fix(subs): stop the lock/reload on source actions + regroup the row buttons
Lock/reload: every inline source action (check / backfill / recover / toggle / remove) ended by refetching the WHOLE subscription list (store.loadAll / refresh), which blocked the UI and re-rendered the table — collapsing the expanded row, which read as "locks then resets." The action APIs already return the updated source, so the store now patches that one row in place (_patchSource / _dropSource); the post-action loadAll/refresh calls are gone. Toggling enabled, starting/stopping a backfill, recovering, and removing are now instant and leave the expansion intact. Button regroup (operator-flagged: tiny, mis-clickable, not grouped by function): - New shared SourceActions.vue used by desktop SourceRow + mobile SourceCard. - Frequent actions stay as size="small" buttons: Check, Backfill/Stop. - Low-frequency / destructive actions move into a labelled overflow (⋮) menu — Preview backfill, Recover dropped near-duplicates, Remove source — so they can't be fat-fingered, and the labels spell out recover-vs-backfill. - Edit moves next to the source URL (its identity), out of the action cluster where it sat beside Remove. - Single-source Remove now confirms (it had no guard before). Tests: store patches/drops in place without dropping the cache. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -32,6 +32,31 @@ export const useSourcesStore = defineStore('sources', () => {
|
||||
if (artistId != null) byArtist.value.delete(artistId)
|
||||
}
|
||||
|
||||
// Patch a single updated source into every cached array IN PLACE, rather than
|
||||
// invalidating + refetching the whole list. The full refetch was what locked
|
||||
// the Subscriptions UI and collapsed the expanded row after every inline
|
||||
// action (check / backfill / recover / toggle) — operator-flagged 2026-06-07.
|
||||
// Map.set on a Vue-reactive ref(Map) triggers re-render; we hand each cache a
|
||||
// NEW array so the table diffs just the one changed row.
|
||||
function _patchSource(updated) {
|
||||
if (!updated || updated.id == null) return
|
||||
for (const [key, arr] of byArtist.value) {
|
||||
const i = arr.findIndex((s) => s.id === updated.id)
|
||||
if (i === -1) continue
|
||||
const next = arr.slice()
|
||||
next[i] = { ...arr[i], ...updated }
|
||||
byArtist.value.set(key, next)
|
||||
}
|
||||
}
|
||||
|
||||
function _dropSource(id) {
|
||||
for (const [key, arr] of byArtist.value) {
|
||||
if (arr.some((s) => s.id === id)) {
|
||||
byArtist.value.set(key, arr.filter((s) => s.id !== id))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function create(payload) {
|
||||
const body = await api.post('/api/sources', { body: payload })
|
||||
_invalidate(payload.artist_id)
|
||||
@@ -40,13 +65,13 @@ export const useSourcesStore = defineStore('sources', () => {
|
||||
|
||||
async function update(id, patch, artistIdHint = null) {
|
||||
const body = await api.patch(`/api/sources/${id}`, { body: patch })
|
||||
_invalidate(artistIdHint ?? body.artist_id)
|
||||
_patchSource(body)
|
||||
return body
|
||||
}
|
||||
|
||||
async function remove(id, artistIdHint = null) {
|
||||
await api.delete(`/api/sources/${id}`)
|
||||
_invalidate(artistIdHint)
|
||||
_dropSource(id)
|
||||
}
|
||||
|
||||
async function findOrCreateArtist(name) {
|
||||
@@ -90,12 +115,12 @@ export const useSourcesStore = defineStore('sources', () => {
|
||||
// source shows backfill_state 'complete'); 'stop' cancels back to tick mode.
|
||||
async function startBackfill(id, artistIdHint = null) {
|
||||
const body = await api.post(`/api/sources/${id}/backfill`, { body: { action: 'start' } })
|
||||
_invalidate(artistIdHint ?? body.artist_id)
|
||||
_patchSource(body)
|
||||
return body
|
||||
}
|
||||
async function stopBackfill(id, artistIdHint = null) {
|
||||
const body = await api.post(`/api/sources/${id}/backfill`, { body: { action: 'stop' } })
|
||||
_invalidate(artistIdHint ?? body.artist_id)
|
||||
_patchSource(body)
|
||||
return body
|
||||
}
|
||||
// Plan #697: arm a recovery walk — a backfill that bypasses the Patreon
|
||||
@@ -103,7 +128,7 @@ export const useSourcesStore = defineStore('sources', () => {
|
||||
// under the current pHash threshold. Stop with stopBackfill (shared lifecycle).
|
||||
async function recoverSource(id, artistIdHint = null) {
|
||||
const body = await api.post(`/api/sources/${id}/backfill`, { body: { action: 'recover' } })
|
||||
_invalidate(artistIdHint ?? body.artist_id)
|
||||
_patchSource(body)
|
||||
return body
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user