Innovenergy
/
Innovenergy_trunk
2
1
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

fix some bugs

This commit is contained in:
Sina Blattmann 2023-04-20 11:13:29 +02:00
parent dcab3ab4d1
commit ee289d27b2
23 changed files with 129 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
typescript/Frontend/src/App.tsx
View File

@ -14,12 +14,13 @@ import NavigationButtons from "./components/Layout/NavigationButtons";
import InstallationPage from "./components/Installations/InstallationPage"; import InstallationPage from "./components/Installations/InstallationPage";
import { UserContext } from "./components/Context/UserContextProvider"; import { UserContext } from "./components/Context/UserContextProvider";
import ResetPassword from "./ResetPassword"; import ResetPassword from "./ResetPassword";
import innovenergyLogo from "./resources/innovenergy_Logo_onOrange.png";
const App = () => { const App = () => {
const { token, setToken, removeToken } = useToken(); const { token, setToken, removeToken } = useToken();
const [language, setLanguage] = useState("EN"); const [language, setLanguage] = useState("EN");
const { currentUser } = useContext(UserContext); const { getCurrentUser } = useContext(UserContext);
const getTranslations = () => { const getTranslations = () => {
if (language === "DE") { if (language === "DE") {
@ -31,7 +32,7 @@ const App = () => {
if (!token) { if (!token) {
return <Login setToken={setToken} setLanguage={setLanguage} />; return <Login setToken={setToken} setLanguage={setLanguage} />;
} }
if (token && currentUser?.mustResetPassword) { if (token && getCurrentUser()?.mustResetPassword) {
return <ResetPassword />; return <ResetPassword />;
} }
return ( return (
@ -42,15 +43,20 @@ const App = () => {
defaultLocale="EN" defaultLocale="EN"
> >
<Container maxWidth="xl" sx={{ marginTop: 2, height: "100vh" }}> <Container maxWidth="xl" sx={{ marginTop: 2, height: "100vh" }}>
<Grid container spacing={2}> <Grid container spacing={2} maxHeight="20vh">
<Grid item xs={3}> <Grid item xs={3} container justifyContent="flex-start">
<NavigationButtons /> <img src={innovenergyLogo} alt="innovenergy logo" height="50" />
</Grid> </Grid>
<Grid item xs={9} container justifyContent="flex-end"> <Grid item xs={9} container justifyContent="flex-end">
<LanguageSelect language={language} setLanguage={setLanguage} /> <LanguageSelect language={language} setLanguage={setLanguage} />
<LogoutButton removeToken={removeToken} /> <LogoutButton removeToken={removeToken} />
</Grid> </Grid>
</Grid> </Grid>
<Grid container spacing={2} mt={2}>
<Grid item xs={3} container justifyContent="flex-start">
<NavigationButtons />
</Grid>
</Grid>
<Routes> <Routes>
<Route <Route
path="*" path="*"

5
typescript/Frontend/src/Login.tsx
View File

@ -22,7 +22,7 @@ const Login = ({ setToken, setLanguage }: I_LoginProps) => {
const [password, setPassword] = useState(""); const [password, setPassword] = useState("");
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [error, setError] = useState(); const [error, setError] = useState();
const { setCurrentUser } = useContext(UserContext); const { saveCurrentUser } = useContext(UserContext);
const verifyToken = async (token: string) => { const verifyToken = async (token: string) => {
axiosConfigWithoutToken.get("/GetAllInstallations", { axiosConfigWithoutToken.get("/GetAllInstallations", {
@ -39,7 +39,8 @@ const Login = ({ setToken, setLanguage }: I_LoginProps) => {
verifyToken(data.token) verifyToken(data.token)
.then(() => { .then(() => {
setToken(data.token); setToken(data.token);
setCurrentUser(data.user); saveCurrentUser(data.user);
console.log(data.user);
setLoading(false); setLoading(false);
setLanguage(data.user.language); setLanguage(data.user.language);
}) })

5
typescript/Frontend/src/ResetPassword.tsx
View File

@ -12,7 +12,7 @@ import * as Yup from "yup";
const ResetPassword = () => { const ResetPassword = () => {
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [error, setError] = useState<AxiosError>(); const [error, setError] = useState<AxiosError>();
const { setCurrentUser } = useContext(UserContext); const { saveCurrentUser } = useContext(UserContext);
const validationSchema = Yup.object().shape({ const validationSchema = Yup.object().shape({
password: Yup.string().required("*Password is required"), password: Yup.string().required("*Password is required"),
@ -33,7 +33,8 @@ const ResetPassword = () => {
params: { newPassword: formikValues.verifyPassword }, params: { newPassword: formikValues.verifyPassword },
}) })
.then((res) => { .then((res) => {
setCurrentUser(res.data); saveCurrentUser(res.data);
console.log(res.data);
setLoading(false); setLoading(false);
}) })
.catch((err) => setError(err)); .catch((err) => setError(err));

20
typescript/Frontend/src/components/Context/UserContextProvider.tsx
View File

@ -4,18 +4,36 @@ import { I_User } from "../../util/user.util";
interface InstallationContextProviderProps { interface InstallationContextProviderProps {
currentUser?: I_User; currentUser?: I_User;
setCurrentUser: (value: I_User) => void; setCurrentUser: (value: I_User) => void;
saveCurrentUser: (user: I_User) => void;
getCurrentUser: () => I_User;
} }
export const UserContext = createContext<InstallationContextProviderProps>({ export const UserContext = createContext<InstallationContextProviderProps>({
currentUser: {} as I_User, currentUser: {} as I_User,
setCurrentUser: () => {}, setCurrentUser: () => {},
saveCurrentUser: () => {},
getCurrentUser: () => {
return {} as I_User;
},
}); });
const UserContextProvider = ({ children }: { children: ReactNode }) => { const UserContextProvider = ({ children }: { children: ReactNode }) => {
const [currentUser, setCurrentUser] = useState<I_User>(); const [currentUser, setCurrentUser] = useState<I_User>();
const saveCurrentUser = (user: I_User) => {
localStorage.setItem("currentUser", JSON.stringify(user));
setCurrentUser(user);
};
const getCurrentUser = (): I_User => {
const tokenString = localStorage.getItem("currentUser");
return tokenString !== null ? JSON.parse(tokenString) : "";
};
return ( return (
<UserContext.Provider value={{ currentUser, setCurrentUser }}> <UserContext.Provider
value={{ currentUser, setCurrentUser, saveCurrentUser, getCurrentUser }}
>
{children} {children}
</UserContext.Provider> </UserContext.Provider>
); );

27
typescript/Frontend/src/components/Context/UsersContextProvider.tsx
View File

@ -21,6 +21,7 @@ interface UsersContextProviderProps {
getAvailableUsersForResource: () => I_User[]; getAvailableUsersForResource: () => I_User[];
fetchUsersWithInheritedAccessForResource: () => Promise<void>; fetchUsersWithInheritedAccessForResource: () => Promise<void>;
fetchUsersWithDirectAccessForResource: () => Promise<void>; fetchUsersWithDirectAccessForResource: () => Promise<void>;
fetchAvailableUsers: () => Promise<void>;
} }
export const UsersContext = createContext<UsersContextProviderProps>({ export const UsersContext = createContext<UsersContextProviderProps>({
@ -39,6 +40,9 @@ export const UsersContext = createContext<UsersContextProviderProps>({
fetchUsersWithDirectAccessForResource: () => { fetchUsersWithDirectAccessForResource: () => {
return Promise.resolve(); return Promise.resolve();
}, },
fetchAvailableUsers: () => {
return Promise.resolve();
},
}); });
const UsersContextProvider = ({ children }: { children: ReactNode }) => { const UsersContextProvider = ({ children }: { children: ReactNode }) => {
@ -51,7 +55,7 @@ const UsersContextProvider = ({ children }: { children: ReactNode }) => {
const { currentType } = useContext(GroupContext); const { currentType } = useContext(GroupContext);
const { id } = useParams(); const { id } = useParams();
const fetchUsers = useCallback( const fetchUsersWithAccess = useCallback(
async (route: string, setState: (value: any) => void) => { async (route: string, setState: (value: any) => void) => {
axiosConfig.get(route + currentType, { params: { id } }).then((res) => { axiosConfig.get(route + currentType, { params: { id } }).then((res) => {
setState(res.data); setState(res.data);
@ -61,12 +65,15 @@ const UsersContextProvider = ({ children }: { children: ReactNode }) => {
); );
const fetchUsersWithInheritedAccessForResource = useCallback(async () => { const fetchUsersWithInheritedAccessForResource = useCallback(async () => {
fetchUsers("/GetUsersWithInheritedAccessTo", setInheritedAccessUsers); fetchUsersWithAccess(
}, [fetchUsers]); "/GetUsersWithInheritedAccessTo",
setInheritedAccessUsers
);
}, [fetchUsersWithAccess]);
const fetchUsersWithDirectAccessForResource = useCallback(async () => { const fetchUsersWithDirectAccessForResource = useCallback(async () => {
fetchUsers("/GetUsersWithDirectAccessTo", setDirectAccessUsers); fetchUsersWithAccess("/GetUsersWithDirectAccessTo", setDirectAccessUsers);
}, [fetchUsers]); }, [fetchUsersWithAccess]);
const getAvailableUsersForResource = () => { const getAvailableUsersForResource = () => {
const inheritedUsers = inheritedAccessUsers.map( const inheritedUsers = inheritedAccessUsers.map(
@ -81,10 +88,15 @@ const UsersContextProvider = ({ children }: { children: ReactNode }) => {
); );
}; };
useEffect(() => { const fetchAvailableUsers = async (): Promise<void> => {
axiosConfig.get("/GetAllChildUsers").then((res) => { return axiosConfig.get("/GetAllChildUsers").then((res) => {
console.log(res);
setAvailableUsers(res.data); setAvailableUsers(res.data);
}); });
};
useEffect(() => {
fetchAvailableUsers();
}, []); }, []);
return ( return (
@ -99,6 +111,7 @@ const UsersContextProvider = ({ children }: { children: ReactNode }) => {
getAvailableUsersForResource, getAvailableUsersForResource,
fetchUsersWithInheritedAccessForResource, fetchUsersWithInheritedAccessForResource,
fetchUsersWithDirectAccessForResource, fetchUsersWithDirectAccessForResource,
fetchAvailableUsers,
}} }}
> >
{children} {children}

4
typescript/Frontend/src/components/Groups/AccessManagement/AccessManagement.tsx
View File

@ -8,13 +8,13 @@ import { useContext } from "react";
import { UserContext } from "../../Context/UserContextProvider"; import { UserContext } from "../../Context/UserContextProvider";
const AccessManagement = () => { const AccessManagement = () => {
const { currentUser } = useContext(UserContext); const { getCurrentUser } = useContext(UserContext);
return ( return (
<UsersContextProvider> <UsersContextProvider>
<Grid container sx={{ mt: 1 }}> <Grid container sx={{ mt: 1 }}>
<Grid item xs={6}> <Grid item xs={6}>
{currentUser?.hasWriteAccess && <AvailableUserDialog />} {getCurrentUser().hasWriteAccess && <AvailableUserDialog />}
<InnovenergyList id="access-management-list"> <InnovenergyList id="access-management-list">
<UsersWithDirectAccess /> <UsersWithDirectAccess />
<UsersWithInheritedAccess /> <UsersWithInheritedAccess />

12
typescript/Frontend/src/components/Groups/AccessManagement/AvailableUserDialog.tsx
View File

@ -59,15 +59,16 @@ const AvailableUserDialog = () => {
scroll="paper" scroll="paper"
> >
<DialogTitle id="available-user-dialog-title"> <DialogTitle id="available-user-dialog-title">
Grant access <FormattedMessage id="manageAccess" defaultMessage="Manage access" />
</DialogTitle> </DialogTitle>
<DialogContent id="available-user-dialog-content"> <DialogContent id="available-user-dialog-content">
<Autocomplete <Autocomplete
sx={{ width: "500px" }} sx={{ width: "500px", pt: 1 }}
multiple multiple
id="available-user-dialog-autocomplete" id="available-user-dialog-autocomplete"
options={getAvailableUsersForResource()} options={getAvailableUsersForResource()}
getOptionLabel={(option) => option.name} getOptionLabel={(option) => option.name}
value={selectedUsers}
renderInput={(params) => ( renderInput={(params) => (
<TextField <TextField
{...params} {...params}
@ -86,7 +87,10 @@ const AvailableUserDialog = () => {
sx={{ height: 40, ml: 2 }} sx={{ height: 40, ml: 2 }}
onClick={handleGrant} onClick={handleGrant}
> >
<FormattedMessage id="grantAccess" defaultMessage="Grant access" /> <FormattedMessage
id="manageAccess"
defaultMessage="Manage access"
/>
</InnovenergyButton> </InnovenergyButton>
</DialogActions> </DialogActions>
</Dialog> </Dialog>
@ -95,7 +99,7 @@ const AvailableUserDialog = () => {
type="submit" type="submit"
onClick={() => setOpen(true)} onClick={() => setOpen(true)}
> >
<FormattedMessage id="grantAccess" defaultMessage="Grant access" /> <FormattedMessage id="manageAccess" defaultMessage="Manage access" />
</InnovenergyButton> </InnovenergyButton>
</> </>
); );

4
typescript/Frontend/src/components/Groups/AccessManagement/UsersWithDirectAccess.tsx
View File

@ -20,7 +20,7 @@ const UsersWithDirectAccess = () => {
useContext(UsersContext); useContext(UsersContext);
const { currentType } = useContext(GroupContext); const { currentType } = useContext(GroupContext);
const { id } = useParams(); const { id } = useParams();
const { currentUser } = useContext(UserContext); const { getCurrentUser } = useContext(UserContext);
useEffect(() => { useEffect(() => {
fetchUsersWithDirectAccessForResource(); fetchUsersWithDirectAccessForResource();
@ -47,7 +47,7 @@ const UsersWithDirectAccess = () => {
<ListItem <ListItem
id={"direct-access-user-" + user.id} id={"direct-access-user-" + user.id}
secondaryAction={ secondaryAction={
currentUser?.hasWriteAccess && ( getCurrentUser().hasWriteAccess && (
<IconButton <IconButton
id={"direct-access-user-icon-button" + user.id} id={"direct-access-user-icon-button" + user.id}
onClick={() => handleIconClick(user.id)} onClick={() => handleIconClick(user.id)}

4
typescript/Frontend/src/components/Groups/FolderForm.tsx
View File

@ -23,13 +23,13 @@ const FolderForm = (props: I_CustomerFormProps) => {
const { values, additionalButtons, handleSubmit } = props; const { values, additionalButtons, handleSubmit } = props;
const intl = useIntl(); const intl = useIntl();
const { fetchData } = useContext(GroupContext); const { fetchData } = useContext(GroupContext);
const { currentUser } = useContext(UserContext); const { getCurrentUser } = useContext(UserContext);
const [snackbarOpen, setSnackbarOpen] = useState(false); const [snackbarOpen, setSnackbarOpen] = useState(false);
const [error, setError] = useState(); const [error, setError] = useState();
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const readOnly = !currentUser?.hasWriteAccess; const readOnly = !getCurrentUser().hasWriteAccess;
const formik = useFormik({ const formik = useFormik({
initialValues: { initialValues: {

4
typescript/Frontend/src/components/Installations/InstallationForm.tsx
View File

@ -21,9 +21,9 @@ const InstallationForm = (props: I_InstallationFormProps) => {
const intl = useIntl(); const intl = useIntl();
const { fetchData } = useContext(InstallationContext); const { fetchData } = useContext(InstallationContext);
const { currentUser } = useContext(UserContext); const { getCurrentUser } = useContext(UserContext);
const readOnly = !currentUser?.hasWriteAccess; const readOnly = !getCurrentUser().hasWriteAccess;
const formik = useFormik({ const formik = useFormik({
initialValues: { initialValues: {

3
typescript/Frontend/src/components/Installations/InstallationList.tsx
View File

@ -64,9 +64,10 @@ const InstallationList = (props: InstallationListProps) => {
bgcolor: "background.paper", bgcolor: "background.paper",
position: "relative", position: "relative",
overflow: "auto", overflow: "auto",
maxHeight: 400,
py: 0, py: 0,
mt: 1, mt: 1,
height: "80vh",
maxHeight: "70vh",
}} }}
component="nav" component="nav"
aria-labelledby="nested-list-subheader" aria-labelledby="nested-list-subheader"

2
typescript/Frontend/src/components/Installations/InstallationPage.tsx
View File

@ -8,7 +8,7 @@ import { Grid } from "@mui/material";
const InstallationPage = () => { const InstallationPage = () => {
return ( return (
<> <>
<Grid container spacing={2}> <Grid container spacing={2} marginTop={1}>
<Grid item xs={3}> <Grid item xs={3}>
<ModeButtons /> <ModeButtons />
</Grid> </Grid>

2
typescript/Frontend/src/components/Installations/Installations.tsx
View File

@ -12,7 +12,7 @@ import Installation from "./Installation";
const Installations = () => { const Installations = () => {
return ( return (
<InstallationContextProvider> <InstallationContextProvider>
<Grid container spacing={2}> <Grid container spacing={2} height="100%">
<Grid item xs={3}> <Grid item xs={3}>
<SearchSidebar <SearchSidebar
id="installations-search-sidebar" id="installations-search-sidebar"

4
typescript/Frontend/src/components/Layout/Search.tsx
View File

@ -12,7 +12,7 @@ const SearchSidebar = (props: SearchSidebarProps) => {
const intl = useIntl(); const intl = useIntl();
return ( return (
<> <div style={{ height: "100%" }}>
<TextField <TextField
id={id} id={id}
label={intl.formatMessage({ label={intl.formatMessage({
@ -25,7 +25,7 @@ const SearchSidebar = (props: SearchSidebarProps) => {
onChange={(e) => setSearchQuery(e.target.value)} onChange={(e) => setSearchQuery(e.target.value)}
/> />
<ListComponent searchQuery={searchQuery} /> <ListComponent searchQuery={searchQuery} />
</> </div>
); );
}; };

4
typescript/Frontend/src/components/Users/User.tsx
View File

@ -7,10 +7,10 @@ import { I_User } from "../../util/user.util";
import UserForm from "./UserForm"; import UserForm from "./UserForm";
import { useIntl } from "react-intl"; import { useIntl } from "react-intl";
interface I_DetailProps<T> { interface I_DetailProps {
hasMoveButton?: boolean; hasMoveButton?: boolean;
} }
const Detail = <T extends { id: number }>(props: I_DetailProps<T>) => { const Detail = (props: I_DetailProps) => {
const { id } = useParams(); const { id } = useParams();
const { locale } = useIntl(); const { locale } = useIntl();
const [values, setValues] = useState<I_User>(); const [values, setValues] = useState<I_User>();

10
typescript/Frontend/src/components/Users/UserForm.tsx
View File

@ -7,6 +7,7 @@ import { I_User } from "../../util/user.util";
import InnovenergyButton from "../Layout/InnovenergyButton"; import InnovenergyButton from "../Layout/InnovenergyButton";
import InnovenergyTextfield from "../Layout/InnovenergyTextfield"; import InnovenergyTextfield from "../Layout/InnovenergyTextfield";
import { UserContext } from "../Context/UserContextProvider"; import { UserContext } from "../Context/UserContextProvider";
import { UsersContext } from "../Context/UsersContextProvider";
interface I_UserFormProps { interface I_UserFormProps {
handleSubmit: (formikValues: Partial<I_User>) => Promise<AxiosResponse>; handleSubmit: (formikValues: Partial<I_User>) => Promise<AxiosResponse>;
@ -19,9 +20,11 @@ const UserForm = (props: I_UserFormProps) => {
const [error, setError] = useState<AxiosError>(); const [error, setError] = useState<AxiosError>();
const intl = useIntl(); const intl = useIntl();
const { currentUser } = useContext(UserContext); const { getCurrentUser } = useContext(UserContext);
const { fetchAvailableUsers } = useContext(UsersContext);
const readOnly = !currentUser?.hasWriteAccess; const currentUser = getCurrentUser();
const readOnly = !currentUser.hasWriteAccess;
const formik = useFormik({ const formik = useFormik({
initialValues: { initialValues: {
@ -34,6 +37,7 @@ const UserForm = (props: I_UserFormProps) => {
handleSubmit(formikValues) handleSubmit(formikValues)
.then(() => { .then(() => {
setOpen(true); setOpen(true);
fetchAvailableUsers();
setLoading(false); setLoading(false);
}) })
.catch((err: AxiosError) => { .catch((err: AxiosError) => {
@ -85,7 +89,7 @@ const UserForm = (props: I_UserFormProps) => {
/> />
<Grid container justifyContent="flex-end" sx={{ pt: 1 }}> <Grid container justifyContent="flex-end" sx={{ pt: 1 }}>
{loading && <CircularProgress />} {loading && <CircularProgress />}
{currentUser?.hasWriteAccess && ( {currentUser.hasWriteAccess && (
<InnovenergyButton type="submit"> <InnovenergyButton type="submit">
<FormattedMessage id="submit" defaultMessage="Submit" /> <FormattedMessage id="submit" defaultMessage="Submit" />
</InnovenergyButton> </InnovenergyButton>

36
typescript/Frontend/src/components/Users/UserTabs.tsx
View File

@ -14,26 +14,22 @@ const UserTabs = () => {
if (id) { if (id) {
return ( return (
<Box sx={{ width: "100%" }}> <AntTabs
<Box sx={{ borderBottom: 1, borderColor: "divider" }}> id="users-tabs"
<AntTabs value={routeMatch?.pattern?.path ?? routes.user + ":id"}
id="users-tabs" aria-label="user tabs"
value={routeMatch?.pattern?.path ?? routes.user + ":id"} >
aria-label="user tabs" <StyledTab
> id="users-tab-user"
<StyledTab label={intl.formatMessage({
id="users-tab-user" id: "user",
label={intl.formatMessage({ defaultMessage: "User",
id: "user", })}
defaultMessage: "User", value={routes.users + routes.user + ":id"}
})} component={Link}
value={routes.users + routes.user + ":id"} to={routes.user + id}
component={Link} />
to={routes.user + id} </AntTabs>
/>
</AntTabs>
</Box>
</Box>
); );
} }
return null; return null;

6
typescript/Frontend/src/components/Users/Users.tsx
View File

@ -11,13 +11,13 @@ import { useContext } from "react";
import { UserContext } from "../Context/UserContextProvider"; import { UserContext } from "../Context/UserContextProvider";
const Users = () => { const Users = () => {
const { currentUser } = useContext(UserContext); const { getCurrentUser } = useContext(UserContext);
return ( return (
<UsersContextProvider> <UsersContextProvider>
<Grid container spacing={2}> <Grid container spacing={2} marginTop={1}>
<Grid item xs={3}> <Grid item xs={3}>
{currentUser?.hasWriteAccess && <AddUser />} {getCurrentUser().hasWriteAccess && <AddUser />}
<SearchSidebar id="users-search-sidebar" listComponent={UserList} /> <SearchSidebar id="users-search-sidebar" listComponent={UserList} />
</Grid> </Grid>
<Grid item xs={9}> <Grid item xs={9}>

2
typescript/Frontend/src/config/axiosConfig.tsx
View File

@ -10,7 +10,7 @@ const axiosConfig = axios.create({
axiosConfig.defaults.params = {}; axiosConfig.defaults.params = {};
axiosConfig.interceptors.request.use( axiosConfig.interceptors.request.use(
(config) => { (config) => {
const tokenString = sessionStorage.getItem("token"); const tokenString = localStorage.getItem("token");
const token = tokenString !== null ? JSON.parse(tokenString) : ""; const token = tokenString !== null ? JSON.parse(tokenString) : "";
if (token) { if (token) {
config.params["authToken"] = token; config.params["authToken"] = token;

6
typescript/Frontend/src/hooks/useToken.tsx
View File

@ -2,18 +2,18 @@ import { useState } from "react";
const useToken = () => { const useToken = () => {
const getToken = () => { const getToken = () => {
const tokenString = sessionStorage.getItem("token"); const tokenString = localStorage.getItem("token");
return tokenString !== null ? JSON.parse(tokenString) : ""; return tokenString !== null ? JSON.parse(tokenString) : "";
}; };
const [token, setToken] = useState(getToken()); const [token, setToken] = useState(getToken());
const saveToken = (userToken: any) => { const saveToken = (userToken: any) => {
sessionStorage.setItem("token", JSON.stringify(userToken)); localStorage.setItem("token", JSON.stringify(userToken));
setToken(userToken); setToken(userToken);
}; };
const removeToken = () => { const removeToken = () => {
sessionStorage.removeItem("token"); localStorage.removeItem("token");
setToken(null); setToken(null);
}; };

9
typescript/Frontend/src/index.tsx
View File

@ -15,6 +15,15 @@ const theme = createTheme({
primary: { primary: {
main: "#F59100", main: "#F59100",
}, },
text: {
primary: "#000000",
secondary: "#000000",
disabled: "#000000",
},
},
typography: {
fontFamily: `"Ubuntu", sans-serif`,
fontWeightRegular: 300,
}, },
}); });

BIN
typescript/Frontend/src/resources/innovenergy_Logo_onOrange.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 50 KiB

17
typescript/Frontend/src/util/installation.util.tsx
View File

@ -3,9 +3,9 @@ import { styled, Tab, Tabs } from "@mui/material";
export const StyledTab = styled((props: any) => ( export const StyledTab = styled((props: any) => (
<Tab disableRipple {...props} /> <Tab disableRipple {...props} />
))(({ theme }) => ({ ))(({ theme }) => ({
textTransform: "none", textTransform: "uppercase",
fontWeight: theme.typography.fontWeightRegular, fontWeight: theme.typography.fontWeightRegular,
fontSize: theme.typography.pxToRem(15), fontSize: theme.typography.pxToRem(14),
marginRight: theme.spacing(1), marginRight: theme.spacing(1),
background: "0 0", background: "0 0",
border: "1px solid transparent", border: "1px solid transparent",
@ -15,9 +15,9 @@ export const StyledTab = styled((props: any) => (
textDecoration: "none", textDecoration: "none",
transition: `color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out`, transition: `color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out`,
"&.Mui-selected": { "&.Mui-selected": {
color: "#495057", color: "#000000",
backgroundColor: "#fff", backgroundColor: "#fff",
borderColor: "#dee2e6 #dee2e6 #fff", borderColor: "#bdbdbd #bdbdbd #fff",
marginBottom: "-3px", marginBottom: "-3px",
}, },
"&.Mui-focusVisible": { "&.Mui-focusVisible": {
@ -26,19 +26,22 @@ export const StyledTab = styled((props: any) => (
})); }));
export const AntTabs = styled(Tabs)({ export const AntTabs = styled(Tabs)({
borderBottom: "1px solid #dee2e6", borderBottom: "1px solid #bdbdbd",
overflow: "visible!important", overflow: "visible!important",
"& div.MuiTabs-scroller": { "& div.MuiTabs-scroller": {
overflow: "visible!important", overflow: "visible!important",
}, },
"&.Mui-selected": { "&.Mui-selected": {
color: "#495057", color: "#000000",
backgroundColor: "red", backgroundColor: "red",
borderColor: `#dee2e6 #dee2e6 #fff`, borderColor: `#bdbdbd #bdbdbd #fff`,
}, },
"& .MuiTabs-indicator": { "& .MuiTabs-indicator": {
display: "flex", display: "flex",
justifyContent: "center", justifyContent: "center",
backgroundColor: "transparent", backgroundColor: "transparent",
}, },
"&.MuiTabs-root": {
width: "100%",
},
}); });