diff --git a/package.json b/package.json index f4be4f9b..54fecaa1 100644 --- a/package.json +++ b/package.json @@ -35,6 +35,7 @@ "react-datepicker": "4.8.0", "react-dom": "18.2.0", "react-dropzone": "14.2.3", + "react-error-boundary": "^3.1.4", "react-feather": "^2.0.10", "react-hot-toast": "2.4.0", "server-only": "^0.0.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 93a2be2a..12b18535 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -41,6 +41,7 @@ specifiers: react-datepicker: 4.8.0 react-dom: 18.2.0 react-dropzone: 14.2.3 + react-error-boundary: ^3.1.4 react-feather: ^2.0.10 react-hot-toast: 2.4.0 server-only: ^0.0.1 @@ -75,6 +76,7 @@ dependencies: react-datepicker: 4.8.0_biqbaboplfbrettd7655fr4n2y react-dom: 18.2.0_react@18.2.0 react-dropzone: 14.2.3_react@18.2.0 + react-error-boundary: 3.1.4_react@18.2.0 react-feather: 2.0.10_react@18.2.0 react-hot-toast: 2.4.0_owo25xnefcwdq3zjgtohz6dbju server-only: 0.0.1 @@ -424,7 +426,7 @@ packages: resolution: {integrity: sha512-mrzLkl6U9YLF8qpqI7TB82PESyEGjm/0Ly91jG575eVxMMlb8fYfOXFZIJ8XfLrJZQbm7dlKry2bJmXBUEkdFg==} engines: {node: '>=6.9.0'} dependencies: - regenerator-runtime: 0.13.10 + regenerator-runtime: 0.13.11 dev: false /@babel/runtime/7.20.13: @@ -432,7 +434,6 @@ packages: engines: {node: '>=6.9.0'} dependencies: regenerator-runtime: 0.13.11 - dev: true /@babel/template/7.20.7: resolution: {integrity: sha512-8SegXApWe6VoNw0r9JHpSteLKTpTiLZ4rMlGIm9JQ18KiCtyQiAMEazujAHrUS5flrcqYZa75ukev3P6QmUwUw==} @@ -1029,7 +1030,7 @@ packages: /@radix-ui/primitive/1.0.0: resolution: {integrity: sha512-3e7rn8FDMin4CgeL7Z/49smCA3rFYY3Ha2rUQ7HRWFadS5iCRw08ZgVT1LaNTCNqgvrUiyczLflrVrF0SRQtNA==} dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 dev: false /@radix-ui/react-arrow/1.0.1_biqbaboplfbrettd7655fr4n2y: @@ -1038,7 +1039,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-primitive': 1.0.1_biqbaboplfbrettd7655fr4n2y react: 18.2.0 react-dom: 18.2.0_react@18.2.0 @@ -1050,7 +1051,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 '@radix-ui/react-context': 1.0.0_react@18.2.0 '@radix-ui/react-primitive': 1.0.1_biqbaboplfbrettd7655fr4n2y @@ -1064,7 +1065,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 react: 18.2.0 dev: false @@ -1073,7 +1074,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 react: 18.2.0 dev: false @@ -1109,7 +1110,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 react: 18.2.0 dev: false @@ -1119,7 +1120,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/primitive': 1.0.0 '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 '@radix-ui/react-primitive': 1.0.1_biqbaboplfbrettd7655fr4n2y @@ -1154,7 +1155,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 react: 18.2.0 dev: false @@ -1164,7 +1165,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 '@radix-ui/react-primitive': 1.0.1_biqbaboplfbrettd7655fr4n2y '@radix-ui/react-use-callback-ref': 1.0.0_react@18.2.0 @@ -1177,7 +1178,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-use-layout-effect': 1.0.0_react@18.2.0 react: 18.2.0 dev: false @@ -1188,7 +1189,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/primitive': 1.0.0 '@radix-ui/react-collection': 1.0.1_biqbaboplfbrettd7655fr4n2y '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 @@ -1247,7 +1248,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@floating-ui/react-dom': 0.7.2_5ndqzdd6t4rivxsukjv3i3ak2q '@radix-ui/react-arrow': 1.0.1_biqbaboplfbrettd7655fr4n2y '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 @@ -1270,7 +1271,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-primitive': 1.0.1_biqbaboplfbrettd7655fr4n2y react: 18.2.0 react-dom: 18.2.0_react@18.2.0 @@ -1282,7 +1283,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 '@radix-ui/react-use-layout-effect': 1.0.0_react@18.2.0 react: 18.2.0 @@ -1295,7 +1296,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-slot': 1.0.1_react@18.2.0 react: 18.2.0 react-dom: 18.2.0_react@18.2.0 @@ -1307,7 +1308,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/primitive': 1.0.0 '@radix-ui/react-collection': 1.0.1_biqbaboplfbrettd7655fr4n2y '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 @@ -1326,7 +1327,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-compose-refs': 1.0.0_react@18.2.0 react: 18.2.0 dev: false @@ -1380,7 +1381,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 react: 18.2.0 dev: false @@ -1389,7 +1390,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-use-callback-ref': 1.0.0_react@18.2.0 react: 18.2.0 dev: false @@ -1399,7 +1400,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-use-callback-ref': 1.0.0_react@18.2.0 react: 18.2.0 dev: false @@ -1409,7 +1410,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 react: 18.2.0 dev: false @@ -1418,7 +1419,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/rect': 1.0.0 react: 18.2.0 dev: false @@ -1428,7 +1429,7 @@ packages: peerDependencies: react: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-use-layout-effect': 1.0.0_react@18.2.0 react: 18.2.0 dev: false @@ -1439,7 +1440,7 @@ packages: react: ^16.8 || ^17.0 || ^18.0 react-dom: ^16.8 || ^17.0 || ^18.0 dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 '@radix-ui/react-primitive': 1.0.1_biqbaboplfbrettd7655fr4n2y react: 18.2.0 react-dom: 18.2.0_react@18.2.0 @@ -1448,7 +1449,7 @@ packages: /@radix-ui/rect/1.0.0: resolution: {integrity: sha512-d0O68AYy/9oeEy1DdC07bz1/ZXX+DqCskRd3i4JzLSTXwefzaepQrKjXC7aNM8lTHjFLDO0pDgaEiQ7jEk+HVg==} dependencies: - '@babel/runtime': 7.20.1 + '@babel/runtime': 7.20.13 dev: false /@resvg/resvg-wasm/2.0.0-alpha.4: @@ -6184,6 +6185,16 @@ packages: react: 18.2.0 dev: false + /react-error-boundary/3.1.4_react@18.2.0: + resolution: {integrity: sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==} + engines: {node: '>=10', npm: '>=6'} + peerDependencies: + react: '>=16.13.1' + dependencies: + '@babel/runtime': 7.20.13 + react: 18.2.0 + dev: false + /react-fast-compare/3.2.0: resolution: {integrity: sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==} @@ -6334,13 +6345,8 @@ packages: parse-entities: 4.0.0 dev: false - /regenerator-runtime/0.13.10: - resolution: {integrity: sha512-KepLsg4dU12hryUO7bp/axHAKvwGOCV0sGloQtpagJ12ai+ojVDqkeGSiRX1zlq+kjIMZ1t7gpze+26QqtdGqw==} - dev: false - /regenerator-runtime/0.13.11: resolution: {integrity: sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==} - dev: true /regexp.prototype.flags/1.4.3: resolution: {integrity: sha512-fjggEOO3slI6Wvgjwflkc4NFRCTZAu5CnNfBd5qOMYhWdn67nJBBu34/TkD++eeFmd8C9r9jfXJ27+nSiRkSUA==} diff --git a/src/app/components/error/fallback.tsx b/src/app/components/error/fallback.tsx new file mode 100644 index 00000000..5721fc8b --- /dev/null +++ b/src/app/components/error/fallback.tsx @@ -0,0 +1,49 @@ +"use client" + +import Button from "@components/button" +import Note from "@components/note" +import { useRouter } from "next/navigation" +// an error fallback for react-error-boundary + +import { + ErrorBoundary as ErrorBoundaryComponent, + FallbackProps, + ErrorBoundaryPropsWithFallback +} from "react-error-boundary" + +function ErrorFallback({ error, resetErrorBoundary }: FallbackProps) { + return ( + +

Something went wrong:

+
{error.message}
+ +
+ ) +} + +export default function ErrorBoundary({ + children, + onReset, + ...props +}: { + children: React.ReactNode + onReset?: ErrorBoundaryPropsWithFallback["onReset"] + props?: ErrorBoundaryPropsWithFallback +}) { + const router = useRouter() + if (!onReset) { + onReset = () => { + router.refresh() + } + } + + return ( + + {children} + + ) +}