From e085e36934b27d2e3e11427e595c8f0ea0fcae44 Mon Sep 17 00:00:00 2001 From: Tudor Stanciu Date: Mon, 25 Mar 2024 02:10:14 +0200 Subject: [PATCH] Update Material-UI imports to MUI imports --- frontend/src/components/common/DataLabel.js | 9 ++--- .../components/common/NavigationButtons.js | 20 ++-------- frontend/src/components/common/NotAllowed.js | 2 +- frontend/src/components/common/PageTitle.js | 4 +- frontend/src/components/common/PaperTitle.js | 4 +- frontend/src/components/layout/AppLayout.js | 2 +- .../src/components/layout/LightDarkToggle.js | 2 +- .../src/components/layout/ProfileButton.js | 4 +- .../components/layout/SensitiveInfoToggle.js | 2 +- frontend/src/components/layout/Sidebar.js | 6 +-- frontend/src/components/layout/TopBar.js | 4 +- .../about/releaseNotes/ReleaseNote.js | 8 +--- .../about/releaseNotes/ReleaseNoteSummary.js | 2 +- .../about/releaseNotes/ReleaseNotesList.js | 2 +- .../about/system/AboutSystemComponent.js | 12 +++--- .../about/system/AboutSystemContainer.js | 2 +- .../about/system/SystemVersionComponent.js | 8 ++-- .../about/timeline/TimelineComponent.js | 6 +-- .../announcements/GuestAnnouncement.js | 2 +- .../announcements/UserAnnouncement.js | 2 +- .../features/login/components/LoginCard.js | 10 ++--- .../login/components/LoginComponent.js | 4 +- .../machines/components/MachineAccordion.js | 6 +-- .../machines/components/MachineTableRow.js | 4 +- .../components/MachinesListComponent.js | 17 ++------- .../machines/components/ViewModeSelection.js | 2 +- .../components/common/ActionButton.js | 7 +--- .../components/common/ActionsGroup.js | 2 +- .../common/MachineCollapsedContent.js | 10 ++--- .../machines/components/common/MachineLog.js | 7 +--- .../components/common/WakeComponent.js | 2 +- .../appearance/AppearanceComponent.js | 13 ++----- .../appearance/language/LanguageComponent.js | 37 +++---------------- .../settings/system/CacheSettingsComponent.js | 11 ++---- .../profile/card/UserProfileCardContent.js | 7 +--- .../user/profile/card/UserProfileComponent.js | 13 ++----- .../user/profile/card/UserProfilePicture.js | 4 +- .../user/profile/contact/ContactOption.js | 9 +---- .../user/profile/contact/ContactOptionList.js | 2 +- .../user/profile/contact/ContactOptions.js | 2 +- .../profile/security/SecurityComponent.js | 11 ++---- .../src/providers/UserPermissionsProvider.js | 30 +++++---------- frontend/src/themes/index.js | 2 +- 43 files changed, 101 insertions(+), 214 deletions(-) diff --git a/frontend/src/components/common/DataLabel.js b/frontend/src/components/common/DataLabel.js index 7c58946..815f7cb 100644 --- a/frontend/src/components/common/DataLabel.js +++ b/frontend/src/components/common/DataLabel.js @@ -1,7 +1,7 @@ import React, { useMemo } from "react"; import PropTypes from "prop-types"; -import Typography from "@material-ui/core/Typography"; -import { makeStyles } from "@material-ui/core/styles"; +import Typography from "@mui/material/Typography"; +import { makeStyles } from "@mui/material/styles"; const useStyles = makeStyles(theme => ({ panel: { @@ -17,10 +17,7 @@ const useStyles = makeStyles(theme => ({ const DataLabel = ({ label, data }) => { const classes = useStyles(); - const lbl = useMemo( - () => (label.endsWith(":") ? label : `${label}:`), - [label] - ); + const lbl = useMemo(() => (label.endsWith(":") ? label : `${label}:`), [label]); return (
diff --git a/frontend/src/components/common/NavigationButtons.js b/frontend/src/components/common/NavigationButtons.js index c8d10eb..7b01845 100644 --- a/frontend/src/components/common/NavigationButtons.js +++ b/frontend/src/components/common/NavigationButtons.js @@ -2,7 +2,7 @@ import React, { useState } from "react"; import PropTypes from "prop-types"; import ToggleButton from "@material-ui/lab/ToggleButton"; import ToggleButtonGroup from "@material-ui/lab/ToggleButtonGroup"; -import { Tooltip } from "@material-ui/core"; +import { Tooltip } from "@mui/material"; const NavigationButtons = ({ tabs, onTabChange }) => { const [selected, setSelected] = useState(tabs[0].code); @@ -13,19 +13,9 @@ const NavigationButtons = ({ tabs, onTabChange }) => { }; return ( - + {tabs.map(tab => ( - + @@ -36,9 +26,7 @@ const NavigationButtons = ({ tabs, onTabChange }) => { }; NavigationButtons.propTypes = { - tabs: PropTypes.arrayOf( - PropTypes.shape({ code: PropTypes.string.isRequired }) - ).isRequired, + tabs: PropTypes.arrayOf(PropTypes.shape({ code: PropTypes.string.isRequired })).isRequired, onTabChange: PropTypes.func }; diff --git a/frontend/src/components/common/NotAllowed.js b/frontend/src/components/common/NotAllowed.js index 363c420..c799fea 100644 --- a/frontend/src/components/common/NotAllowed.js +++ b/frontend/src/components/common/NotAllowed.js @@ -1,5 +1,5 @@ import React from "react"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import { Alert, AlertTitle } from "@material-ui/lab"; import { useTranslation } from "react-i18next"; diff --git a/frontend/src/components/common/PageTitle.js b/frontend/src/components/common/PageTitle.js index 9a5646c..9859396 100644 --- a/frontend/src/components/common/PageTitle.js +++ b/frontend/src/components/common/PageTitle.js @@ -1,7 +1,7 @@ import React from "react"; import PropTypes from "prop-types"; -import { makeStyles } from "@material-ui/core/styles"; -import { Typography } from "@material-ui/core"; +import { makeStyles } from "@mui/material/styles"; +import { Typography } from "@mui/material"; const useStyles = makeStyles(theme => ({ box: { diff --git a/frontend/src/components/common/PaperTitle.js b/frontend/src/components/common/PaperTitle.js index 8f0313d..dbe4d4f 100644 --- a/frontend/src/components/common/PaperTitle.js +++ b/frontend/src/components/common/PaperTitle.js @@ -1,7 +1,7 @@ import React from "react"; import PropTypes from "prop-types"; -import { Typography } from "@material-ui/core"; -import { makeStyles } from "@material-ui/core/styles"; +import { Typography } from "@mui/material"; +import { makeStyles } from "@mui/material/styles"; const useStyles = makeStyles(theme => ({ paper: { diff --git a/frontend/src/components/layout/AppLayout.js b/frontend/src/components/layout/AppLayout.js index 70092b3..eb36e66 100644 --- a/frontend/src/components/layout/AppLayout.js +++ b/frontend/src/components/layout/AppLayout.js @@ -1,5 +1,5 @@ import React, { useState } from "react"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import AppRoutes from "./AppRoutes"; import TopBar from "./TopBar"; import Sidebar from "./Sidebar"; diff --git a/frontend/src/components/layout/LightDarkToggle.js b/frontend/src/components/layout/LightDarkToggle.js index b68f307..e31febd 100644 --- a/frontend/src/components/layout/LightDarkToggle.js +++ b/frontend/src/components/layout/LightDarkToggle.js @@ -1,5 +1,5 @@ import React from "react"; -import { IconButton } from "@material-ui/core"; +import { IconButton } from "@mui/material"; import { Brightness2 as MoonIcon, WbSunny as SunIcon } from "@mui/icons-material"; import { useApplicationTheme } from "../../providers/ThemeProvider"; diff --git a/frontend/src/components/layout/ProfileButton.js b/frontend/src/components/layout/ProfileButton.js index 17b39f8..63173c2 100644 --- a/frontend/src/components/layout/ProfileButton.js +++ b/frontend/src/components/layout/ProfileButton.js @@ -1,5 +1,5 @@ import React, { useState } from "react"; -import { IconButton, Menu, MenuItem, Typography, ListItemIcon } from "@material-ui/core"; +import { IconButton, Menu, MenuItem, Typography, ListItemIcon } from "@mui/material"; import AccountCircle from "@mui/icons-material/AccountCircle"; import ExitToAppIcon from "@mui/icons-material/ExitToApp"; import AccountBoxIcon from "@mui/icons-material/AccountBox"; @@ -8,7 +8,7 @@ import { useNavigate } from "react-router-dom"; import { useTuitioClient } from "@flare/tuitio-client-react"; import { useToast } from "../../hooks"; import styles from "./styles"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import { useTranslation } from "react-i18next"; const useStyles = makeStyles(styles); diff --git a/frontend/src/components/layout/SensitiveInfoToggle.js b/frontend/src/components/layout/SensitiveInfoToggle.js index 0cefd72..177f911 100644 --- a/frontend/src/components/layout/SensitiveInfoToggle.js +++ b/frontend/src/components/layout/SensitiveInfoToggle.js @@ -1,5 +1,5 @@ import React from "react"; -import { IconButton } from "@material-ui/core"; +import { IconButton } from "@mui/material"; import { Visibility as VisibilityIcon, VisibilityOff as VisibilityOffIcon } from "@mui/icons-material"; import { useSensitiveInfo } from "../../hooks"; diff --git a/frontend/src/components/layout/Sidebar.js b/frontend/src/components/layout/Sidebar.js index 78ba6a4..40c8659 100644 --- a/frontend/src/components/layout/Sidebar.js +++ b/frontend/src/components/layout/Sidebar.js @@ -1,11 +1,11 @@ import React, { useState } from "react"; import PropTypes from "prop-types"; import clsx from "clsx"; -import { makeStyles, useTheme } from "@material-ui/core/styles"; -import { Drawer, List, Divider, IconButton, ListItemIcon, ListItemText } from "@material-ui/core"; +import { makeStyles, useTheme } from "@mui/material/styles"; +import { Drawer, List, Divider, IconButton, ListItemIcon, ListItemText } from "@mui/material"; import ChevronLeftIcon from "@mui/icons-material/ChevronLeft"; import ChevronRightIcon from "@mui/icons-material/ChevronRight"; -import ListItem from "@material-ui/core/ListItem"; +import ListItem from "@mui/material/ListItem"; import BuildIcon from "@mui/icons-material/Build"; import DnsIcon from "@mui/icons-material/Dns"; import DeviceHubIcon from "@mui/icons-material/DeviceHub"; diff --git a/frontend/src/components/layout/TopBar.js b/frontend/src/components/layout/TopBar.js index 6247989..b3bdced 100644 --- a/frontend/src/components/layout/TopBar.js +++ b/frontend/src/components/layout/TopBar.js @@ -1,8 +1,8 @@ import React from "react"; import PropTypes from "prop-types"; import clsx from "clsx"; -import { makeStyles } from "@material-ui/core/styles"; -import { AppBar, Toolbar, Typography, IconButton } from "@material-ui/core"; +import { makeStyles } from "@mui/material/styles"; +import { AppBar, Toolbar, Typography, IconButton } from "@mui/material"; import MenuIcon from "@mui/icons-material/Menu"; import ProfileButton from "./ProfileButton"; import LightDarkToggle from "./LightDarkToggle"; diff --git a/frontend/src/features/about/releaseNotes/ReleaseNote.js b/frontend/src/features/about/releaseNotes/ReleaseNote.js index 83bc923..32770c3 100644 --- a/frontend/src/features/about/releaseNotes/ReleaseNote.js +++ b/frontend/src/features/about/releaseNotes/ReleaseNote.js @@ -1,17 +1,13 @@ import React from "react"; import PropTypes from "prop-types"; -import Typography from "@material-ui/core/Typography"; +import Typography from "@mui/material/Typography"; const ReleaseNote = ({ releaseNote }) => { return (
{releaseNote.notes.map(note => { return ( - + {note} ); diff --git a/frontend/src/features/about/releaseNotes/ReleaseNoteSummary.js b/frontend/src/features/about/releaseNotes/ReleaseNoteSummary.js index 0bff6b4..718d156 100644 --- a/frontend/src/features/about/releaseNotes/ReleaseNoteSummary.js +++ b/frontend/src/features/about/releaseNotes/ReleaseNoteSummary.js @@ -1,6 +1,6 @@ import React from "react"; import PropTypes from "prop-types"; -import { Grid, Typography } from "@material-ui/core"; +import { Grid, Typography } from "@mui/material"; import { useTranslation } from "react-i18next"; const ReleaseNoteSummary = ({ releaseNote, collapsed }) => { diff --git a/frontend/src/features/about/releaseNotes/ReleaseNotesList.js b/frontend/src/features/about/releaseNotes/ReleaseNotesList.js index b46c03d..82896a4 100644 --- a/frontend/src/features/about/releaseNotes/ReleaseNotesList.js +++ b/frontend/src/features/about/releaseNotes/ReleaseNotesList.js @@ -1,6 +1,6 @@ import React, { useState } from "react"; import PropTypes from "prop-types"; -import { Accordion, AccordionSummary, AccordionDetails } from "@material-ui/core"; +import { Accordion, AccordionSummary, AccordionDetails } from "@mui/material"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; import ReleaseNoteSummary from "./ReleaseNoteSummary"; import ReleaseNote from "./ReleaseNote"; diff --git a/frontend/src/features/about/system/AboutSystemComponent.js b/frontend/src/features/about/system/AboutSystemComponent.js index 4c0ad72..c22168a 100644 --- a/frontend/src/features/about/system/AboutSystemComponent.js +++ b/frontend/src/features/about/system/AboutSystemComponent.js @@ -1,11 +1,11 @@ import React from "react"; import PropTypes from "prop-types"; -import { makeStyles } from "@material-ui/core/styles"; -import Card from "@material-ui/core/Card"; -import CardActions from "@material-ui/core/CardActions"; -import CardContent from "@material-ui/core/CardContent"; -import Button from "@material-ui/core/Button"; -import Typography from "@material-ui/core/Typography"; +import { makeStyles } from "@mui/material/styles"; +import Card from "@mui/material/Card"; +import CardActions from "@mui/material/CardActions"; +import CardContent from "@mui/material/CardContent"; +import Button from "@mui/material/Button"; +import Typography from "@mui/material/Typography"; import { useTranslation } from "react-i18next"; import OpenInNewIcon from "@mui/icons-material/OpenInNew"; diff --git a/frontend/src/features/about/system/AboutSystemContainer.js b/frontend/src/features/about/system/AboutSystemContainer.js index 8850a72..8ef7188 100644 --- a/frontend/src/features/about/system/AboutSystemContainer.js +++ b/frontend/src/features/about/system/AboutSystemContainer.js @@ -1,5 +1,5 @@ import React from "react"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import AboutSystemComponent from "./AboutSystemComponent"; import SystemVersionContainer from "./SystemVersionContainer"; diff --git a/frontend/src/features/about/system/SystemVersionComponent.js b/frontend/src/features/about/system/SystemVersionComponent.js index 0e8a261..ba7a9a8 100644 --- a/frontend/src/features/about/system/SystemVersionComponent.js +++ b/frontend/src/features/about/system/SystemVersionComponent.js @@ -1,14 +1,14 @@ import React, { useMemo, useEffect, useState } from "react"; import PropTypes from "prop-types"; -import { makeStyles } from "@material-ui/core/styles"; -import { List, ListItem, ListItemText, ListItemAvatar } from "@material-ui/core"; -import Avatar from "@material-ui/core/Avatar"; +import { makeStyles } from "@mui/material/styles"; +import { List, ListItem, ListItemText, ListItemAvatar } from "@mui/material"; +import Avatar from "@mui/material/Avatar"; import WebAssetIcon from "@mui/icons-material/WebAsset"; import DeveloperBoardIcon from "@mui/icons-material/DeveloperBoard"; import SettingsInputSvideoIcon from "@mui/icons-material/SettingsInputSvideo"; import { useTranslation } from "react-i18next"; import packageData from "../../../../package.json"; -import Paper from "@material-ui/core/Paper"; +import Paper from "@mui/material/Paper"; const useStyles = makeStyles(theme => { return { diff --git a/frontend/src/features/about/timeline/TimelineComponent.js b/frontend/src/features/about/timeline/TimelineComponent.js index 418ddf3..34235d7 100644 --- a/frontend/src/features/about/timeline/TimelineComponent.js +++ b/frontend/src/features/about/timeline/TimelineComponent.js @@ -1,6 +1,6 @@ import React from "react"; import PropTypes from "prop-types"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import Timeline from "@material-ui/lab/Timeline"; import TimelineItem from "@material-ui/lab/TimelineItem"; import TimelineSeparator from "@material-ui/lab/TimelineSeparator"; @@ -8,8 +8,8 @@ import TimelineConnector from "@material-ui/lab/TimelineConnector"; import TimelineContent from "@material-ui/lab/TimelineContent"; import TimelineOppositeContent from "@material-ui/lab/TimelineOppositeContent"; import TimelineDot from "@material-ui/lab/TimelineDot"; -import Paper from "@material-ui/core/Paper"; -import Typography from "@material-ui/core/Typography"; +import Paper from "@mui/material/Paper"; +import Typography from "@mui/material/Typography"; import { useTranslation } from "react-i18next"; import { getRandomElement } from "../../../utils"; import { diff --git a/frontend/src/features/dashboard/announcements/GuestAnnouncement.js b/frontend/src/features/dashboard/announcements/GuestAnnouncement.js index a7ba9e4..597bbae 100644 --- a/frontend/src/features/dashboard/announcements/GuestAnnouncement.js +++ b/frontend/src/features/dashboard/announcements/GuestAnnouncement.js @@ -1,5 +1,5 @@ import React from "react"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import { Alert, AlertTitle } from "@material-ui/lab"; import styles from "../styles"; import { useTranslation } from "react-i18next"; diff --git a/frontend/src/features/dashboard/announcements/UserAnnouncement.js b/frontend/src/features/dashboard/announcements/UserAnnouncement.js index 1b6c0ac..40e8ac8 100644 --- a/frontend/src/features/dashboard/announcements/UserAnnouncement.js +++ b/frontend/src/features/dashboard/announcements/UserAnnouncement.js @@ -1,5 +1,5 @@ import React from "react"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import { Alert, AlertTitle } from "@material-ui/lab"; import styles from "../styles"; import { useTranslation } from "react-i18next"; diff --git a/frontend/src/features/login/components/LoginCard.js b/frontend/src/features/login/components/LoginCard.js index ae45726..60a2df6 100644 --- a/frontend/src/features/login/components/LoginCard.js +++ b/frontend/src/features/login/components/LoginCard.js @@ -1,7 +1,7 @@ import React from "react"; import PropTypes from "prop-types"; -import { Card } from "@material-ui/core"; -import { makeStyles } from "@material-ui/core/styles"; +import { Card } from "@mui/material"; +import { makeStyles } from "@mui/material/styles"; import styles from "../styles"; import LoginComponent from "./LoginComponent"; @@ -13,11 +13,7 @@ const LoginCard = ({ credentials, onChange, onLogin }) => { return (
- +
); diff --git a/frontend/src/features/login/components/LoginComponent.js b/frontend/src/features/login/components/LoginComponent.js index e5f16a6..b432dc9 100644 --- a/frontend/src/features/login/components/LoginComponent.js +++ b/frontend/src/features/login/components/LoginComponent.js @@ -1,7 +1,7 @@ import React from "react"; import PropTypes from "prop-types"; -import { makeStyles } from "@material-ui/core/styles"; -import { TextField, InputAdornment, Button, CardActions, CardContent } from "@material-ui/core"; +import { makeStyles } from "@mui/material/styles"; +import { TextField, InputAdornment, Button, CardActions, CardContent } from "@mui/material"; import { AccountCircleOutlined } from "@mui/icons-material"; import PasswordField from "../../../components/common/inputs/PasswordField"; import { useTranslation } from "react-i18next"; diff --git a/frontend/src/features/machines/components/MachineAccordion.js b/frontend/src/features/machines/components/MachineAccordion.js index 81284fc..2fb29e0 100644 --- a/frontend/src/features/machines/components/MachineAccordion.js +++ b/frontend/src/features/machines/components/MachineAccordion.js @@ -1,14 +1,14 @@ import React from "react"; import PropTypes from "prop-types"; -import { Accordion, AccordionSummary, AccordionDetails, Grid } from "@material-ui/core"; +import { Accordion, AccordionSummary, AccordionDetails, Grid } from "@mui/material"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; -import withStyles from "@material-ui/core/styles/withStyles"; +import withStyles from "@mui/material/styles/withStyles"; import MachineCollapsedContent from "./common/MachineCollapsedContent"; import { DataLabel } from "../../../components/common"; import { useTranslation } from "react-i18next"; import { useSensitiveInfo } from "../../../hooks"; import ActionsGroup from "./common/ActionsGroup"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; const useStyles = makeStyles(() => ({ panel: { diff --git a/frontend/src/features/machines/components/MachineTableRow.js b/frontend/src/features/machines/components/MachineTableRow.js index c1e24b3..189e3af 100644 --- a/frontend/src/features/machines/components/MachineTableRow.js +++ b/frontend/src/features/machines/components/MachineTableRow.js @@ -1,8 +1,8 @@ import React from "react"; import PropTypes from "prop-types"; -import { TableCell, TableRow, IconButton, Collapse } from "@material-ui/core"; +import { TableCell, TableRow, IconButton, Collapse } from "@mui/material"; import { KeyboardArrowDown, KeyboardArrowUp } from "@mui/icons-material"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import MachineCollapsedContent from "./common/MachineCollapsedContent"; import { useSensitiveInfo } from "../../../hooks"; import ActionsGroup from "./common/ActionsGroup"; diff --git a/frontend/src/features/machines/components/MachinesListComponent.js b/frontend/src/features/machines/components/MachinesListComponent.js index 53d2522..326951e 100644 --- a/frontend/src/features/machines/components/MachinesListComponent.js +++ b/frontend/src/features/machines/components/MachinesListComponent.js @@ -1,14 +1,7 @@ import React from "react"; import PropTypes from "prop-types"; -import { - Table, - TableBody, - TableCell, - TableContainer, - TableHead, - TableRow -} from "@material-ui/core"; -import Paper from "@material-ui/core/Paper"; +import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from "@mui/material"; +import Paper from "@mui/material/Paper"; import MachineContainer from "./MachineContainer"; import { useTranslation } from "react-i18next"; import { ViewModes } from "./ViewModeSelection"; @@ -17,11 +10,7 @@ const MachinesList = ({ machines, viewMode }) => { return ( <> {machines.map(machine => ( - + ))} ); diff --git a/frontend/src/features/machines/components/ViewModeSelection.js b/frontend/src/features/machines/components/ViewModeSelection.js index f2bfa93..c656170 100644 --- a/frontend/src/features/machines/components/ViewModeSelection.js +++ b/frontend/src/features/machines/components/ViewModeSelection.js @@ -4,7 +4,7 @@ import TableChartIcon from "@mui/icons-material/TableChart"; import ViewListIcon from "@mui/icons-material/ViewList"; import ToggleButton from "@material-ui/lab/ToggleButton"; import ToggleButtonGroup from "@material-ui/lab/ToggleButtonGroup"; -import { Tooltip } from "@material-ui/core"; +import { Tooltip } from "@mui/material"; import { useTranslation } from "react-i18next"; export const ViewModes = { diff --git a/frontend/src/features/machines/components/common/ActionButton.js b/frontend/src/features/machines/components/common/ActionButton.js index 3e65812..f4a7374 100644 --- a/frontend/src/features/machines/components/common/ActionButton.js +++ b/frontend/src/features/machines/components/common/ActionButton.js @@ -1,6 +1,6 @@ import React from "react"; import PropTypes from "prop-types"; -import { IconButton, Tooltip } from "@material-ui/core"; +import { IconButton, Tooltip } from "@mui/material"; const ActionButton = React.forwardRef((props, _ref) => { const { action, machine, callback, disabled } = props; @@ -12,10 +12,7 @@ const ActionButton = React.forwardRef((props, _ref) => { }; return ( - + ({ panel: { @@ -19,11 +19,7 @@ const MachineDescription = ({ description }) => { return (
- + {"Description:"} diff --git a/frontend/src/features/machines/components/common/MachineLog.js b/frontend/src/features/machines/components/common/MachineLog.js index 53ad613..adba441 100644 --- a/frontend/src/features/machines/components/common/MachineLog.js +++ b/frontend/src/features/machines/components/common/MachineLog.js @@ -1,16 +1,13 @@ import React, { useMemo } from "react"; import PropTypes from "prop-types"; -import { Box } from "@material-ui/core"; +import { Box } from "@mui/material"; import { useSensitiveInfo } from "../../../../hooks"; import { LazyLog, ScrollFollow } from "react-lazylog"; const MachineLog = ({ logs }) => { const { maskElements } = useSensitiveInfo(); - const displayLogs = useMemo( - () => (logs.length > 0 ? maskElements(logs).join("\n") : "..."), - [logs, maskElements] - ); + const displayLogs = useMemo(() => (logs.length > 0 ? maskElements(logs).join("\n") : "..."), [logs, maskElements]); return ( diff --git a/frontend/src/features/machines/components/common/WakeComponent.js b/frontend/src/features/machines/components/common/WakeComponent.js index 49909f7..530a426 100644 --- a/frontend/src/features/machines/components/common/WakeComponent.js +++ b/frontend/src/features/machines/components/common/WakeComponent.js @@ -1,6 +1,6 @@ import React, { useState, useEffect, useCallback } from "react"; import PropTypes from "prop-types"; -import { IconButton, Tooltip } from "@material-ui/core"; +import { IconButton, Tooltip } from "@mui/material"; import { PowerSettingsNew } from "@mui/icons-material"; import { useTranslation } from "react-i18next"; import { useToast } from "../../../../hooks"; diff --git a/frontend/src/features/settings/appearance/AppearanceComponent.js b/frontend/src/features/settings/appearance/AppearanceComponent.js index 274b37e..565f9f6 100644 --- a/frontend/src/features/settings/appearance/AppearanceComponent.js +++ b/frontend/src/features/settings/appearance/AppearanceComponent.js @@ -1,9 +1,9 @@ import React from "react"; import { useApplicationTheme } from "../../../providers/ThemeProvider"; -import { Grid, Paper, FormControlLabel, Switch } from "@material-ui/core"; +import { Grid, Paper, FormControlLabel, Switch } from "@mui/material"; import LanguageContainer from "./language/LanguageContainer"; import { PaperTitle } from "components/common"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import { useTranslation } from "react-i18next"; const useStyles = makeStyles(theme => ({ @@ -29,14 +29,7 @@ const AppearanceComponent = () => { - } + control={} label="Dark mode:" labelPlacement="start" /> diff --git a/frontend/src/features/settings/appearance/language/LanguageComponent.js b/frontend/src/features/settings/appearance/language/LanguageComponent.js index 9376875..c22b3f3 100644 --- a/frontend/src/features/settings/appearance/language/LanguageComponent.js +++ b/frontend/src/features/settings/appearance/language/LanguageComponent.js @@ -1,39 +1,18 @@ import React from "react"; import PropTypes from "prop-types"; import Flag from "react-flags"; -import { IconButton, Menu, MenuItem } from "@material-ui/core"; +import { IconButton, Menu, MenuItem } from "@mui/material"; import { useTranslation } from "react-i18next"; -const LanguageComponent = ({ - languageIsSet, - anchorEl, - onMenuOpen, - onLanguageChange, - onClose, - flag, - flagsPath -}) => { +const LanguageComponent = ({ languageIsSet, anchorEl, onMenuOpen, onLanguageChange, onClose, flag, flagsPath }) => { const { t } = useTranslation(); const open = Boolean(anchorEl); return ( <> - + {languageIsSet && ( - + )} - - {t("Language.Romanian")} - - - {t("Language.English")} - + {t("Language.Romanian")} + {t("Language.English")} ); diff --git a/frontend/src/features/settings/system/CacheSettingsComponent.js b/frontend/src/features/settings/system/CacheSettingsComponent.js index 1396a2f..366725b 100644 --- a/frontend/src/features/settings/system/CacheSettingsComponent.js +++ b/frontend/src/features/settings/system/CacheSettingsComponent.js @@ -1,7 +1,7 @@ import React from "react"; import PropTypes from "prop-types"; -import { Paper, Button } from "@material-ui/core"; -import { makeStyles } from "@material-ui/core/styles"; +import { Paper, Button } from "@mui/material"; +import { makeStyles } from "@mui/material/styles"; import { useTranslation } from "react-i18next"; import { PaperTitle } from "components/common"; import { usePermissions } from "hooks"; @@ -23,12 +23,7 @@ const CacheSettingsComponent = ({ onResetCache }) => {
-
diff --git a/frontend/src/features/user/profile/card/UserProfileCardContent.js b/frontend/src/features/user/profile/card/UserProfileCardContent.js index ec501a2..3d1a6d3 100644 --- a/frontend/src/features/user/profile/card/UserProfileCardContent.js +++ b/frontend/src/features/user/profile/card/UserProfileCardContent.js @@ -2,7 +2,7 @@ import React, { useMemo } from "react"; import PropTypes from "prop-types"; import UserProfilePicture from "./UserProfilePicture"; import ContactOptions from "../contact/ContactOptions"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import styles from "../styles"; const useStyles = makeStyles(styles); @@ -11,10 +11,7 @@ const UserProfileCardContent = ({ userData }) => { const { profilePictureUrl } = userData; const classes = useStyles(); - const userName = useMemo( - () => `${userData.firstName} ${userData.lastName}`, - [userData.firstName, userData.lastName] - ); + const userName = useMemo(() => `${userData.firstName} ${userData.lastName}`, [userData.firstName, userData.lastName]); const _contactOptions = useMemo( () => profilePictureUrl diff --git a/frontend/src/features/user/profile/card/UserProfileComponent.js b/frontend/src/features/user/profile/card/UserProfileComponent.js index d9b4682..8d2d5b7 100644 --- a/frontend/src/features/user/profile/card/UserProfileComponent.js +++ b/frontend/src/features/user/profile/card/UserProfileComponent.js @@ -1,12 +1,12 @@ import React, { useMemo } from "react"; import PropTypes from "prop-types"; import { useTranslation } from "react-i18next"; -import { Card, CardHeader, CardContent } from "@material-ui/core"; +import { Card, CardHeader, CardContent } from "@mui/material"; import PageTitle from "../../../../components/common/PageTitle"; import UserProfileCardContent from "./UserProfileCardContent"; import SecurityComponent from "../security/SecurityComponent"; import styles from "../styles"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; const useStyles = makeStyles(styles); @@ -29,9 +29,7 @@ const UserProfileComponent = ({ userData }) => { return ( <> - + @@ -40,10 +38,7 @@ const UserProfileComponent = ({ userData }) => {
- +
); diff --git a/frontend/src/features/user/profile/card/UserProfilePicture.js b/frontend/src/features/user/profile/card/UserProfilePicture.js index 1c0f45c..469d40a 100644 --- a/frontend/src/features/user/profile/card/UserProfilePicture.js +++ b/frontend/src/features/user/profile/card/UserProfilePicture.js @@ -1,8 +1,8 @@ import React from "react"; import PropTypes from "prop-types"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import style from "../styles"; -import Avatar from "@material-ui/core/Avatar"; +import Avatar from "@mui/material/Avatar"; import DefaultUserProfilePicture from "../../../../assets/images/DefaultUserProfilePicture.png"; const useStyles = makeStyles(style); diff --git a/frontend/src/features/user/profile/contact/ContactOption.js b/frontend/src/features/user/profile/contact/ContactOption.js index 6f5b031..b69c71f 100644 --- a/frontend/src/features/user/profile/contact/ContactOption.js +++ b/frontend/src/features/user/profile/contact/ContactOption.js @@ -1,13 +1,6 @@ import React from "react"; import PropTypes from "prop-types"; -import { - ListItem, - ListItemText, - ListItemIcon, - Link, - Tooltip, - IconButton -} from "@material-ui/core"; +import { ListItem, ListItemText, ListItemIcon, Link, Tooltip, IconButton } from "@mui/material"; const ContactIcon = ({ onIconClick, iconTooltip, ...props }) => { if (!onIconClick) return ; diff --git a/frontend/src/features/user/profile/contact/ContactOptionList.js b/frontend/src/features/user/profile/contact/ContactOptionList.js index 17fb8b1..479991b 100644 --- a/frontend/src/features/user/profile/contact/ContactOptionList.js +++ b/frontend/src/features/user/profile/contact/ContactOptionList.js @@ -1,6 +1,6 @@ import React from "react"; import PropTypes from "prop-types"; -import { List } from "@material-ui/core"; +import { List } from "@mui/material"; import ContactOption from "./ContactOption"; const ContactOptionList = ({ options }) => { diff --git a/frontend/src/features/user/profile/contact/ContactOptions.js b/frontend/src/features/user/profile/contact/ContactOptions.js index d1849fa..ed1eb4f 100644 --- a/frontend/src/features/user/profile/contact/ContactOptions.js +++ b/frontend/src/features/user/profile/contact/ContactOptions.js @@ -1,7 +1,7 @@ import React, { useCallback, useMemo } from "react"; import PropTypes from "prop-types"; import { useTranslation } from "react-i18next"; -import { Grid } from "@material-ui/core"; +import { Grid } from "@mui/material"; import ContactOptionList from "./ContactOptionList"; import BusinessCenterIcon from "@mui/icons-material/BusinessCenter"; import EmailIcon from "@mui/icons-material/Email"; diff --git a/frontend/src/features/user/profile/security/SecurityComponent.js b/frontend/src/features/user/profile/security/SecurityComponent.js index 7755f30..7ef4414 100644 --- a/frontend/src/features/user/profile/security/SecurityComponent.js +++ b/frontend/src/features/user/profile/security/SecurityComponent.js @@ -1,8 +1,8 @@ import React from "react"; import PropTypes from "prop-types"; -import { Paper, Grid, Chip, Typography } from "@material-ui/core"; +import { Paper, Grid, Chip, Typography } from "@mui/material"; import styles from "../styles"; -import { makeStyles } from "@material-ui/core/styles"; +import { makeStyles } from "@mui/material/styles"; import { useTranslation } from "react-i18next"; const useStyles = makeStyles(styles); @@ -32,12 +32,7 @@ const SecurityComponent = ({ userGroups, userRoles }) => {
{userRoles.map(r => ( - + ))}
diff --git a/frontend/src/providers/UserPermissionsProvider.js b/frontend/src/providers/UserPermissionsProvider.js index 9d26a09..fbc29af 100644 --- a/frontend/src/providers/UserPermissionsProvider.js +++ b/frontend/src/providers/UserPermissionsProvider.js @@ -19,22 +19,14 @@ const initialState = { }; const getPermissionFlags = permissions => { - const viewDashboard = - permissions.includes(permissionCodes.VIEW_DASHBOARD) ?? false; - const manageUsers = - permissions.includes(permissionCodes.MANAGE_USERS) ?? false; - const manageSettings = - permissions.includes(permissionCodes.MANAGE_SETTINGS) ?? false; - const viewMachines = - permissions.includes(permissionCodes.VIEW_MACHINES) ?? false; - const manageMachines = - permissions.includes(permissionCodes.MANAGE_MACHINES) ?? false; - const operateMachines = - permissions.includes(permissionCodes.OPERATE_MACHINES) ?? false; - const guestAccess = - permissions.includes(permissionCodes.GUEST_ACCESS) ?? false; - const sysAdmin = - permissions.includes(permissionCodes.SYSTEM_ADMINISTRATION) ?? false; + const viewDashboard = permissions.includes(permissionCodes.VIEW_DASHBOARD) ?? false; + const manageUsers = permissions.includes(permissionCodes.MANAGE_USERS) ?? false; + const manageSettings = permissions.includes(permissionCodes.MANAGE_SETTINGS) ?? false; + const viewMachines = permissions.includes(permissionCodes.VIEW_MACHINES) ?? false; + const manageMachines = permissions.includes(permissionCodes.MANAGE_MACHINES) ?? false; + const operateMachines = permissions.includes(permissionCodes.OPERATE_MACHINES) ?? false; + const guestAccess = permissions.includes(permissionCodes.GUEST_ACCESS) ?? false; + const sysAdmin = permissions.includes(permissionCodes.SYSTEM_ADMINISTRATION) ?? false; const flags = { viewDashboard, @@ -74,11 +66,7 @@ const UserPermissionsProvider = ({ children }) => { }); }, []); - return ( - - {children} - - ); + return {children}; }; UserPermissionsProvider.propTypes = { diff --git a/frontend/src/themes/index.js b/frontend/src/themes/index.js index 07216c2..4b45ee1 100644 --- a/frontend/src/themes/index.js +++ b/frontend/src/themes/index.js @@ -1,5 +1,5 @@ import defaultTheme from "./default"; -import { createTheme } from "@material-ui/core/styles"; +import { createTheme } from "@mui/material/styles"; const overrides = { typography: {