diff --git a/typescript/Frontend/.gitignore b/typescript/Frontend/.gitignore
new file mode 100644
index 000000000..4d29575de
--- /dev/null
+++ b/typescript/Frontend/.gitignore
@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/typescript/Frontend/lang/en.json b/typescript/Frontend/lang/en.json
new file mode 100644
index 000000000..c2937f320
--- /dev/null
+++ b/typescript/Frontend/lang/en.json
@@ -0,0 +1,50 @@
+{
+ "alarms": {
+ "defaultMessage": "Alarms"
+ },
+ "allInstallations": {
+ "defaultMessage": "All installations"
+ },
+ "applyChanges": {
+ "defaultMessage": "Apply changes"
+ },
+ "country": {
+ "defaultMessage": "Country"
+ },
+ "customerName": {
+ "defaultMessage": "Customer name"
+ },
+ "english": {
+ "defaultMessage": "English"
+ },
+ "german": {
+ "defaultMessage": "German"
+ },
+ "installation": {
+ "defaultMessage": "Installation"
+ },
+ "location": {
+ "defaultMessage": "Location"
+ },
+ "log": {
+ "defaultMessage": "Log"
+ },
+ "logout": {
+ "defaultMessage": "Logout"
+ },
+ "orderNumbers": {
+ "defaultMessage": "Order number"
+ },
+ "region": {
+ "defaultMessage": "Region"
+ },
+ "search": {
+ "defaultMessage": "Search"
+ },
+ "updatedSuccessfully": {
+ "defaultMessage": "Updated successfully"
+ },
+ "users": {
+ "defaultMessage": "Users"
+ }
+}
diff --git a/typescript/Frontend/package-lock.json b/typescript/Frontend/package-lock.json
index a9afa3d5c..88944aeda 100644
--- a/typescript/Frontend/package-lock.json
+++ b/typescript/Frontend/package-lock.json
@@ -32,6 +32,9 @@
"reactflow": "^11.5.6",
"typescript": "^4.9.5",
"web-vitals": "^2.1.4"
+ },
+ "devDependencies": {
+ "@formatjs/cli": "^6.0.3"
}
},
"node_modules/@adobe/css-tools": {
@@ -2306,6 +2309,26 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/@formatjs/cli": {
+ "version": "6.0.3",
+ "resolved": "https://registry.npmjs.org/@formatjs/cli/-/cli-6.0.3.tgz",
+ "integrity": "sha512-YPhDUw5zQwufAZRUlk054Z/J9jeZWH4LEbAVnQFrfJ8NNgOziDqn9SSTEfRB4W0w8JBGgte4x1SwwJjH/HGoRA==",
+ "dev": true,
+ "bin": {
+ "formatjs": "bin/formatjs"
+ },
+ "engines": {
+ "node": ">= 16"
+ },
+ "peerDependencies": {
+ "@vue/compiler-sfc": "^3.2.34"
+ },
+ "peerDependenciesMeta": {
+ "@vue/compiler-sfc": {
+ "optional": true
+ }
+ }
+ },
"node_modules/@formatjs/ecma402-abstract": {
"version": "1.14.3",
"resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-1.14.3.tgz",
@@ -19710,6 +19733,13 @@
}
}
},
+ "@formatjs/cli": {
+ "version": "6.0.3",
+ "resolved": "https://registry.npmjs.org/@formatjs/cli/-/cli-6.0.3.tgz",
+ "integrity": "sha512-YPhDUw5zQwufAZRUlk054Z/J9jeZWH4LEbAVnQFrfJ8NNgOziDqn9SSTEfRB4W0w8JBGgte4x1SwwJjH/HGoRA==",
+ "dev": true,
+ "requires": {}
+ },
"@formatjs/ecma402-abstract": {
"version": "1.14.3",
"resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-1.14.3.tgz",
diff --git a/typescript/Frontend/package.json b/typescript/Frontend/package.json
index e2ab79d93..b0f0b125f 100644
--- a/typescript/Frontend/package.json
+++ b/typescript/Frontend/package.json
@@ -32,7 +32,8 @@
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
- "eject": "react-scripts eject"
+ "eject": "react-scripts eject",
+ "extract": "formatjs extract"
},
"eslintConfig": {
"extends": [
@@ -51,5 +52,8 @@
"last 1 firefox version",
"last 1 safari version"
]
+ },
+ "devDependencies": {
+ "@formatjs/cli": "^6.0.3"
}
}
diff --git a/typescript/Frontend/src/App.tsx b/typescript/Frontend/src/App.tsx
index c13163b0c..358e4750c 100644
--- a/typescript/Frontend/src/App.tsx
+++ b/typescript/Frontend/src/App.tsx
@@ -1,15 +1,7 @@
import useToken from "./hooks/useToken";
import Login from "./Login";
import { BrowserRouter, Route, Routes } from "react-router-dom";
-import {
- Box,
- Grid,
- ButtonGroup,
- Button,
- Divider,
- Select,
- MenuItem,
-} from "@mui/material";
+import { Box, Grid, Divider } from "@mui/material";
import NestedList from "./components/NestedList";
import BasicTable from "./components/Table";
import BasicTabs from "./components/Tabs";
@@ -17,25 +9,18 @@ import Alarms from "./routes/Alarms";
import InstallationDetail from "./routes/Installation";
import Log from "./routes/Log";
import routes from "./routes.json";
-import { FormattedMessage, IntlProvider } from "react-intl";
+import { IntlProvider } from "react-intl";
import { useState } from "react";
+import en from "./lang/en.json";
+import de from "./lang/de.json";
+import NavigationButtons from "./components/NavigationButtons";
+import LanguageSelect from "./components/LanguageSelect";
+import LogoutButton from "./components/LogoutButton";
const App = () => {
- const { token, setToken } = useToken();
+ const { token, setToken, removeToken } = useToken();
const [language, setLanguage] = useState("en");
- if (!token) {
- return ;
- }
-
- const de = {
- allInstallations: "Alle Installationen",
- };
-
- const en = {
- allInstallations: "All installations",
- };
-
const getTranslations = () => {
if (language === "de") {
return de;
@@ -43,6 +28,12 @@ const App = () => {
return en;
};
+ if (!token) {
+ return ;
+ }
+
+ console.log("app");
+
return (
{
-
-
-
-
+
-
+
+
{
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
const [loading, setLoading] = useState(false);
+ const [error, setError] = useState();
- const handleSubmit = async (e: any) => {
+ const handleSubmit = (e: any) => {
setLoading(true);
- loginUser(username, password).then((res) => {
- setToken(res.data);
+ loginUser(username, password).then(({ data }) => {
+ if (typeof data === "string") {
+ setToken(data);
+ setLoading(false);
+ }
+ setError(data);
setLoading(false);
});
};
@@ -41,6 +46,7 @@ const Login = ({ setToken }: { setToken: any }) => {
value={password}
handleChange={(e) => setPassword(e.target.value)}
/>
+ {error && Incorrect username or password}