From 991ae70af8cb584b16acd2e2d370f2ca34fe7bbf Mon Sep 17 00:00:00 2001
From: Alexander Madsen <alexander.madsen@ess.eu>
Date: Tue, 10 Oct 2023 08:07:58 +0000
Subject: [PATCH] CE-1950: Replace wrappers with RootPaper
---
src/views/IOC/IOCDetailsAccessControl.js | 6 +-
src/views/IOC/IOCDetailsView.js | 150 ++++++++++-----------
src/views/host/HostDetailsAccessControl.js | 6 +-
src/views/host/HostDetailsView.js | 5 +-
src/views/jobs/JobDetailsAccessControl.js | 6 +-
src/views/jobs/JobDetailsView.js | 6 +-
src/views/records/RecordDetailsView.js | 11 +-
7 files changed, 92 insertions(+), 98 deletions(-)
diff --git a/src/views/IOC/IOCDetailsAccessControl.js b/src/views/IOC/IOCDetailsAccessControl.js
index dfb29fa7..25a7afb3 100644
--- a/src/views/IOC/IOCDetailsAccessControl.js
+++ b/src/views/IOC/IOCDetailsAccessControl.js
@@ -1,5 +1,5 @@
import React from "react";
-import { RootContainer } from "../../components/common/Container/RootContainer";
+import { RootPaper } from "@ess-ics/ce-ui-common";
import AccessControl from "../../components/auth/AccessControl";
import { IOCDetailsContainer } from "./IOCDetailsContainer";
import { useParams } from "react-router-dom";
@@ -8,10 +8,10 @@ export function IOCDetailsAccessControl() {
const { id } = useParams();
return (
- <RootContainer>
+ <RootPaper>
<AccessControl allowedRoles={[]}>
<IOCDetailsContainer id={id} />
</AccessControl>
- </RootContainer>
+ </RootPaper>
);
}
diff --git a/src/views/IOC/IOCDetailsView.js b/src/views/IOC/IOCDetailsView.js
index f6bc0574..6fe8961a 100644
--- a/src/views/IOC/IOCDetailsView.js
+++ b/src/views/IOC/IOCDetailsView.js
@@ -1,4 +1,4 @@
-import { Grid, Paper, Tab, Tabs, IconButton } from "@mui/material";
+import { Grid, Tab, Tabs, IconButton } from "@mui/material";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import React, {
useCallback,
@@ -201,89 +201,85 @@ export function IOCDetailsView({ ioc, getIOC, loading }) {
};
return (
- <Paper>
+ <Grid
+ container
+ spacing={1}
+ >
<Grid
- container
- spacing={1}
+ item
+ xs={1}
>
- <Grid
- item
- xs={1}
- >
- <IconButton
- color="inherit"
- onClick={handleClick}
- size="large"
- >
- <ArrowBackIcon />
- </IconButton>
- </Grid>
- <Grid
- item
- xs={11}
+ <IconButton
+ color="inherit"
+ onClick={handleClick}
+ size="large"
>
- <Grid
- container
- justifyContent="center"
- >
- {ioc && (
- <CustomTabs>
- {statusTab}
- <AccessControl
- allowedRoles={[
- "DeploymentToolAdmin",
- "DeploymentToolIntegrator"
- ]}
- renderNoAccess={() => <></>}
- >
- <CustomTabs>{manageDeploymentTab}</CustomTabs>
- </AccessControl>
- <AccessControl
- allowedRoles={["DeploymentToolAdmin"]}
- renderNoAccess={() => <></>}
- >
- <CustomTabs>{iocAdminTab}</CustomTabs>
- </AccessControl>
- </CustomTabs>
- )}
- </Grid>
- </Grid>
+ <ArrowBackIcon />
+ </IconButton>
+ </Grid>
+ <Grid
+ item
+ xs={11}
+ >
<Grid
- item
- xs={12}
- style={{ paddingBottom: 0 }}
+ container
+ justifyContent="center"
>
- {deserialize(urlState.tab) === "Status" && (
- <IOCLiveStatus ioc={ioc} />
- )}
- {deserialize(urlState.tab) === "Management" && (
- <IOCManage
- ioc={ioc}
- getIOC={getIOC}
- buttonDisabled={buttonDisabled}
- currentCommand={
- ongoingCommand?.operations?.length > 0
- ? ongoingCommand.operations[0]
- : null
- }
- operations={operations?.operations}
- operationsLoading={operationsLoading || !operationsDataReady}
- getOperations={getOperations}
- setButtonDisabled={setButtonDisabledAndUpdate}
- pagination={jobPagination}
- onPage={onPage}
- />
- )}
- {deserialize(urlState.tab) === "Admin" && (
- <IOCAdmin
- ioc={ioc}
- getIOC={getIOC}
- resetTab={resetTab}
- buttonDisabled={buttonDisabled}
- />
+ {ioc && (
+ <CustomTabs>
+ {statusTab}
+ <AccessControl
+ allowedRoles={[
+ "DeploymentToolAdmin",
+ "DeploymentToolIntegrator"
+ ]}
+ renderNoAccess={() => <></>}
+ >
+ <CustomTabs>{manageDeploymentTab}</CustomTabs>
+ </AccessControl>
+ <AccessControl
+ allowedRoles={["DeploymentToolAdmin"]}
+ renderNoAccess={() => <></>}
+ >
+ <CustomTabs>{iocAdminTab}</CustomTabs>
+ </AccessControl>
+ </CustomTabs>
)}
</Grid>
</Grid>
- </Paper>
+ <Grid
+ item
+ xs={12}
+ style={{ paddingBottom: 0 }}
+ >
+ {deserialize(urlState.tab) === "Status" && <IOCLiveStatus ioc={ioc} />}
+ {deserialize(urlState.tab) === "Management" && (
+ <IOCManage
+ ioc={ioc}
+ getIOC={getIOC}
+ buttonDisabled={buttonDisabled}
+ currentCommand={
+ ongoingCommand?.operations?.length > 0
+ ? ongoingCommand.operations[0]
+ : null
+ }
+ operations={operations?.operations}
+ operationsLoading={operationsLoading || !operationsDataReady}
+ getOperations={getOperations}
+ setButtonDisabled={setButtonDisabledAndUpdate}
+ pagination={jobPagination}
+ onPage={onPage}
+ />
+ )}
+ {deserialize(urlState.tab) === "Admin" && (
+ <IOCAdmin
+ ioc={ioc}
+ getIOC={getIOC}
+ resetTab={resetTab}
+ buttonDisabled={buttonDisabled}
+ />
+ )}
+ </Grid>
+ </Grid>
);
}
diff --git a/src/views/host/HostDetailsAccessControl.js b/src/views/host/HostDetailsAccessControl.js
index bac49ecd..06d7b011 100644
--- a/src/views/host/HostDetailsAccessControl.js
+++ b/src/views/host/HostDetailsAccessControl.js
@@ -1,5 +1,5 @@
import React from "react";
-import { RootContainer } from "../../components/common/Container/RootContainer";
+import { RootPaper } from "@ess-ics/ce-ui-common";
import AccessControl from "../../components/auth/AccessControl";
import { HostDetailsContainer } from "./HostDetailsContainer";
import { useParams } from "react-router-dom";
@@ -8,10 +8,10 @@ export function HostDetailsAccessControl() {
const { id } = useParams();
return (
- <RootContainer data-testid="host-details-container">
+ <RootPaper data-testid="host-details-container">
<AccessControl allowedRoles={[]}>
<HostDetailsContainer id={id} />
</AccessControl>
- </RootContainer>
+ </RootPaper>
);
}
diff --git a/src/views/host/HostDetailsView.js b/src/views/host/HostDetailsView.js
index fff663eb..d82ac468 100644
--- a/src/views/host/HostDetailsView.js
+++ b/src/views/host/HostDetailsView.js
@@ -15,7 +15,6 @@ import {
KeyValueTable,
SimpleAccordion,
GlobalAppBarContext,
- RootPaper,
useAPIMethod
} from "@ess-ics/ce-ui-common";
import { LokiPanel } from "../../components/common/Loki/LokiPanel";
@@ -180,7 +179,7 @@ export function HostDetailsView({ id, host }) {
};
return (
- <RootPaper>
+ <>
<IconButton
color="inherit"
onClick={handleClick}
@@ -286,6 +285,6 @@ export function HostDetailsView({ id, host }) {
</Container>
</CardContent>
</Card>
- </RootPaper>
+ </>
);
}
diff --git a/src/views/jobs/JobDetailsAccessControl.js b/src/views/jobs/JobDetailsAccessControl.js
index a493d238..43ff283c 100644
--- a/src/views/jobs/JobDetailsAccessControl.js
+++ b/src/views/jobs/JobDetailsAccessControl.js
@@ -1,5 +1,5 @@
import React from "react";
-import { RootContainer } from "../../components/common/Container/RootContainer";
+import { RootPaper } from "@ess-ics/ce-ui-common";
import AccessControl from "../../components/auth/AccessControl";
import { JobDetailsContainer } from "./JobDetailsContainer";
import { useParams } from "react-router-dom";
@@ -8,10 +8,10 @@ export function JobDetailsAccessControl() {
const { id } = useParams();
return (
- <RootContainer>
+ <RootPaper>
<AccessControl allowedRoles={[]}>
<JobDetailsContainer id={id} />
</AccessControl>
- </RootContainer>
+ </RootPaper>
);
}
diff --git a/src/views/jobs/JobDetailsView.js b/src/views/jobs/JobDetailsView.js
index 9c41845f..658783a9 100644
--- a/src/views/jobs/JobDetailsView.js
+++ b/src/views/jobs/JobDetailsView.js
@@ -1,5 +1,5 @@
import React, { useContext, useEffect } from "react";
-import { IconButton, Paper } from "@mui/material";
+import { IconButton } from "@mui/material";
import { JobDetails } from "../../components/Job/JobDetails";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import { useNavigate } from "react-router-dom";
@@ -22,7 +22,7 @@ export function JobDetailsView({ operation, job }) {
);
return (
- <Paper>
+ <>
<IconButton
color="inherit"
onClick={handleClick}
@@ -36,6 +36,6 @@ export function JobDetailsView({ operation, job }) {
job={job}
/>
)}
- </Paper>
+ </>
);
}
diff --git a/src/views/records/RecordDetailsView.js b/src/views/records/RecordDetailsView.js
index 8eca4382..b625d00c 100644
--- a/src/views/records/RecordDetailsView.js
+++ b/src/views/records/RecordDetailsView.js
@@ -6,16 +6,15 @@ import React, {
useMemo
} from "react";
import {
- Paper,
IconButton,
Typography,
LinearProgress,
Link as MuiLink
} from "@mui/material";
import { Link as ReactRouterLink } from "react-router-dom";
-import { RootContainer } from "../../components/common/Container/RootContainer";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import {
+ RootPaper,
KeyValueTable,
SimpleAccordion,
GlobalAppBarContext
@@ -138,13 +137,13 @@ export function RecordDetailsView() {
}, []);
return (
- <RootContainer>
+ <RootPaper>
{error ? (
<NotFoundView />
) : recordLoading || !dataReady ? (
<LinearProgress color="primary" />
) : (
- <Paper>
+ <>
<IconButton
color="inherit"
onClick={handleClick}
@@ -165,8 +164,8 @@ export function RecordDetailsView() {
/>
</SimpleAccordion>
)}
- </Paper>
+ </>
)}
- </RootContainer>
+ </RootPaper>
);
}
--
GitLab