added error page #425

ruuvi · Aug 20, 2024 · 3f3ccda · 3f3ccda
1 parent 3f3b43d
commit 3f3ccda
Show file tree

Hide file tree

Showing 3 changed files with 137 additions and 50 deletions.
diff --git a/src/img/with-phone-serious-500.png b/src/img/with-phone-serious-500.png
diff --git a/src/index.js b/src/index.js
@@ -7,20 +7,57 @@ import 'typeface-montserrat';
 import 'typeface-mulish';
 import 'typeface-oswald';
 import './i18n';
+import logo from './img/ruuvi-vector-logo.svg'
+import seriousPhone from './img/with-phone-serious-500.png'
 import { createStandaloneToast } from '@chakra-ui/toast'
+import { t } from 'i18next';
 const { ToastContainer } = createStandaloneToast()
 
+class ErrorView extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false };
+  }
+
+  static getDerivedStateFromError(error) {
+    return { hasError: true };
+  }
+
+  componentDidCatch(error, info) {
+    console.log(error, info)
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return (
+        <center style={{ color: "white" }}>
+          <br />
+          <img src={logo} alt='logo' width={"100px"} />
+          <br />
+          <br />
+          <img src={seriousPhone} alt='serious-mascot' width={"300px"} />
+          <h1>{t("something_went_wrong")}</h1>
+          <p>{t("try_refreshing_page")}</p>
+        </center>
+      );
+    }
+
+    return this.props.children;
+  }
+}
 
 const root = ReactDOM.createRoot(document.getElementById("root"));
 root.render(
-    <Suspense fallback={
-      <center style={{ width: "100%", marginTop: 100 }}>
-        <span className='spinner'></span>
-      </center>
-    }>
+  <Suspense fallback={
+    <center style={{ width: "100%", marginTop: 100 }}>
+      <span className='spinner'></span>
+    </center>
+  }>
+    <ErrorView>
       <App />
-      <ToastContainer />
-    </Suspense>,
+    </ErrorView>
+    <ToastContainer />
+  </Suspense>,
   document.getElementById('root')
 );
 

diff --git a/src/localization_i18n.json b/src/localization_i18n.json
@@ -252,32 +252,42 @@
       "set": "Set",
       "upgrade_plan": "Upgrade plan",
       "active_shares": "Active shares",
-      "remove_share_title": "Remove share",
+      "remove_share_title": "Remove Share",
       "share_center": "Share Sensors",
       "share_center_subtitle": "Share your sensors with other Ruuvi users and manage the sensor sharing settings",
       "share_center_description": "Select one or more sensors from the list, enter the email addresses to share with, and tap Add. You can add multiple email addresses at once. To share, tap the Share button.",
-      "shared_by_me": "Sensors shared by me",
-      "shared_to_me": "Sensors shared to me",
+      "shared_by_me": "Sensors Shared by Me",
+      "shared_to_me": "Sensors Shared to Me",
       "sharing_progress": "Sharing {}/{}...",
-      "sensor_shared_to_email": "Sensor {} shared to {}",
-      "sensor_not_shared_to_email": "Sensor {} not shared to {}",
+      "sensor_shared_to_email": "Sensor {} has been shared to {}",
+      "sensor_not_shared_to_email": "Sensor {} was not shared to {}",
       "share_result": "Report",
       "sensor_removed": "Sensor removed",
       "sensor_shared_by_me_description": "Below is a list of sensors you have shared with others. To remove a share, choose X. After removing the share, the respective sensor will be removed from the recipient's app and it will become instantly unaccessible for the user.",
       "sensor_shared_with_me_description": "Below is a list of sensors shared with you, along with the owner's email addresses and subscription levels. To remove a share, choose X. The respective sensor will be removed from the app.",
-      "remove_sensor_confirmation_title": "Remove sensor",
-      "my_sensors": "My Sensors",
+      "remove_sensor_confirmation_title": "Remove Sensor",
+      "my_sensors": "Sensors",
       "home": "Home",
       "help": "Help",
       "contact_support": "Contact Support",
