add rest of translations, improve error flow

kristianka · Jun 7, 2024 · 86047bb · 86047bb
1 parent cfbdca6
commit 86047bb
Show file tree

Hide file tree

Showing 5 changed files with 46 additions and 15 deletions.
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -20,6 +20,7 @@ import { sortBoxes } from "./components/Buttons/sortLogic";
 import { getBoxes } from "./services/boxes";
 import ErrorMessage from "./components/ErrorMessage";
 import { searchBoxes } from "./misc";
+import InfoMessage from "./components/InfoMessage";
 
 const address = import.meta.env.VITE_BACKEND_URL;
 
@@ -79,10 +80,15 @@ function App() {
             </div>
           </div>
           {error ? (
-            <ErrorMessage
-              title="Error!"
-              description="Backend URL not found. Please check your .env file."
-            />
+            <div>
+              <ErrorMessage
+                title={t("error")}
+                description={t("couldntFetchBoxes")}
+              />
+              <div className="mt-3">
+                <InfoMessage title={t("info")} description={t("infoTip")} />
+              </div>
+            </div>
           ) : (
             <BoxList
               pagination={pagination}

diff --git a/frontend/src/components/ErrorMessage.tsx b/frontend/src/components/ErrorMessage.tsx
@@ -9,8 +9,8 @@ interface props {
 const ErrorMessage = ({ title, description }: props) => {
   return (
     <Alert color="failure" icon={HiInformationCircle}>
-      <span className="font-medium">{title} </span>
-      {description}
+      <span className="font-medium">{title}. </span>
+      {description}.
     </Alert>
   );
 };

diff --git a/frontend/src/components/InfoMessage.tsx b/frontend/src/components/InfoMessage.tsx
@@ -0,0 +1,18 @@
+import { Alert } from "flowbite-react";
+import { HiInformationCircle } from "react-icons/hi";
+
+interface props {
+  title: string;
+  description: string;
+}
+
+const InfoMessage = ({ title, description }: props) => {
+  return (
+    <Alert color="info" icon={HiInformationCircle}>
+      <span className="font-medium">{title}. </span>
+      {description}.
+    </Alert>
+  );
+};
+
+export default InfoMessage;
diff --git a/frontend/src/i18n/en/translations.json b/frontend/src/i18n/en/translations.json
@@ -39,17 +39,20 @@
     "undoChanges": "Undo changes",
     "deleteBox": "Delete box",
     "saveChanges": "Save changes",
-    "editBoxErrorTitle": "Error while modifying.",
-    "addBoxErrorTitle": "Error while adding.",
-    "BoxErrorDescription": " Make sure all values are numbers, greater than 0, and not empty.",
+    "editBoxErrorTitle": "Error while modifying",
+    "addBoxErrorTitle": "Error while adding",
+    "BoxErrorDescription": " Make sure all values are numbers, greater than 0, and not empty",
     "notModified": "Not modified",
     "noComment": "No comment",
     "previous": "Previous",
     "next": "Next",
     "noBoxesFound": "No boxes found.",
     "boxAdded": "Box added successfully.",
     "boxDeleted": "Box deleted successfully.",
-    "language": "Language"
-
+    "language": "Language",
+    "error": "Error",
+    "tip": "Tip",
+    "info": "Info",
+    "infoTip": "Make sure backend and database are running, and you have set the .env values to backend and frontend. See GitHub readme for more information"
 
 }
diff --git a/frontend/src/i18n/fi/translations.json b/frontend/src/i18n/fi/translations.json
@@ -38,16 +38,20 @@
     "undoChanges": "Peru muutokset",
     "deleteBox": "Poista laatikko",
     "saveChanges": "Tallenna muutokset",
-    "editBoxErrorTitle": "Virhe muokatessa.",
-    "addBoxErrorTitle": "Virhe lisättäessä.",
-    "BoxErrorDescription": "Varmista että kaikki arvot ovat numeroita, suurempia kuin 0, ja eivät ole tyhjiä.",
+    "editBoxErrorTitle": "Virhe muokatessa",
+    "addBoxErrorTitle": "Virhe lisättäessä",
+    "BoxErrorDescription": "Varmista että kaikki arvot ovat numeroita, suurempia kuin 0, ja eivät ole tyhjiä",
     "notModified": "Ei muutettu",
     "noComment": "Ei kommenttia",
     "previous": "Edellinen",
     "next": "Seuraava",
     "noBoxesFound": "Laatikoita ei löytynyt.",
     "boxAdded": "Laatikko lisätty onnistuneesti.",
     "boxDeleted": "Laatikko poistettu onnistuneesti.",
-    "language": "Kieli"
+    "language": "Kieli",
+    "error": "Virhe",
+    "tip": "Vinkki",
+    "info": "Info",
+    "infoTip": "Varmista että backend ja tietokanta ovat käynnissä, ja että olet asettanut .env arvot backendiin ja frontendiin. Katso GitHubin readme lisätietoja varten"
 
 }