aboutsummaryrefslogtreecommitdiffstats
path: root/webui/src/components/BugTitleForm
diff options
context:
space:
mode:
Diffstat (limited to 'webui/src/components/BugTitleForm')
-rw-r--r--webui/src/components/BugTitleForm/BugTitleForm.tsx20
-rw-r--r--webui/src/components/BugTitleForm/BugTitleInput.tsx8
2 files changed, 14 insertions, 14 deletions
diff --git a/webui/src/components/BugTitleForm/BugTitleForm.tsx b/webui/src/components/BugTitleForm/BugTitleForm.tsx
index 6007680f..78b9e901 100644
--- a/webui/src/components/BugTitleForm/BugTitleForm.tsx
+++ b/webui/src/components/BugTitleForm/BugTitleForm.tsx
@@ -1,8 +1,8 @@
-import { useState } from 'react';
+import { Button, Typography } from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
+import { useRef, useState } from 'react';
import { Link } from 'react-router-dom';
-import { Button, makeStyles, Typography } from '@material-ui/core';
-
import { TimelineDocument } from '../../pages/bug/TimelineQuery.generated';
import IfLoggedIn from '../IfLoggedIn/IfLoggedIn';
import Author from 'src/components/Author';
@@ -71,11 +71,11 @@ function BugTitleForm({ bug }: Props) {
const [setTitle, { loading, error }] = useSetTitleMutation();
const [issueTitle, setIssueTitle] = useState(bug.title);
const classes = useStyles();
- let issueTitleInput: any;
+ const issueTitleInput = useRef<HTMLInputElement>();
function isFormValid() {
- if (issueTitleInput) {
- return issueTitleInput.value.length > 0;
+ if (issueTitleInput.current) {
+ return issueTitleInput.current.value.length > 0;
} else {
return false;
}
@@ -83,7 +83,7 @@ function BugTitleForm({ bug }: Props) {
function submitNewTitle() {
if (!isFormValid()) return;
- if (bug.title === issueTitleInput.value) {
+ if (bug.title === issueTitleInput.current?.value) {
cancelChange();
return;
}
@@ -91,7 +91,7 @@ function BugTitleForm({ bug }: Props) {
variables: {
input: {
prefix: bug.id,
- title: issueTitleInput.value,
+ title: issueTitleInput.current!!.value,
},
},
refetchQueries: [
@@ -117,9 +117,7 @@ function BugTitleForm({ bug }: Props) {
return (
<form className={classes.headerTitle}>
<BugTitleInput
- inputRef={(node) => {
- issueTitleInput = node;
- }}
+ inputRef={issueTitleInput}
label="Title"
variant="outlined"
fullWidth
diff --git a/webui/src/components/BugTitleForm/BugTitleInput.tsx b/webui/src/components/BugTitleForm/BugTitleInput.tsx
index d2b060a2..11cbbdb6 100644
--- a/webui/src/components/BugTitleForm/BugTitleInput.tsx
+++ b/webui/src/components/BugTitleForm/BugTitleInput.tsx
@@ -1,5 +1,7 @@
-import { createStyles, fade, withStyles, TextField } from '@material-ui/core';
-import { Theme } from '@material-ui/core/styles';
+import { alpha, TextField } from '@mui/material';
+import { Theme } from '@mui/material/styles';
+import createStyles from '@mui/styles/createStyles';
+import withStyles from '@mui/styles/withStyles';
const BugTitleInput = withStyles((theme: Theme) =>
createStyles({
@@ -14,7 +16,7 @@ const BugTitleInput = withStyles((theme: Theme) =>
},
'& input:valid:hover + fieldset': {
color: theme.palette.text.primary,
- borderColor: fade(theme.palette.divider, 0.3),
+ borderColor: alpha(theme.palette.divider, 0.3),
borderWidth: 2,
},
'& input:valid:focus + fieldset': {