Enhancement: initially collapsed option for layout groups

src/components/bookmarks/group.jsx

@@ -1,4 +1,4 @@
-import { useRef } from "react";
+import { useRef, useEffect } from "react";
 import classNames from "classnames";
 import { Disclosure, Transition } from "@headlessui/react";
 import { MdKeyboardArrowDown } from "react-icons/md";
@@ -7,8 +7,13 @@ import ErrorBoundary from "components/errorboundry";
 import List from "components/bookmarks/list";
 import ResolvedIcon from "components/resolvedicon";
 
-export default function BookmarksGroup({ bookmarks, layout, disableCollapse }) {
+export default function BookmarksGroup({ bookmarks, layout, disableCollapse, groupsInitiallyCollapsed }) {
   const panel = useRef();
+
+  useEffect(() => {
+    if (layout?.initiallyCollapsed ?? groupsInitiallyCollapsed) panel.current.style.height = `0`;
+  }, [layout, groupsInitiallyCollapsed]);
+
   return (
     <div
       key={bookmarks.name}
@@ -18,7 +23,7 @@ export default function BookmarksGroup({ bookmarks, layout, disableCollapse }) {
         layout?.header === false ? "flex-1 px-1 -my-1" : "flex-1 p-1",
       )}
     >
-      <Disclosure defaultOpen>
+      <Disclosure defaultOpen={!(layout?.initiallyCollapsed ?? groupsInitiallyCollapsed) ?? true}>
         {({ open }) => (
           <>
             {layout?.header !== false && (