danvics/soulsync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

feat(import): badge auto-import status

Browse source
This commit is contained in:
Antti Kettunen 2026-05-18 20:45:53 +03:00
parent 934a612df3
commit fccc03efef
No known key found for this signature in database
GPG key ID: C6B2A3D250359BD7
4 changed files with 12 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
webui/src/routes/import/-import.helpers.ts
View file

@ -160,13 +160,14 @@ export function getAutoImportStatusText(status: ImportAutoImportStatusPayload |
return 'Watching'; return 'Watching';
} }
export function getAutoImportStatusClass( export type AutoImportStatusTone = 'neutral' | 'info' | 'success';
export function getAutoImportStatusTone(
status: ImportAutoImportStatusPayload | undefined, status: ImportAutoImportStatusPayload | undefined,
): string { ): AutoImportStatusTone {
if (!status?.running) return 'disabled'; if (!status?.running || status.paused) return 'neutral';
if (status.current_status === 'scanning') return 'scanning'; if (status.current_status === 'scanning' || status.current_status === 'processing') return 'info';
if (status.current_status === 'processing') return 'processing'; return 'success';
return 'active';
} }
export function getActiveImportLines(status: ImportAutoImportStatusPayload | undefined): string[] { export function getActiveImportLines(status: ImportAutoImportStatusPayload | undefined): string[] {

1
webui/src/routes/import/-route.test.tsx
View file

@ -303,6 +303,7 @@ describe('import route', () => {
expect(await screen.findByRole('button', { name: /^Needs Review\s*1$/ })).toBeInTheDocument(); expect(await screen.findByRole('button', { name: /^Needs Review\s*1$/ })).toBeInTheDocument();
expect(screen.getAllByText('Album A').length).toBeGreaterThan(0); expect(screen.getAllByText('Album A').length).toBeGreaterThan(0);
expect(screen.getByText('Watching')).toHaveAttribute('data-tone', 'success');
const intervalSelect = document.getElementById('auto-import-interval'); const intervalSelect = document.getElementById('auto-import-interval');
if (!(intervalSelect instanceof HTMLElement)) { if (!(intervalSelect instanceof HTMLElement)) {
throw new Error('auto-import interval select missing'); throw new Error('auto-import interval select missing');

11
webui/src/routes/import/-ui/auto-import-tab.tsx
View file

@ -34,9 +34,9 @@ import {
filterAutoImportResults, filterAutoImportResults,
getActiveImportLines, getActiveImportLines,
getAutoImportCounts, getAutoImportCounts,
getAutoImportStatusClass,
getAutoImportStatusMeta, getAutoImportStatusMeta,
getAutoImportStatusText, getAutoImportStatusText,
getAutoImportStatusTone,
getAutoImportTimeAgo, getAutoImportTimeAgo,
getConfidenceClass, getConfidenceClass,
parseAutoImportMatchData, parseAutoImportMatchData,
@ -149,7 +149,7 @@ export function AutoImportPanel({
const results = filterAutoImportResults(allResults, autoFilter); const results = filterAutoImportResults(allResults, autoFilter);
const counts = getAutoImportCounts(allResults); const counts = getAutoImportCounts(allResults);
const activeLines = getActiveImportLines(statusQuery.data); const activeLines = getActiveImportLines(statusQuery.data);
const statusClassName = getAutoImportStatusClass(statusQuery.data); const statusTone = getAutoImportStatusTone(statusQuery.data);
if (statusQuery.error) { if (statusQuery.error) {
return ( return (
@ -173,12 +173,9 @@ export function AutoImportPanel({
/> />
<span id="auto-import-toggle-label">Auto-Import</span> <span id="auto-import-toggle-label">Auto-Import</span>
</div> </div>
<span <Badge id="auto-import-status-text" tone={statusTone}>
className={`${styles.autoImportStatus} ${styles[statusClassName]}`}
id="auto-import-status-text"
>
{getAutoImportStatusText(statusQuery.data)} {getAutoImportStatusText(statusQuery.data)}
</span> </Badge>
<div className={styles.importPageFlexSpacer} /> <div className={styles.importPageFlexSpacer} />
{statusQuery.data?.running ? ( {statusQuery.data?.running ? (
<Button <Button

18
webui/src/routes/import/-ui/import-page.module.css
View file

@ -908,24 +908,6 @@
color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7);
} }
.autoImportStatus {
font-size: 12px;
font-weight: 500;
padding: 2px 10px;
border-radius: 6px;
}
.autoImportStatus.active {
color: #4ade80;
background: rgba(74, 222, 128, 0.1);
}
.autoImportStatus.scanning {
color: rgb(var(--accent-light-rgb));
background: rgba(var(--accent-rgb), 0.1);
}
.autoImportStatus.disabled {
color: rgba(255, 255, 255, 0.3);
}
.autoImportSettingsRow { .autoImportSettingsRow {
display: flex; display: flex;
align-items: center; align-items: center;