arian/navidrome
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

feat(ui): add scan progress and error reporting to UI (#4094)

Browse Source 
* feat(scanner): add LastScanError tracking to scanner status

- Introduced LastScanErrorKey constant for error tracking.
- Updated StatusInfo struct to include LastError field.
- Modified scanner logic to store and retrieve last scan error.
- Enhanced ScanStatus response to include error information.
- Updated UI components to display last scan error when applicable.
- Added tests to verify last scan error functionality.

Signed-off-by: Deluan <deluan@navidrome.org>

* feat(scanner): enhance scan status with type and elapsed time tracking

- Added LastScanTypeKey and LastScanStartTimeKey constants for tracking scan type and start time.
- Updated StatusInfo struct to include ScanType and ElapsedTime fields.
- Implemented getScanInfo method to retrieve scan type, elapsed time, and last error.
- Modified scanner logic to store scan type and start time during scans.
- Enhanced ScanStatus response and UI components to display scan type and elapsed time.
- Added formatShortDuration utility for better elapsed time representation.
- Updated activity reducer to handle new scan status fields.

Signed-off-by: Deluan <deluan@navidrome.org>

* refactor(tests): consolidate controller status tests into a single file

- Removed the old controller_status_test.go file.
- Merged relevant tests into the new controller_test.go file for better organization and maintainability.
- Ensured all existing test cases for controller status are preserved and functional.

Signed-off-by: Deluan <deluan@navidrome.org>

* Fix formatting issues

* refactor(scanner): update getScanInfo method documentation

---------

Signed-off-by: Deluan <deluan@navidrome.org>
This commit is contained in:
Deluan Quintão
2025-05-21 09:30:23 -04:00
committed by GitHub
parent fef1739c1a
commit 6880cffd16
13 changed files with 394 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/i18n/en.json
+4 -1
View File
@@ -499,7 +499,10 @@
"quickScan": "Quick Scan",
"fullScan": "Full Scan",
"serverUptime": "Server Uptime",
"serverDown": "OFFLINE"
"serverDown": "OFFLINE",
"scanType": "Type",
"status": "Scan Error",
"elapsedTime": "Elapsed Time"
},
"help": {
"title": "Navidrome Hotkeys",
ui/src/layout/ActivityPanel.jsx
+71 -10
View File
@@ -12,15 +12,16 @@ import {
CardActions,
Divider,
Box,
Typography,
} from '@material-ui/core'
import { FiActivity } from 'react-icons/fi'
import { BiError } from 'react-icons/bi'
import { BiError, BiCheckCircle } from 'react-icons/bi'
import { VscSync } from 'react-icons/vsc'
import { GiMagnifyingGlass } from 'react-icons/gi'
import subsonic from '../subsonic'
import { scanStatusUpdate } from '../actions'
import { useInterval } from '../common'
import { formatDuration } from '../utils'
import { formatDuration, formatShortDuration } from '../utils'
import config from '../config'
const useStyles = makeStyles((theme) => ({
@@ -40,7 +41,16 @@ const useStyles = makeStyles((theme) => ({
zIndex: 2,
},
counterStatus: {
minWidth: '15em',
minWidth: '20em',
},
error: {
color: theme.palette.error.main,
},
card: {
maxWidth: 'none',
},
cardContent: {
padding: theme.spacing(2, 3),
},
}))
@@ -59,13 +69,13 @@ const Uptime = () => {
const ActivityPanel = () => {
const serverStart = useSelector((state) => state.activity.serverStart)
const up = serverStart.startTime
const classes = useStyles({ up })
const scanStatus = useSelector((state) => state.activity.scanStatus)
const classes = useStyles({ up: up && !scanStatus.error })
const translate = useTranslate()
const notify = useNotify()
const [anchorEl, setAnchorEl] = useState(null)
const open = Boolean(anchorEl)
const dispatch = useDispatch()
const scanStatus = useSelector((state) => state.activity.scanStatus)
const handleMenuOpen = (event) => setAnchorEl(event.currentTarget)
const handleMenuClose = () => setAnchorEl(null)
@@ -89,11 +99,30 @@ const ActivityPanel = () => {
}
}, [serverStart, notify])
const tooltipTitle = scanStatus.error
? `${translate('activity.status')}: ${scanStatus.error}`
: translate('activity.title')
const lastScanType = (() => {
switch (scanStatus.scanType) {
case 'full':
return translate('activity.fullScan')
case 'quick':
return translate('activity.quickScan')
default:
return ''
}
})()
return (
<div className={classes.wrapper}>
<Tooltip title={translate('activity.title')}>
<Tooltip title={tooltipTitle}>
<IconButton className={classes.button} onClick={handleMenuOpen}>
{up ? <FiActivity size={'20'} /> : <BiError size={'20'} />}
{!up || scanStatus.error ? (
<BiError size={'20'} />
) : (
<FiActivity size={'20'} />
)}
</IconButton>
</Tooltip>
{scanStatus.scanning && (
@@ -113,8 +142,8 @@ const ActivityPanel = () => {
open={open}
onClose={handleMenuClose}
>
<Card>
<CardContent>
<Card className={classes.card}>
<CardContent className={classes.cardContent}>
<Box display="flex" className={classes.counterStatus}>
<Box component="span" flex={2}>
{translate('activity.serverUptime')}:
@@ -125,7 +154,7 @@ const ActivityPanel = () => {
</Box>
</CardContent>
<Divider />
<CardContent>
<CardContent className={classes.cardContent}>
<Box display="flex" className={classes.counterStatus}>
<Box component="span" flex={2}>
{translate('activity.totalScanned')}:
@@ -134,6 +163,38 @@ const ActivityPanel = () => {
{scanStatus.folderCount || '-'}
</Box>
</Box>
<Box display="flex" className={classes.counterStatus} mt={2}>
<Box component="span" flex={2}>
{translate('activity.scanType')}:
</Box>
<Box component="span" flex={1}>
{lastScanType}
</Box>
</Box>
<Box display="flex" className={classes.counterStatus} mt={2}>
<Box component="span" flex={2}>
{translate('activity.elapsedTime')}:
</Box>
<Box component="span" flex={1}>
{formatShortDuration(scanStatus.elapsedTime)}
</Box>
</Box>
{scanStatus.error && (
<Box
display="flex"
flexDirection="column"
mt={2}
className={classes.error}
>
<Typography variant="subtitle2">
{translate('activity.status')}:
</Typography>
<Typography variant="body2">{scanStatus.error}</Typography>
</Box>
)}
</CardContent>
<Divider />
<CardActions>
ui/src/reducers/activityReducer.js
+12 -3
View File
@@ -6,15 +6,24 @@ import {
import config from '../config'
const initialState = {
scanStatus: { scanning: false, folderCount: 0, count: 0 },
scanStatus: {
scanning: false,
folderCount: 0,
count: 0,
error: '',
elapsedTime: 0,
},
serverStart: { version: config.version },
}
export const activityReducer = (previousState = initialState, payload) => {
const { type, data } = payload
switch (type) {
case EVENT_SCAN_STATUS:
return { ...previousState, scanStatus: data }
case EVENT_SCAN_STATUS: {
const elapsedTime = Number(data.elapsedTime) || 0
return { ...previousState, scanStatus: { ...data, elapsedTime } }
}
case EVENT_SERVER_START:
return {
...previousState,
ui/src/reducers/activityReducer.test.js
+119
View File
@@ -0,0 +1,119 @@
import { activityReducer } from './activityReducer'
import { EVENT_SCAN_STATUS, EVENT_SERVER_START } from '../actions'
import config from '../config'
describe('activityReducer', () => {
const initialState = {
scanStatus: {
scanning: false,
folderCount: 0,
count: 0,
error: '',
elapsedTime: 0,
},
serverStart: { version: config.version },
}
it('returns the initial state when no action is specified', () => {
expect(activityReducer(undefined, {})).toEqual(initialState)
})
it('handles EVENT_SCAN_STATUS action with elapsedTime field', () => {
const elapsedTime = 123456789 // nanoseconds
const action = {
type: EVENT_SCAN_STATUS,
data: {
scanning: true,
folderCount: 5,
count: 100,
error: '',
elapsedTime: elapsedTime,
},
}
const newState = activityReducer(initialState, action)
expect(newState.scanStatus).toEqual({
scanning: true,
folderCount: 5,
count: 100,
error: '',
elapsedTime: elapsedTime,
})
})
it('handles EVENT_SCAN_STATUS action with string elapsedTime', () => {
const action = {
type: EVENT_SCAN_STATUS,
data: {
scanning: true,
folderCount: 5,
count: 100,
error: '',
elapsedTime: '123456789',
},
}
const newState = activityReducer(initialState, action)
expect(newState.scanStatus.elapsedTime).toEqual(123456789)
})
it('handles EVENT_SCAN_STATUS with error field', () => {
const action = {
type: EVENT_SCAN_STATUS,
data: {
scanning: false,
folderCount: 0,
count: 0,
error: 'Test error message',
elapsedTime: 0,
},
}
const newState = activityReducer(initialState, action)
expect(newState.scanStatus.error).toEqual('Test error message')
})
it('handles EVENT_SERVER_START action', () => {
const action = {
type: EVENT_SERVER_START,
data: {
version: '1.0.0',
startTime: '2023-01-01T00:00:00Z',
},
}
const newState = activityReducer(initialState, action)
expect(newState.serverStart).toEqual({
version: '1.0.0',
startTime: Date.parse('2023-01-01T00:00:00Z'),
})
})
it('preserves the scanStatus when handling EVENT_SERVER_START', () => {
const currentState = {
scanStatus: {
scanning: true,
folderCount: 5,
count: 100,
error: 'Previous error',
elapsedTime: 12345,
},
serverStart: { version: config.version },
}
const action = {
type: EVENT_SERVER_START,
data: {
version: '1.0.0',
startTime: '2023-01-01T00:00:00Z',
},
}
const newState = activityReducer(currentState, action)
expect(newState.scanStatus).toEqual(currentState.scanStatus)
expect(newState.serverStart).toEqual({
version: '1.0.0',
startTime: Date.parse('2023-01-01T00:00:00Z'),
})
})
})
ui/src/utils/formatters.js
+20
View File
@@ -25,6 +25,26 @@ export const formatDuration = (d) => {
return `${days > 0 ? days + ':' : ''}${f}`
}
export const formatShortDuration = (ns) => {
// Convert nanoseconds to seconds
const seconds = ns / 1e9
if (seconds < 1.0) {
return '<1s'
}
const hours = Math.floor(seconds / 3600)
const minutes = Math.floor((seconds % 3600) / 60)
const secs = Math.floor(seconds % 60)
if (hours > 0) {
return `${hours}h${minutes}m`
}
if (minutes > 0) {
return `${minutes}m${secs}s`
}
return `${secs}s`
}
export const formatFullDate = (date, locale) => {
const dashes = date.split('-').length - 1
let options = {
ui/src/utils/formatters.test.js
+33 -1
View File
@@ -1,4 +1,9 @@
import { formatBytes, formatDuration, formatFullDate } from './formatters'
import {
formatBytes,
formatDuration,
formatFullDate,
formatShortDuration,
} from './formatters'
describe('formatBytes', () => {
it('format bytes', () => {
@@ -32,6 +37,33 @@ describe('formatDuration', () => {
})
})
describe('formatShortDuration', () => {
// Convert seconds to nanoseconds for the tests
const toNs = (seconds) => seconds * 1e9
it('formats less than a second', () => {
expect(formatShortDuration(toNs(0.5))).toEqual('<1s')
expect(formatShortDuration(toNs(0))).toEqual('<1s')
})
it('formats seconds', () => {
expect(formatShortDuration(toNs(1))).toEqual('1s')
expect(formatShortDuration(toNs(59))).toEqual('59s')
})
it('formats minutes and seconds', () => {
expect(formatShortDuration(toNs(60))).toEqual('1m0s')
expect(formatShortDuration(toNs(90))).toEqual('1m30s')
expect(formatShortDuration(toNs(59 * 60 + 59))).toEqual('59m59s')
})
it('formats hours and minutes', () => {
expect(formatShortDuration(toNs(3600))).toEqual('1h0m')
expect(formatShortDuration(toNs(3600 + 30 * 60))).toEqual('1h30m')
expect(formatShortDuration(toNs(24 * 3600 - 1))).toEqual('23h59m')
})
})
describe('formatFullDate', () => {
it('format dates', () => {
expect(formatFullDate('2011', 'en-US')).toEqual('2011')