archipelago c83bade022
Some checks failed
Demo images / Build & push demo images (push) Failing after 3m24s
feat(ui): Cloud page renders from cache — per-peer incremental fan-in, live FIPS/Tor badges, per-path folder cache
Part B3 of docs/FIPS-UPTIME-AND-UI-STATE-PLAN.md — the worst
fetch-on-every-navigation offender converted to the cached-resource layer:

- section counts / peer nodes / my files / paid items are cached resources:
  revisits paint instantly, refresh happens behind the content
  (sticky-ready), errors keep last-known data
- peer files: per-peer cached browse entries replace the all-or-nothing
  Promise.allSettled — each peer's rows render the moment it answers, with
  "still fetching from N peers" + unreachable counts; browse-peer runs
  with maxRetries:1 so one dead peer costs its timeout once, not ×3
- peer cards get a live transport badge (FIPS green / Tor amber, with
  measured latency) from the transport field the browse response already
  carried — the per-peer FIPS-uptime view, for free
- cloud store: per-path listing cache with stale-while-revalidate
  navigate() and a last-wins guard; CloudFolder no longer reset()s the
  store on every folder entry (that wipe forced a spinner each time)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-27 22:49:30 -04:00

153 lines
4.4 KiB
TypeScript

import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
import { fileBrowserClient, type FileBrowserItem } from '@/api/filebrowser-client'
export const useCloudStore = defineStore('cloud', () => {
const currentPath = ref('/')
const items = ref<FileBrowserItem[]>([])
const loading = ref(false)
const error = ref<string | null>(null)
const authenticated = ref(false)
// Per-path listing cache: re-entering a folder paints the last listing
// immediately (no spinner) while the fresh listing loads behind it.
const pathCache = new Map<string, FileBrowserItem[]>()
// Last-wins guard for overlapping navigations (fast folder hopping).
let navSeq = 0
const breadcrumbs = computed(() => {
const parts = currentPath.value.split('/').filter(Boolean)
const crumbs = [{ name: 'Home', path: '/' }]
let path = ''
for (const part of parts) {
path += `/${part}`
crumbs.push({ name: part, path })
}
return crumbs
})
const sortedItems = computed(() => {
const dirs = items.value.filter((i) => i.isDir)
const files = items.value.filter((i) => !i.isDir)
dirs.sort((a, b) => a.name.localeCompare(b.name))
files.sort((a, b) => a.name.localeCompare(b.name))
return [...dirs, ...files]
})
async function init(): Promise<boolean> {
if (authenticated.value) return true
const ok = await fileBrowserClient.login()
authenticated.value = ok
return ok
}
async function navigate(path: string): Promise<void> {
const seq = ++navSeq
const apply = (p: string, result: FileBrowserItem[]) => {
pathCache.set(p, result)
if (seq !== navSeq) return // a newer navigation superseded this one
items.value = result
currentPath.value = p
}
// Stale-while-revalidate: show the cached listing for this path
// immediately (no spinner), then refresh it underneath.
const cached = pathCache.get(path)
if (cached) {
items.value = cached
currentPath.value = path
} else {
loading.value = true
}
error.value = null
try {
if (!authenticated.value) {
const ok = await init()
if (!ok) {
error.value = 'Failed to authenticate with File Browser'
return
}
}
try {
apply(path, await fileBrowserClient.listDirectory(path))
} catch {
// Directory may not exist — try to create it, then retry
if (path !== '/') {
try {
const parentPath = path.substring(0, path.lastIndexOf('/')) || '/'
const dirName = path.substring(path.lastIndexOf('/') + 1)
await fileBrowserClient.createFolder(parentPath, dirName)
apply(path, await fileBrowserClient.listDirectory(path))
} catch {
// Fall back to root
apply('/', await fileBrowserClient.listDirectory('/'))
}
} else {
throw new Error('Failed to list root directory')
}
}
} catch (e) {
// Keep showing the cached listing on a failed revalidate.
if (!cached) error.value = e instanceof Error ? e.message : 'Failed to load files'
} finally {
if (seq === navSeq) loading.value = false
}
}
async function refresh(): Promise<void> {
await navigate(currentPath.value)
}
async function uploadFile(file: File): Promise<void> {
await fileBrowserClient.upload(currentPath.value, file)
await refresh()
}
async function deleteItem(path: string): Promise<void> {
await fileBrowserClient.deleteItem(path)
await refresh()
}
function downloadUrl(path: string): string {
return fileBrowserClient.downloadUrl(path)
}
async function fetchBlobUrl(path: string): Promise<string> {
return fileBrowserClient.fetchBlobUrl(path)
}
async function streamUrl(path: string): Promise<string> {
return fileBrowserClient.streamUrl(path)
}
async function downloadFile(path: string): Promise<void> {
return fileBrowserClient.downloadFile(path)
}
function reset(): void {
currentPath.value = '/'
items.value = []
loading.value = false
error.value = null
pathCache.clear()
}
return {
currentPath,
items,
loading,
error,
authenticated,
breadcrumbs,
sortedItems,
init,
navigate,
refresh,
uploadFile,
deleteItem,
downloadUrl,
fetchBlobUrl,
streamUrl,
downloadFile,
reset,
}
})