use-overview-file-collapsed.ts 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import { useCallback } from 'react'
  2. import { DocId } from '../../../../../types/project-settings'
  3. import { useProjectContext } from '../../../shared/context/project-context'
  4. import usePersistedState from '../../../shared/hooks/use-persisted-state'
  5. import { debugConsole } from '@/utils/debugging'
  6. const safeStringify = (value: unknown) => {
  7. try {
  8. return JSON.stringify(value)
  9. } catch (e) {
  10. debugConsole.error('double stringify exception', e)
  11. return ''
  12. }
  13. }
  14. const safeParse = (value: string) => {
  15. try {
  16. return JSON.parse(value)
  17. } catch (e) {
  18. debugConsole.error('double parse exception', e)
  19. return null
  20. }
  21. }
  22. export default function useOverviewFileCollapsed(docId: DocId) {
  23. const { projectId } = useProjectContext()
  24. const [collapsedDocs, setCollapsedDocs] = usePersistedState<
  25. Record<DocId, boolean>,
  26. string
  27. >(
  28. `docs_collapsed_state:${projectId}`,
  29. {},
  30. {
  31. converter: {
  32. fromPersisted: safeParse,
  33. toPersisted: safeStringify,
  34. },
  35. }
  36. )
  37. const toggleCollapsed = useCallback(() => {
  38. setCollapsedDocs((collapsedDocs: Record<DocId, boolean>) => {
  39. return {
  40. ...collapsedDocs,
  41. [docId]: !collapsedDocs[docId],
  42. }
  43. })
  44. }, [docId, setCollapsedDocs])
  45. return { collapsed: collapsedDocs[docId], toggleCollapsed }
  46. }