From 9492a980809d11834a593c6d83c89cd41ec5cfdc Mon Sep 17 00:00:00 2001 From: James Arthur Date: Wed, 27 Nov 2024 19:25:04 +0100 Subject: [PATCH] examples: format. --- .../patterns/1-online-writes/index.tsx | 4 +- .../patterns/2-optimistic-state/index.tsx | 44 ++++++++++++++----- examples/write-patterns/shared/app/client.ts | 26 ++++++----- examples/write-patterns/vite.config.ts | 18 ++++---- 4 files changed, 57 insertions(+), 35 deletions(-) diff --git a/examples/write-patterns/patterns/1-online-writes/index.tsx b/examples/write-patterns/patterns/1-online-writes/index.tsx index 6e7706c6b0..91ca8e7fcd 100644 --- a/examples/write-patterns/patterns/1-online-writes/index.tsx +++ b/examples/write-patterns/patterns/1-online-writes/index.tsx @@ -35,7 +35,7 @@ export default function OnlineWrites() { const path = '/todos' const data = { id: uuidv4(), - title: title + title: title, } await api.request(path, 'POST', data) @@ -48,7 +48,7 @@ export default function OnlineWrites() { const data = { ...todo, - completed: !todo.completed + completed: !todo.completed, } await api.request(path, 'PUT', data) diff --git a/examples/write-patterns/patterns/2-optimistic-state/index.tsx b/examples/write-patterns/patterns/2-optimistic-state/index.tsx index e2494e0c89..2175fda4c6 100644 --- a/examples/write-patterns/patterns/2-optimistic-state/index.tsx +++ b/examples/write-patterns/patterns/2-optimistic-state/index.tsx @@ -32,7 +32,9 @@ export default function OptimisticState() { table: 'todos', }) - const sorted = data ? data.sort((a, b) => a.created_at.localeCompare(b.created_at)) : [] + const sorted = data + ? data.sort((a, b) => a.created_at.localeCompare(b.created_at)) + : [] // Use React's built in `useOptimistic` hook. This provides // a mechanism to apply local optimistic state whilst writes @@ -47,7 +49,9 @@ export default function OptimisticState() { : [...syncedTodos, value] case 'update': - return syncedTodos.map((todo) => todo.id === value.id ? value : todo) + return syncedTodos.map((todo) => + todo.id === value.id ? value : todo + ) case 'delete': return syncedTodos.filter((todo) => todo.id !== value.id) @@ -77,17 +81,25 @@ export default function OptimisticState() { const path = '/todos' const data = { id: uuidv4(), - title: title + title: title, } startTransition(async () => { addOptimisticState({ operation: 'insert', - value: {...data, completed: false, created_at: new Date().toISOString()} + value: { + ...data, + completed: false, + created_at: new Date().toISOString(), + }, }) const fetchPromise = api.request(path, 'POST', data) - const syncPromise = matchStream(stream, [`insert`], matchBy('id', data.id)) + const syncPromise = matchStream( + stream, + ['insert'], + matchBy('id', data.id) + ) await Promise.all([fetchPromise, syncPromise]) }) @@ -100,17 +112,21 @@ export default function OptimisticState() { const data = { ...todo, - completed: !todo.completed + completed: !todo.completed, } startTransition(async () => { addOptimisticState({ operation: 'update', - value: data + value: data, }) const fetchPromise = api.request(path, 'PUT', data) - const syncPromise = matchStream(stream, [`update`], matchBy('id', todo.id)) + const syncPromise = matchStream( + stream, + ['update'], + matchBy('id', todo.id) + ) await Promise.all([fetchPromise, syncPromise]) }) @@ -120,16 +136,20 @@ export default function OptimisticState() { event.preventDefault() const path = `/todos/${todo.id}` - const data = {...todo} + const data = { ...todo } startTransition(async () => { addOptimisticState({ operation: 'delete', - value: data + value: data, }) const fetchPromise = api.request(path, 'DELETE') - const syncPromise = matchStream(stream, [`delete`], matchBy('id', todo.id)) + const syncPromise = matchStream( + stream, + ['delete'], + matchBy('id', todo.id) + ) await Promise.all([fetchPromise, syncPromise]) }) @@ -181,4 +201,4 @@ export default function OptimisticState() { ) -} \ No newline at end of file +} diff --git a/examples/write-patterns/shared/app/client.ts b/examples/write-patterns/shared/app/client.ts index 40e4cca2a9..7500579930 100644 --- a/examples/write-patterns/shared/app/client.ts +++ b/examples/write-patterns/shared/app/client.ts @@ -12,7 +12,11 @@ const maxRetries = 32 const backoffMultiplier = 1.1 const initialDelayMs = 1_000 -async function retryFetch(url: string, options: RequestOptions, retryCount: number) { +async function retryFetch( + url: string, + options: RequestOptions, + retryCount: number +) { if (retryCount > maxRetries) { return } @@ -20,16 +24,17 @@ async function retryFetch(url: string, options: RequestOptions, retryCount: numb const delay = retryCount * backoffMultiplier * initialDelayMs return await new Promise((resolve) => { - setTimeout( - async () => { - resolve(await resilientFetch(url, options, retryCount)) - }, - delay - ) + setTimeout(async () => { + resolve(await resilientFetch(url, options, retryCount)) + }, delay) }) } -async function resilientFetch(url: string, options: RequestOptions, retryCount: number) { +async function resilientFetch( + url: string, + options: RequestOptions, + retryCount: number +) { try { const response = await fetch(url, options) @@ -39,8 +44,7 @@ async function resilientFetch(url: string, options: RequestOptions, retryCount: // Could also retry here if you want to be resilient // to 4xx and 5xx responses as well as network errors - } - catch (err) { + } catch (err) { return await retryFetch(url, options, retryCount + 1) } } @@ -62,4 +66,4 @@ async function request(path: string, method: string, data?: object) { return await resilientFetch(url, options, 0) } -export default { request } \ No newline at end of file +export default { request } diff --git a/examples/write-patterns/vite.config.ts b/examples/write-patterns/vite.config.ts index 1b698cc5b6..bf3321f2e1 100644 --- a/examples/write-patterns/vite.config.ts +++ b/examples/write-patterns/vite.config.ts @@ -9,11 +9,9 @@ export default defineConfig({ VitePWA({ registerType: 'autoUpdate', devOptions: { - enabled: true + enabled: true, }, - includeAssets: [ - 'shared/app/icons/*' - ], + includeAssets: ['shared/app/icons/*'], manifest: { name: 'Write Patterns Example - ElectricSQL ', short_name: 'Writes', @@ -23,15 +21,15 @@ export default defineConfig({ { src: './shared/app/icons/icon-192.png', sizes: '192x192', - type: 'image/png' + type: 'image/png', }, { src: './shared/app/icons/icon-512.png', sizes: '512x512', - type: 'image/png' - } - ] - } - }) + type: 'image/png', + }, + ], + }, + }), ], })