diff --git a/CHANGELOG.md b/CHANGELOG.md index 195092b3..d0d1d22a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,7 @@ and this project adheres to - 🚸(backend) improve users similarity search and sort results #391 - 🌐(backend) add german translation #259 +- ♻️(frontend) simplify stores #402 ## Fixed diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/DocEditor.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/DocEditor.tsx index 902b2792..b40e26e7 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/DocEditor.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/DocEditor.tsx @@ -32,8 +32,8 @@ export const DocEditor = ({ doc }: DocEditorProps) => { const { colorsTokens } = useCunninghamTheme(); - const { docsStore } = useDocStore(); - const provider = docsStore?.[doc.id]?.provider; + const { providers } = useDocStore(); + const provider = providers?.[doc.id]; if (!provider) { return null; @@ -98,7 +98,7 @@ export const DocVersionEditor = ({ doc, versionId }: DocVersionEditorProps) => { docId: doc.id, versionId, }); - const { createProvider, docsStore } = useDocStore(); + const { createProvider, providers } = useDocStore(); const navigate = useNavigate(); @@ -107,11 +107,11 @@ export const DocVersionEditor = ({ doc, versionId }: DocVersionEditorProps) => { return; } - const provider = docsStore?.[version.id]?.provider; + const provider = providers?.[version.id]; if (!provider || provider.document.guid !== version.id) { createProvider(version.id, version.content); } - }, [createProvider, docsStore, version]); + }, [createProvider, providers, version]); if (isError && error) { if (error.status === 404) { @@ -143,7 +143,7 @@ export const DocVersionEditor = ({ doc, versionId }: DocVersionEditorProps) => { ); } - const provider = docsStore?.[version.id]?.provider; + const provider = providers?.[version.id]; if (!provider) { return null; diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx b/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx index 2461d0aa..3bc2a95c 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx @@ -5,23 +5,19 @@ import { create } from 'zustand'; import { providerUrl } from '@/core'; import { Base64, Doc, blocksToYDoc } from '@/features/docs/doc-management'; -interface DocStore { - provider: HocuspocusProvider; -} - export interface UseDocStore { currentDoc?: Doc; - docsStore: { - [storeId: string]: DocStore; + providers: { + [storeId: string]: HocuspocusProvider; }; createProvider: (storeId: string, initialDoc: Base64) => HocuspocusProvider; - setStore: (storeId: string, props: Partial) => void; + setProviders: (storeId: string, providers: HocuspocusProvider) => void; setCurrentDoc: (doc: Doc | undefined) => void; } export const useDocStore = create((set, get) => ({ currentDoc: undefined, - docsStore: {}, + providers: {}, createProvider: (storeId: string, initialDoc: Base64) => { const doc = new Y.Doc({ guid: storeId, @@ -46,23 +42,17 @@ export const useDocStore = create((set, get) => ({ document: doc, }); - get().setStore(storeId, { provider }); + get().setProviders(storeId, provider); return provider; }, - setStore: (storeId, props) => { - set(({ docsStore }, ...store) => { - return { - ...store, - docsStore: { - ...docsStore, - [storeId]: { - ...docsStore[storeId], - ...props, - }, - }, - }; - }); + setProviders: (storeId, provider) => { + set(({ providers }) => ({ + providers: { + ...providers, + [storeId]: provider, + }, + })); }, setCurrentDoc: (doc) => { set({ currentDoc: doc }); diff --git a/src/frontend/apps/impress/src/features/docs/doc-versioning/components/ModalVersion.tsx b/src/frontend/apps/impress/src/features/docs/doc-versioning/components/ModalVersion.tsx index 5ca10764..97f3fb43 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-versioning/components/ModalVersion.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-versioning/components/ModalVersion.tsx @@ -32,7 +32,7 @@ export const ModalVersion = ({ }: ModalVersionProps) => { const { toast } = useToastProvider(); const router = useRouter(); - const { docsStore } = useDocStore(); + const { providers } = useDocStore(); const { mutate: updateDoc } = useUpdateDoc({ listInvalideQueries: [KEY_LIST_DOC_VERSIONS], onSuccess: () => { @@ -41,15 +41,15 @@ export const ModalVersion = ({ router.push(`/docs/${docId}`); }; - if (!docsStore?.[docId]?.provider || !docsStore?.[versionId]?.provider) { + if (!providers?.[docId] || !providers?.[versionId]) { onDisplaySuccess(); return; } revertUpdate( - docsStore[docId].provider.document, - docsStore[docId].provider.document, - docsStore[versionId].provider.document, + providers[docId].document, + providers[docId].document, + providers[versionId].document, ); onDisplaySuccess(); @@ -79,7 +79,7 @@ export const ModalVersion = ({ fullWidth onClick={() => { const newDoc = toBase64( - Y.encodeStateAsUpdate(docsStore?.[versionId]?.provider.document), + Y.encodeStateAsUpdate(providers?.[versionId].document), ); updateDoc({ diff --git a/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx b/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx index b9d73257..24eda8b7 100644 --- a/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx +++ b/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx @@ -43,11 +43,11 @@ const DocPage = ({ id }: DocProps) => { const { login } = useAuthStore(); const { data: docQuery, isError, error } = useDoc({ id }); const [doc, setDoc] = useState(docQuery); - const { setCurrentDoc, createProvider, docsStore } = useDocStore(); + const { setCurrentDoc, createProvider, providers } = useDocStore(); const { setBroadcastProvider, addTask } = useBroadcastStore(); const queryClient = useQueryClient(); const navigate = useNavigate(); - const provider = docsStore?.[id]?.provider; + const provider = providers?.[id]; useEffect(() => { if (doc?.title) {