Fix import statements and add missing code comments

master^2
Tudor Stanciu 2024-03-25 02:28:47 +02:00
parent e085e36934
commit 77c0264963
23 changed files with 100 additions and 83 deletions

View File

@ -13,6 +13,7 @@
"@flare/js-utils": "^1.1.0", "@flare/js-utils": "^1.1.0",
"@flare/tuitio-client-react": "^1.2.6", "@flare/tuitio-client-react": "^1.2.6",
"@mui/icons-material": "^5.14.16", "@mui/icons-material": "^5.14.16",
"@mui/lab": "^5.0.0-alpha.169",
"@mui/material": "^5.14.16", "@mui/material": "^5.14.16",
"axios": "^1.6.0", "axios": "^1.6.0",
"i18next": "^22.4.15", "i18next": "^22.4.15",
@ -3484,6 +3485,46 @@
} }
} }
}, },
"node_modules/@mui/lab": {
"version": "5.0.0-alpha.169",
"resolved": "https://registry.npmjs.org/@mui/lab/-/lab-5.0.0-alpha.169.tgz",
"integrity": "sha512-h6xe1K6ISKUbyxTDgdvql4qoDP6+q8ad5fg9nXQxGLUrIeT2jVrBuT/jRECSTufbnhzP+V5kulvYxaMfM8rEdA==",
"dependencies": {
"@babel/runtime": "^7.23.9",
"@mui/base": "5.0.0-beta.40",
"@mui/system": "^5.15.14",
"@mui/types": "^7.2.14",
"@mui/utils": "^5.15.14",
"clsx": "^2.1.0",
"prop-types": "^15.8.1"
},
"engines": {
"node": ">=12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/mui-org"
},
"peerDependencies": {
"@emotion/react": "^11.5.0",
"@emotion/styled": "^11.3.0",
"@mui/material": ">=5.15.0",
"@types/react": "^17.0.0 || ^18.0.0",
"react": "^17.0.0 || ^18.0.0",
"react-dom": "^17.0.0 || ^18.0.0"
},
"peerDependenciesMeta": {
"@emotion/react": {
"optional": true
},
"@emotion/styled": {
"optional": true
},
"@types/react": {
"optional": true
}
}
},
"node_modules/@mui/material": { "node_modules/@mui/material": {
"version": "5.15.14", "version": "5.15.14",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.15.14.tgz", "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.15.14.tgz",
@ -21308,6 +21349,20 @@
"@babel/runtime": "^7.23.9" "@babel/runtime": "^7.23.9"
} }
}, },
"@mui/lab": {
"version": "5.0.0-alpha.169",
"resolved": "https://registry.npmjs.org/@mui/lab/-/lab-5.0.0-alpha.169.tgz",
"integrity": "sha512-h6xe1K6ISKUbyxTDgdvql4qoDP6+q8ad5fg9nXQxGLUrIeT2jVrBuT/jRECSTufbnhzP+V5kulvYxaMfM8rEdA==",
"requires": {
"@babel/runtime": "^7.23.9",
"@mui/base": "5.0.0-beta.40",
"@mui/system": "^5.15.14",
"@mui/types": "^7.2.14",
"@mui/utils": "^5.15.14",
"clsx": "^2.1.0",
"prop-types": "^15.8.1"
}
},
"@mui/material": { "@mui/material": {
"version": "5.15.14", "version": "5.15.14",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.15.14.tgz", "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.15.14.tgz",

View File

@ -13,11 +13,12 @@
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@flare/js-utils": "^1.1.0",
"@flare/tuitio-client-react": "^1.2.6",
"@emotion/react": "^11.11.1", "@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0", "@emotion/styled": "^11.11.0",
"@flare/js-utils": "^1.1.0",
"@flare/tuitio-client-react": "^1.2.6",
"@mui/icons-material": "^5.14.16", "@mui/icons-material": "^5.14.16",
"@mui/lab": "^5.0.0-alpha.169",
"@mui/material": "^5.14.16", "@mui/material": "^5.14.16",
"axios": "^1.6.0", "axios": "^1.6.0",
"i18next": "^22.4.15", "i18next": "^22.4.15",
@ -26,12 +27,12 @@
"moment": "^2.29.4", "moment": "^2.29.4",
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-world-flags": "^1.5.1",
"react-i18next": "^12.2.2", "react-i18next": "^12.2.2",
"react-lazylog": "^4.5.3", "react-lazylog": "^4.5.3",
"react-router-dom": "^6.10.0", "react-router-dom": "^6.10.0",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"react-toastify": "^9.1.3" "react-toastify": "^9.1.3",
"react-world-flags": "^1.5.1"
}, },
"devDependencies": { "devDependencies": {
"@babel/plugin-proposal-private-property-in-object": "^7.21.11", "@babel/plugin-proposal-private-property-in-object": "^7.21.11",

View File

@ -1,7 +1,6 @@
import React, { useState } from "react"; import React, { useState } from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import ToggleButton from "@material-ui/lab/ToggleButton"; import { ToggleButtonGroup, ToggleButton } from "@mui/material";
import ToggleButtonGroup from "@material-ui/lab/ToggleButtonGroup";
import { Tooltip } from "@mui/material"; import { Tooltip } from "@mui/material";
const NavigationButtons = ({ tabs, onTabChange }) => { const NavigationButtons = ({ tabs, onTabChange }) => {

View File

@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import { makeStyles } from "@mui/material/styles"; import { makeStyles } from "@mui/material/styles";
import { Alert, AlertTitle } from "@material-ui/lab"; import { Alert, AlertTitle } from "@mui/material";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
const useStyles = makeStyles(theme => ({ const useStyles = makeStyles(theme => ({

View File

@ -4,8 +4,7 @@ import ReleaseNotesList from "./ReleaseNotesList";
import TimelineComponent from "../timeline/TimelineComponent"; import TimelineComponent from "../timeline/TimelineComponent";
import { routes, get } from "../../../utils/api"; import { routes, get } from "../../../utils/api";
const sort = releases => const sort = releases => releases.sort((a, b) => new Date(b.date) - new Date(a.date));
releases.sort((a, b) => new Date(b.date) - new Date(a.date));
const ReleaseNotesContainer = ({ view }) => { const ReleaseNotesContainer = ({ view }) => {
const [state, setState] = useState({ data: [], loaded: false }); const [state, setState] = useState({ data: [], loaded: false });

View File

@ -1,20 +1,20 @@
import React from "react"; import React from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import { makeStyles } from "@mui/material/styles"; import { makeStyles } from "@mui/material/styles";
import Timeline from "@material-ui/lab/Timeline"; import Timeline from "@mui/lab/Timeline";
import TimelineItem from "@material-ui/lab/TimelineItem"; import TimelineItem from "@mui/lab/TimelineItem";
import TimelineSeparator from "@material-ui/lab/TimelineSeparator"; import TimelineSeparator from "@mui/lab/TimelineSeparator";
import TimelineConnector from "@material-ui/lab/TimelineConnector"; import TimelineConnector from "@mui/lab/TimelineConnector";
import TimelineContent from "@material-ui/lab/TimelineContent"; import TimelineContent from "@mui/lab/TimelineContent";
import TimelineOppositeContent from "@material-ui/lab/TimelineOppositeContent"; import TimelineOppositeContent from "@mui/lab/TimelineOppositeContent";
import TimelineDot from "@material-ui/lab/TimelineDot"; import TimelineDot from "@mui/lab/TimelineDot";
import Paper from "@mui/material/Paper"; import Paper from "@mui/material/Paper";
import Typography from "@mui/material/Typography"; import Typography from "@mui/material/Typography";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { getRandomElement } from "../../../utils"; import { getRandomElement } from "../../../utils";
import { import {
Announcement, Announcement,
AmpStories, Book,
Apps, Apps,
BugReport, BugReport,
DeviceHub, DeviceHub,
@ -33,7 +33,7 @@ import {
const timelineIcons = [ const timelineIcons = [
Announcement, Announcement,
AmpStories, Book,
Apps, Apps,
BugReport, BugReport,
DeviceHub, DeviceHub,

View File

@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import { makeStyles } from "@mui/material/styles"; import { makeStyles } from "@mui/material/styles";
import { Alert, AlertTitle } from "@material-ui/lab"; import { Alert, AlertTitle } from "@mui/material";
import styles from "../styles"; import styles from "../styles";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";

View File

@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import { makeStyles } from "@mui/material/styles"; import { makeStyles } from "@mui/material/styles";
import { Alert, AlertTitle } from "@material-ui/lab"; import { Alert, AlertTitle } from "@mui/material";
import styles from "../styles"; import styles from "../styles";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useTuitioUser } from "@flare/tuitio-client-react"; import { useTuitioUser } from "@flare/tuitio-client-react";

View File

@ -26,13 +26,7 @@ const LoginContainer = () => {
return login(userName, password); return login(userName, password);
}; };
return ( return <LoginCard credentials={credentials} onChange={handleChange} onLogin={handleLogin} />;
<LoginCard
credentials={credentials}
onChange={handleChange}
onLogin={handleLogin}
/>
);
}; };
export default LoginContainer; export default LoginContainer;

View File

@ -96,7 +96,9 @@ const MachineContainer = ({ machine, viewMode }) => {
}, },
{ {
code: "advanced", code: "advanced",
effect: () => {}, effect: () => {
// to do: implement
},
icon: Launch, icon: Launch,
tooltip: t("Machine.Actions.Advanced"), tooltip: t("Machine.Actions.Advanced"),
main: false main: false

View File

@ -1,8 +1,5 @@
import React, { useContext, useEffect, useCallback, useState } from "react"; import React, { useContext, useEffect, useCallback, useState } from "react";
import { import { NetworkStateContext, NetworkDispatchContext } from "../../network/state/contexts";
NetworkStateContext,
NetworkDispatchContext
} from "../../network/state/contexts";
import MachinesListComponent from "./MachinesListComponent"; import MachinesListComponent from "./MachinesListComponent";
import PageTitle from "../../../components/common/PageTitle"; import PageTitle from "../../../components/common/PageTitle";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
@ -35,19 +32,9 @@ const MachinesContainer = () => {
<> <>
<PageTitle <PageTitle
text={t("Menu.Machines")} text={t("Menu.Machines")}
toolBar={ toolBar={<ViewModeSelection callback={setViewMode} initialMode={ViewModes.TABLE} />}
<ViewModeSelection
callback={setViewMode}
initialMode={ViewModes.TABLE}
/>
}
/> />
{viewMode && ( {viewMode && <MachinesListComponent machines={state.network.machines} viewMode={viewMode} />}
<MachinesListComponent
machines={state.network.machines}
viewMode={viewMode}
/>
)}
</> </>
); );
}; };

View File

@ -2,8 +2,7 @@ import React, { useState, useEffect, useCallback } from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import TableChartIcon from "@mui/icons-material/TableChart"; import TableChartIcon from "@mui/icons-material/TableChart";
import ViewListIcon from "@mui/icons-material/ViewList"; import ViewListIcon from "@mui/icons-material/ViewList";
import ToggleButton from "@material-ui/lab/ToggleButton"; import { ToggleButtonGroup, ToggleButton } from "@mui/material";
import ToggleButtonGroup from "@material-ui/lab/ToggleButtonGroup";
import { Tooltip } from "@mui/material"; import { Tooltip } from "@mui/material";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";

View File

@ -41,4 +41,6 @@ ActionButton.propTypes = {
disabled: PropTypes.bool disabled: PropTypes.bool
}; };
ActionButton.displayName = "ActionButton";
export default ActionButton; export default ActionButton;

View File

@ -71,7 +71,9 @@ const WakeComponent = ({ machine, addLog, disabled }) => {
}, pingInterval); }, pingInterval);
} }
}, },
onError: () => {} onError: () => {
// to do: handle error
}
} }
); );
}, [machine, log, pingInterval, disabled]); }, [machine, log, pingInterval, disabled]);

