Add cache load spinner (build 271261238)

This commit is contained in:
2026-01-27 12:39:51 +13:00
parent 0e95f94025
commit 7d6cdcbe02
3 changed files with 24 additions and 3 deletions

View File

@@ -1 +1 @@
271261228 271261238

View File

@@ -125,6 +125,7 @@ export default function SettingsPage({ section }: SettingsPageProps) {
const [cacheRows, setCacheRows] = useState<any[]>([]) const [cacheRows, setCacheRows] = useState<any[]>([])
const [cacheCount, setCacheCount] = useState(50) const [cacheCount, setCacheCount] = useState(50)
const [cacheStatus, setCacheStatus] = useState<string | null>(null) const [cacheStatus, setCacheStatus] = useState<string | null>(null)
const [cacheLoading, setCacheLoading] = useState(false)
const [requestsSync, setRequestsSync] = useState<any | null>(null) const [requestsSync, setRequestsSync] = useState<any | null>(null)
const [artworkPrefetch, setArtworkPrefetch] = useState<any | null>(null) const [artworkPrefetch, setArtworkPrefetch] = useState<any | null>(null)
const [artworkSummary, setArtworkSummary] = useState<any | null>(null) const [artworkSummary, setArtworkSummary] = useState<any | null>(null)
@@ -667,6 +668,7 @@ export default function SettingsPage({ section }: SettingsPageProps) {
const loadCache = async () => { const loadCache = async () => {
setCacheStatus(null) setCacheStatus(null)
setCacheLoading(true)
try { try {
const baseUrl = getApiBase() const baseUrl = getApiBase()
const response = await authFetch( const response = await authFetch(
@@ -689,6 +691,8 @@ export default function SettingsPage({ section }: SettingsPageProps) {
? err.message.replace(/^\\{\"detail\":\"|\"\\}$/g, '') ? err.message.replace(/^\\{\"detail\":\"|\"\\}$/g, '')
: 'Could not load cache.' : 'Could not load cache.'
setCacheStatus(message) setCacheStatus(message)
} finally {
setCacheLoading(false)
} }
} }
@@ -1378,8 +1382,15 @@ export default function SettingsPage({ section }: SettingsPageProps) {
<option value={200}>200</option> <option value={200}>200</option>
</select> </select>
</label> </label>
<button type="button" onClick={loadCache}> <button type="button" onClick={loadCache} disabled={cacheLoading}>
Load saved requests {cacheLoading ? (
<>
<span className="spinner button-spinner" aria-hidden="true" />
Loading saved requests
</>
) : (
'Load saved requests'
)}
</button> </button>
</div> </div>
</div> </div>

View File

@@ -1689,6 +1689,16 @@ button span {
animation: spin 0.9s linear infinite; animation: spin 0.9s linear infinite;
} }
.button-spinner {
width: 16px;
height: 16px;
border-width: 2px;
box-shadow: none;
margin-right: 8px;
vertical-align: middle;
display: inline-block;
}
.loading-text { .loading-text {
font-size: 16px; font-size: 16px;
color: var(--ink-muted); color: var(--ink-muted);