From 7e02aa05ece6d908ea3a9de351415a88bdf456f0 Mon Sep 17 00:00:00 2001
From: Alexander Madsen <alexander.madsen@ess.eu>
Date: Fri, 13 Oct 2023 15:23:22 +0000
Subject: [PATCH] CE-2042: Use AlertBanner from common
---
.../IOC/AlertMessages/AlertMessages.js | 46 -------------------
src/components/IOC/AlertMessages/index.js | 4 --
src/components/IOC/IOCDetails/IOCDetails.js | 42 ++++++++++-------
src/components/IOC/IOCIcons/IOCIcons.js | 4 +-
.../IOC/IOCLiveStatus/IOCLiveStatus.js | 4 +-
src/components/IOC/IOCManage/IOCManage.js | 6 +--
src/components/Job/JobDetails.js | 13 ++++--
src/views/host/HostDetailsView.js | 6 +--
8 files changed, 43 insertions(+), 82 deletions(-)
delete mode 100644 src/components/IOC/AlertMessages/AlertMessages.js
delete mode 100644 src/components/IOC/AlertMessages/index.js
diff --git a/src/components/IOC/AlertMessages/AlertMessages.js b/src/components/IOC/AlertMessages/AlertMessages.js
deleted file mode 100644
index e99dd3af..00000000
--- a/src/components/IOC/AlertMessages/AlertMessages.js
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react";
-import { Button, Grid } from "@mui/material";
-import Alert from "@mui/material/Alert";
-
-export default function AlertMessages({ alerts }) {
- function determineSeverity(alarmType) {
- return ["error", "warning", "success"].includes(alarmType?.toLowerCase())
- ? alarmType?.toLowerCase()
- : "info";
- }
-
- return (
- <Grid
- id="ioc-alerts"
- container
- spacing={1}
- direction="column"
- >
- {alerts?.map((alert) => (
- <Grid
- item
- key={alert?.message || alert}
- >
- <Alert
- severity={determineSeverity(alert?.type)}
- action={
- alert?.link && (
- <Button
- target="_blank"
- href={alert.link}
- color="inherit"
- size="small"
- >
- More Info
- </Button>
- )
- }
- component="p"
- >
- {alert?.message}
- </Alert>
- </Grid>
- ))}
- </Grid>
- );
-}
diff --git a/src/components/IOC/AlertMessages/index.js b/src/components/IOC/AlertMessages/index.js
deleted file mode 100644
index 67da3975..00000000
--- a/src/components/IOC/AlertMessages/index.js
+++ /dev/null
@@ -1,4 +0,0 @@
-import AlertMessages from "./AlertMessages";
-
-export { AlertMessages };
-export default AlertMessages;
diff --git a/src/components/IOC/IOCDetails/IOCDetails.js b/src/components/IOC/IOCDetails/IOCDetails.js
index eda7ad2e..769591b0 100644
--- a/src/components/IOC/IOCDetails/IOCDetails.js
+++ b/src/components/IOC/IOCDetails/IOCDetails.js
@@ -31,7 +31,10 @@ export function IOCDetails({ ioc, getSubset = defaultSubset, alert, buttons }) {
return (
<>
- <Grid container>
+ <Grid
+ container
+ spacing={1}
+ >
{alert && (
<Grid
item
@@ -40,24 +43,29 @@ export function IOCDetails({ ioc, getSubset = defaultSubset, alert, buttons }) {
{alert}
</Grid>
)}
- <Grid
- item
- xs={12}
- >
- <Box
- display="flex"
- flexDirection="row-reverse"
- p={2}
- m={1}
+ {buttons && (
+ <Grid
+ item
+ xs={12}
>
- <AccessControl
- allowedRoles={["DeploymentToolAdmin", "DeploymentToolIntegrator"]}
- renderNoAccess={() => <> </>}
+ <Box
+ display="flex"
+ flexDirection="row-reverse"
+ p={2}
+ m={1}
>
- <>{buttons}</>
- </AccessControl>
- </Box>
- </Grid>
+ <AccessControl
+ allowedRoles={[
+ "DeploymentToolAdmin",
+ "DeploymentToolIntegrator"
+ ]}
+ renderNoAccess={() => <> </>}
+ >
+ <>{buttons}</>
+ </AccessControl>
+ </Box>
+ </Grid>
+ )}
<Grid
item
xs={12}
diff --git a/src/components/IOC/IOCIcons/IOCIcons.js b/src/components/IOC/IOCIcons/IOCIcons.js
index 95d52e15..f029ec56 100644
--- a/src/components/IOC/IOCIcons/IOCIcons.js
+++ b/src/components/IOC/IOCIcons/IOCIcons.js
@@ -11,7 +11,7 @@ import {
PauseCircleFilled
} from "@mui/icons-material";
import Popover from "../../common/Popover";
-import AlertMessages from "../AlertMessages/AlertMessages";
+import { AlertBannerList } from "@ess-ics/ce-ui-common";
function AlertMessagesPopoverContents({ title, alerts }) {
// for now filter out links on alerts due to issues with
@@ -31,7 +31,7 @@ function AlertMessagesPopoverContents({ title, alerts }) {
{title}
</Typography>
{alertsWithoutLinks.length > 0 ? (
- <AlertMessages alerts={alertsWithoutLinks} />
+ <AlertBannerList alerts={alertsWithoutLinks} />
) : null}
</div>
);
diff --git a/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js b/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js
index 85be7b35..848b1eb8 100644
--- a/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js
+++ b/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js
@@ -6,7 +6,7 @@ import { Link as ReactRouterLink } from "react-router-dom";
import { LokiContainer } from "../../common/Loki/LokiContainer";
import { RecordSearch } from "../../records/RecordSearch";
import GitRefLink from "../GitRefLink";
-import AlertMessages from "../AlertMessages";
+import { AlertBannerList } from "@ess-ics/ce-ui-common";
import AccessControl from "../../auth/AccessControl";
import { IocActiveDeployment } from "../../../api/DataTypes";
import useUrlState from "@ahooksjs/use-url-state";
@@ -83,7 +83,7 @@ export function IOCLiveStatus({ ioc }) {
<IOCDetails
ioc={liveIOC}
getSubset={getSubset}
- alert={<AlertMessages alerts={liveIOC.alerts} />}
+ alert={<AlertBannerList alerts={liveIOC.alerts} />}
/>
{liveIOC.activeDeployment?.host?.csEntryIdValid && (
<AccessControl
diff --git a/src/components/IOC/IOCManage/IOCManage.js b/src/components/IOC/IOCManage/IOCManage.js
index d2b8f3f7..8e3835ff 100644
--- a/src/components/IOC/IOCManage/IOCManage.js
+++ b/src/components/IOC/IOCManage/IOCManage.js
@@ -12,9 +12,9 @@ import { UndeployIOC } from "../UndeployIOC";
import {
userContext,
SimpleAccordion,
- useAPIMethod
+ useAPIMethod,
+ AlertBannerList
} from "@ess-ics/ce-ui-common";
-import AlertMessages from "../AlertMessages";
import AccessControl from "../../auth/AccessControl";
import { DeploymentStatus } from "../../../api/DataTypes";
import { IOCService } from "../IOCService";
@@ -181,7 +181,7 @@ export function IOCManage({
<IOCDetails
ioc={managedIOC}
getSubset={getSubset}
- alert={<AlertMessages alerts={managedIOC.alerts} />}
+ alert={<AlertBannerList alerts={managedIOC.alerts} />}
buttons={
<>
<Tooltip title={disabledDebployButtonTitle}>
diff --git a/src/components/Job/JobDetails.js b/src/components/Job/JobDetails.js
index 628cbb05..082188c2 100644
--- a/src/components/Job/JobDetails.js
+++ b/src/components/Job/JobDetails.js
@@ -7,8 +7,12 @@ import {
Container,
Link as MuiLink
} from "@mui/material";
-import { KeyValueTable, SimpleAccordion } from "@ess-ics/ce-ui-common";
-import { Stepper } from "@ess-ics/ce-ui-common";
+import {
+ KeyValueTable,
+ SimpleAccordion,
+ AlertBannerList,
+ Stepper
+} from "@ess-ics/ce-ui-common";
import { JobBadge } from "./JobBadge";
import { DeploymentJobOutput } from "../deployments/DeploymentJobOutput";
import { Link as ReactRouterLink } from "react-router-dom";
@@ -16,7 +20,6 @@ import { formatDate } from "../common/Helper";
import GitRefLink from "../IOC/GitRefLink";
import AccessControl from "../auth/AccessControl";
import { AWXJobDetails } from "../../api/DataTypes";
-import AlertMessages from "../IOC/AlertMessages";
const STATUS = {
queued: {
@@ -147,7 +150,7 @@ export function JobDetails({ operation, job }) {
item
xs={12}
>
- <AlertMessages alerts={[alert].concat(jobAlert)} />
+ <AlertBannerList alerts={[alert].concat(jobAlert)} />
</Grid>
)}
<Grid
@@ -191,7 +194,7 @@ export function JobDetails({ operation, job }) {
item
xs={12}
>
- <AlertMessages alerts={[alert]} />
+ <AlertBannerList alerts={[alert]} />
</Grid>
)}
<AccessControl
diff --git a/src/views/host/HostDetailsView.js b/src/views/host/HostDetailsView.js
index d82ac468..3a85bad6 100644
--- a/src/views/host/HostDetailsView.js
+++ b/src/views/host/HostDetailsView.js
@@ -15,7 +15,8 @@ import {
KeyValueTable,
SimpleAccordion,
GlobalAppBarContext,
- useAPIMethod
+ useAPIMethod,
+ AlertBannerList
} from "@ess-ics/ce-ui-common";
import { LokiPanel } from "../../components/common/Loki/LokiPanel";
import { useNavigate, Link as ReactRouterLink } from "react-router-dom";
@@ -24,7 +25,6 @@ import {
initRequestParams
} from "../../components/common/Helper";
import AccessControl from "../../components/auth/AccessControl";
-import AlertMessages from "../../components/IOC/AlertMessages";
import useUrlState from "@ahooksjs/use-url-state";
import {
serialize,
@@ -188,7 +188,7 @@ export function HostDetailsView({ id, host }) {
<ArrowBackIcon />
</IconButton>
- {host && <AlertMessages alerts={host.alerts} />}
+ {host && <AlertBannerList alerts={host.alerts} />}
<Card
variant="outlined"
sx={{ marginTop: 2 }}
--
GitLab