updates

Author: letstri

apps/app/src/entities/chat/sync.ts

@@ -3,9 +3,8 @@ import { persistedCollectionOptions } from '@tanstack/browser-db-sqlite-persiste
 import { electricCollectionOptions } from '@tanstack/electric-db-collection'
 import { BasicIndex, createCollection } from '@tanstack/react-db'
 import { type } from 'arktype'
-import { shapeOptions } from '~/lib/electric'
 import { orpc } from '~/lib/orpc'
-import { persistence } from '~/lib/sync'
+import { persistence, shapeOptions } from '~/lib/sync'
 
 export const chatsSchema = type({
   id: 'string',

apps/app/src/entities/connection/query.ts

@@ -4,6 +4,7 @@ import type { Connection, ConnectionResource } from '~/entities/connection/sync'
 import { isConnectionError } from '@conar/shared/utils/connections'
 import { SafeURL } from '@conar/shared/utils/safe-url'
 import { Result } from 'better-result'
+import { memoize } from 'memoza'
 import { createStore } from 'seitu'
 import { toast } from 'sonner'
 import { connectionStringStorage } from '~/lib/connection-string-storage'
@@ -20,7 +21,7 @@ export async function connectionToQueryParams(connection: Connection): Promise<Q
   }
 }
 
-export async function connectionResourceToQueryParams(connectionResource: ConnectionResource): Promise<QueryParams> {
+export const connectionResourceToQueryParams = memoize(async (connectionResource: ConnectionResource): Promise<QueryParams> => {
   const connection = connectionsCollection.get(connectionResource.connectionId)!
   const connectionString = new SafeURL(await connectionStringStorage.decrypt(connection.id))
   connectionString.pathname = connectionResource.name || ''
@@ -31,7 +32,7 @@ export async function connectionResourceToQueryParams(connectionResource: Connec
     resourceId: connectionResource.id,
     log: ({ promise, query, values }) => logQuery({ resourceId: connectionResource.id, promise, query, values }),
   }
-}
+})
 
 export interface QueryParams {
   connectionString: string

apps/app/src/entities/connection/sync.ts

@@ -6,9 +6,8 @@ import { electricCollectionOptions } from '@tanstack/electric-db-collection'
 import { BasicIndex, createCollection, createOptimisticAction } from '@tanstack/react-db'
 import { type } from 'arktype'
 import { connectionStringStorage } from '~/lib/connection-string-storage'
-import { shapeOptions } from '~/lib/electric'
 import { orpc } from '~/lib/orpc'
-import { persistence } from '~/lib/sync'
+import { persistence, shapeOptions } from '~/lib/sync'
 
 export const connectionsSchema = type({
   id: 'string',

apps/app/src/entities/connection/utils/fetching.ts

@@ -16,9 +16,9 @@ import { connectionsCollection } from '../sync'
 
 export async function prefetchConnectionResourceCore(connectionResource: ConnectionResource) {
   const connection = connectionsCollection.get(connectionResource.connectionId)!
-  const info = connectionStringStorage.get(connection.id)
+  const connectionString = connectionStringStorage.get(connection.id)
 
-  if (connection.passwordExists && !info?.metadata?.isPasswordPopulated) {
+  if (connection.passwordExists && !connectionString?.metadata?.isPasswordPopulated) {
     return
   }
 

apps/app/src/entities/query/sync.ts

@@ -2,9 +2,8 @@ import { persistedCollectionOptions } from '@tanstack/browser-db-sqlite-persiste
 import { electricCollectionOptions } from '@tanstack/electric-db-collection'
 import { BasicIndex, createCollection } from '@tanstack/react-db'
 import { type } from 'arktype'
-import { shapeOptions } from '~/lib/electric'
 import { orpc } from '~/lib/orpc'
-import { persistence } from '~/lib/sync'
+import { persistence, shapeOptions } from '~/lib/sync'
 
 export const queriesSchema = type({
   id: 'string',

apps/app/src/lib/auth.ts

@@ -4,8 +4,9 @@ import { bearer } from 'better-auth/plugins'
 import { createAuthClient } from 'better-auth/react'
 import { createWebStorageValue } from 'seitu/web'
 import { toast } from 'sonner'
+import { router } from '~/main'
 import { apiUrl } from '../utils/utils'
-import { clearDb } from './sync'
+import { connectionStringStorage } from './connection-string-storage'
 
 const BEARER_TOKEN_KEY = 'tamery.bearer_token'
 
@@ -61,6 +62,6 @@ export async function isSignedIn() {
 export async function fullSignOut() {
   await authClient.signOut()
   bearerToken.clear()
-  await clearDb()
-  window.location.reload()
+  router.navigate({ to: '/auth' })
+  await connectionStringStorage.clear()
 }

apps/app/src/lib/connection-string-storage.ts

@@ -7,13 +7,13 @@ import { memoize } from 'memoza'
 import { useSubscription } from 'seitu/react'
 import { createIndexedDbStorage } from 'seitu/web'
 
-const safeStorageAvailable = memoize(() => window.electron ? window.electron.safeStorage.isEncryptionAvailable() : false)
+const safeStorageAvailable = memoize(async () => window.electron ? window.electron.safeStorage.isEncryptionAvailable() : false)
 
 function importAesKey(raw: Uint8Array<ArrayBuffer>) {
   return crypto.subtle.importKey('raw', raw, { name: 'AES-GCM' }, false, ['encrypt', 'decrypt'])
 }
 
-const connectionsStringsStorage = createIndexedDbStorage({
+const storage = createIndexedDbStorage({
   databaseName: 'secure-storage',
   storeName: 'connections-strings',
   schemas: {
@@ -38,13 +38,13 @@ const connectionsStringsStorage = createIndexedDbStorage({
 })
 
 function resetEncryptionKey() {
-  return connectionsStringsStorage.set({ encryptionKey: null, connectionStrings: {} })
+  return storage.set({ encryptionKey: null, connectionStrings: {} })
 }
 
 const getEncryptionKey = memoize(async (): Promise<CryptoKey> => {
-  await connectionsStringsStorage.ready
+  await storage.ready
 
-  const stored = connectionsStringsStorage.get().encryptionKey
+  const stored = storage.get().encryptionKey
 
   if (stored instanceof CryptoKey)
     return stored
@@ -62,7 +62,7 @@ const getEncryptionKey = memoize(async (): Promise<CryptoKey> => {
     }
 
     const raw = crypto.getRandomValues(new Uint8Array(32))
-    await connectionsStringsStorage.set({ encryptionKey: await safeStorage.encryptString(bytesToBase64(raw)) })
+    await storage.set({ encryptionKey: await safeStorage.encryptString(bytesToBase64(raw)) })
     return importAesKey(raw)
   }
 
@@ -72,7 +72,7 @@ const getEncryptionKey = memoize(async (): Promise<CryptoKey> => {
     await resetEncryptionKey()
 
   const key = await crypto.subtle.generateKey({ name: 'AES-GCM', length: 256 }, false, ['encrypt', 'decrypt'])
-  await connectionsStringsStorage.set({ encryptionKey: key })
+  await storage.set({ encryptionKey: key })
   return key
 })
 
@@ -85,19 +85,19 @@ async function decryptConnectionString(encryptedConnectionString: string) {
 }
 
 export const connectionStringStorage = {
-  ready: connectionsStringsStorage.ready,
-  has: (id: string) => id in connectionsStringsStorage.get().connectionStrings,
-  get: (id: string) => connectionsStringsStorage.get().connectionStrings[id],
+  ready: storage.ready,
+  has: (id: string) => id in storage.get().connectionStrings,
+  get: (id: string) => storage.get().connectionStrings[id],
   decrypt: (id: string): Promise<string> => {
-    const record = connectionsStringsStorage.get().connectionStrings[id]
+    const record = connectionStringStorage.get(id)
     if (!record)
       throw new Error(`No connection string found for connection "${id}"`)
     return decryptConnectionString(record.encrypted)
   },
   set: async (id: string, connectionString: string) => {
     const url = new SafeURL(connectionString)
     const encrypted = await encryptConnectionString(connectionString)
-    await connectionsStringsStorage.set(prev => ({
+    await storage.set(prev => ({
       connectionStrings: {
         ...prev.connectionStrings,
         [id]: {
@@ -113,15 +113,15 @@ export const connectionStringStorage = {
     }))
   },
   remove: async (id: string) => {
-    await connectionsStringsStorage.set((prev) => {
+    await storage.set((prev) => {
       const connectionStrings = { ...prev.connectionStrings }
       delete connectionStrings[id]
       return { connectionStrings }
     })
   },
-  clear: () => connectionsStringsStorage.set({ connectionStrings: {} }),
+  clear: () => storage.set({ connectionStrings: {} }),
 }
 
 export function useConnectionString(id: string) {
-  return useSubscription(connectionsStringsStorage, { selector: state => state.connectionStrings[id] })
+  return useSubscription(storage, { selector: state => state.connectionStrings[id] })
 }

apps/app/src/lib/db.ts

@@ -1,22 +0,0 @@
-import type { ElectricCollectionConfig } from '@tanstack/electric-db-collection'
-import { snakeCamelMapper } from '@electric-sql/client'
-import { apiUrl } from '~/utils/utils'
-import { bearerToken } from './auth'
-
-export function shapeOptions(entity: string) {
-  return {
-    url: new URL(`/shapes/${entity}`, apiUrl).toString(),
-    columnMapper: snakeCamelMapper(),
-    liveSse: true,
-    headers: {
-      Authorization: () => {
-        const token = bearerToken.get()
-        return token ? `Bearer ${token}` : ''
-      },
-    },
-    fetchClient: ((url, init) => globalThis.fetch(url, {
-      ...init,
-      credentials: 'include',
-    })) as typeof fetch,
-  } satisfies ElectricCollectionConfig['shapeOptions']
-}

apps/app/src/lib/electric.ts

@@ -1,7 +1,11 @@
+import type { ElectricCollectionConfig } from '@tanstack/electric-db-collection'
 import { GITHUB_REPO_NAME } from '@conar/shared/constants'
+import { FetchError, snakeCamelMapper } from '@electric-sql/client'
 import { BrowserCollectionCoordinator, createBrowserWASQLitePersistence, openBrowserWASQLiteOPFSDatabase } from '@tanstack/browser-db-sqlite-persistence'
-import { connectionStringStorage } from '~/lib/connection-string-storage'
-import { posthog } from '~/lib/posthog'
+import { apiUrl } from '~/utils/utils'
+import { bearerToken } from './auth'
+import { connectionStringStorage } from './connection-string-storage'
+import { posthog } from './posthog'
 
 const DATABASE_NAME = `${GITHUB_REPO_NAME}.sqlite`
 
@@ -20,17 +24,29 @@ export const persistence = createBrowserWASQLitePersistence({
   schemaMismatchPolicy: 'reset',
 })
 
-if (import.meta.env.DEV) {
-  async function showCollectionData(name: string) {
-    const collections = await database.execute('SELECT * FROM collection_registry') as { collection_id: string, table_name: string, schema_version: number }[]
-    const collection = await database.execute(`SELECT * FROM ${collections.find(c => c.collection_id === name)?.table_name}`) as { key: string, metadata: unknown, row_version: number, value: string }[]
-
-    // eslint-disable-next-line no-console
-    console.log(collection.map(c => JSON.parse(c.value)))
-  }
+export function shapeOptions(entity: string) {
+  return {
+    url: new URL(`/shapes/${entity}`, apiUrl).toString(),
+    columnMapper: snakeCamelMapper(),
+    liveSse: true,
+    headers: {
+      Authorization: () => {
+        const token = bearerToken.get()
+        return token ? `Bearer ${token}` : ''
+      },
+    },
+    fetchClient: ((url, init) => globalThis.fetch(url, {
+      ...init,
+      credentials: 'include',
+    })) as typeof fetch,
+    onError(error) {
+      if (error instanceof FetchError && error.status === 401) {
+        return
+      }
 
-  // @ts-expect-error window is not typed
-  window.showCollection = showCollectionData
+      throw error
+    },
+  } satisfies ElectricCollectionConfig['shapeOptions']
 }
 
 export async function clearDb() {
@@ -52,3 +68,41 @@ export async function clearDb() {
   }
   await connectionStringStorage.clear()
 }
+
+async function getCollectionTableName(name: string) {
+  const collections = await database.execute('SELECT * FROM collection_registry') as { collection_id: string, table_name: string, schema_version: number }[]
+  const matching = collections.filter(c => c.collection_id === name)
+  if (matching.length === 0)
+    return undefined
+
+  return matching.toSorted((a, b) => b.schema_version - a.schema_version)[0]!.table_name
+}
+
+export async function truncateCollectionData(name: string) {
+  const tableName = await getCollectionTableName(name)
+  if (!tableName) {
+    return
+  }
+
+  await database.execute(`DELETE FROM ${tableName}`)
+
+  // eslint-disable-next-line no-console
+  console.log(`Truncated collection "${name}" (${tableName})`)
+}
+
+if (import.meta.env.DEV) {
+  async function showCollectionData(name: string) {
+    const tableName = await getCollectionTableName(name)
+    if (!tableName) {
+      return
+    }
+
+    const collection = await database.execute(`SELECT * FROM ${tableName}`) as { key: string, metadata: unknown, row_version: number, value: string }[]
+
+    // eslint-disable-next-line no-console
+    console.log(collection.map(c => JSON.parse(c.value)))
+  }
+
+  // @ts-expect-error window is not typed
+  window.showCollection = showCollectionData
+}