2023-06-22 14:11:10 +00:00
|
|
|
import { useMemo, useState } from 'react';
|
2023-05-02 06:42:16 +00:00
|
|
|
import { useStore } from 'zustand';
|
|
|
|
|
|
|
|
import { useSearchBarState } from './SearchBar';
|
2023-07-13 07:47:20 +00:00
|
|
|
import { BasicTableSettings, CreatePersistedStoreReturn } from './types';
|
2023-05-02 06:42:16 +00:00
|
|
|
|
|
|
|
export function useTableState<
|
|
|
|
TSettings extends BasicTableSettings = BasicTableSettings
|
2023-07-13 07:47:20 +00:00
|
|
|
>(store: CreatePersistedStoreReturn<TSettings>, storageKey: string) {
|
2023-05-02 06:42:16 +00:00
|
|
|
const settings = useStore(store);
|
|
|
|
|
|
|
|
const [search, setSearch] = useSearchBarState(storageKey);
|
|
|
|
|
|
|
|
return useMemo(
|
|
|
|
() => ({ ...settings, setSearch, search }),
|
|
|
|
[settings, search, setSearch]
|
|
|
|
);
|
|
|
|
}
|
2023-06-22 14:11:10 +00:00
|
|
|
|
|
|
|
export function useTableStateWithoutStorage(
|
|
|
|
defaultSortKey: string
|
|
|
|
): BasicTableSettings & {
|
|
|
|
setSearch: (search: string) => void;
|
|
|
|
search: string;
|
|
|
|
} {
|
|
|
|
const [search, setSearch] = useState('');
|
|
|
|
const [pageSize, setPageSize] = useState(10);
|
|
|
|
const [sortBy, setSortBy] = useState({ id: defaultSortKey, desc: false });
|
|
|
|
|
|
|
|
return {
|
|
|
|
search,
|
|
|
|
setSearch,
|
|
|
|
pageSize,
|
|
|
|
setPageSize,
|
|
|
|
setSortBy: (id: string, desc: boolean) => setSortBy({ id, desc }),
|
|
|
|
sortBy,
|
|
|
|
};
|
|
|
|
}
|