15497092546

Committed 06 Jun 2025 06:19PM UTC coverage: 65.179% (+2.5%) from 62.708%

Build # 15497092546

Build Type

push

github

Committed by

web-flow

Commit Message

Merge pull request #726 from CBIIT/CRDCDH-2817

CRDCDH-2817 Vite/Vitest Migration & Upgrade dependencies

Run Details

3529 of 3882 branches covered (90.91%)

Branch coverage included in aggregate %.

167 of 224 new or added lines in 82 files covered. (74.55%)

7620 existing lines in 126 files now uncovered.

22012 of 35304 relevant lines covered (62.35%)

101.98 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

98.4

/src/components/SystemUseWarningOverlay/OverlayWindow.tsx

import React, { useEffect, useState } from "react";
import {
  Dialog,
  DialogContent,
  DialogContentText,
  Button,
  DialogTitle,
  Divider,
  List,
  ListItem,
  ListItemText,
  ListItemIcon,
  DialogActions,
} from "@mui/material";
import FiberManualRecordIcon from "@mui/icons-material/FiberManualRecord";
import { ThemeProvider, createTheme } from "@mui/material/styles";
import text from "./OverlayText";

const theme = createTheme({
  components: {
    MuiDialog: {
      styleOverrides: {
        paper: {
          width: "770px",
          height: "620px",
          borderRadius: "5px !important",
          backgroundColor: "#ffffff !important",
          padding: "0px 20px 0px 20px !important",
        },
      },
    },
    MuiTypography: {
      styleOverrides: {
        root: {
          fontSize: "14px !important",
          color: "#000000",
        },
      },
    },
    MuiDialogTitle: {
      styleOverrides: {
        root: {
          padding: "15px 15px 15px 0 !important",
          fontSize: "22px !important",
        },
      },
    },
    MuiDialogContent: {
      styleOverrides: {
        root: {
          color: "#000045",
          "& p": {
            fontSize: "14px",
            margin: "0px 0px 10px !important",
          },
          padding: "20px 0px 0px 0px !important",
          "& ul": {
            marginTop: "0px",
            paddingTop: "0px",
          },
        },
      },
    },
    MuiButton: {
      styleOverrides: {
        root: {
          width: "133px",
          height: "35px",
          backgroundColor: "#337ab7 !important",
          color: "#fff",
          textTransform: "capitalize !important" as "capitalize",
          boxShadow: "none !important",
          "&:hover": {
            backgroundColor: "#2e6da4 !important",
          },
        },
      },
    },
    MuiList: {
      styleOverrides: {
        root: {
          marginTop: "-15px !important",
          fontSize: "14px",
        },
        padding: {
          paddingTop: "0px !important",
        },
      },
    },
    MuiListItem: {
      styleOverrides: {
        root: {
          fontSize: "14px",
          padding: "2px 0px 0px 25px !important",
        },
        gutters: {
          paddingTop: "4px",
          paddingRight: "8px",
          paddingBottom: "4px",
          paddingLeft: "35px",
        },
      },
    },
    MuiListItemIcon: {
      styleOverrides: {
        root: {
          marginBottom: "auto",
          fontSize: "12px",
          color: "black",
          width: "10px",
          minWidth: "2px",
          paddingTop: "10px",
          marginRight: "4px",
        },
      },
    },
    MuiDialogContentText: {
      styleOverrides: {
        root: {
          color: "#000000",
          marginBottom: "10px",
          "& p.lastChild": {
            marginBottom: "0px",
          },
        },
      },
    },
    MuiBackdrop: {
      styleOverrides: {
        root: {
          backgroundColor: "#00000047",
        },
      },
    },
    MuiDialogActions: {
      styleOverrides: {
        root: {
          height: "75px",
          justifyContent: "right !important",
          padding: "30px 10px 25px 0px !important",
        },
      },
    },
  },
});

