starred/yaak
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-01-11 20:00:29 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Persist sidebar collapsed state (Closes #10)

Browse Source
This commit is contained in:
Gregory Schier
2023-11-06 07:18:42 -08:00
parent 7eafff082c
commit 5bfcccbb2f
1 changed files with 19 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src-web/components/Sidebar.tsx
View File

@@ -13,6 +13,7 @@ import { useCreateRequest } from '../hooks/useCreateRequest';
import { useDeleteAnyRequest } from '../hooks/useDeleteAnyRequest';
import { useDeleteFolder } from '../hooks/useDeleteFolder';
import { useFolders } from '../hooks/useFolders';
import { useKeyValue } from '../hooks/useKeyValue';
import { useLatestResponse } from '../hooks/useLatestResponse';
import { useListenToTauriEvent } from '../hooks/useListenToTauriEvent';
import { useRequests } from '../hooks/useRequests';
@@ -20,6 +21,7 @@ import { useSidebarHidden } from '../hooks/useSidebarHidden';
import { useUpdateAnyFolder } from '../hooks/useUpdateAnyFolder';
import { useUpdateAnyRequest } from '../hooks/useUpdateAnyRequest';
import { useUpdateRequest } from '../hooks/useUpdateRequest';
import { NAMESPACE_NO_SYNC } from '../lib/keyValueStore';
import type { Folder, HttpRequest, Workspace } from '../lib/models';
import { isResponseLoading } from '../lib/models';
import { Dropdown } from './core/Dropdown';
@@ -57,6 +59,16 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
const [hasFocus, setHasFocus] = useState<boolean>(false);
const [selectedId, setSelectedId] = useState<string | null>(null);
const [selectedTree, setSelectedTree] = useState<TreeNode | null>(null);
const updateAnyRequest = useUpdateAnyRequest();
const updateAnyFolder = useUpdateAnyFolder();
const [draggingId, setDraggingId] = useState<string | null>(null);
const [hoveredTree, setHoveredTree] = useState<TreeNode | null>(null);
const [hoveredIndex, setHoveredIndex] = useState<number | null>(null);
const collapsed = useKeyValue<Record<string, boolean>>({
key: ['sidebar_collapsed', activeWorkspace?.id ?? 'n/a'],
defaultValue: {},
namespace: NAMESPACE_NO_SYNC,
});
const { tree, treeParentMap, selectableRequests } = useMemo<{
tree: TreeNode | null;
@@ -126,7 +138,7 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
const { item } = node;
if (item.model === 'folder') {
setCollapsed((c) => ({ ...c, [item.id]: !c[item.id] }));
collapsed.set((c) => ({ ...c, [item.id]: !c[item.id] }));
} else {
routes.navigate('request', {
requestId: id,
@@ -138,7 +150,7 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
focusActiveRequest({ id, tree });
}
},
[treeParentMap, routes, activeEnvironmentId, focusActiveRequest],
[treeParentMap, collapsed, routes, activeEnvironmentId, focusActiveRequest],
);
const handleClearSelected = useCallback(() => {
@@ -230,13 +242,6 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
undefined,
[hasFocus, selectableRequests, selectedId, setSelectedId, setSelectedTree],
);
const updateAnyRequest = useUpdateAnyRequest();
const updateAnyFolder = useUpdateAnyFolder();
const [collapsed, setCollapsed] = useState<Record<string, boolean>>({});
const [draggingId, setDraggingId] = useState<string | null>(null);
const [hoveredTree, setHoveredTree] = useState<TreeNode | null>(null);
const [hoveredIndex, setHoveredIndex] = useState<number | null>(null);
const handleMove = useCallback<DraggableSidebarItemProps['onMove']>(
(id, side) => {
@@ -326,6 +331,10 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
return null;
}
if (collapsed.value == null) {
return null;
}
return (
<div aria-hidden={hidden} className="h-full">
<aside
@@ -342,7 +351,7 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
treeParentMap={treeParentMap}
selectedId={selectedId}
selectedTree={selectedTree}
collapsed={collapsed}
collapsed={collapsed.value}
tree={tree}
focused={hasFocus}
draggingId={draggingId}