From 14de87c72ec51ca80eb27af09b8893c8cb3bdfd1 Mon Sep 17 00:00:00 2001
From: oxdc <29519076+oxdc@users.noreply.github.com>
Date: Fri, 27 Sep 2024 20:47:11 +0800
Subject: [PATCH] added button for collapsing/expanding all groups: fixed #37

---
 src/components/Group.tsx            | 13 ++++++++++++-
 src/components/NavigationHeader.tsx | 22 +++++++++++++++++++++-
 src/models/ViewState.ts             | 10 ++++++++++
 3 files changed, 43 insertions(+), 2 deletions(-)

diff --git a/src/components/Group.tsx b/src/components/Group.tsx
index 39ebdd6..82f236b 100644
--- a/src/components/Group.tsx
+++ b/src/components/Group.tsx
@@ -22,7 +22,18 @@ export const Group = ({ type, children, group }: GroupProps) => {
 	const workspace = app.workspace as VT.Workspace;
 	const isSidebar =
 		type === VT.GroupType.LeftSidebar || type === VT.GroupType.RightSidebar;
-	const [isCollapsed, setIsCollapsed] = useState(isSidebar ? true : false);
+	const globalCollpaseState = useViewState(
+		(state) => state.globalCollapseState
+	);
+	const [isCollapsed, setIsCollapsed] = useState(
+		isSidebar ? true : globalCollpaseState
+	);
+
+	useEffect(() => {
+		if (isSidebar) return;
+		setIsCollapsed(globalCollpaseState);
+	}, [globalCollpaseState]);
+
 	const { groupTitles, setGroupTitle, toggleHiddenGroup } = useViewState();
 	const isHidden = useViewState((state) =>
 		group ? state.hiddenGroups.includes(group.id) : false
diff --git a/src/components/NavigationHeader.tsx b/src/components/NavigationHeader.tsx
index 82d1688..a838683 100644
--- a/src/components/NavigationHeader.tsx
+++ b/src/components/NavigationHeader.tsx
@@ -15,7 +15,10 @@ export const NavigationHeader = () => {
 	const toggleZenMode = useSettings.use.toggleZenMode();
 	const sortStrategy = useTabCache((state) => state.sortStrategy);
 	const { setSortStrategy } = useTabCache();
-	const { lockFocus } = useViewState();
+	const { lockFocus, setAllCollapsed, setAllExpanded } = useViewState();
+	const globalCollapseState = useViewState(
+		(state) => state.globalCollapseState
+	);
 
 	const createAndShowNewTab = () => {
 		const workspace = plugin.app.workspace as VT.Workspace;
@@ -110,6 +113,23 @@ export const NavigationHeader = () => {
 					isActive={zenMode}
 					isNavAction={true}
 				/>
+				<IconButton
+					icon={
+						globalCollapseState
+							? "unfold-vertical"
+							: "fold-vertical"
+					}
+					action="global-collapse"
+					tooltip={
+						globalCollapseState ? "Expand all" : "Collapse all"
+					}
+					onClick={() =>
+						globalCollapseState
+							? setAllExpanded()
+							: setAllCollapsed()
+					}
+					isNavAction={true}
+				/>
 			</div>
 		</div>
 	);
diff --git a/src/models/ViewState.ts b/src/models/ViewState.ts
index aba5ecb..2fd0fc6 100644
--- a/src/models/ViewState.ts
+++ b/src/models/ViewState.ts
@@ -34,6 +34,7 @@ interface ViewState {
 	hiddenGroups: Array<VT.Identifier>;
 	latestActiveLeaf: VT.WorkspaceLeaf | null;
 	pinningEvents: PinningEvents;
+	globalCollapseState: boolean;
 	clear: () => void;
 	setGroupTitle: (id: VT.Identifier, name: string) => void;
 	toggleHiddenGroup: (id: VT.Identifier, isHidden: boolean) => void;
@@ -59,6 +60,8 @@ interface ViewState {
 		callback: PinningEventCallback
 	) => void;
 	unbindPinningEvent: (leaf: VT.WorkspaceLeaf) => void;
+	setAllCollapsed: () => void;
+	setAllExpanded: () => void;
 }
 
 const saveViewState = (titles: GroupTitles) => {
@@ -115,6 +118,7 @@ export const useViewState = create<ViewState>()((set, get) => ({
 	hiddenGroups: loadHiddenGroups(),
 	latestActiveLeaf: null,
 	pinningEvents: createNewPinningEvents(),
+	globalCollapseState: false,
 	leftButtonClone: null,
 	rightButtonClone: null,
 	topLeftContainer: null,
@@ -290,4 +294,10 @@ export const useViewState = create<ViewState>()((set, get) => ({
 			set({ pinningEvents });
 		}
 	},
+	setAllCollapsed() {
+		set({ globalCollapseState: true });
+	},
+	setAllExpanded() {
+		set({ globalCollapseState: false });
+	},
 }));