View File

@ -6,16 +6,11 @@ import { initialState } from "./initialState";
const NetworkStateProvider = ({ children }) => { const NetworkStateProvider = ({ children }) => {
const [state, dispatch] = useReducer(reducer, initialState); const [state, dispatch] = useReducer(reducer, initialState);
const dispatchActions = useMemo( const dispatchActions = useMemo(() => reducerDispatchActions(dispatch), [dispatch]);
() => reducerDispatchActions(dispatch),
[dispatch]
);
return ( return (
<NetworkStateContext.Provider value={state}> <NetworkStateContext.Provider value={state}>
<NetworkDispatchContext.Provider value={dispatchActions}> <NetworkDispatchContext.Provider value={dispatchActions}>{children}</NetworkDispatchContext.Provider>
{children}
</NetworkDispatchContext.Provider>
</NetworkStateContext.Provider> </NetworkStateContext.Provider>
); );
}; };

View File

@ -17,6 +17,5 @@ export function reducer(state, action) {
} }
export const dispatchActions = dispatch => ({ export const dispatchActions = dispatch => ({
onNetworkChange: (prop, value) => onNetworkChange: (prop, value) => dispatch({ type: "onNetworkChange", payload: { prop, value } })
dispatch({ type: "onNetworkChange", payload: { prop, value } })
}); });

