- fixed docker problems by changing envvar

- fixed some translations
- sports connection (partial)

client/public/locales/de/translation.json

@@ -11,16 +11,15 @@
         "labelStartTime": "Startzeit",
         "labelEstimatedEndTime":"Rückkehrzeit",
         "labelDestination": "Fahrtziel",
-        "labelEmail": "Email",
+        "labelEmail": "E-Mail",
         "labelName": "Name (Verantwortliche*r)",
-        "labelAdditionalName": "Name (Mitfahrende*r)",
         "labelAdditionalNames": "Namen der Mitfahrenden",
         "labelAnnotations": "Anmerkungen",
         "buttonBookBoat": "Boot jetzt buchen!",
         "messages": {
             "required": "{{val}} wird benötigt",
             "invalidTime" : "Bitte trage eine gültige Uhrzeit für '{{val}}' ein (hh:mm)",
-            "invalidEmail" : "Bitte trage eine gültige Email ein"
+            "invalidEmail" : "Bitte trage eine gültige E-Mail ein"
         }
     },
     "bookingSuccessful": {
@@ -40,13 +39,13 @@
     },
     "staffLogin": {
         "title": "Mitarbeiter Login",
-        "subtitle": "Bitte loggen sie sich mit ihren Benutzerdaten ein",
-        "labelEmail": "Email",
+        "subtitle": "Bitte loggen Sie sich mit ihren Benutzerdaten ein",
+        "labelEmail": "E-Mail",
         "labelPassword": "Passwort",
         "buttonSignIn": "Login",
         "messages": {
             "required": "{{val}} wird benötigt",
-            "invalidEmail" : "Bitte trage eine gültige Email ein"
+            "invalidEmail" : "Bitte trage eine gültige E-Mail ein"
         }
     },
     "staffModal": {

client/public/locales/en/translation.json

@@ -12,15 +12,14 @@
         "labelEstimatedEndTime":"End time",
         "labelDestination": "Destination",
         "labelEmail": "Email",
-        "labelName": "Name (resposible person)",
-        "labelAdditionalName": "Additional Name",
+        "labelName": "Name (responsible person)",
         "labelAdditionalNames": "Additional Names",
         "labelAnnotations": "Annotations",
         "buttonBookBoat": "Book this boat!",
         "messages": {
             "required": "{{val}} is required",
             "invalidTime" : "Please enter a valid time for '{{val}}' (hh:mm)",
-            "invalidEmail" : "Please enter a valid mail address"
+            "invalidEmail" : "Please enter a valid email address"
         }
     },
     "bookingSuccessful": {
@@ -46,7 +45,7 @@
         "buttonSignIn": "Login",
         "messages": {
             "required": "{{val}} is required",
-            "invalidEmail" : "Please enter a valid Email"
+            "invalidEmail" : "Please enter a valid email"
         }
     },
     "staffModal": {
@@ -118,7 +117,7 @@
         }
     },
     "routes": {
-        "/": "Water Sports",
+        "/": "Watersports",
         "/book": "Book a Boat",
         "/book/success": "Booked Successfully",
         "/signout": "Sign Out",

client/src/pages/staff/Sports.tsx

-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { Table, Button } from "react-bootstrap";
 import { useTranslation } from "react-i18next";
 import { faEdit, faTrashAlt } from "@fortawesome/free-regular-svg-icons";
@@ -10,9 +10,23 @@ import EditSports from "../../components/forms/EditSports";
 
 function Sports() {
     const { t } = useTranslation();
-    const [editElement, setEditElement] = useState<{ id: number; name: string;}|undefined>(undefined);
+    const [editElement, setEditElement] = useState<{ id: number; name: string; } | undefined>(undefined);
     const [deleteElement, setDeleteElement] = useState<any>(undefined);
     const [addElement, setAddElement] = useState<any>(false);
+    const [sports, setSports] = useState<{id: number; name: string;}[]>([]);
+
+    useEffect(() => {
+            fetch('/api/sport')
+            .then((response) => response.json())
+            .then((data) => {
+                console.log(data)
+                setSports(data);
+            })
+            .catch((e) => {
+                console.log(e);
+            });
+    })
+
     return (
         <div className="m-1 h-100">
             <Table responsive striped bordered hover>
@@ -25,7 +39,7 @@ function Sports() {
                 </thead>
                 <tbody>
                     {
-                        [{ id: 1, name: "Wasser 1" }, { id: 2, name: "Wasser 2" }].map(x => (
+                        sports.map(x => (
                             <tr key={x.id}>
                                 <td>{x.id}</td>
                                 <td>{x.name}</td>
@@ -58,7 +72,7 @@ function Sports() {
                 <EditSports id={editElement?.id} name={editElement?.name} ></EditSports>
             </StaffModal>
             <StaffModal header={t("sports.DeleteSport")} hideColor="secondary" successText={t("sports.Delete")} successColor="danger" show={deleteElement} onHide={() => { setDeleteElement(undefined) }} onSuccess={() => { setDeleteElement(undefined) }}>
-                <span>{t("sports.messages.DeleteText", {val: deleteElement?.name})}</span>
+                <span>{t("sports.messages.DeleteText", { val: deleteElement?.name })}</span>
             </StaffModal>
         </div>
     );

server/.env.example

 NODE_ENV=development
 POSTGRES_DB=fahrtenbuch
 POSTGRES_USER=postgres
-POSTGRES_HOST=localhost
+POSTGRES_HOST=postgres
 POSTGRES_DRIVER=postgres
 POSTGRES_PASSWORD=postgres
 TEST_DB_NAME=test