From 637a6ff874a105274d366d5c8dc5361600d4bf78 Mon Sep 17 00:00:00 2001 From: Shams mosowi Date: Fri, 4 Sep 2020 00:37:35 +1000 Subject: [PATCH 1/3] store sidedrawer docRef in the url --- .../components/SideDrawer/Form/Autosave.tsx | 7 +-- www/src/components/SideDrawer/Form/index.tsx | 1 + www/src/components/SideDrawer/index.tsx | 47 +++++++++++++++++-- www/src/hooks/useDoc.ts | 6 +-- 4 files changed, 48 insertions(+), 13 deletions(-) diff --git a/www/src/components/SideDrawer/Form/Autosave.tsx b/www/src/components/SideDrawer/Form/Autosave.tsx index fb3643fa..59bbf863 100644 --- a/www/src/components/SideDrawer/Form/Autosave.tsx +++ b/www/src/components/SideDrawer/Form/Autosave.tsx @@ -16,12 +16,14 @@ export interface IAutosaveProps { control: Control; defaultValues: Values; docRef: firebase.firestore.DocumentReference; + row: any; } export default function Autosave({ control, defaultValues, docRef, + row, }: IAutosaveProps) { const { currentUser } = useAppContext(); const { tableState, sideDrawerRef } = useFiretableContext(); @@ -43,10 +45,6 @@ export default function Autosave({ equalityFn: _isEqual, }); - const row = sideDrawerRef?.current?.cell - ? tableState?.rows[sideDrawerRef?.current?.cell.row] - : {}; - useEffect(() => { if (!row || !row.ref) return; if (row.ref.id !== docRef.id) return; @@ -57,7 +55,6 @@ export default function Autosave({ _omitBy(debouncedValue, _isUndefined), (value, key) => _isEqual(value, row[key]) ); - console.log(updatedValues); if (Object.keys(updatedValues).length === 0) return; diff --git a/www/src/components/SideDrawer/Form/index.tsx b/www/src/components/SideDrawer/Form/index.tsx index 022ef93a..bb670859 100644 --- a/www/src/components/SideDrawer/Form/index.tsx +++ b/www/src/components/SideDrawer/Form/index.tsx @@ -134,6 +134,7 @@ export default function Form({ fields, values }: IFormProps) { control={control} defaultValues={defaultValues} docRef={docRef} + row={values} /> diff --git a/www/src/components/SideDrawer/index.tsx b/www/src/components/SideDrawer/index.tsx index 4e05d4e1..a2154c82 100644 --- a/www/src/components/SideDrawer/index.tsx +++ b/www/src/components/SideDrawer/index.tsx @@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react"; import clsx from "clsx"; import _isNil from "lodash/isNil"; import _sortBy from "lodash/sortBy"; - +import queryString from "query-string"; import { Drawer, Fab } from "@material-ui/core"; import ChevronIcon from "@material-ui/icons/KeyboardArrowLeft"; import ChevronUpIcon from "@material-ui/icons/KeyboardArrowUp"; @@ -15,7 +15,7 @@ import ErrorBoundary from "components/ErrorBoundary"; import { useStyles } from "./useStyles"; import { useFiretableContext } from "contexts/firetableContext"; import { FieldType } from "constants/fields"; - +import useDoc from "hooks/useDoc"; export const DRAWER_WIDTH = 600; export const DRAWER_COLLAPSED_WIDTH = 36; @@ -53,6 +53,33 @@ export default function SideDrawer() { dataGridRef?.current?.selectCell({ rowIdx: row, idx }); }; + const [urlDocState, dispatchUrlDoc] = useDoc({}); + useEffect(() => { + if (urlDocState.doc) { + setOpen(true); + } + }, [urlDocState]); + useEffect(() => { + const rowRef = queryString.parse(window.location.search).rowRef as string; + if (rowRef) { + console.log(rowRef); + dispatchUrlDoc({ path: decodeURIComponent(rowRef) }); + } + }, []); + useEffect(() => { + if (cell) { + window.history.pushState( + "", + `${tableState?.tablePath}`, + `${window.location.pathname}?rowRef=${encodeURIComponent( + tableState?.rows[cell.row].ref.path + )}` + ); + console.log(tableState?.tablePath, tableState?.rows[cell.row].id); + dispatchUrlDoc({ path: "", doc: null }); + } + }, [cell]); + // Map columns to form fields const fields = @@ -115,12 +142,22 @@ export default function SideDrawer() { >
- {open && fields && cell && ( + {open && fields && urlDocState.doc ? (
+ ) : ( + open && + fields && + cell && ( + + ) )}
diff --git a/www/src/hooks/useDoc.ts b/www/src/hooks/useDoc.ts index 956cd5d5..0cdaf72a 100644 --- a/www/src/hooks/useDoc.ts +++ b/www/src/hooks/useDoc.ts @@ -42,12 +42,12 @@ const useDoc = (intialOverrides: any) => { const unsubscribe = db.doc(documentState.path).onSnapshot((snapshot) => { if (snapshot.exists) { const data = snapshot.data(); - const id = snapshot.id; - const doc = { ...data, id }; + const ref = snapshot.ref; + const doc = { ...data, id, ref }; documentDispatch({ doc, - ref: snapshot.ref, + ref, loading: false, }); } else { From 0096c5f90146b881490a27147ff3a00b94844de8 Mon Sep 17 00:00:00 2001 From: Shams mosowi Date: Fri, 4 Sep 2020 01:11:03 +1000 Subject: [PATCH 2/3] unsubscribe sideDrawer urlDoc --- www/src/components/SideDrawer/index.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/www/src/components/SideDrawer/index.tsx b/www/src/components/SideDrawer/index.tsx index a2154c82..687ff318 100644 --- a/www/src/components/SideDrawer/index.tsx +++ b/www/src/components/SideDrawer/index.tsx @@ -76,7 +76,10 @@ export default function SideDrawer() { )}` ); console.log(tableState?.tablePath, tableState?.rows[cell.row].id); - dispatchUrlDoc({ path: "", doc: null }); + if (urlDocState.doc) { + urlDocState.unsubscribe(); + dispatchUrlDoc({ path: "", doc: null }); + } } }, [cell]); From c9466e8445bc2259e5804feca4e006c352c67ad2 Mon Sep 17 00:00:00 2001 From: Shams mosowi Date: Fri, 4 Sep 2020 12:26:09 +1000 Subject: [PATCH 3/3] require node 10 or higher --- cloud_functions/functions/src/config.ts | 1 - www/package.json | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/cloud_functions/functions/src/config.ts b/cloud_functions/functions/src/config.ts index b4de316a..0919f1bb 100644 --- a/cloud_functions/functions/src/config.ts +++ b/cloud_functions/functions/src/config.ts @@ -8,7 +8,6 @@ export const db = admin.firestore(); // Initialize Auth export const auth = admin.auth(); -//export const bucket = admin.storage().bucket("antler-vc"); const settings = { timestampsInSnapshots: true }; db.settings(settings); export const env = functions.config(); diff --git a/www/package.json b/www/package.json index 8c4be39f..216f939b 100644 --- a/www/package.json +++ b/www/package.json @@ -63,7 +63,7 @@ "deploy": "firebase deploy" }, "engines": { - "node": "10" + "node": ">=10" }, "eslintConfig": { "extends": "react-app"