chore: update rename and delete thread from dynamic project screen

web-app/src/components/ui/dialog.tsx

@@ -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}

web-app/src/containers/LeftPanel.tsx

@@ -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
+        }
       />
     </>
   )

web-app/src/containers/ThreadList.tsx

@@ -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',
+            'pr-2 truncate flex-1',
-            variant === 'project' ? 'py-2' : 'py-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>

web-app/src/containers/dialogs/DeleteThreadDialog.tsx

@@ -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,10 +50,12 @@ export function DeleteThreadDialog({
       id: 'delete-thread',
       description: t('common:toast.deleteThread.description'),
     })
+    if (variant !== 'project') {
       setTimeout(() => {
         navigate({ to: route.home })
       }, 0)
     }
+  }
 
   const handleKeyDown = (e: React.KeyboardEvent) => {
     if (e.key === 'Enter') {