aboutsummaryrefslogtreecommitdiffstats
path: root/webui/src/pages/list
diff options
context:
space:
mode:
Diffstat (limited to 'webui/src/pages/list')
-rw-r--r--webui/src/pages/list/BugRow.tsx15
-rw-r--r--webui/src/pages/list/Filter.tsx25
-rw-r--r--webui/src/pages/list/FilterToolbar.tsx9
-rw-r--r--webui/src/pages/list/List.tsx4
-rw-r--r--webui/src/pages/list/ListQuery.tsx37
5 files changed, 43 insertions, 47 deletions
diff --git a/webui/src/pages/list/BugRow.tsx b/webui/src/pages/list/BugRow.tsx
index b3380dd7..82582dbe 100644
--- a/webui/src/pages/list/BugRow.tsx
+++ b/webui/src/pages/list/BugRow.tsx
@@ -1,14 +1,13 @@
+import CheckCircleOutline from '@mui/icons-material/CheckCircleOutline';
+import CommentOutlinedIcon from '@mui/icons-material/CommentOutlined';
+import ErrorOutline from '@mui/icons-material/ErrorOutline';
+import TableCell from '@mui/material/TableCell/TableCell';
+import TableRow from '@mui/material/TableRow/TableRow';
+import Tooltip from '@mui/material/Tooltip/Tooltip';
+import makeStyles from '@mui/styles/makeStyles';
import * as React from 'react';
import { Link } from 'react-router-dom';
-import TableCell from '@material-ui/core/TableCell/TableCell';
-import TableRow from '@material-ui/core/TableRow/TableRow';
-import Tooltip from '@material-ui/core/Tooltip/Tooltip';
-import { makeStyles } from '@material-ui/core/styles';
-import CheckCircleOutline from '@material-ui/icons/CheckCircleOutline';
-import CommentOutlinedIcon from '@material-ui/icons/CommentOutlined';
-import ErrorOutline from '@material-ui/icons/ErrorOutline';
-
import Author from 'src/components/Author';
import Date from 'src/components/Date';
import Label from 'src/components/Label';
diff --git a/webui/src/pages/list/Filter.tsx b/webui/src/pages/list/Filter.tsx
index fd2d5a3a..6b3422be 100644
--- a/webui/src/pages/list/Filter.tsx
+++ b/webui/src/pages/list/Filter.tsx
@@ -1,17 +1,17 @@
+import ArrowDropDown from '@mui/icons-material/ArrowDropDown';
+import CheckIcon from '@mui/icons-material/Check';
+import Menu from '@mui/material/Menu';
+import MenuItem from '@mui/material/MenuItem';
+import { SvgIconProps } from '@mui/material/SvgIcon';
+import TextField from '@mui/material/TextField';
+import { darken } from '@mui/material/styles';
+import makeStyles from '@mui/styles/makeStyles';
+import withStyles from '@mui/styles/withStyles';
import clsx from 'clsx';
-import { useRef, useState, useEffect } from 'react';
import * as React from 'react';
+import { useRef, useState, useEffect } from 'react';
import { Location, Link } from 'react-router-dom';
-import Menu from '@material-ui/core/Menu';
-import MenuItem from '@material-ui/core/MenuItem';
-import { SvgIconProps } from '@material-ui/core/SvgIcon';
-import TextField from '@material-ui/core/TextField';
-import { makeStyles, withStyles } from '@material-ui/core/styles';
-import { darken } from '@material-ui/core/styles/colorManipulator';
-import ArrowDropDown from '@material-ui/icons/ArrowDropDown';
-import CheckIcon from '@material-ui/icons/Check';
-
import { Color } from '../../gqlTypes';
const CustomTextField = withStyles((theme) => ({
@@ -153,7 +153,7 @@ function FilterDropdown({
const [open, setOpen] = useState(false);
const [filter, setFilter] = useState<string>('');
const buttonRef = useRef<HTMLButtonElement>(null);
- const searchRef = useRef<HTMLButtonElement>(null);
+ const searchRef = useRef<HTMLInputElement>(null);
const classes = useStyles({ active: false });
useEffect(() => {
@@ -180,8 +180,6 @@ function FilterDropdown({
</button>
<Menu
className={classes.labelMenu}
- getContentAnchorEl={null}
- ref={searchRef}
anchorOrigin={{
vertical: 'bottom',
horizontal: 'left',
@@ -202,6 +200,7 @@ function FilterDropdown({
>
{hasFilter && (
<CustomTextField
+ inputRef={searchRef}
onChange={(e) => {
const { value } = e.target;
setFilter(value);
diff --git a/webui/src/pages/list/FilterToolbar.tsx b/webui/src/pages/list/FilterToolbar.tsx
index 1a3476e2..5e774734 100644
--- a/webui/src/pages/list/FilterToolbar.tsx
+++ b/webui/src/pages/list/FilterToolbar.tsx
@@ -1,12 +1,11 @@
import { pipe } from '@arrows/composition';
+import CheckCircleOutline from '@mui/icons-material/CheckCircleOutline';
+import ErrorOutline from '@mui/icons-material/ErrorOutline';
+import Toolbar from '@mui/material/Toolbar';
+import makeStyles from '@mui/styles/makeStyles';
import * as React from 'react';
import { Location } from 'react-router-dom';
-import Toolbar from '@material-ui/core/Toolbar';
-import { makeStyles } from '@material-ui/core/styles';
-import CheckCircleOutline from '@material-ui/icons/CheckCircleOutline';
-import ErrorOutline from '@material-ui/icons/ErrorOutline';
-
import {
Filter,
FilterDropdown,
diff --git a/webui/src/pages/list/List.tsx b/webui/src/pages/list/List.tsx
index 11760509..4d0666ec 100644
--- a/webui/src/pages/list/List.tsx
+++ b/webui/src/pages/list/List.tsx
@@ -1,5 +1,5 @@
-import Table from '@material-ui/core/Table/Table';
-import TableBody from '@material-ui/core/TableBody/TableBody';
+import Table from '@mui/material/Table/Table';
+import TableBody from '@mui/material/TableBody/TableBody';
import BugRow from './BugRow';
import { BugListFragment } from './ListQuery.generated';
diff --git a/webui/src/pages/list/ListQuery.tsx b/webui/src/pages/list/ListQuery.tsx
index 21818758..6b508e90 100644
--- a/webui/src/pages/list/ListQuery.tsx
+++ b/webui/src/pages/list/ListQuery.tsx
@@ -1,20 +1,20 @@
import { ApolloError } from '@apollo/client';
import { pipe } from '@arrows/composition';
-import { useState, useEffect, useRef } from 'react';
+import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
+import ErrorOutline from '@mui/icons-material/ErrorOutline';
+import KeyboardArrowLeft from '@mui/icons-material/KeyboardArrowLeft';
+import KeyboardArrowRight from '@mui/icons-material/KeyboardArrowRight';
+import { Button, FormControl, Menu, MenuItem } from '@mui/material';
+import IconButton from '@mui/material/IconButton';
+import InputBase from '@mui/material/InputBase';
+import Paper from '@mui/material/Paper';
+import Skeleton from '@mui/material/Skeleton';
+import { Theme } from '@mui/material/styles';
+import makeStyles from '@mui/styles/makeStyles';
import * as React from 'react';
+import { useState, useEffect, useRef } from 'react';
import { useLocation, useNavigate, Link } from 'react-router-dom';
-import { Button, FormControl, Menu, MenuItem } from '@material-ui/core';
-import IconButton from '@material-ui/core/IconButton';
-import InputBase from '@material-ui/core/InputBase';
-import Paper from '@material-ui/core/Paper';
-import { makeStyles, Theme } from '@material-ui/core/styles';
-import ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown';
-import ErrorOutline from '@material-ui/icons/ErrorOutline';
-import KeyboardArrowLeft from '@material-ui/icons/KeyboardArrowLeft';
-import KeyboardArrowRight from '@material-ui/icons/KeyboardArrowRight';
-import Skeleton from '@material-ui/lab/Skeleton';
-
import { useCurrentIdentityQuery } from '../../components/Identity/CurrentIdentity.generated';
import IfLoggedIn from 'src/components/IfLoggedIn/IfLoggedIn';
@@ -88,7 +88,7 @@ const useStyles = makeStyles<Theme, StylesProps>((theme) => ({
...theme.typography.h5,
padding: theme.spacing(8),
textAlign: 'center',
- color: theme.palette.text.hint,
+ color: theme.palette.text.primary,
borderBottomColor: theme.palette.divider,
borderBottomWidth: '1px',
borderBottomStyle: 'solid',
@@ -141,7 +141,7 @@ const Placeholder: React.FC<PlaceholderProps> = ({
<div key={i} className={classes.placeholderRow}>
<Skeleton
className={classes.placeholderRowStatus}
- variant="circle"
+ variant="circular"
width={20}
height={20}
/>
@@ -327,7 +327,6 @@ function ListQuery() {
<Menu
open={filterMenuIsOpen}
onClose={() => setFilterMenuIsOpen(false)}
- getContentAnchorEl={null}
anchorEl={filterButtonRef.current}
anchorOrigin={{
vertical: 'bottom',
@@ -382,21 +381,21 @@ function ListQuery() {
{content}
<div className={classes.pagination}>
{previousPage ? (
- <IconButton component={Link} to={previousPage}>
+ <IconButton component={Link} to={previousPage} size="large">
<KeyboardArrowLeft />
</IconButton>
) : (
- <IconButton disabled>
+ <IconButton disabled size="large">
<KeyboardArrowLeft />
</IconButton>
)}
<div>{loading ? 'Loading' : `Total: ${count}`}</div>
{nextPage ? (
- <IconButton component={Link} to={nextPage}>
+ <IconButton component={Link} to={nextPage} size="large">
<KeyboardArrowRight />
</IconButton>
) : (
- <IconButton disabled>
+ <IconButton disabled size="large">
<KeyboardArrowRight />
</IconButton>
)}
generated by cgit (git 2.34.1) at 2024-10-19 11:51:44 +0000