diff --git a/src/components/ItemHeaderView/ItemHeaderView.js b/src/components/ItemHeaderView/ItemHeaderView.js index 798a3fb..8e9c503 100644 --- a/src/components/ItemHeaderView/ItemHeaderView.js +++ b/src/components/ItemHeaderView/ItemHeaderView.js @@ -1,7 +1,7 @@ import React, { useMemo } from "react"; import PropTypes from "prop-types"; import { useTable, useFlexLayout, useFilters } from "react-table"; -import { TableContainer, Table, TableHead, TableRow, TableCell, TableBody, TextField, useTheme, makeStyles } from "@material-ui/core"; +import { TableContainer, Paper, Table, TableHead, TableRow, TableCell, TableBody, TextField, useTheme, makeStyles } from "@material-ui/core"; export default function ItemHeaderView({ data }) { @@ -51,7 +51,7 @@ export default function ItemHeaderView({ data }) { } = tableInstance; return ( - + {headerGroups.map(headerGroup => ( diff --git a/src/components/ItemTable/ItemTable.js b/src/components/ItemTable/ItemTable.js index 424d55e..c742c85 100644 --- a/src/components/ItemTable/ItemTable.js +++ b/src/components/ItemTable/ItemTable.js @@ -1,7 +1,7 @@ import React, { useState } from "react"; import PropTypes from "prop-types"; import { useTable, useFilters, useFlexLayout, useSortBy } from "react-table"; -import { Table, TableBody, TableCell, TableHead, TableRow, TableContainer, Box, Grid, ButtonGroup, IconButton, makeStyles, useTheme } from "@material-ui/core"; +import { Table, TableBody, TableCell, TableHead, TableRow, TableContainer, Paper, Box, Grid, ButtonGroup, IconButton, makeStyles, useTheme } from "@material-ui/core"; import { useHistory } from "react-router-dom"; import RelativeTime from "react-relative-time"; import ItemTableFilter from "../ItemTableFilter/" @@ -22,7 +22,7 @@ export default function ItemTable({ data, rowCanBeSelected, loading }) { }, hoverBackgroundColor: { "&:hover": { - // The !important is placed here to enforce CSS specificity. + // The !important is placed here to enforce CSS specificity. // See: https://material-ui.com/styles/advanced/#css-injection-order backgroundColor: `${theme.palette.primary[200]} !important`, }, @@ -90,14 +90,14 @@ export default function ItemTable({ data, rowCanBeSelected, loading }) { const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow, } = tableInstance; return ( - loading + loading ? ( Items are loading. ) : ( - +
- - {label} - - + + + {label} + + + ); }; diff --git a/src/components/QueueSelector/QueueSelector.js b/src/components/QueueSelector/QueueSelector.js index aa1a816..4336fd5 100644 --- a/src/components/QueueSelector/QueueSelector.js +++ b/src/components/QueueSelector/QueueSelector.js @@ -1,6 +1,6 @@ import React, { useState, useEffect } from "react"; import PropTypes from "prop-types"; -import { TextField, Checkbox, InputAdornment, Box, useTheme } from "@material-ui/core"; +import { TextField, Checkbox, InputAdornment, useTheme, Paper } from "@material-ui/core"; import { Autocomplete } from "@material-ui/lab"; import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank'; import CheckBoxIcon from '@material-ui/icons/CheckBox'; @@ -17,14 +17,14 @@ const getQueueCounts = async (access_token) => { if (access_token === null){ return undefined } - + let myHeaders = new Headers(); myHeaders.append("Authorization", `Bearer ${access_token}`); let requestOptions = { headers: myHeaders }; const apiResponse = await fetch(`/api/get_queues`, requestOptions); const queueCountJson = await apiResponse.json(); - + return queueCountJson; }; @@ -86,7 +86,7 @@ export default function QueueSelector({ open, setOpen, value, setValue }) { // Set active-queues cookie to csv of selected queue names const activeQueueOptions = { - path: "/", + path: "/", expires: (_ => { let expiration_date = new Date(); expiration_date.setDate(expiration_date.getDate() + 365); @@ -113,7 +113,7 @@ export default function QueueSelector({ open, setOpen, value, setValue }) { return( // Box is used for margin because Autocomplete CSS overrides don't work as expected. - + ( - Active Queues: + Active Queues: {params.InputProps.startAdornment} @@ -160,7 +160,7 @@ export default function QueueSelector({ open, setOpen, value, setValue }) { multiple autoHighlight /> - + ); };