🐛(frontend) fix flickering left panel

In some cases, the left panel can flicker
when navigating from the index to a document page.
This is due to different state + a transition effect.
To fix this, we remove the transition effect
when mounting.

CHANGELOG.md

@@ -22,6 +22,7 @@ and this project adheres to
 
 - 🐛(backend) create a link_trace record for on-boarding documents
 - 🐛(backend) manage race condition when creating sandbox document
+- 🐛(frontend) fix flickering left panel #1989
 - ♿️(frontend) improve doc tree keyboard navigation #1981
 
 ## [v4.7.0] - 2026-03-09

src/frontend/apps/impress/src/features/left-panel/components/ResizableLeftPanel.tsx

@@ -45,6 +45,22 @@ export const ResizableLeftPanel = ({
     );
   });
 
+  const [isMounting, setIsMounting] = useState(false);
+
+  /**
+   * To avoid flickering animation on initial load
+   */
+  useEffect(() => {
+    const timeout = setTimeout(() => {
+      setIsMounting(true);
+    }, 500);
+
+    return () => {
+      clearTimeout(timeout);
+      setIsMounting(false);
+    };
+  }, []);
+
   /**
    * When the panel is toggled open/closed, we want
    * to either expand/collapse
@@ -94,9 +110,10 @@ export const ResizableLeftPanel = ({
         collapsible={!isPanelOpen}
         collapsedSize={0}
         style={{
-          transition: isDragging
-            ? 'none'
-            : 'flex var(--c--globals--transitions--duration) var(--c--globals--transitions--ease-out)',
+          transition:
+            isDragging || !isMounting
+              ? 'none'
+              : 'flex var(--c--globals--transitions--duration) var(--c--globals--transitions--ease-out)',
         }}
         order={0}
         defaultSize={