View File

@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import Flag from "react-flags"; import Flag from "react-world-flags";
import { IconButton, Menu, MenuItem } from "@mui/material"; import { IconButton, Menu, MenuItem } from "@mui/material";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";

View File

@ -2,9 +2,7 @@ import React, { useState, useEffect } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import LanguageComponent from "./LanguageComponent"; import LanguageComponent from "./LanguageComponent";
const flagsPath = process.env.PUBLIC_URL const flagsPath = process.env.PUBLIC_URL ? `${process.env.PUBLIC_URL}/flags` : "flags";
? `${process.env.PUBLIC_URL}/flags`
: "flags";
const LanguageContainer = () => { const LanguageContainer = () => {
const [anchorEl, setAnchorEl] = useState(null); const [anchorEl, setAnchorEl] = useState(null);

View File

@ -3,9 +3,8 @@ import React from "react";
const NotificationsContainer = () => { const NotificationsContainer = () => {
return ( return (
<div> <div>
Enable/Disable email notifications (for each one separately - when Enable/Disable email notifications (for each one separately - when starting the machine, when stopping) You can go
starting the machine, when stopping) You can go even further and have an even further and have an advanced site where you can configure each individual machine.
advanced site where you can configure each individual machine.
</div> </div>
); );
}; };

View File

@ -23,8 +23,7 @@ const reducer = (state = initialState, action) => {
}; };
const dispatchActions = dispatch => ({ const dispatchActions = dispatch => ({
onSensitiveInfoEnabled: enabled => onSensitiveInfoEnabled: enabled => dispatch({ type: "onSensitiveInfoEnabled", payload: { enabled } })
dispatch({ type: "onSensitiveInfoEnabled", payload: { enabled } })
}); });
const useSensitiveInfo = () => { const useSensitiveInfo = () => {

View File

@ -3,9 +3,4 @@ import ToastProvider from "./ToastProvider";
import SensitiveInfoProvider from "./SensitiveInfoProvider"; import SensitiveInfoProvider from "./SensitiveInfoProvider";
import UserPermissionsProvider from "./UserPermissionsProvider"; import UserPermissionsProvider from "./UserPermissionsProvider";
export { export { ThemeProvider, ToastProvider, SensitiveInfoProvider, UserPermissionsProvider };
ThemeProvider,
ToastProvider,
SensitiveInfoProvider,
UserPermissionsProvider
};

View File

@ -49,16 +49,12 @@ i18n
let startDate = moment(value.start); let startDate = moment(value.start);
let endDate = moment(value.end); let endDate = moment(value.end);
let span = moment.duration(endDate - startDate); let span = moment.duration(endDate - startDate);
return `${parseInt(span.asHours(), 10)}h ${parseInt( return `${parseInt(span.asHours(), 10)}h ${parseInt(span.asMinutes() % 60, 10)}m`;
span.asMinutes() % 60,
10
)}m`;
} }
return ""; return "";
} }
if (format === "intlNumber") if (format === "intlNumber") return new Intl.NumberFormat(lng).format(value);
return new Intl.NumberFormat(lng).format(value);
if (format === "intlDecimal") if (format === "intlDecimal")
return new Intl.NumberFormat(lng, { return new Intl.NumberFormat(lng, {
minimumFractionDigits: 2 minimumFractionDigits: 2

View File

@ -1,9 +1,7 @@
const obfuscateForChars = (text, placeholder = "*") => { const obfuscateForChars = (text, placeholder = "*") => {
const firstChar = text.substring(0, 1); const firstChar = text.substring(0, 1);
const lastChar = text.substring(text.length - 1); const lastChar = text.substring(text.length - 1);
const middleChars = text const middleChars = text.substring(1, text.length - 1).replace(/[a-zA-Z0-9]/g, placeholder);
.substring(1, text.length - 1)
.replace(/[a-zA-Z0-9]/g, placeholder);
return firstChar + middleChars + lastChar; return firstChar + middleChars + lastChar;
}; };
@ -15,9 +13,7 @@ const obfuscate = (text, placeholder = "*") => {
const firstTwoChars = text.substring(0, 2); const firstTwoChars = text.substring(0, 2);
const lastChar = text.substring(text.length - 1); const lastChar = text.substring(text.length - 1);
const middleChars = text const middleChars = text.substring(2, text.length - 1).replace(/[a-zA-Z0-9]/g, placeholder);
.substring(2, text.length - 1)
.replace(/[a-zA-Z0-9]/g, placeholder);
return firstTwoChars + middleChars + lastChar; return firstTwoChars + middleChars + lastChar;
}; };