-      "what_to_measure": "What to measure",
-      "switch_to_dark_mode": "Switch to dark mode",
-      "switch_to_light_mode": "Switch to light mode",
-      "all_my_sensors": "All my sensors",
-      "buy_sensors": "Buy sensors",
+      "what_to_measure": "What to Measure?",
+      "switch_to_dark_mode": "Switch to Dark Mode",
+      "switch_to_light_mode": "Switch to Light Mode",
+      "all_my_sensors": "All Sensors",
+      "buy_sensors": "Buy Sensors",
       "share_sensors": "Share Sensors",
-      "app_settings": "App Settings",
-      "my_profile": "My Profile"
+      "app_settings": "Settings",
+      "my_profile": "My Profile",
+      "compare_sensors": "Compare Sensors",
+      "compare_subtitle": "Compare history data from multiple sensors on a unified chart",
+      "unit": "Unit",
+      "compare": "Compare",
+      "compare_description": "First, select all Ruuvi sensors you want to compare with each other. Then, select the unit of measurement. Finally, tap Load and wait for the data to be loaded into the chart.",
+      "sensors_select_label": "Sensors",
+      "sensors_select_button": "Select",
+      "image_format_not_supported": "Image format not supported",
+      "load": "Load",
+      "try_refreshing_page": "Try refreshing the page"
     }
   },
   "fi": {
@@ -540,25 +550,35 @@
       "shared_by_me": "Jakamani anturit",
       "shared_to_me": "Minulle jaetut anturit",
       "sharing_progress": "Jaetaan {}/{}...",
-      "sensor_shared_to_email": "Anturi {} jaettu {}",
-      "sensor_not_shared_to_email": "Anturia {} ei jaettu {}",
+      "sensor_shared_to_email": "Anturi {} jaettiin käyttäjälle {}",
+      "sensor_not_shared_to_email": "Anturia {} ei jaettu käyttäjälle {}",
       "share_result": "Raportti",
       "sensor_removed": "Anturi poistettu",
       "sensor_shared_by_me_description": "Alla on luettelo antureista, jotka olet jakanut muiden kanssa. Poistaaksesi jaon, valitse X. Jaon poistamisen jälkeen kyseinen anturi poistetaan vastaanottajan sovelluksesta eikä käyttäjä pääse enää lukemaan sen tietoja.",
       "sensor_shared_with_me_description": "Alla on luettelo antureista, jotka on jaettu sinulle, sekä omistajien sähköpostiosoitteet ja tilausasetukset. Poistaaksesi jaon, valitse X. Kyseinen anturi poistetaan sovelluksesta.",
       "remove_sensor_confirmation_title": "Poista anturi",
-      "my_sensors": "Omat anturit",
+      "my_sensors": "Anturit",
       "home": "Koti",
       "help": "Ohje",
       "contact_support": "Ota yhteyttä tukeen",
-      "what_to_measure": "Mitä mitata",
-      "switch_to_dark_mode": "Vaihda pimeään tilaan",
-      "switch_to_light_mode": "Vaihda vaaleaan tilaan",
+      "what_to_measure": "Mitä mitata?",
+      "switch_to_dark_mode": "Vaihda tummaan teemaan",
+      "switch_to_light_mode": "Vaihda vaaleaan teemaan",
       "all_my_sensors": "Kaikki anturit",
       "buy_sensors": "Osta antureita",
-      "share_sensors": "Jaa anturit",
-      "app_settings": "Sovelluksen asetukset",
-      "my_profile": "Profiilini"
+      "share_sensors": "Jaa antureita",
+      "app_settings": "Asetukset",
+      "my_profile": "Profiilini",
+      "compare_sensors": "Vertaile antureita",
+      "compare_subtitle": "Vertaile usean anturin hisoriatietoja yhdessä kuvaajassa",
+      "unit": "Yksikkö",
+      "compare": "Vertaile",
+      "compare_description": "Valitse ensin kaikki Ruuvi-anturit, joita haluat vertailla keskenään. Valitse sitten mittayksikkö. Valitse lopuksi Lataa ja odota, että tiedot ladataan kuvaajaan.",
+      "sensors_select_label": "Anturit",
+      "sensors_select_button": "Valitse",
+      "image_format_not_supported": "Kuvamuotoa ei tueta",
+      "load": "Lataa",
+      "try_refreshing_page": "Kokeile päivittää sivu uudelleen."
     }
   },
   "sv": {
@@ -822,24 +842,34 @@
       "shared_to_me": "Sensorer delade till mig",
       "sharing_progress": "Delar {}/{}...",
       "sensor_shared_to_email": "Sensor {} delat till {}",
-      "sensor_not_shared_to_email": "Sensor {} inte delat till {}",
+      "sensor_not_shared_to_email": "Sensorn {} delades inte till {}",
       "share_result": "Rapportera",
       "sensor_removed": "Sensor borttagen",
       "sensor_shared_by_me_description": "Nedan finns en lista över sensorer du har delat med andra. För att ta bort en delning, välj X. Efter att delningen har tagits bort kommer den respektive sensorn att tas bort från mottagarens app och bli omedelbart otillgänglig för användaren.",
       "sensor_shared_with_me_description": "Nedan finns en lista över sensorer som har delats med dig, tillsammans med ägarens e-postadresser och prenumerationsnivåer. För att ta bort en delning, välj X. Den respektive sensorn kommer att tas bort från appen.",
       "remove_sensor_confirmation_title": "Ta bort sensor",
-      "my_sensors": "Mina sensorer",
+      "my_sensors": "Sensorer",
       "home": "Hem",
       "help": "Hjälp",
       "contact_support": "Kontakta support",
-      "what_to_measure": "Vad att mäta",
+      "what_to_measure": "Vad att mäta?",
       "switch_to_dark_mode": "Byt till mörkt läge",
       "switch_to_light_mode": "Byt till ljust läge",
-      "all_my_sensors": "Alla mina sensorer",
+      "all_my_sensors": "Alla sensorer",
       "buy_sensors": "Köp sensorer",
       "share_sensors": "Dela sensorer",
-      "app_settings": "Appinställningar",
-      "my_profile": "Min profil"
+      "app_settings": "Inställningar",
+      "my_profile": "Min profil",
+      "compare_sensors": "Jämför sensorer",
+      "compare_subtitle": "Jämför historiska data från flera sensorer på ett enhetligt diagram",
+      "unit": "Enhet",
+      "compare": "Jämför",
+      "compare_description": "Välj först alla Ruuvi-sensorer du vill jämföra med varandra. Välj sedan måttenhet. Slutligen väljer du Ladda och väntar på att data ska laddas in i diagrammet.",
+      "sensors_select_label": "Sensorer",
+      "sensors_select_button": "Välj",
+      "image_format_not_supported": "Bildformat stöds inte",
+      "load": "Ladda",
+      "try_refreshing_page": "Försök att ladda om sidan"
     }
   },
   "fr": {
@@ -1102,25 +1132,35 @@
       "shared_by_me": "Capteurs partagés par moi",
       "shared_to_me": "Capteurs partagés avec moi",
       "sharing_progress": "Partage {}/{}...",
-      "sensor_shared_to_email": "Capteur {} partagé à {}",
-      "sensor_not_shared_to_email": "Capteur {} pas partagé à {}",
+      "sensor_shared_to_email": "Le capteur {} a été partagé avec {}",
+      "sensor_not_shared_to_email": "Le capteur {} n'a pas été partagé avec {}",
       "share_result": "Rapport",
       "sensor_removed": "Capteur supprimé",
       "sensor_shared_by_me_description": "Ci-dessous se trouve une liste des capteurs que vous avez partagés avec d'autres. Pour supprimer un partage, choisissez X. Après la suppression du partage, le capteur concerné sera retiré de l'application du destinataire et deviendra immédiatement inaccessible pour l'utilisateur.",
       "sensor_shared_with_me_description": "Ci-dessous se trouve une liste des capteurs partagés avec vous, ainsi que les adresses e-mail des propriétaires et les niveaux d'abonnement. Pour supprimer un partage, choisissez X. Le capteur concerné sera supprimé de l'application.",
       "remove_sensor_confirmation_title": "Supprimer le capteur",
-      "my_sensors": "Mes capteurs",
+      "my_sensors": "Capteurs",
       "home": "Accueil",
       "help": "Aide",
       "contact_support": "Contacter le support",
-      "what_to_measure": "Quoi mesurer",
+      "what_to_measure": "Quoi mesurer?",
       "switch_to_dark_mode": "Passer en mode sombre",
       "switch_to_light_mode": "Passer en mode clair",
-      "all_my_sensors": "Tous mes capteurs",
+      "all_my_sensors": "Tous les capteurs",
       "buy_sensors": "Acheter des capteurs",
       "share_sensors": "Partager les capteurs",
-      "app_settings": "Paramètres de l'application",
-      "my_profile": "Mon profil"
+      "app_settings": "Paramètres",
+      "my_profile": "Mon profil",
+      "compare_sensors": "Comparer les capteurs",
+      "compare_subtitle": "Comparez les données historiques de plusieurs capteurs sur un graphique unifié",
+      "unit": "Unité",
+      "compare": "Comparer",
+      "compare_description": "Tout d'abord, sélectionnez tous les capteurs Ruuvi que vous souhaitez comparer entre eux. Ensuite, sélectionnez l'unité de mesure. Enfin, choisissez Charger et attendez que les données soient chargées dans le graphique.",
+      "sensors_select_label": "Capteurs",
+      "sensors_select_button": "Sélectionner",
+      "image_format_not_supported": "Format d'image non pris en charge",
+      "load": "Charger",
+      "try_refreshing_page": "Essayez de rafraîchir la page"
     }
   },
   "de": {
@@ -1383,25 +1423,35 @@
       "shared_by_me": "Von mir freigegebene Sensoren",
       "shared_to_me": "Mit mir geteilte Sensoren",
       "sharing_progress": "Teilen {}/{}...",
-      "sensor_shared_to_email": "Sensor {} geteilt mit {}",
-      "sensor_not_shared_to_email": "Sensor {} nicht geteilt mit {}",
+      "sensor_shared_to_email": "Sensor {} wurde an {} weitergegeben",
+      "sensor_not_shared_to_email": "Sensor {} wurde nicht an {} weitergegeben",
       "share_result": "Bericht",
       "sensor_removed": "Sensor entfernt",
       "sensor_shared_by_me_description": "Unten finden Sie eine Liste der Sensoren, die Sie mit anderen geteilt haben. Um eine Freigabe zu entfernen, wählen Sie X. Nach dem Entfernen der Freigabe wird der jeweilige Sensor aus der App des Empfängers entfernt und ist für den Benutzer sofort unzugänglich.",
       "sensor_shared_with_me_description": "Unten finden Sie eine Liste der Sensoren, die mit Ihnen geteilt wurden, zusammen mit den E-Mail-Adressen der Eigentümer und den Abonnementstufen. Um eine Freigabe zu entfernen, wählen Sie X. Der entsprechende Sensor wird aus der App entfernt.",
       "remove_sensor_confirmation_title": "Sensor entfernen",
-      "my_sensors": "Meine Sensoren",
+      "my_sensors": "Sensoren",
       "home": "Startseite",
       "help": "Hilfe",
       "contact_support": "Support kontaktieren",
-      "what_to_measure": "Was messen",
+      "what_to_measure": "Was messen?",
       "switch_to_dark_mode": "Zum Dunkelmodus wechseln",
       "switch_to_light_mode": "Zum Lichtmodus wechseln",
-      "all_my_sensors": "Alle meine Sensoren",
+      "all_my_sensors": "Alle Sensoren",
       "buy_sensors": "Sensoren kaufen",
       "share_sensors": "Sensoren teilen",
-      "app_settings": "App-Einstellungen",
-      "my_profile": "Mein Profil"
+      "app_settings": "Einstellungen",
+      "my_profile": "Mein Profil",
+      "compare_sensors": "Sensoren vergleichen",
+      "compare_subtitle": "Vergleichen Sie historische Daten von mehreren Sensoren auf einem einheitlichen Diagramm",
+      "unit": "Einheit",
+      "compare": "Vergleichen",
+      "compare_description": "Wählen Sie zuerst alle Ruuvi-Sensoren aus, die Sie miteinander vergleichen möchten. Wählen Sie dann die Maßeinheit aus. Wählen Sie schließlich Laden und warten Sie, bis die Daten in das Diagramm geladen sind.",
+      "sensors_select_label": "Sensoren",
+      "sensors_select_button": "Auswählen",
+      "image_format_not_supported": "Bildformat wird nicht unterstützt",
+      "load": "Laden",
+      "try_refreshing_page": "Versuchen Sie, die Seite neu zu laden"
     }
   }
 }