- {
to={
getPathWithoutId(routeMatch?.pattern?.path) + installation.id
}
- style={{ textDecoration: "none", color: colors.blueBlack }}
+ style={{ textDecoration: "none", color: colors.black }}
>
TopologyView
;
};
export default TopologyView;
diff --git a/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx b/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx
index 500058971..49336713e 100644
--- a/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx
+++ b/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx
@@ -17,13 +17,13 @@ const InnovenergyTab = (props: any) => {
marginRight: theme.spacing(1),
background: "0 0",
border: "2px solid transparent",
- bgcolor: theme.palette.primary.light,
borderTopLeftRadius: "0.3rem",
borderTopRightRadius: "0.3rem",
padding: ".5rem 1rem",
textDecoration: "none",
transition: `color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out`,
"&.Mui-selected": {
+ backgroundColor: "#eaecf1",
color: colors.black,
borderColor: theme.palette.text.disabled,
marginTop: "1px",
diff --git a/typescript/Frontend/src/components/Layout/InnovenergyTabs.tsx b/typescript/Frontend/src/components/Layout/InnovenergyTabs.tsx
index 714afad3d..bef153708 100644
--- a/typescript/Frontend/src/components/Layout/InnovenergyTabs.tsx
+++ b/typescript/Frontend/src/components/Layout/InnovenergyTabs.tsx
@@ -5,7 +5,7 @@ import { colors } from "index";
interface AntTabsProps {
id: string;
value?: string;
- sx?: SxProps
{props.rows.map((prop) => (
- {prop.label}
+ {prop.label}
))}
{props.rows.map((element) => {
return (
{
+const NavigationTabs = () => {
const theme = useTheme();
const routeMatch = useRouteMatch([
routes.installations + "*",
routes.users + "*",
]);
- const intl = useIntl();
return (
<>
@@ -25,7 +29,7 @@ const NavigationButtons = () => {
sx={{
bgcolor: theme.palette.primary.main,
"&.Mui-selected": {
- backgroundColor: theme.palette.primary.main,
+ backgroundColor: "#eaecf1",
borderColor: theme.palette.text.disabled,
borderBottom: 0,
mb: -1 / 8,
@@ -46,7 +50,7 @@ const NavigationButtons = () => {
sx={{
bgcolor: theme.palette.primary.main,
"&.Mui-selected": {
- backgroundColor: theme.palette.primary.main,
+ backgroundColor: "#eaecf1",
borderColor: theme.palette.text.disabled,
borderBottom: 0,
mb: -1 / 8,
@@ -63,4 +67,4 @@ const NavigationButtons = () => {
);
};
-export default NavigationButtons;
+export default NavigationTabs;
diff --git a/typescript/Frontend/src/components/Layout/Search.tsx b/typescript/Frontend/src/components/Layout/Search.tsx
index 8b510b540..851d0042f 100644
--- a/typescript/Frontend/src/components/Layout/Search.tsx
+++ b/typescript/Frontend/src/components/Layout/Search.tsx
@@ -10,7 +10,6 @@ import { colors } from "index";
import { FC, useState } from "react";
import { useIntl } from "react-intl";
-
interface SearchSidebarProps {
listComponent: FC<{ searchQuery: string }>;
id: string;
@@ -22,7 +21,6 @@ const SearchInputTextfield = styled((props: TextFieldProps) => (
InputProps={{ disableUnderline: true } as Partial}
{...props}
/>
-
))(({ theme }) => ({
"& .MuiFilledInput-root": {
overflow: "hidden",
@@ -41,11 +39,9 @@ const SearchInputTextfield = styled((props: TextFieldProps) => (
backgroundColor: theme.palette.primary.dark,
},
"&.Mui-focused": {
-
backgroundColor: theme.palette.primary.dark,
borderColor: theme.palette.secondary.main,
},
-
},
}));
@@ -55,28 +51,17 @@ const SearchSidebar = (props: SearchSidebarProps) => {
const intl = useIntl();
const theme = useTheme();
-
-
return (
- {/* setSearchQuery(e.target.value)}
- /> */}
setSearchQuery(e.target.value)}
diff --git a/typescript/Frontend/src/config/axiosConfig.tsx b/typescript/Frontend/src/config/axiosConfig.tsx
index 38e7e1f81..75b3924a1 100644
--- a/typescript/Frontend/src/config/axiosConfig.tsx
+++ b/typescript/Frontend/src/config/axiosConfig.tsx
@@ -1,25 +1,25 @@
-import axios from "axios";
-
-export const axiosConfigWithoutToken = axios.create({
- baseURL: "https://localhost:7087/api",
-});
-
-const axiosConfig = axios.create({
- baseURL: "https://localhost:7087/api",
-});
-axiosConfig.defaults.params = {};
-axiosConfig.interceptors.request.use(
- (config) => {
- const tokenString = localStorage.getItem("token");
- const token = tokenString !== null ? JSON.parse(tokenString) : "";
- if (token) {
- config.params["authToken"] = token;
- }
- return config;
- },
- (error) => {
- return Promise.reject(error);
- }
-);
-
-export default axiosConfig;
+import axios from "axios";
+
+export const axiosConfigWithoutToken = axios.create({
+ baseURL: "https://localhost:7087/api",
+});
+
+const axiosConfig = axios.create({
+ baseURL: "https://localhost:7087/api",
+});
+axiosConfig.defaults.params = {};
+axiosConfig.interceptors.request.use(
+ (config) => {
+ const tokenString = localStorage.getItem("token");
+ const token = tokenString !== null ? JSON.parse(tokenString) : "";
+ if (token) {
+ config.params["authToken"] = token;
+ }
+ return config;
+ },
+ (error) => {
+ return Promise.reject(error);
+ }
+);
+
+export default axiosConfig;
diff --git a/typescript/Frontend/src/dataCache/dataCache.ts b/typescript/Frontend/src/dataCache/dataCache.ts
index 33ba43dab..7a35dd8bb 100644
--- a/typescript/Frontend/src/dataCache/dataCache.ts
+++ b/typescript/Frontend/src/dataCache/dataCache.ts
@@ -138,10 +138,13 @@ export default class DataCache> {
const onSuccess = (data: FetchResult) => {
if (data === FetchResult.tryLater) {
console.warn(FetchResult.tryLater);
- return;
}
- const value = data === FetchResult.notAvailable ? undefined : data;
+ const value =
+ data === FetchResult.notAvailable || data === FetchResult.tryLater
+ ? undefined
+ : data;
+ // @ts-ignore
this.cache.insert(value, t);
};
diff --git a/typescript/Frontend/src/hooks/useInstallation.tsx b/typescript/Frontend/src/hooks/useInstallation.tsx
new file mode 100644
index 000000000..369c611c3
--- /dev/null
+++ b/typescript/Frontend/src/hooks/useInstallation.tsx
@@ -0,0 +1,43 @@
+import { useContext, useState } from "react";
+import axiosConfig from "../config/axiosConfig";
+import { I_Installation } from "../util/types";
+import { AxiosError } from "axios";
+import { S3CredentialsContext } from "../components/Context/S3CredentialsContextProvider";
+
+const useInstallation = () => {
+ const [data, setData] = useState();
+ const [loading, setLoading] = useState(false);
+ const [error, setError] = useState();
+
+ const { saveS3Credentials } = useContext(S3CredentialsContext);
+
+ const getInstallation = (id?: string) => {
+ if (id) {
+ setLoading(true);
+ axiosConfig
+ .get("/GetInstallationById?id=" + id)
+ .then(({ data }: { data: I_Installation }) => {
+ const { s3Region, s3Provider, s3Secret, s3Key } = data;
+ setData(data);
+ setLoading(false);
+ // TODO remove if
+ if (id) {
+ saveS3Credentials({ s3Region, s3Provider, s3Secret, s3Key }, id);
+ }
+ })
+ .catch((err: AxiosError) => {
+ setError(err);
+ setLoading(false);
+ });
+ }
+ };
+
+ return {
+ data,
+ loading,
+ error,
+ getInstallation,
+ };
+};
+
+export default useInstallation;
diff --git a/typescript/Frontend/src/index.tsx b/typescript/Frontend/src/index.tsx
index 9f610827c..e4bff8ba6 100644
--- a/typescript/Frontend/src/index.tsx
+++ b/typescript/Frontend/src/index.tsx
@@ -3,67 +3,66 @@ import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
-import {createTheme, ThemeProvider} from "@mui/material";
+import { createTheme, ThemeProvider } from "@mui/material";
import UserContextProvider from "./components/Context/UserContextProvider";
const root = ReactDOM.createRoot(
- document.getElementById("root") as HTMLElement
+ document.getElementById("root") as HTMLElement
);
export const colors = {
- black: "#000000",
- blueBlack: "#2b3e54",
- borderColor: "#a8b0be",
+ black: "#000000",
+ blueBlack: "#2b3e54",
+ borderColor: "#a8b0be",
- background: "#f3f4f7",
- //change this color in index.css too
+ background: "#f3f4f7",
+ //change this color in index.css too
- greyDark: "#d1d7de",
- greyLight: "#e1e4e7",
+ greyDark: "#d1d7de",
+ greyLight: "#e1e4e7",
- orangeSelected: "#ffd280",
- orangeHover: "#ffe4b3",
+ orangeSelected: "#f7b34d",
+ orangeHover: "#fad399",
- orangeDark: "#ffc04d",
+ orangeDark: "#ffc04d",
};
const theme = createTheme({
- components: {
- MuiButtonBase: {
- defaultProps: {
- disableRipple: true,
- },
- },
+ components: {
+ MuiButtonBase: {
+ defaultProps: {
+ disableRipple: true,
+ },
},
- palette: {
- text: {
- primary: colors.blueBlack,
- secondary: "#000000",
- disabled: colors.borderColor,
- },
- primary: {
- main: colors.background,
- light: colors.greyLight,
- dark: colors.greyDark,
- },
- secondary: {
- main: colors.orangeSelected,
- light: colors.orangeHover,
- dark: colors.orangeDark,
- },
+ },
+ palette: {
+ text: {
+ primary: colors.black,
+ disabled: colors.borderColor,
},
- typography: {
- fontFamily: `"Ubuntu", sans-serif`,
- fontWeightRegular: 300,
+ primary: {
+ main: colors.background,
+ light: colors.greyLight,
+ dark: colors.greyDark,
},
+ secondary: {
+ main: colors.orangeSelected,
+ light: colors.orangeHover,
+ dark: colors.orangeDark,
+ },
+ },
+ typography: {
+ fontFamily: `"Ubuntu", sans-serif`,
+ fontWeightRegular: 300,
+ },
});
root.render(
-
-
-
-
+
+
+
+
);
// If you want to start measuring performance in your app, pass a function
diff --git a/typescript/Frontend/src/resources/innoveng_logo_on_orange.png b/typescript/Frontend/src/resources/innoveng_logo_on_orange.png
new file mode 100644
index 000000000..4f1714ecd
Binary files /dev/null and b/typescript/Frontend/src/resources/innoveng_logo_on_orange.png differ
diff --git a/typescript/Frontend/src/resources/test.gif b/typescript/Frontend/src/resources/test.gif
deleted file mode 100644
index 3b135931e..000000000
Binary files a/typescript/Frontend/src/resources/test.gif and /dev/null differ
diff --git a/typescript/Frontend/src/util/types.tsx b/typescript/Frontend/src/util/types.tsx
index 5b6bfcc25..81ff48c34 100644
--- a/typescript/Frontend/src/util/types.tsx
+++ b/typescript/Frontend/src/util/types.tsx
@@ -1,5 +1,13 @@
// TODO add if required or not
-export interface I_Installation {
+export interface S3Credentials {
+ s3Region: string;
+ s3Provider: string;
+ s3Key: string;
+ s3Secret: string;
+ s3Bucket?: string;
+}
+
+export interface I_Installation extends S3Credentials {
type: string;
title?: string;
status?: number;
@@ -15,12 +23,6 @@ export interface I_Installation {
name: string;
information: string;
parentId: number;
-
- s3Bucket: string;
- s3Region: string;
- s3Provider: string;
- s3Key: string;
- s3Secret: string;
}
export interface I_Folder {