From f13eabda5491e7a2d05dd94a08e3966207d8b09e Mon Sep 17 00:00:00 2001 From: Sidney Alcantara Date: Thu, 28 Apr 2022 16:50:26 +1000 Subject: [PATCH] add settings pages --- .prettierignore | 1 + emulators/auth_export/accounts.json | 23 +- emulators/auth_export/config.json | 2 +- emulators/firebase-export-metadata.json | 2 +- .../all_namespaces_all_kinds.export_metadata | Bin 52 -> 52 bytes .../all_namespaces/all_kinds/output-0 | Bin 96 -> 385 bytes .../firestore_export.overall_export_metadata | Bin 94 -> 95 bytes firebase.json | 2 +- package.json | 6 + src/App.tsx | 35 ++- src/assets/LogoRowyRun.tsx | 8 +- src/atoms/auth.ts | 1 + src/atoms/globalScope.ts | 7 + src/atoms/project.ts | 3 +- src/atoms/rowyRun.ts | 127 +++++++++ src/atoms/ui.ts | 6 + src/atoms/user.ts | 14 +- src/components/SectionHeading.tsx | 70 +++++ src/components/SectionHeadingSkeleton.tsx | 14 + .../Settings/ProjectSettings/About.tsx | 156 +++++++++++ .../ProjectSettings/Authentication.tsx | 50 ++++ .../ProjectSettings/Customization.tsx | 61 +++++ .../Settings/ProjectSettings/RowyRun.tsx | 196 ++++++++++++++ src/components/Settings/SettingsSection.tsx | 43 +++ src/components/Settings/SettingsSkeleton.tsx | 59 +++++ src/components/Settings/ThemeColorPicker.tsx | 245 ++++++++++++++++++ .../Settings/UserSettings/Account.tsx | 35 +++ .../Settings/UserSettings/Personalization.tsx | 63 +++++ .../Settings/UserSettings/Theme.tsx | 76 ++++++ src/components/Setup/Steps/StepFinish.tsx | 4 +- src/constants/routes.ts | 26 -- src/constants/routes.tsx | 57 ++++ src/hooks/useDocumentTitle.ts | 31 +++ src/hooks/useFirestoreDocWithAtom.ts | 40 ++- src/hooks/useUpdateCheck.ts | 92 +++++++ src/layouts/Navigation/NavDrawer.tsx | 203 +++++++++++++++ src/layouts/Navigation/NavItem.tsx | 21 ++ src/layouts/Navigation/NavTableSection.tsx | 78 ++++++ src/layouts/Navigation/UpdateCheckBadge.tsx | 22 ++ src/layouts/Navigation/UserMenu.tsx | 182 +++++++++++++ src/layouts/Navigation/index.tsx | 194 ++++++++++++++ src/layouts/RequireAuth.tsx | 4 +- src/pages/Auth/ImpersonatorAuth.tsx | 46 ++-- src/pages/JotaiTest.tsx | 55 ++-- src/pages/NotFound.tsx | 57 ++-- src/pages/Settings/ProjectSettings.tsx | 106 ++++++++ src/pages/Settings/UserSettings.tsx | 85 ++++++ src/sources/ProjectSourceFirebase.tsx | 68 +++-- src/test/App.test.tsx | 6 +- src/test/testUtils.tsx | 8 +- tsconfig.json | 2 +- yarn.lock | 171 +++++++++++- 52 files changed, 2690 insertions(+), 173 deletions(-) create mode 100644 src/atoms/rowyRun.ts create mode 100644 src/atoms/ui.ts create mode 100644 src/components/SectionHeading.tsx create mode 100644 src/components/SectionHeadingSkeleton.tsx create mode 100644 src/components/Settings/ProjectSettings/About.tsx create mode 100644 src/components/Settings/ProjectSettings/Authentication.tsx create mode 100644 src/components/Settings/ProjectSettings/Customization.tsx create mode 100644 src/components/Settings/ProjectSettings/RowyRun.tsx create mode 100644 src/components/Settings/SettingsSection.tsx create mode 100644 src/components/Settings/SettingsSkeleton.tsx create mode 100644 src/components/Settings/ThemeColorPicker.tsx create mode 100644 src/components/Settings/UserSettings/Account.tsx create mode 100644 src/components/Settings/UserSettings/Personalization.tsx create mode 100644 src/components/Settings/UserSettings/Theme.tsx delete mode 100644 src/constants/routes.ts create mode 100644 src/constants/routes.tsx create mode 100644 src/hooks/useDocumentTitle.ts create mode 100644 src/hooks/useUpdateCheck.ts create mode 100644 src/layouts/Navigation/NavDrawer.tsx create mode 100644 src/layouts/Navigation/NavItem.tsx create mode 100644 src/layouts/Navigation/NavTableSection.tsx create mode 100644 src/layouts/Navigation/UpdateCheckBadge.tsx create mode 100644 src/layouts/Navigation/UserMenu.tsx create mode 100644 src/layouts/Navigation/index.tsx create mode 100644 src/pages/Settings/ProjectSettings.tsx create mode 100644 src/pages/Settings/UserSettings.tsx diff --git a/.prettierignore b/.prettierignore index 63022880..9ede4117 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,2 +1,3 @@ node_modules/ .yarn +emulators/ diff --git a/emulators/auth_export/accounts.json b/emulators/auth_export/accounts.json index 282cf60e..5c2dfe1c 100644 --- a/emulators/auth_export/accounts.json +++ b/emulators/auth_export/accounts.json @@ -1,22 +1 @@ -{ - "kind": "identitytoolkit#DownloadAccountResponse", - "users": [ - { - "localId": "uhYEjLj2GUl4jNeOkSR6QyesPJb9", - "createdAt": "1650966071948", - "lastLoginAt": "1650969459716", - "providerUserInfo": [ - { - "providerId": "google.com", - "rawId": "abc123", - "federatedId": "abc123", - "email": "foo@example.com" - } - ], - "validSince": "1650969876", - "email": "foo@example.com", - "emailVerified": true, - "disabled": false - } - ] -} +{"kind":"identitytoolkit#DownloadAccountResponse","users":[{"localId":"26CJMrwlouNRwkiLofNK07DNgKhw","createdAt":"1651022832613","lastLoginAt":"1651042518099","displayName":"Admin User","photoUrl":"","customAttributes":"{\"roles\": [\"ADMIN\"]}","providerUserInfo":[{"providerId":"google.com","rawId":"abc123","federatedId":"abc123","email":"admin@example.com"}],"validSince":"1651028322","email":"admin@example.com","emailVerified":true,"disabled":false,"lastRefreshAt":"2022-04-28T03:45:32.296Z"},{"localId":"3xTRVPnJGT2GE6lkiWKZp1jShuXj","createdAt":"1651023059442","lastLoginAt":"1651023059443","displayName":"Editor User","providerUserInfo":[{"providerId":"google.com","rawId":"1535779573397289142795231390488730790451","federatedId":"1535779573397289142795231390488730790451","displayName":"Editor User","email":"editor@example.com"}],"validSince":"1651028322","email":"editor@example.com","emailVerified":true,"disabled":false}]} \ No newline at end of file diff --git a/emulators/auth_export/config.json b/emulators/auth_export/config.json index a66c0872..bb253cf7 100644 --- a/emulators/auth_export/config.json +++ b/emulators/auth_export/config.json @@ -1 +1 @@ -{ "signIn": { "allowDuplicateEmails": false }, "usageMode": "DEFAULT" } +{"signIn":{"allowDuplicateEmails":false},"usageMode":"DEFAULT"} \ No newline at end of file diff --git a/emulators/firebase-export-metadata.json b/emulators/firebase-export-metadata.json index 82a540e6..6b385ef3 100644 --- a/emulators/firebase-export-metadata.json +++ b/emulators/firebase-export-metadata.json @@ -9,4 +9,4 @@ "version": "10.6.0", "path": "auth_export" } -} +} \ No newline at end of file diff --git a/emulators/firestore_export/all_namespaces/all_kinds/all_namespaces_all_kinds.export_metadata b/emulators/firestore_export/all_namespaces/all_kinds/all_namespaces_all_kinds.export_metadata index f88e82d6f138bd90c16c0710a29a4e325eec8d00..2c4abb1f766779908b14999c00422804fd4c5fe5 100644 GIT binary patch delta 36 pcmXppnII}Z|M32mZ?=AClK8ge0GJ`f!^I%PkzZO;P+FpE002Hh52gSB delta 36 ocmXppnIJ0vWZ~1v$2NXvlGwW)!Vu!&Vi4lUFD)r3Ezvaq06EAHUH||9 diff --git a/emulators/firestore_export/all_namespaces/all_kinds/output-0 b/emulators/firestore_export/all_namespaces/all_kinds/output-0 index 5eadb33f90bebfdb2c148c942bdeba1887ac3c73..5b815ff251d57aebee81038855ded83465b56a74 100644 GIT binary patch literal 385 zcmXRhKC2bUz?h|x#g&p;R#%i?UYVI+B*iVn77t>_EAbVSCgo%%2d9>lWagz8^Hd2) zair#!<|LNn7b!4kF$pj>G2&6~qrx@u7|?uw6!RUC%r7lYE%HswOH5DAP0cIe;TB>A zi4-fz7@0YH`4*MuXCqXzZRKcrAc|k;`wQpcf0XLL)N(X~+hN delta 27 icma!#6Wo#O;>XCqXe^!JcHEzVk;`|YpcgZvLIMC{WCmIQ diff --git a/firebase.json b/firebase.json index fc870ed6..26e83bd4 100644 --- a/firebase.json +++ b/firebase.json @@ -21,7 +21,7 @@ "port": 9099 }, "firestore": { - "port": 8080 + "port": 9299 }, "storage": { "port": 9199 diff --git a/package.json b/package.json index b5271a8d..3c2369ef 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,9 @@ "@mui/icons-material": "^5.6.0", "@mui/lab": "^5.0.0-alpha.76", "@mui/material": "^5.6.0", + "@mui/styles": "^5.6.2", "@rowy/multiselect": "^0.2.3", + "compare-versions": "^4.1.3", "date-fns": "^2.28.0", "dompurify": "^2.3.6", "firebase": "^9.6.11", @@ -23,6 +25,7 @@ "lodash-es": "^4.17.21", "notistack": "^2.0.4", "react": "^18.0.0", + "react-color-palette": "^6.2.0", "react-data-grid": "7.0.0-beta.5", "react-div-100vh": "^0.7.0", "react-dom": "^18.0.0", @@ -30,9 +33,11 @@ "react-error-boundary": "^3.1.4", "react-helmet-async": "^1.3.0", "react-router-dom": "^6.3.0", + "react-router-hash-link": "^2.4.3", "react-scripts": "^5.0.0", "tss-react": "^3.6.2", "typescript": "^4.6.3", + "use-debounce": "^7.0.1", "web-vitals": "^2.1.4" }, "scripts": { @@ -112,6 +117,7 @@ "@types/react-div-100vh": "^0.4.0", "@types/react-dom": "^18.0.0", "@types/react-router-dom": "^5.3.3", + "@types/react-router-hash-link": "^2.4.5", "@typescript-eslint/parser": "^5.18.0", "craco-alias": "^3.0.1", "craco-swc": "^0.5.1", diff --git a/src/App.tsx b/src/App.tsx index ca7917a7..60ab41b6 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,16 +1,16 @@ import { lazy, Suspense } from "react"; -import { Routes, Route } from "react-router-dom"; +import { Routes, Route, Navigate } from "react-router-dom"; import { useAtom } from "jotai"; import Loading from "@src/components/Loading"; import ProjectSourceFirebase from "@src/sources/ProjectSourceFirebase"; import NotFound from "@src/pages/NotFound"; import RequireAuth from "@src/layouts/RequireAuth"; -import Nav from "@src/layouts/Nav"; +import Navigation from "@src/layouts/Navigation"; import { globalScope } from "@src/atoms/globalScope"; import { currentUserAtom } from "@src/atoms/auth"; -import { routes } from "@src/constants/routes"; +import { ROUTES } from "@src/constants/routes"; import JotaiTestPage from "@src/pages/JotaiTest"; import SignOutPage from "@src/pages/Auth/SignOut"; @@ -27,6 +27,13 @@ const ImpersonatorAuthPage = lazy(() => import("@src/pages/Auth/ImpersonatorAuth // prettier-ignore const SetupPage = lazy(() => import("@src/pages/Setup" /* webpackChunkName: "SetupPage" */)); +// prettier-ignore +const UserSettingsPage = lazy(() => import("@src/pages/Settings/UserSettings" /* webpackChunkName: "UserSettingsPage" */)); +// prettier-ignore +const ProjectSettingsPage = lazy(() => import("@src/pages/Settings/ProjectSettings" /* webpackChunkName: "ProjectSettingsPage" */)); +// prettier-ignore +// const RowyRunTestPage = lazy(() => import("@src/pages/RowyRunTest" /* webpackChunkName: "RowyRunTestPage" */)); + export default function App() { const [currentUser] = useAtom(currentUserAtom, globalScope); @@ -40,12 +47,12 @@ export default function App() { } /> - } /> - } /> - } /> - } /> + } /> + } /> + } /> + } /> @@ -53,17 +60,23 @@ export default function App() { } /> - } /> + } /> -