spacedrive/interface/hooks/useExplorerStore.tsx
Brendan Allan c65d92ee4c
[ENG-380] Interface code structure improvement (#581)
* beginnings of app directory

* settings mostly good

* colocate way more components

* flatten components folder

* reexport QueryClientProvider from client

* move CodeBlock back to interface

* colocate Explorer, KeyManager + more

* goddamn captialisation

* get toasts out of components

* please eslint

* no more src directory

* $ instead of :

* added back RowHeader component

* fix settings modal padding

* more spacing, less margin

* fix sidebar locations button

* fix tags sidebar link

* clean up back button

* added margin to explorer context menu to prevent contact with edge of viewport

* don't export QueryClientProvider from @sd/client

* basic guidelines

* import interface correctly

* remove old demo data

* fix onboarding layout

* fix onboarding navigation

* fix key manager settings button

---------

Co-authored-by: Jamie Pine <ijamespine@me.com>
2023-02-27 21:29:48 -08:00

65 lines
1.6 KiB
TypeScript

import { proxy, useSnapshot } from 'valtio';
import { resetStore } from '@sd/client/src/stores/util';
export type ExplorerLayoutMode = 'rows' | 'grid' | 'columns' | 'media';
export enum ExplorerKind {
Location,
Tag,
Space
}
export type CutCopyType = 'Cut' | 'Copy';
const state = {
locationId: null as number | null,
layoutMode: 'grid' as ExplorerLayoutMode,
gridItemSize: 100,
listItemSize: 40,
selectedRowIndex: 1,
tagAssignMode: false,
showInspector: false,
multiSelectIndexes: [] as number[],
contextMenuObjectId: null as number | null,
contextMenuActiveObject: null as object | null,
newThumbnails: {} as Record<string, boolean>,
cutCopyState: {
sourceLocationId: 0,
sourcePathId: 0,
actionType: 'Cut',
active: false
}
};
// Keep the private and use `useExplorerState` or `getExplorerStore` or you will get production build issues.
const explorerStore = proxy({
...state,
reset: () => resetStore(explorerStore, state),
addNewThumbnail: (cas_id: string) => {
explorerStore.newThumbnails[cas_id] = true;
},
selectMore: (indexes: number[]) => {
if (!explorerStore.multiSelectIndexes.length && indexes.length) {
explorerStore.multiSelectIndexes = [explorerStore.selectedRowIndex, ...indexes];
} else {
explorerStore.multiSelectIndexes = [
...new Set([...explorerStore.multiSelectIndexes, ...indexes])
];
}
}
});
export function useExplorerStore() {
// const { library } = useLibraryContext();
// useEffect(() => {
// explorerStore.reset();
// }, [library.uuid]);
return useSnapshot(explorerStore);
}
export function getExplorerStore() {
return explorerStore;
}