GSAP carries the counter roll-ups, the bandeja card physics, the dialog transitions and the three success moments FLOWS.md allows. Every one of them checks prefers-reduced-motion first and does nothing when it is set. boneyard and canvas-ui are not what SPEC.md's stack table says they are: on npm the names belong to two abandoned projects that do neither job. The skeletons were already ours; the two canvas spots are now sixty lines each with no dependency. DECISIONS.md records the substitution. The app installs, keeps a scan taken with no network in IndexedDB and sends it when there is one, falls back to a page that explains itself, and can push a deadline notice. Reading the log of what is queued is the source of truth, so the notice clears when the capture actually lands. The CSP now allows scripts by per-request nonce rather than by 'unsafe-inline'. That forced /offline to render per request: a prerendered page carries a build-time nonce no live policy matches, so its scripts were blocked and it never hydrated. Two crashes fixed on the way. web-push throws on a VAPID subject that is not https: or mailto:, and the code handed it APP_PUBLIC_URL, so any machine with push keys died at boot; a misconfigured optional channel now switches itself off and says why. And a subscription the push service answers 410 for is deleted rather than retried forever. Lighthouse on the production build: accessibility 100, best practices 96, SEO 100, performance 73. The performance number is not trustworthy on this machine and DECISIONS.md says why; total blocking time did fall from 17.6s to 1.7s once the hero canvas stopped drawing at full resolution every frame and the landing page stopped importing GSAP. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
97 lines
3.1 KiB
TypeScript
97 lines
3.1 KiB
TypeScript
'use client';
|
|
|
|
/**
|
|
* Captures taken with no network, kept until they can be sent (FLOWS.md B2, SPEC.md
|
|
* section 8). IndexedDB rather than localStorage because the payload is a photograph.
|
|
*
|
|
* The queue is per browser, not per account. A capture belongs to whoever was signed in
|
|
* when it was taken, and the API decides that from the session on the way in, so a queued
|
|
* item that syncs under a different session is refused there rather than misfiled here.
|
|
*/
|
|
const DB_NAME = 'impuestos-offline';
|
|
const STORE = 'captures';
|
|
const VERSION = 1;
|
|
|
|
export interface QueuedCapture {
|
|
id: string;
|
|
blob: Blob;
|
|
mime: string;
|
|
qrPayload: string | null;
|
|
queuedAt: string;
|
|
}
|
|
|
|
function open(): Promise<IDBDatabase> {
|
|
return new Promise((resolve, reject) => {
|
|
const request = indexedDB.open(DB_NAME, VERSION);
|
|
request.onupgradeneeded = () => {
|
|
if (!request.result.objectStoreNames.contains(STORE)) {
|
|
request.result.createObjectStore(STORE, { keyPath: 'id' });
|
|
}
|
|
};
|
|
request.onsuccess = () => resolve(request.result);
|
|
request.onerror = () => reject(request.error);
|
|
});
|
|
}
|
|
|
|
function transact<T>(mode: IDBTransactionMode, run: (store: IDBObjectStore) => IDBRequest<T>): Promise<T> {
|
|
return open().then(
|
|
(db) =>
|
|
new Promise<T>((resolve, reject) => {
|
|
const transaction = db.transaction(STORE, mode);
|
|
const request = run(transaction.objectStore(STORE));
|
|
request.onsuccess = () => resolve(request.result);
|
|
request.onerror = () => reject(request.error);
|
|
transaction.oncomplete = () => db.close();
|
|
}),
|
|
);
|
|
}
|
|
|
|
export async function enqueueCapture(file: File, qrPayload: string | null): Promise<void> {
|
|
const item: QueuedCapture = {
|
|
id: crypto.randomUUID(),
|
|
blob: file,
|
|
mime: file.type || 'image/jpeg',
|
|
qrPayload,
|
|
queuedAt: new Date().toISOString(),
|
|
};
|
|
await transact('readwrite', (store) => store.add(item));
|
|
notify();
|
|
}
|
|
|
|
export async function listQueue(): Promise<QueuedCapture[]> {
|
|
try {
|
|
return await transact<QueuedCapture[]>('readonly', (store) => store.getAll());
|
|
} catch {
|
|
// A browser with storage switched off has no queue, which is not an error the reader
|
|
// needs to hear about: the capture simply failed to send and said so.
|
|
return [];
|
|
}
|
|
}
|
|
|
|
export async function removeCapture(id: string): Promise<void> {
|
|
await transact('readwrite', (store) => store.delete(id));
|
|
notify();
|
|
}
|
|
|
|
/** Lets the shell re-read the count without polling. */
|
|
const CHANGED = 'impuestos:offline-queue';
|
|
|
|
export function notify(): void {
|
|
window.dispatchEvent(new Event(CHANGED));
|
|
}
|
|
|
|
export function subscribeToQueue(listener: () => void): () => void {
|
|
window.addEventListener(CHANGED, listener);
|
|
window.addEventListener('online', listener);
|
|
window.addEventListener('offline', listener);
|
|
return () => {
|
|
window.removeEventListener(CHANGED, listener);
|
|
window.removeEventListener('online', listener);
|
|
window.removeEventListener('offline', listener);
|
|
};
|
|
}
|
|
|
|
export function fileFor(item: QueuedCapture): File {
|
|
return new File([item.blob], `captura-${item.id}.jpg`, { type: item.mime });
|
|
}
|