diff --git a/ui/src/layout/ActivityMenu.js b/ui/src/layout/ActivityPanel.js similarity index 59% rename from ui/src/layout/ActivityMenu.js rename to ui/src/layout/ActivityPanel.js index e6fe6ee64..bb0c55c16 100644 --- a/ui/src/layout/ActivityMenu.js +++ b/ui/src/layout/ActivityPanel.js @@ -2,15 +2,21 @@ import React, { useState, useEffect } from 'react' import { useDispatch, useSelector } from 'react-redux' import { fetchUtils } from 'react-admin' import { - Menu, - MenuItem, + Popover, Badge, CircularProgress, IconButton, makeStyles, Tooltip, + Card, + CardContent, + CardActions, + Divider, + Box, } from '@material-ui/core' import { FiActivity } from 'react-icons/fi' +import { VscSync } from 'react-icons/vsc' +import { GiMagnifyingGlass } from 'react-icons/gi' import subsonic from '../subsonic' import { scanStatusUpdate } from '../actions' @@ -29,9 +35,12 @@ const useStyles = makeStyles((theme) => ({ color: 'inherit', zIndex: 2, }, + counterStatus: { + minWidth: '16em', + }, })) -const ActivityMenu = () => { +const ActivityPanel = () => { const classes = useStyles() const [anchorEl, setAnchorEl] = useState(null) const open = Boolean(anchorEl) @@ -39,8 +48,9 @@ const ActivityMenu = () => { const dispatch = useDispatch() const handleMenuOpen = (event) => setAnchorEl(event.currentTarget) - const handleCloseClose = () => setAnchorEl(null) - const triggerScan = () => fetch(subsonic.url('startScan')) + const handleMenuClose = () => setAnchorEl(null) + const triggerScan = (full) => () => + fetch(subsonic.url('startScan', null, { fullScan: full })) // Get updated status on component mount useEffect(() => { @@ -66,8 +76,8 @@ const ActivityMenu = () => { {scanStatus.scanning && ( )} - { horizontal: 'right', }} open={open} - onClose={handleCloseClose} + onClose={handleMenuClose} > - - {`Scanned: ${scanStatus.count}`} - - + + + + + Total Folders Scanned: + + + {scanStatus.count} + + + + + + + + + + + + + + + + + + ) } -export default ActivityMenu +export default ActivityPanel diff --git a/ui/src/layout/AppBar.js b/ui/src/layout/AppBar.js index feb951a1e..7080eb1e5 100644 --- a/ui/src/layout/AppBar.js +++ b/ui/src/layout/AppBar.js @@ -13,7 +13,7 @@ import ViewListIcon from '@material-ui/icons/ViewList' import InfoIcon from '@material-ui/icons/Info' import AboutDialog from './AboutDialog' import PersonalMenu from './PersonalMenu' -import ActivityMenu from './ActivityMenu' +import ActivityPanel from './ActivityPanel' import config from '../config' const useStyles = makeStyles((theme) => ({ @@ -90,7 +90,7 @@ const CustomUserMenu = ({ onClick, ...rest }) => { return ( <> - {config.devActivityMenu && permissions === 'admin' && } + {config.devActivityMenu && permissions === 'admin' && }