Skip to content

Commit 7add252

Browse files
authored
Update dependencies 2 (#325)
fixes
1 parent 7f62092 commit 7add252

25 files changed

+533
-352
lines changed

package-lock.json

Lines changed: 306 additions & 23 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,14 @@
1414
"@fontsource/roboto": "^5.0.5",
1515
"@mui/icons-material": "^5.14.0",
1616
"@mui/material": "^5.14.0",
17+
"@mui/styles": "^5.14.4",
1718
"@mui/x-data-grid": "^6.10.0",
1819
"@testing-library/jest-dom": "^5.16.5",
1920
"@testing-library/react": "^12.1.5",
2021
"@testing-library/user-event": "^12.8.3",
2122
"file-saver": "^2.0.5",
2223
"jszip": "^3.10.1",
23-
"konva": "^8.4.3",
24+
"konva": "^7.2.5",
2425
"material-ui-popup-state": "^5.0.9",
2526
"notistack": "^3.0.1",
2627
"qs": "^6.11.2",

src/components/BaseModal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export const BaseModal: React.FunctionComponent<IProps> = ({
3838
<Button onClick={onCancel} color="primary">
3939
Cancel
4040
</Button>
41-
<Button type="submit" color="primary" data-testId="submitButton">
41+
<Button type="submit" color="primary" data-testid="submitButton">
4242
{submitButtonText}
4343
</Button>
4444
</DialogActions>

src/components/BuildList/index.tsx

Lines changed: 20 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { FunctionComponent } from "react";
2-
import { styled } from "@mui/material/styles";
2+
import { makeStyles, createStyles } from '@mui/styles';
33
import {
44
List,
55
ListItemButton,
@@ -34,33 +34,25 @@ import { useNavigate } from "react-router";
3434
import { buildTestRunLocation } from "../../_helpers/route.helpers";
3535
import { Tooltip } from "../Tooltip";
3636

37-
const PREFIX = "index";
38-
39-
const classes = {
40-
listContainer: `${PREFIX}-listContainer`,
41-
listItemSecondaryAction: `${PREFIX}-listItemSecondaryAction`,
42-
listItem: `${PREFIX}-listItem`,
43-
};
44-
45-
// TODO jss-to-styled codemod: The Fragment root was replaced by div. Change the tag if needed.
46-
const Root = styled("div")(() => ({
47-
[`& .${classes.listContainer}`]: {
48-
height: "100%",
49-
overflow: "auto",
50-
},
51-
52-
[`& .${classes.listItemSecondaryAction}`]: {
53-
visibility: "hidden",
54-
},
55-
56-
[`& .${classes.listItem}`]: {
57-
"&:hover $listItemSecondaryAction": {
58-
visibility: "inherit",
37+
const useStyles = makeStyles(() =>
38+
createStyles({
39+
listContainer: {
40+
height: "100%",
41+
overflow: "auto",
42+
},
43+
listItemSecondaryAction: {
44+
visibility: "hidden",
45+
},
46+
listItem: {
47+
"&:hover $listItemSecondaryAction": {
48+
visibility: "inherit",
49+
},
5950
},
60-
},
61-
}));
51+
}),
52+
);
6253

6354
const BuildList: FunctionComponent = () => {
55+
const classes = useStyles();
6456
const navigate = useNavigate();
6557
const { buildList, selectedBuild, loading, total, take } = useBuildState();
6658
const buildDispatch = useBuildDispatch();
@@ -124,7 +116,7 @@ const BuildList: FunctionComponent = () => {
124116
}, [handlePaginationChange]);
125117

126118
return (
127-
<Root>
119+
<>
128120
<Box height="91%" overflow="auto">
129121
<List>
130122
{loading ? (
@@ -263,7 +255,7 @@ const BuildList: FunctionComponent = () => {
263255
inputProps={{
264256
onChange: (event: React.ChangeEvent<HTMLInputElement>) =>
265257
setNewCiBuildId(event.target.value),
266-
"data-testId": "newCiBuildId",
258+
"data-testid": "newCiBuildId",
267259
}}
268260
/>
269261
</React.Fragment>
@@ -322,7 +314,7 @@ const BuildList: FunctionComponent = () => {
322314
}}
323315
/>
324316
)}
325-
</Root>
317+
</>
326318
);
327319
};
328320

src/components/CommentsPopper.tsx

Lines changed: 10 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,22 @@
11
import React from "react";
2-
import { styled } from "@mui/material/styles";
3-
import { Button, Popper, Fade, Paper, TextField, Badge } from "@mui/material";
2+
import { makeStyles } from '@mui/styles';
3+
import { Button, Popper, Fade, Paper, TextField, Badge, type Theme } from "@mui/material";
44
import {
55
usePopupState,
66
bindToggle,
77
bindPopper,
88
} from "material-ui-popup-state/hooks";
99

10-
const PREFIX = "CommentsPopper";
11-
12-
const classes = {
13-
popperContainer: `${PREFIX}-popperContainer`,
14-
contentContainer: `${PREFIX}-contentContainer`,
15-
};
16-
17-
// TODO jss-to-styled codemod: The Fragment root was replaced by div. Change the tag if needed.
18-
const Root = styled("div")(({ theme }) => ({
19-
[`& .${classes.popperContainer}`]: {
10+
const useStyles = makeStyles((theme: Theme) => ({
11+
popperContainer: {
2012
zIndex: 1400,
2113
},
22-
23-
[`& .${classes.contentContainer}`]: {
14+
contentContainer: {
2415
padding: theme.spacing(2),
2516
},
2617
}));
2718

19+
2820
interface IProps {
2921
text: string | undefined;
3022
onSave: (comment: string) => Promise<void | string | number>;
@@ -34,6 +26,7 @@ export const CommentsPopper: React.FunctionComponent<IProps> = ({
3426
text,
3527
onSave,
3628
}) => {
29+
const classes = useStyles();
3730
const popupState = usePopupState({
3831
variant: "popper",
3932
popupId: "commentPopper",
@@ -44,7 +37,7 @@ export const CommentsPopper: React.FunctionComponent<IProps> = ({
4437
React.useEffect(() => setComment(text || ""), [text]);
4538

4639
return (
47-
<Root>
40+
<>
4841
<Badge
4942
color="secondary"
5043
variant="dot"
@@ -82,11 +75,10 @@ export const CommentsPopper: React.FunctionComponent<IProps> = ({
8275
setComment(event.target.value)
8376
}
8477
inputProps={{
85-
"data-testId": "comment",
78+
"data-testid": "comment",
8679
}}
8780
/>
8881
<Button
89-
variant="outlined"
9082
onClick={() => {
9183
onSave(comment).then(() => popupState.close());
9284
}}
@@ -98,6 +90,6 @@ export const CommentsPopper: React.FunctionComponent<IProps> = ({
9890
</Fade>
9991
)}
10092
</Popper>
101-
</Root>
93+
</>
10294
);
10395
};

src/components/Filters.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,7 @@ const Filters: React.FunctionComponent<IProps> = ({
8686
<Grid container spacing={2} alignItems="flex-end">
8787
<Grid item xs>
8888
<DebounceInput
89+
variant="standard"
8990
fullWidth
9091
label="Name"
9192
value={query}

src/components/Header.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -149,7 +149,7 @@ const Header: FunctionComponent = () => {
149149
handleMenuClose();
150150
logout(authDispatch);
151151
}}
152-
data-testId="logoutBtn"
152+
data-testid="logoutBtn"
153153
>
154154
<IconButton size="small">
155155
<SettingsPower />

src/components/LoginForm.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ const LoginForm = () => {
5858
inputProps={{
5959
onChange: (event: React.ChangeEvent<HTMLInputElement>) =>
6060
setEmail(event.target.value),
61-
"data-testId": "email",
61+
"data-testid": "email",
6262
}}
6363
/>
6464
</Grid>
@@ -78,7 +78,7 @@ const LoginForm = () => {
7878
inputProps={{
7979
onChange: (event: React.ChangeEvent<HTMLInputElement>) =>
8080
setPassword(event.target.value),
81-
"data-testId": "password",
81+
"data-testid": "password",
8282
}}
8383
/>
8484
</Grid>
@@ -96,7 +96,7 @@ const LoginForm = () => {
9696
type="submit"
9797
color="primary"
9898
variant="outlined"
99-
data-testId="loginBtn"
99+
data-testid="loginBtn"
100100
>
101101
Login
102102
</Button>

src/components/ProjectSelect.tsx

Lines changed: 15 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
import React, { FunctionComponent } from "react";
2-
import { styled } from "@mui/material/styles";
2+
import { makeStyles, createStyles } from '@mui/styles';
33
import {
44
FormControl,
55
InputLabel,
66
MenuItem,
77
Select,
8+
type Theme,
89
type SelectChangeEvent,
910
} from "@mui/material";
1011
import {
@@ -13,28 +14,22 @@ import {
1314
selectProject,
1415
} from "../contexts";
1516

16-
const PREFIX = "ProjectSelect";
17-
18-
const classes = {
19-
formControl: `${PREFIX}-formControl`,
20-
input: `${PREFIX}-input`,
21-
};
22-
23-
// TODO jss-to-styled codemod: The Fragment root was replaced by div. Change the tag if needed.
24-
const Root = styled("div")(({ theme }) => ({
25-
[`& .${classes.formControl}`]: {
26-
width: "100%",
27-
},
28-
29-
[`& .${classes.input}`]: {
30-
margin: theme.spacing(1),
31-
},
32-
}));
17+
const useStyles = makeStyles((theme: Theme) =>
18+
createStyles({
19+
formControl: {
20+
width: "100%",
21+
},
22+
input: {
23+
margin: theme.spacing(1),
24+
},
25+
}),
26+
);
3327

3428
const ProjectSelect: FunctionComponent<{
3529
projectId?: string;
3630
onProjectSelect: (id: string) => void;
3731
}> = ({ projectId, onProjectSelect }) => {
32+
const classes = useStyles();
3833
const { projectList, selectedProjectId } = useProjectState();
3934
const projectDispatch = useProjectDispatch();
4035

@@ -45,7 +40,7 @@ const ProjectSelect: FunctionComponent<{
4540
}, [projectId, selectedProjectId, projectDispatch]);
4641

4742
return (
48-
<Root>
43+
<>
4944
{projectList.length > 0 && (
5045
<FormControl variant="standard" className={classes.formControl}>
5146
<InputLabel id="projectSelect" shrink>
@@ -73,7 +68,7 @@ const ProjectSelect: FunctionComponent<{
7368
</Select>
7469
</FormControl>
7570
)}
76-
</Root>
71+
</>
7772
);
7873
};
7974

src/components/RegisterForm.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ const RegisterForm = () => {
5555
inputProps={{
5656
onChange: (event: React.FormEvent<HTMLInputElement>) =>
5757
setFirstName(event.target.value),
58-
"data-testId": "firstName",
58+
"data-testid": "firstName",
5959
}}
6060
/>
6161
</Grid>
@@ -74,7 +74,7 @@ const RegisterForm = () => {
7474
inputProps={{
7575
onChange: (event: React.FormEvent<HTMLInputElement>) =>
7676
setLastName(event.target.value),
77-
"data-testId": "lastName",
77+
"data-testid": "lastName",
7878
}}
7979
/>
8080
</Grid>
@@ -93,7 +93,7 @@ const RegisterForm = () => {
9393
inputProps={{
9494
onChange: (event: React.FormEvent<HTMLInputElement>) =>
9595
setEmail(event.target.value),
96-
"data-testId": "email",
96+
"data-testid": "email",
9797
}}
9898
/>
9999
</Grid>
@@ -112,7 +112,7 @@ const RegisterForm = () => {
112112
inputProps={{
113113
onChange: (event: React.FormEvent<HTMLInputElement>) =>
114114
setPassword(event.target.value),
115-
"data-testId": "password",
115+
"data-testid": "password",
116116
}}
117117
/>
118118
</Grid>
@@ -125,7 +125,7 @@ const RegisterForm = () => {
125125
type="submit"
126126
color="primary"
127127
variant="outlined"
128-
data-testId="submit"
128+
data-testid="submit"
129129
>
130130
Submit
131131
</Button>

0 commit comments

Comments
 (0)