revert: resize in app sidebar (#2193)

packages/component/src/components/app-sidebar/index.jotai.ts

@@ -1,9 +1,6 @@
 import { atomWithStorage } from 'jotai/utils';
 
-export const appSidebarOpenAtom = atomWithStorage(
-  'app-sidebar-open',
-  undefined as boolean | undefined
-);
+export const appSidebarOpenAtom = atomWithStorage('app-sidebar-open', true);
 export const appSidebarWidthAtom = atomWithStorage(
   'app-sidebar-width',
   256 /* px */

packages/component/src/components/app-sidebar/index.tsx

@@ -8,13 +8,7 @@ import { assignInlineVars } from '@vanilla-extract/dynamic';
 import { useAtom, useAtomValue } from 'jotai';
 import type { PropsWithChildren, ReactElement } from 'react';
 import type { ReactNode } from 'react';
-import {
-  forwardRef,
-  useCallback,
-  useEffect,
-  useImperativeHandle,
-  useRef,
-} from 'react';
+import { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';
 
 import { IconButton } from '../../ui/button/IconButton';
 import {
@@ -40,7 +34,6 @@ export const AppSidebar = forwardRef<HTMLElement, AppSidebarProps>(
     const [open, setOpen] = useAtom(appSidebarOpenAtom);
 
     const appSidebarWidth = useAtomValue(appSidebarWidthAtom);
-    const initialRender = open === undefined;
 
     const handleSidebarOpen = useCallback(() => {
       setOpen(open => !open);
@@ -48,20 +41,8 @@ export const AppSidebar = forwardRef<HTMLElement, AppSidebarProps>(
 
     useImperativeHandle(forwardedRef, () => ref.current as HTMLElement);
 
-    useEffect(() => {
-      if (open === undefined && ref.current) {
-        const initialOpen =
-          window.getComputedStyle(ref.current).position === 'relative';
-
-        setOpen(initialOpen);
-      }
-    }, [open, setOpen]);
-
     const environment = getEnvironment();
     const isMacosDesktop = environment.isDesktop && environment.isMacOs;
-    if (initialRender) {
-      return <div />;
-    }
     return (
       <>
         <nav
@@ -115,7 +96,9 @@ export const AppSidebar = forwardRef<HTMLElement, AppSidebarProps>(
           data-testid="app-sidebar-float-mask"
           data-open={open}
           className={sidebarFloatMaskStyle}
-          onClick={() => setOpen(false)}
+          onClick={useCallback(() => {
+            setOpen(false);
+          }, [setOpen])}
         />
       </>
     );