chore: update rename and delete thread from dynamic project screen

This commit is contained in:
Faisal Amir 2025-09-25 13:12:33 +07:00
parent b0bca2ac1f
commit 8479b7c105
4 changed files with 27 additions and 17 deletions

View File

@ -37,7 +37,7 @@ function DialogOverlay({
<DialogPrimitive.Overlay
data-slot="dialog-overlay"
className={cn(
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-main-view/80 backdrop-blur-sm',
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-[80] bg-main-view/80 backdrop-blur-sm',
className
)}
{...props}
@ -67,7 +67,7 @@ function DialogContent({
data-slot="dialog-content"
aria-describedby={ariaDescribedBy}
className={cn(
'bg-main-view max-h-[calc(100%-80px)] overflow-auto border-main-view-fg/10 text-main-view-fg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
'bg-main-view max-h-[calc(100%-80px)] overflow-auto border-main-view-fg/10 text-main-view-fg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-[90] grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
className
)}
{...props}

View File

@ -53,7 +53,7 @@ const mainMenus = [
isEnabled: true,
},
{
title: 'Projects',
title: 'common:projects',
icon: IconFolderPlus,
route: route.project,
isEnabled: true,
@ -400,7 +400,7 @@ const LeftPanel = () => {
<div className="space-y-1 py-1">
<div className="flex items-center justify-between mb-2">
<span className="block text-xs text-left-panel-fg/50 px-1 font-semibold">
Projects
{t('common:projects.title')}
</span>
</div>
<div className="flex flex-col">
@ -635,7 +635,9 @@ const LeftPanel = () => {
open={deleteProjectConfirmOpen}
onOpenChange={setDeleteProjectConfirmOpen}
onConfirm={confirmProjectDelete}
projectName={deletingProjectId ? getFolderById(deletingProjectId)?.name : undefined}
projectName={
deletingProjectId ? getFolderById(deletingProjectId)?.name : undefined
}
/>
</>
)

View File

@ -140,12 +140,6 @@ const SortableItem = memo(
style={style}
{...attributes}
{...listeners}
onClick={handleClick}
onContextMenu={(e) => {
e.preventDefault()
e.stopPropagation()
setOpenDropdown(true)
}}
className={cn(
'rounded hover:bg-left-panel-fg/10 flex items-center justify-between gap-2 px-1.5 group/thread-list transition-all',
variant === 'project'
@ -154,12 +148,18 @@ const SortableItem = memo(
isDragging ? 'cursor-move' : 'cursor-pointer',
isActive && 'bg-left-panel-fg/10'
)}
onContextMenu={(e) => {
e.preventDefault()
e.stopPropagation()
setOpenDropdown(true)
}}
>
<div
className={cn(
'pr-2 truncate',
variant === 'project' ? 'py-2' : 'py-1'
'pr-2 truncate flex-1',
variant === 'project' ? 'py-2 cursor-pointer' : 'py-1'
)}
onClick={variant === 'project' ? handleClick : undefined}
>
<span>{thread.title || t('common:newThread')}</span>
{variant === 'project' && (
@ -172,7 +172,10 @@ const SortableItem = memo(
</>
)}
</div>
<div className="flex items-center">
<div
className="flex items-center"
onClick={variant !== 'project' ? handleClick : undefined}
>
<DropdownMenu
open={openDropdown}
onOpenChange={(open) => setOpenDropdown(open)}
@ -277,6 +280,7 @@ const SortableItem = memo(
thread={thread}
onDelete={deleteThread}
onDropdownClose={() => setOpenDropdown(false)}
variant={variant}
/>
</DropdownMenuContent>
</DropdownMenu>

View File

@ -21,12 +21,14 @@ interface DeleteThreadDialogProps {
thread: Thread
onDelete: (threadId: string) => void
onDropdownClose: () => void
variant?: 'default' | 'project'
}
export function DeleteThreadDialog({
thread,
onDelete,
onDropdownClose,
variant = 'default',
}: DeleteThreadDialogProps) {
const { t } = useTranslation()
const navigate = useNavigate()
@ -48,9 +50,11 @@ export function DeleteThreadDialog({
id: 'delete-thread',
description: t('common:toast.deleteThread.description'),
})
setTimeout(() => {
navigate({ to: route.home })
}, 0)
if (variant !== 'project') {
setTimeout(() => {
navigate({ to: route.home })
}, 0)
}
}
const handleKeyDown = (e: React.KeyboardEvent) => {