selected file layout update

web/src/components/ui/segmented/AppSegmented.tsx

@@ -110,7 +110,7 @@ export const AppSegmented: AppSegmentedComponent = React.memo(
     block = false
   }: AppSegmentedProps<T>) => {
     const rootRef = React.useRef<HTMLDivElement>(null);
-    const elementSize = useSize(rootRef);
+    const elementSize = useSize(rootRef, 25);
     const tabRefs = React.useRef<Map<string, HTMLButtonElement>>(new Map());
     const [selectedValue, setSelectedValue] = useState(value || options[0]?.value);
     const [gliderStyle, setGliderStyle] = useState({
@@ -146,19 +146,10 @@ export const AppSegmented: AppSegmentedComponent = React.memo(
       }
     });
 
-    const { run: throttledUpdateGliderStyle } = useThrottleFn(updateGliderStyle, {
-      wait: 15,
-      leading: true
-    });
-
     // Use useLayoutEffect to measure before paint
     useLayoutEffect(() => {
       updateGliderStyle();
-    }, [selectedValue]);
-
-    useEffect(() => {
-      throttledUpdateGliderStyle();
-    }, [elementSize?.width]);
+    }, [selectedValue, elementSize?.width]);
 
     useEffect(() => {
       if (value !== undefined && value !== selectedValue) {

web/src/layouts/ChatLayout/ChatLayoutContext/ChatLayoutContext.tsx

@@ -15,13 +15,19 @@ interface UseChatSplitterProps {
 export const useChatLayout = ({ appSplitterRef }: UseChatSplitterProps) => {
   const animateOpenSplitter = useMemoizedFn((side: 'left' | 'right' | 'both') => {
     if (appSplitterRef.current) {
-      const { animateWidth } = appSplitterRef.current;
+      const { animateWidth, sizes } = appSplitterRef.current;
+      const leftSize = sizes[0] ?? 0;
+      const rightSize = sizes[1] ?? 0;
+
       if (side === 'left') {
         animateWidth('100%', 'left');
       } else if (side === 'right') {
         animateWidth('100%', 'right');
       } else if (side === 'both') {
-        //&& (isSideClosed('right') || isSideClosed('left'))
+        const shouldAnimate = Number(leftSize) < 200 || Number(rightSize) < 340;
+
+        if (!shouldAnimate) return;
+
         animateWidth(DEFAULT_CHAT_OPTION_SIDEBAR_SIZE, 'left');
         setRenderViewLayoutKey('both');
         fileLayoutContext?.closeSecondaryView();

web/src/layouts/ChatLayout/hooks/useSelectedFileAndLayout/useSelectedFileAndLayout.ts

@@ -48,6 +48,8 @@ export const useSelectedFileAndLayout = ({
         ? createChatAssetRoute({ chatId, assetId: fileId, type: fileType })
         : createFileRoute({ assetId: fileId, type: fileType });
 
+    const isSameAsCurrentFile = selectedFile?.id === fileId;
+
     setRenderViewLayoutKey('both');
     setSelectedFile(file);
     await onChangePage(route);