const OverlayWindow = () => {
  const [open, setOpen] = useState(false);

  const handleClose = () => {
    setOpen(false);
    sessionStorage.setItem("overlayLoad", "true");
  };

  useEffect(() => {
    if (!sessionStorage.length) {
      setOpen(true);
    }
  }, [open]);

  const content = text.content.map((item, index) => {
    const textKey = `key_${index}`;
    return (
      <DialogContentText key={textKey} id="alert-dialog-description">
        {item}
      </DialogContentText>
    );
  });
  const list = text.list.map((item, index) => {
    const listKey = `key_${index}`;
    return (
      <ListItem key={listKey}>
        <ListItemIcon>
          <FiberManualRecordIcon style={{ fontSize: 8 }} />
        </ListItemIcon>
        <ListItemText>{item}</ListItemText>
      </ListItem>
    );
  });

  return (
    <ThemeProvider theme={theme}>
      <Dialog
        open={open}
        aria-labelledby="alert-dialog-title"
        aria-describedby="alert-dialog-description"
        data-testid="system-use-warning-dialog"
        maxWidth="md"
      >
        <DialogTitle id="alert-dialog-title">Warning</DialogTitle>
        <Divider />
        <DialogContent>
          {content}
          <List>{list}</List>
        </DialogContent>
        <Divider />
        <DialogActions>
          <Button onClick={handleClose} variant="contained">
            Continue
          </Button>
        </DialogActions>
      </Dialog>
    </ThemeProvider>
  );
};

export default OverlayWindow;

