diff --git a/packages/desktop/package.json b/packages/desktop/package.json index 7ad017b..7e4cc68 100644 --- a/packages/desktop/package.json +++ b/packages/desktop/package.json @@ -103,6 +103,7 @@ "notistack": "^2.0.5", "react": "^18.1.0", "react-dom": "^18.1.0", + "react-error-boundary": "^3.1.4", "react-icons": "^4.3.1", "react-use": "^17.4.0" } diff --git a/packages/desktop/src/app.tsx b/packages/desktop/src/app.tsx index 81bba01..18df2a4 100644 --- a/packages/desktop/src/app.tsx +++ b/packages/desktop/src/app.tsx @@ -10,17 +10,20 @@ import { ElectronProvider } from './providers/ElectronProvider'; import { AuthProvider } from './providers/AuthProvider'; import './firebase/connect'; +import ErrorParent from './providers/ErrorBoundary'; const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement); root.render( - - - - - + + + + + + + , diff --git a/packages/desktop/src/components/Terminal.tsx b/packages/desktop/src/components/Terminal.tsx index 23bc168..eeb246e 100644 --- a/packages/desktop/src/components/Terminal.tsx +++ b/packages/desktop/src/components/Terminal.tsx @@ -16,6 +16,7 @@ import { ListItemButton, ListItemText, ListSubheader, + Menu, Paper, Stack, Tooltip, @@ -39,6 +40,8 @@ import { useSnackbar } from 'notistack'; import { useKey } from 'react-use'; import NirvanaAvatar from './NirvanaAvatar'; +import MenuItem from '@mui/material/MenuItem'; + export default function Terminal() { const { enqueueSnackbar } = useSnackbar(); @@ -218,50 +221,89 @@ export default function Terminal() { } const Navbar = () => { - return ( - - + const [anchorEl, setAnchorEl] = React.useState(null); + const open = Boolean(anchorEl); + const handleClick = (event: React.MouseEvent) => { + setAnchorEl(event.currentTarget); + }; + const handleClose = () => { + setAnchorEl(null); + }; + return ( + <> - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + - - + + + Profile + My account + Logout + + ); }; diff --git a/packages/desktop/src/firebase/firestore.ts b/packages/desktop/src/firebase/firestore.ts index d0e3e65..ea538d4 100644 --- a/packages/desktop/src/firebase/firestore.ts +++ b/packages/desktop/src/firebase/firestore.ts @@ -16,7 +16,7 @@ import { User as FirebaseUser } from 'firebase/auth'; * UTILS */ const converter = () => ({ - toFirestore: (data: T) => data, + toFirestore: (data: T) => ({ ...data }), fromFirestore: (snap: QueryDocumentSnapshot) => snap.data() as T, }); @@ -24,7 +24,6 @@ const dataPoint = (collectionPath: string) => doc(getFirestore(), collectionPath).withConverter(converter()); const db = { - users: dataPoint('users'), user: (userId: string) => dataPoint(`users/${userId}`), }; @@ -62,5 +61,7 @@ export const createUser = async (user: FirebaseUser) => { ); } catch (e) { console.error('Error creating user: ', e); + + throw new Error('Error creating user'); } }; diff --git a/packages/desktop/src/providers/ErrorBoundary.tsx b/packages/desktop/src/providers/ErrorBoundary.tsx new file mode 100644 index 0000000..0a1c9a1 --- /dev/null +++ b/packages/desktop/src/providers/ErrorBoundary.tsx @@ -0,0 +1,36 @@ +import React from 'react'; + +import { ErrorBoundary } from 'react-error-boundary'; +import { useSnackbar } from 'notistack'; + +function MyFallbackComponent({ + error, + resetErrorBoundary, +}: { + error: Error; + resetErrorBoundary: () => void; +}) { + return ( +
+

Something went wrong:

+
{error.message}
+ +
+ ); +} + +export default function ErrorParent({ children }: { children: React.ReactNode }) { + const { enqueueSnackbar } = useSnackbar(); + + return ( + enqueueSnackbar(error.message, { variant: 'error' })} + onReset={() => { + // reset the state of your app + }} + > + {children} + + ); +} diff --git a/yarn.lock b/yarn.lock index 6f9cef9..d4b9aa5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -50,7 +50,7 @@ core-js-pure "^3.20.2" regenerator-runtime "^0.13.4" -"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.13.10", "@babel/runtime@^7.16.3", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.7": +"@babel/runtime@^7.1.2", "@babel/runtime@^7.10.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.13.10", "@babel/runtime@^7.16.3", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.7": version "7.18.3" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.18.3.tgz#c7b654b57f6f63cf7f8b418ac9ca04408c4579f4" integrity sha512-38Y8f7YUhce/K7RMwTp7m0uCumpv9hZkitCbBClqQIow1qSbCvGkcegKOXpEWCQLfWmevgRiWokZ1GkpfhbZug== @@ -6278,6 +6278,13 @@ react-dom@^18.1.0: loose-envify "^1.1.0" scheduler "^0.22.0" +react-error-boundary@^3.1.4: + version "3.1.4" + resolved "https://registry.yarnpkg.com/react-error-boundary/-/react-error-boundary-3.1.4.tgz#255db92b23197108757a888b01e5b729919abde0" + integrity sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA== + dependencies: + "@babel/runtime" "^7.12.5" + react-icons@^4.3.1: version "4.3.1" resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-4.3.1.tgz#2fa92aebbbc71f43d2db2ed1aed07361124e91ca"