Pedro Gomes
b7e3208eb2
Passo 12 completo. Build limpo, AC server-side totalmente verificado. O que foi implementado: lib/queue/ — camada de persistência offline: db.ts — Dexie 4 com tabelas pending e deadLetters broadcast.ts — BroadcastChannel helper (mai-call-sync) para comunicar entre tabs sync.ts — loop de sync com retry/backoff: signPhotoUpload → PUT MinIO → create; 409 = sucesso; 4xx = dead-letter; erros de rede = paragem + retry na próxima volta SyncProvider — React Context que: Arranca sync ao reconectar (online event + visibilitychange) Polling de 10s como fallback Regista Background Sync API quando disponível Expõe pendingCount / deadLetterCount via useSyncState() Formulário (/maintenance/new) — refatorado: ao submeter, escreve em IndexedDB e navega imediatamente para /sent sem esperar pelo servidor. O SyncProvider processa a fila em background. Feedback visual: SyncChip na home: "Tudo sincronizado" / "N pedidos por enviar" / erro dead-letter /maintenance/sent: mostra "Em fila" (Clock) ou "Enviado" (CheckCircle2) reactivamente via BroadcastChannel Workbox (@ducanh2912/next-pwa) — app shell precaching ativo, para que o app carregue mesmo sem rede depois da primeira visita.
27 lines
806 B
TypeScript
27 lines
806 B
TypeScript
export const CHANNEL = 'mai-call-sync';
|
|
|
|
export type SyncMessage =
|
|
| { type: 'queue-update'; pendingCount: number }
|
|
| { type: 'synced'; clientRequestId: string }
|
|
| { type: 'dead-letter'; clientRequestId: string };
|
|
|
|
let _ch: BroadcastChannel | null = null;
|
|
|
|
function ch(): BroadcastChannel | null {
|
|
if (typeof window === 'undefined') return null;
|
|
if (!_ch) _ch = new BroadcastChannel(CHANNEL);
|
|
return _ch;
|
|
}
|
|
|
|
export function broadcast(msg: SyncMessage): void {
|
|
ch()?.postMessage(msg);
|
|
}
|
|
|
|
export function subscribeBroadcast(handler: (msg: SyncMessage) => void): () => void {
|
|
const c = ch();
|
|
if (!c) return () => {};
|
|
const listener = (e: MessageEvent<SyncMessage>) => handler(e.data);
|
|
c.addEventListener('message', listener);
|
|
return () => c.removeEventListener('message', listener);
|
|
}
|