From 363d380301ed2e4822dcd0a4ac84cfd5075a34b6 Mon Sep 17 00:00:00 2001 From: Sidney Alcantara Date: Wed, 13 Oct 2021 16:43:47 +1100 Subject: [PATCH] add initial columns option to create table --- package.json | 2 +- src/components/TableSettings/form.tsx | 51 +++++++++++++++++++++++--- src/components/TableSettings/index.tsx | 7 ++-- src/hooks/useSettings.ts | 23 +++++++++--- yarn.lock | 15 +++++--- 5 files changed, 78 insertions(+), 20 deletions(-) diff --git a/package.json b/package.json index d7f1d43e..317a012f 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "@mui/lab": "^5.0.0-alpha.50", "@mui/material": "^5.0.0", "@mui/styles": "^5.0.0", - "@rowy/form-builder": "^0.2.4", + "@rowy/form-builder": "^0.3.1", "@rowy/multiselect": "^0.2.1", "@tinymce/tinymce-react": "^3.12.6", "algoliasearch": "^4.8.6", diff --git a/src/components/TableSettings/form.tsx b/src/components/TableSettings/form.tsx index 1761dfe0..cd6877cb 100644 --- a/src/components/TableSettings/form.tsx +++ b/src/components/TableSettings/form.tsx @@ -7,6 +7,7 @@ import WarningIcon from "@mui/icons-material/WarningAmber"; import { WIKI_LINKS } from "constants/externalLinks"; import { name } from "@root/package.json"; +import { FieldType as TableFieldType } from "constants/fields"; export const tableSettings = ( mode: TableSettingsDialogModes | null, @@ -159,8 +160,8 @@ export const tableSettings = ( }, { - type: FieldType.contentSubHeader, - name: "_contentSubHeader_userFacing", + type: FieldType.contentHeader, + name: "_contentHeader_userFacing", label: "Display", }, { @@ -182,9 +183,9 @@ export const tableSettings = ( }, { - type: FieldType.contentSubHeader, - name: "_contentSubHeader_admin", - label: "Admin", + type: FieldType.contentHeader, + name: "_contentHeader_admin", + label: "Access controls", }, { type: FieldType.multiSelect, @@ -253,11 +254,19 @@ export const tableSettings = ( ), }, + + mode === TableSettingsDialogModes.create + ? { + type: FieldType.contentHeader, + name: "_contentHeader_columns", + label: "Columns", + } + : null, mode === TableSettingsDialogModes.create && tables && tables?.length !== 0 ? { type: FieldType.singleSelect, name: "schemaSource", - label: "Copy column config from existing table (optional)", + label: "Copy columns from existing table (optional)", labelPlural: "tables", options: tables, clearable: true, @@ -270,4 +279,34 @@ export const tableSettings = ( ), } : null, + mode === TableSettingsDialogModes.create + ? { + type: FieldType.contentSubHeader, + name: "_contentSubHeader_initialColumns", + label: "Initial columns", + } + : null, + mode === TableSettingsDialogModes.create + ? { + type: FieldType.checkbox, + name: `_initialColumns.${TableFieldType.updatedBy}`, + label: "Updated By: Automatically log who updates a row", + } + : null, + mode === TableSettingsDialogModes.create + ? { + type: FieldType.checkbox, + name: `_initialColumns.${TableFieldType.createdBy}`, + label: "Created By: Automatically log who creates a row", + disablePaddingTop: true, + } + : null, + mode === TableSettingsDialogModes.create + ? { + type: FieldType.checkbox, + name: `_initialColumns.${TableFieldType.id}`, + label: "Row ID", + disablePaddingTop: true, + } + : null, ].filter((field) => field !== null) as Field[]; diff --git a/src/components/TableSettings/index.tsx b/src/components/TableSettings/index.tsx index 15978a9e..37dd6faf 100644 --- a/src/components/TableSettings/index.tsx +++ b/src/components/TableSettings/index.tsx @@ -10,8 +10,9 @@ import SuggestedRules from "./SuggestedRules"; import Confirmation from "components/Confirmation"; import { useProjectContext, Table } from "contexts/ProjectContext"; -import useRouter from "../../hooks/useRouter"; -import { db } from "../../firebase"; +import useRouter from "hooks/useRouter"; +import { routes } from "constants/routes"; +import { db } from "@src/firebase"; import { name } from "@root/package.json"; import { SETTINGS, TABLE_SCHEMAS, TABLE_GROUP_SCHEMAS } from "config/dbPaths"; import { runRoutes } from "constants/runRoutes"; @@ -103,8 +104,8 @@ export default function TableSettingsDialog({ ) .doc(data?.id) .delete(); - window.location.reload(); clearDialog(); + router.history.push(routes.home); }; return ( diff --git a/src/hooks/useSettings.ts b/src/hooks/useSettings.ts index 554f7999..6a655b3d 100644 --- a/src/hooks/useSettings.ts +++ b/src/hooks/useSettings.ts @@ -1,11 +1,14 @@ import { useEffect } from "react"; import _findIndex from "lodash/findIndex"; +import _camelCase from "lodash/camelCase"; import useDoc from "./useDoc"; import { db } from "../firebase"; import { SETTINGS, TABLE_GROUP_SCHEMAS, TABLE_SCHEMAS } from "config/dbPaths"; +import { FieldType } from "constants/fields"; +import { getFieldProp } from "@src/components/fields"; -const useSettings = () => { +export default function useSettings() { const [settingsState, documentDispatch] = useDoc({ path: SETTINGS }); useEffect(() => { //updates tables data on document change @@ -30,6 +33,7 @@ const useSettings = () => { tableType: string; roles: string[]; schemaSource: any; + _initialColumns: Record; }) => { const { tables } = settingsState; const { schemaSource, ...tableSettings } = data; @@ -41,7 +45,7 @@ const useSettings = () => { const tableSchemaDocRef = db.doc(tableSchemaPath); // Get columns from schemaSource if provided - let columns = []; + let columns: Record = []; if (schemaSource) { const schemaSourcePath = `${ tableSettings.tableType !== "collectionGroup" @@ -51,6 +55,17 @@ const useSettings = () => { const sourceDoc = await db.doc(schemaSourcePath).get(); columns = sourceDoc.get("columns"); } + // Add columns from `_initialColumns` + for (const [type, checked] of Object.entries(data._initialColumns)) { + if (checked && !columns.some((column) => column.type === type)) + columns.push({ + type, + name: getFieldProp("name", type as FieldType), + key: "_" + _camelCase(type), + fieldName: "_" + _camelCase(type), + config: {}, + }); + } // Appends table to settings doc await db.doc(SETTINGS).set( @@ -92,6 +107,4 @@ const useSettings = () => { }; const settingsActions = { createTable, updateTable, deleteTable }; return [settingsState, settingsActions]; -}; - -export default useSettings; +} diff --git a/yarn.lock b/yarn.lock index ab8577ea..6ac289de 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2659,10 +2659,10 @@ estree-walker "^1.0.1" picomatch "^2.2.2" -"@rowy/form-builder@^0.2.4": - version "0.2.5" - resolved "https://registry.yarnpkg.com/@rowy/form-builder/-/form-builder-0.2.5.tgz#f7d2f981899ed6ad7d3a79f617c5d4c37eb7219f" - integrity sha512-f2MLPIqBbw88vL7gSLlKv5PK6pLKBsa6xgi4efQUOvFLeDWFnU7ksHI1QH6yQwCEfl/tQmLbsanhv/on5pf0tA== +"@rowy/form-builder@^0.3.1": + version "0.3.1" + resolved "https://registry.yarnpkg.com/@rowy/form-builder/-/form-builder-0.3.1.tgz#7359a05563c99ae4c222fa5336a57ce7a344ae29" + integrity sha512-5IlNtBb6V5VdbpYWhO4P6QIBVqI42SVko15Bmn1YLd0JyoI3wza+seFBK0PgrBUB/OzTEA/hsBN5cyWhqlKt2Q== dependencies: "@hookform/resolvers" "^2.6.0" "@mdi/js" "^5.9.55" @@ -13588,7 +13588,12 @@ react-helmet@^6.1.0: react-fast-compare "^3.1.1" react-side-effect "^2.1.0" -react-hook-form@^7.10.0, react-hook-form@^7.16.1: +react-hook-form@^7.10.0: + version "7.17.2" + resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.17.2.tgz#235f15bb65c13e7a1198d33f2db24bcc9e27b303" + integrity sha512-oBaHwlYnbpzSFdNrs43QpcM+K2A0kUeNjV86ECYkCimlR1Ctl+tz4oQQd9plfGYkO7PJGLVMOVpUtL5EHjAcYQ== + +react-hook-form@^7.16.1: version "7.17.1" resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.17.1.tgz#dc257a5e34b3c353460ecdbbba5236e066cf80b1" integrity sha512-9nQ+qKFHFpnWzQHdDh6F4Egxa8iJkue1KU921F8qqeyUVbPPjgQZDXaQyNHABEYjRh0ndjTI24GDA+lwm2lQdg==