- {
});
};
- if (directAccessUsers && directAccessUsers.length) {
+ if (directAccessUsers && directAccessUsers.length > 0) {
return (
<>
{error && (
@@ -90,7 +90,14 @@ const UsersWithDirectAccess = () => {
);
}
- return null;
+ return (
+
{`Write key: ${values.s3WriteKey}`}
}
+ {values.s3WriteSecret && (
+ {`Write secret: ${values.s3WriteSecret}`}
+ )}
+
+
- {props.data && (
- <>
- {props.data.values.map((boxData, index) => {
- console.log("boxData", boxData);
- return (
-
- {`${ - props.data && props.data.values.length === 3 - ? "L" + (index + 1) + " " - : "" - }${ - !isInt(Number(boxData.value)) - ? Number(boxData.value).toPrecision(4) - : boxData.value - }${boxData.unit}`}
- ); - })} - - )} -+ {props.title} +
+
+ {props.data && (
+ <>
+ {props.data.values.map((boxData, index) => {
+ return (
+
+ {`${ + props.data && props.data.values.length === 3 + ? "L" + (index + 1) + " " + : "" + }${ + !isInt(Number(boxData.value)) + ? Number(boxData.value).toPrecision(4) + : boxData.value + }${boxData.unit}`}
+ ); + })} + + )} +
-
+ {!props.isLastColumn && (
+
+
+ )}
);
};
diff --git a/typescript/Frontend/src/components/Installations/Log/TopologyFlow.tsx b/typescript/Frontend/src/components/Installations/Log/TopologyFlow.tsx
index cc077eee4..5c7604a6e 100644
--- a/typescript/Frontend/src/components/Installations/Log/TopologyFlow.tsx
+++ b/typescript/Frontend/src/components/Installations/Log/TopologyFlow.tsx
@@ -9,7 +9,9 @@ export type TopologyFlowProps = {
hidden?: boolean;
};
const TopologyFlow = (props: TopologyFlowProps) => {
- const length = Math.abs((props.amount ?? 1) * BOX_SIZE);
+ const length = Math.abs(
+ ((props.amount && props.amount < 0.1 ? 0.1 : props.amount) ?? 0) * BOX_SIZE
+ );
const values = props.data?.values;
return (
{
{values
?.filter((boxData) => (boxData.value as number) !== 0)
.map(
- (boxData) => `${Math.round(boxData.value as number)} ${boxData.unit}`
+ (boxData) =>
+ `${Math.round(boxData.value as number)} ${boxData.unit}`
)}
{
const [values, setValues] = useState(null);
const { fetchData } = useContext(S3CredentialsContext);
+ const theme = useTheme();
useEffect(() => {
const interval = setInterval(() => {
@@ -37,8 +38,7 @@ const TopologyView = () => {
}, 2000);
return () => clearInterval(interval);
- }, []);
- const theme = useTheme();
+ }, [fetchData]);
if (values) {
const highestConnectionValue = getHighestConnectionValue(values);
@@ -47,19 +47,13 @@ const TopologyView = () => {
sx={{
display: "flex",
flexDirection: "row",
- paddingTop: 3,
- paddingBottom: 3,
+ padding: 3,
bgcolor: "white",
- px: 3 / 8,
- border: 2,
- borderTop: 0,
- borderBottomLeftRadius: 4,
- borderBottomRightRadius: 4,
- borderColor: theme.palette.text.disabled,
- borderTopColor: "white",
marginTop: 0.05,
fontFamily: `"Ubuntu", sans-serif`,
fontSize: "12px",
+ justifyContent: "center",
+ width: "fit-content",
}}
>
(initialNodes);
- const [edges, setEdges] = useState(initialEdges);
-
- const onNodesChange = useCallback(
- (changes: NodeChange[]) =>
- setNodes((nds) => applyNodeChanges(changes, nds)),
- [setNodes]
- );
- const onEdgesChange = useCallback(
- (changes: EdgeChange[]) =>
- setEdges((eds) => applyEdgeChanges(changes, eds)),
- [setEdges]
- );
- const onConnect = useCallback(
- (connection: Connection) => setEdges((eds) => addEdge(connection, eds)),
- [setEdges]
- );
-
- return (
- props.onClick}
+ sx={{
+ ".MuiTreeItem-content": {
+ py: "10px",
+ borderRadius: "4px",
+ width: "inherit",
+ },
+ ".Mui-selected": {
+ backgroundColor: theme.palette.secondary.main + "!important",
+ borderRadius: "4px",
+ },
+ ".MuiTreeItem-content:hover": {
+ borderRadius: "4px",
+ backgroundColor: theme.palette.secondary.light + "!important",
+ },
+ ".MuiTreeItem-content.Mui-selected:hover": {
+ borderRadius: "4px",
+ backgroundColor: theme.palette.secondary.main + "!important",
+ },
+ borderRadius: "4px",
+ bgcolor: colors.greyDark,
+ }}
+ >
+ {props.children}
+
+ );
+};
+
+export default InnovEnergyTreeItem;
diff --git a/typescript/Frontend/src/components/Layout/InnovenergyButton.tsx b/typescript/Frontend/src/components/Layout/InnovenergyButton.tsx
index 883b56e98..dfbff7637 100644
--- a/typescript/Frontend/src/components/Layout/InnovenergyButton.tsx
+++ b/typescript/Frontend/src/components/Layout/InnovenergyButton.tsx
@@ -1,12 +1,11 @@
import { Button, SxProps, Theme, colors, useTheme } from "@mui/material";
-import { DAY_MARGIN } from "@mui/x-date-pickers/internals";
import { ReactNode } from "react";
-import { Background } from "reactflow";
interface I_InnovenergyButtonProps {
children?: ReactNode;
type?: "button" | "submit" | "reset" | undefined;
onClick?: React.MouseEventHandler;
+ onKeyDown?: React.KeyboardEventHandler;
sx?: SxProps | undefined;
id?: string;
}
@@ -19,13 +18,14 @@ const InnovenergyButton = (props: I_InnovenergyButtonProps) => {
variant="contained"
type={props.type}
onClick={props.onClick}
- sx={{...props.sx,
+ onKeyDown={props.onKeyDown}
+ sx={{
+ ...props.sx,
textTransform: "none",
bgcolor: theme.palette.secondary.main,
- ":hover":{
+ ":hover": {
bgcolor: theme.palette.secondary.dark,
- }
-
+ },
}}
>
{props.children}
@@ -33,6 +33,4 @@ const InnovenergyButton = (props: I_InnovenergyButtonProps) => {
);
};
-
export default InnovenergyButton;
-
diff --git a/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx b/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx
index 49336713e..3b814e69b 100644
--- a/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx
+++ b/typescript/Frontend/src/components/Layout/InnovenergyTab.tsx
@@ -1,5 +1,4 @@
-import { styled, SxProps, Tab, Tabs, Theme, useTheme } from "@mui/material";
-import { TabProps } from "@mui/material/Tab/Tab";
+import { Tab, useTheme } from "@mui/material";
import { colors } from "index";
const InnovenergyTab = (props: any) => {
@@ -21,43 +20,8 @@ const InnovenergyTab = (props: any) => {
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",
- bottom: -1,
- ...(props.sx ? props.sx["&.Mui-selected"] : {}),
- },
- }}
- />
- );
-};
-
-const InnovenergyTabBorder = (props: any) => {
- const theme = useTheme();
- return (
- {
},
"&.Mui-selected": {
color: colors.black,
- backgroundColor: "#eaecf1",
+ backgroundColor: theme.palette.primary.light,
borderColor: `#90A7c5 #90A7c5 #fff`,
},
"& .MuiTabs-indicator": {
diff --git a/typescript/Frontend/src/components/Layout/LanguageSelect.tsx b/typescript/Frontend/src/components/Layout/LanguageSelect.tsx
index 593c7a030..c998b8c11 100644
--- a/typescript/Frontend/src/components/Layout/LanguageSelect.tsx
+++ b/typescript/Frontend/src/components/Layout/LanguageSelect.tsx
@@ -15,13 +15,13 @@ const LanguageSelect = (props: LanguageSelectProps) => {
label="Age"
onChange={(e) => props.setLanguage(e.target.value)}
>
-
@@ -217,6 +211,7 @@ const TopologyView = () => {
title: "Battery",
data: values.battery,
}}
+ isLastColumn
/>
diff --git a/typescript/Frontend/src/components/Layout/FlowComp.tsx b/typescript/Frontend/src/components/Layout/FlowComp.tsx
deleted file mode 100644
index ef40a9ad9..000000000
--- a/typescript/Frontend/src/components/Layout/FlowComp.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import { useState, useCallback } from "react";
-import ReactFlow, {
- addEdge,
- FitViewOptions,
- applyNodeChanges,
- applyEdgeChanges,
- Node,
- Edge,
- NodeChange,
- EdgeChange,
- Connection,
-} from "reactflow";
-
-const initialNodes: Node[] = [
- { id: "1", data: { label: "Node 1" }, position: { x: 5, y: 5 } },
- { id: "2", data: { label: "Node 2" }, position: { x: 5, y: 100 } },
-];
-
-const initialEdges: Edge[] = [{ id: "e1-2", source: "1", target: "2" }];
-
-const fitViewOptions: FitViewOptions = {
- padding: 0.2,
-};
-
-function Flow() {
- const [nodes, setNodes] = useState