1	import React, { useEffect, useState } from "react";	1✔
2	import {	1✔
3	Dialog,
4	DialogContent,
5	DialogContentText,
6	Button,
7	DialogTitle,
8	Divider,
9	List,
10	ListItem,
11	ListItemText,
12	ListItemIcon,
13	DialogActions,
14	} from "@mui/material";
15	import FiberManualRecordIcon from "@mui/icons-material/FiberManualRecord";	1✔
16	import { ThemeProvider, createTheme } from "@mui/material/styles";	1✔
17	import text from "./OverlayText";	1✔
18
19	const theme = createTheme({	1✔
20	components: {	1✔
21	MuiDialog: {	1✔
22	styleOverrides: {	1✔
23	paper: {	1✔
24	width: "770px",	1✔
25	height: "620px",	1✔
26	borderRadius: "5px !important",	1✔
27	backgroundColor: "#ffffff !important",	1✔
28	padding: "0px 20px 0px 20px !important",	1✔
29	},	1✔
30	},	1✔
31	},	1✔
32	MuiTypography: {	1✔
33	styleOverrides: {	1✔
34	root: {	1✔
35	fontSize: "14px !important",	1✔
36	color: "#000000",	1✔
37	},	1✔
38	},	1✔
39	},	1✔
40	MuiDialogTitle: {	1✔
41	styleOverrides: {	1✔
42	root: {	1✔
43	padding: "15px 15px 15px 0 !important",	1✔
44	fontSize: "22px !important",	1✔
45	},	1✔
46	},	1✔
47	},	1✔
48	MuiDialogContent: {	1✔
49	styleOverrides: {	1✔
50	root: {	1✔
51	color: "#000045",	1✔
52	"& p": {	1✔
53	fontSize: "14px",	1✔
54	margin: "0px 0px 10px !important",	1✔
55	},	1✔
56	padding: "20px 0px 0px 0px !important",	1✔
57	"& ul": {	1✔
58	marginTop: "0px",	1✔
59	paddingTop: "0px",	1✔
60	},	1✔
61	},	1✔
62	},	1✔
63	},	1✔
64	MuiButton: {	1✔
65	styleOverrides: {	1✔
66	root: {	1✔
67	width: "133px",	1✔
68	height: "35px",	1✔
69	backgroundColor: "#337ab7 !important",	1✔
70	color: "#fff",	1✔
71	textTransform: "capitalize !important" as "capitalize",	1✔
72	boxShadow: "none !important",	1✔
73	"&:hover": {	1✔
74	backgroundColor: "#2e6da4 !important",	1✔
75	},	1✔
76	},	1✔
77	},	1✔
78	},	1✔
79	MuiList: {	1✔
80	styleOverrides: {	1✔
81	root: {	1✔
82	marginTop: "-15px !important",	1✔
83	fontSize: "14px",	1✔
84	},	1✔
85	padding: {	1✔
86	paddingTop: "0px !important",	1✔
87	},	1✔
88	},	1✔
89	},	1✔
90	MuiListItem: {	1✔
91	styleOverrides: {	1✔
92	root: {	1✔
93	fontSize: "14px",	1✔
94	padding: "2px 0px 0px 25px !important",	1✔
95	},	1✔
96	gutters: {	1✔
97	paddingTop: "4px",	1✔
98	paddingRight: "8px",	1✔
99	paddingBottom: "4px",	1✔
100	paddingLeft: "35px",	1✔
101	},	1✔
102	},	1✔
103	},	1✔
104	MuiListItemIcon: {	1✔
105	styleOverrides: {	1✔
106	root: {	1✔
107	marginBottom: "auto",	1✔
108	fontSize: "12px",	1✔
109	color: "black",	1✔
110	width: "10px",	1✔
111	minWidth: "2px",	1✔
112	paddingTop: "10px",	1✔
113	marginRight: "4px",	1✔
114	},	1✔
115	},	1✔
116	},	1✔
117	MuiDialogContentText: {	1✔
118	styleOverrides: {	1✔
119	root: {	1✔
120	color: "#000000",	1✔
121	marginBottom: "10px",	1✔
122	"& p.lastChild": {	1✔
123	marginBottom: "0px",	1✔
124	},	1✔
125	},	1✔
126	},	1✔
127	},	1✔
128	MuiBackdrop: {	1✔
129	styleOverrides: {	1✔
130	root: {	1✔
131	backgroundColor: "#00000047",	1✔
132	},	1✔
133	},	1✔
134	},	1✔
135	MuiDialogActions: {	1✔
136	styleOverrides: {	1✔
137	root: {	1✔
138	height: "75px",	1✔
139	justifyContent: "right !important",	1✔
140	padding: "30px 10px 25px 0px !important",	1✔
141	},	1✔
142	},	1✔
143	},	1✔
144	},	1✔
145	});	1✔
146
147	const OverlayWindow = () => {	1✔
148	const [open, setOpen] = useState(false);	3✔
149
150	const handleClose = () => {	3✔
151	setOpen(false);	×
152	sessionStorage.setItem("overlayLoad", "true");	×
UNCOV 153	};	×
154
155	useEffect(() => {	3✔
156	if (!sessionStorage.length) {	2✔
157	setOpen(true);	2✔
158	}	2✔
159	}, [open]);	3✔
160
161	const content = text.content.map((item, index) => {	3✔
162	const textKey = `key_${index}`;	15✔
163	return (	15✔
164	<DialogContentText key={textKey} id="alert-dialog-description">	15✔
165	{item}	15✔
166	</DialogContentText>	15✔
167	);
168	});	3✔
169	const list = text.list.map((item, index) => {	3✔
170	const listKey = `key_${index}`;	6✔
171	return (	6✔
172	<ListItem key={listKey}>	6✔
173	<ListItemIcon>	6✔
174	<FiberManualRecordIcon style={{ fontSize: 8 }} />	6✔
175	</ListItemIcon>	6✔
176	<ListItemText>{item}</ListItemText>	6✔
177	</ListItem>	6✔
178	);
179	});	3✔
180
181	return (	3✔
182	<ThemeProvider theme={theme}>	3✔
183	<Dialog	3✔
184	open={open}	3✔
185	aria-labelledby="alert-dialog-title"	3✔
186	aria-describedby="alert-dialog-description"	3✔
187	data-testid="system-use-warning-dialog"	3✔
188	maxWidth="md"	3✔
189	>
190	<DialogTitle id="alert-dialog-title">Warning</DialogTitle>	3✔
191	<Divider />	3✔
192	<DialogContent>	3✔
193	{content}	3✔
194	<List>{list}</List>	3✔
195	</DialogContent>	3✔
196	<Divider />	3✔
197	<DialogActions>	3✔
198	<Button onClick={handleClose} variant="contained">	3✔
199	Continue
200	</Button>	3✔
201	</DialogActions>	3✔
202	</Dialog>	3✔
203	</ThemeProvider>	3✔
204	);
205	};	3✔
206
207	export default OverlayWindow;	1✔

CBIIT / crdc-datahub-ui / 15497092546

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous