fix: Fix node panel positioning issue when chat log modal is open

web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx

@@ -120,6 +120,7 @@ const BasePanel: FC<BasePanelProps> = ({
       return
     if (workflowCanvasWidth - 400 <= nodePanelWidth + otherPanelWidth)
       debounceUpdate(workflowCanvasWidth - 400 - otherPanelWidth)
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [nodePanelWidth, otherPanelWidth, workflowCanvasWidth, updateNodePanelWidth])
 
   const { handleNodeSelect } = useNodesInteractions()
@@ -269,10 +270,15 @@ const BasePanel: FC<BasePanelProps> = ({
   }
 
   return (
-    <div className={cn(
+    <div
+      className={cn(
         'relative mr-1 h-full',
-      showMessageLogModal && '!absolute -top-[5px] right-[416px] z-0 !mr-0 w-[384px] overflow-hidden rounded-2xl border-[0.5px] border-components-panel-border shadow-lg transition-all',
+        showMessageLogModal && 'absolute z-0 mr-2 w-[400px] overflow-hidden rounded-2xl border-[0.5px] border-components-panel-border shadow-lg transition-all',
-    )}>
+      )}
+      style={{
+        right: !showMessageLogModal ? '0' : `${otherPanelWidth}px`,
+      }}
+    >
       <div
         ref={triggerRef}
         className='absolute -left-1 top-0 flex h-full w-1 cursor-col-resize resize-x items-center justify-center'>
@@ -280,7 +286,7 @@ const BasePanel: FC<BasePanelProps> = ({
       </div>
       <div
         ref={containerRef}
-        className={cn('flex h-full flex-col rounded-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-lg', showSingleRunPanel ? 'overflow-hidden' : 'overflow-y-auto')}
+        className={cn('flex h-full flex-col rounded-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-lg transition-[width] ease-linear', showSingleRunPanel ? 'overflow-hidden' : 'overflow-y-auto')}
         style={{
           width: `${nodePanelWidth}px`,
         }}