{
+ constructor(props: ErrorBoundaryProps) {
+ super(props)
+ this.state = {}
+ }
+
+ componentDidCatch(error: Error) {
+ this.setState({ error })
+ }
+
+ render() {
+ if (this.state.error) return
+ return this.props.children
+ }
+}
diff --git a/commafeed-client/src/locales/en/messages.po b/commafeed-client/src/locales/en/messages.po
index 6fd5657f..68904291 100644
--- a/commafeed-client/src/locales/en/messages.po
+++ b/commafeed-client/src/locales/en/messages.po
@@ -323,6 +323,10 @@ msgstr "Mark all as read"
msgid "Mark all entries as read"
msgstr "Mark all entries as read"
+#: src/components/header/ProfileMenu.tsx
+msgid "Metrics"
+msgstr "Metrics"
+
#: src/components/RelativeDate.tsx
#: src/pages/app/FeedDetailsPage.tsx
msgid "N/A"
@@ -368,6 +372,10 @@ msgstr "OPML export"
msgid "OPML file"
msgstr "OPML file"
+#: src/pages/ErrorPage.tsx
+msgid "Oops!"
+msgstr "Oops!"
+
#: src/components/content/FeedEntryFooter.tsx
msgid "Open link"
msgstr "Open link"
@@ -446,6 +454,10 @@ msgstr "Settings saved."
msgid "Sign up"
msgstr "Sign up"
+#: src/pages/ErrorPage.tsx
+msgid "Something bad just happened..."
+msgstr "Something bad just happened..."
+
#: src/components/content/add/Subscribe.tsx
#: src/components/content/add/Subscribe.tsx
#: src/pages/app/AddPage.tsx
diff --git a/commafeed-client/src/locales/fr/messages.po b/commafeed-client/src/locales/fr/messages.po
index 4f0f6789..5782deca 100644
--- a/commafeed-client/src/locales/fr/messages.po
+++ b/commafeed-client/src/locales/fr/messages.po
@@ -323,6 +323,10 @@ msgstr "Tout marquer comme lu"
msgid "Mark all entries as read"
msgstr "Marquer toutes les entrées comme lues"
+#: src/components/header/ProfileMenu.tsx
+msgid "Metrics"
+msgstr "Métriques"
+
#: src/components/RelativeDate.tsx
#: src/pages/app/FeedDetailsPage.tsx
msgid "N/A"
@@ -368,6 +372,10 @@ msgstr "Export du fichier OPML"
msgid "OPML file"
msgstr "Fichier OPML"
+#: src/pages/ErrorPage.tsx
+msgid "Oops!"
+msgstr "Oups !"
+
#: src/components/content/FeedEntryFooter.tsx
msgid "Open link"
msgstr "Ouvrir le lien"
@@ -446,6 +454,10 @@ msgstr "Réglages enregistrés."
msgid "Sign up"
msgstr "Créer un compte"
+#: src/pages/ErrorPage.tsx
+msgid "Something bad just happened..."
+msgstr "Quelque chose s'est mal passé..."
+
#: src/components/content/add/Subscribe.tsx
#: src/components/content/add/Subscribe.tsx
#: src/pages/app/AddPage.tsx
diff --git a/commafeed-client/src/pages/ErrorPage.tsx b/commafeed-client/src/pages/ErrorPage.tsx
new file mode 100644
index 00000000..26df286a
--- /dev/null
+++ b/commafeed-client/src/pages/ErrorPage.tsx
@@ -0,0 +1,65 @@
+import { Trans } from "@lingui/macro"
+import { Box, Button, Center, Container, createStyles, Group, Stack, Text, Title } from "@mantine/core"
+import { Logo } from "components/Logo"
+import { TbRefresh } from "react-icons/tb"
+
+const useStyles = createStyles(theme => ({
+ root: {
+ paddingTop: 80,
+ },
+
+ label: {
+ textAlign: "center",
+ fontWeight: "bold",
+ fontSize: 120,
+ lineHeight: 1,
+ marginBottom: theme.spacing.xl * 1.5,
+ color: theme.colors[theme.primaryColor][3],
+ },
+
+ title: {
+ textAlign: "center",
+ fontWeight: "bold",
+ fontSize: 32,
+ },
+
+ description: {
+ maxWidth: 540,
+ margin: "auto",
+ marginTop: theme.spacing.xl,
+ marginBottom: theme.spacing.xl * 1.5,
+ },
+}))
+
+export function ErrorPage(props: { error: Error }) {
+ const { classes } = useStyles()
+
+ return (
+
+
+
+
+
+
+ CommaFeed
+
+
+
+
+ Oops!
+
+
+ Something bad just happened...
+
+
+ {props.error.message}
+
+
+
+
+
+
+ )
+}