Switched js-logger usage in demos for ps logger helper.

Chriztiaan · Chriztiaan · commit 4ad584e293be · 2025-04-16T12:14:07.000+02:00
diff --git a/demos/django-react-native-todolist/app/index.tsx b/demos/django-react-native-todolist/app/index.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ActivityIndicator, View } from 'react-native';
 import { router } from 'expo-router';
-import Logger from 'js-logger';
+import { createBaseLogger, LogLevels } from '@powersync/react-native';
 /**
  * This is the entry point when the app loads.
  * Checks for a Supabase session.
@@ -10,8 +10,9 @@ import Logger from 'js-logger';
  */
 const App = () => {
   React.useEffect(() => {
-    Logger.useDefaults();
-    Logger.setLevel(Logger.DEBUG);
+    const defaultLogger = createBaseLogger();
+    defaultLogger.useDefaults();
+    defaultLogger.setLevel(LogLevels.DEBUG);
 
     setImmediate(() => router.replace('signin'));
   }, []);
diff --git a/demos/django-react-native-todolist/package.json b/demos/django-react-native-todolist/package.json
@@ -27,7 +27,6 @@
     "expo-router": "3.5.21",
     "expo-splash-screen": "~0.27.4",
     "expo-status-bar": "~1.12.1",
-    "js-logger": "^1.6.1",
     "lodash": "^4.17.21",
     "metro": "~0.80.8",
     "react": "18.2.0",
diff --git a/demos/example-capacitor/package.json b/demos/example-capacitor/package.json
@@ -26,7 +26,6 @@
     "@journeyapps/wa-sqlite": "^1.2.0",
     "@powersync/react": "workspace:*",
     "@powersync/web": "workspace:*",
-    "js-logger": "^1.6.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.23.0"
diff --git a/demos/example-capacitor/src/components/providers/SystemProvider.tsx b/demos/example-capacitor/src/components/providers/SystemProvider.tsx
@@ -1,14 +1,14 @@
 import { PowerSyncContext } from '@powersync/react';
-import { PowerSyncDatabase } from '@powersync/web';
+import { createBaseLogger, LogLevels, PowerSyncDatabase } from '@powersync/web';
 import { CircularProgress } from '@mui/material';
-import Logger from 'js-logger';
 import React, { Suspense } from 'react';
 import { AppSchema } from '../../library/powersync/AppSchema.js';
 import { BackendConnector } from '../../library/powersync/BackendConnector.js';
 import { Capacitor } from '@capacitor/core';
 
-Logger.useDefaults();
-Logger.setLevel(Logger.DEBUG);
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 const platform = Capacitor.getPlatform();
 const isIOs = platform === 'ios';
diff --git a/demos/example-electron/package.json b/demos/example-electron/package.json
@@ -29,7 +29,6 @@
     "@powersync/react": "workspace:*",
     "@powersync/web": "workspace:*",
     "electron-squirrel-startup": "^1.0.0",
-    "js-logger": "^1.6.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.23.0"
diff --git a/demos/example-electron/src/components/providers/SystemProvider.tsx b/demos/example-electron/src/components/providers/SystemProvider.tsx
@@ -1,13 +1,13 @@
 import { PowerSyncContext } from '@powersync/react';
-import { PowerSyncDatabase } from '@powersync/web';
+import { createBaseLogger, LogLevels, PowerSyncDatabase } from '@powersync/web';
 import { CircularProgress } from '@mui/material';
-import Logger from 'js-logger';
 import React, { Suspense } from 'react';
 import { AppSchema } from '../../library/powersync/AppSchema.js';
 import { BackendConnector } from '../../library/powersync/BackendConnector.js';
 
-Logger.useDefaults();
-Logger.setLevel(Logger.DEBUG);
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 const powerSync = new PowerSyncDatabase({
   database: { dbFilename: 'powersync2.db' },
diff --git a/demos/example-nextjs/package.json b/demos/example-nextjs/package.json
@@ -20,7 +20,6 @@
     "@mui/material": "^5.15.18",
     "@powersync/react": "workspace:*",
     "@powersync/web": "workspace:*",
-    "js-logger": "^1.6.1",
     "lato-font": "^3.0.0",
     "lexical": "^0.15.0",
     "next": "14.2.3",
diff --git a/demos/example-nextjs/src/components/providers/SystemProvider.tsx b/demos/example-nextjs/src/components/providers/SystemProvider.tsx
@@ -3,14 +3,13 @@
 import { AppSchema } from '@/library/powersync/AppSchema';
 import { BackendConnector } from '@/library/powersync/BackendConnector';
 import { PowerSyncContext } from '@powersync/react';
-import { PowerSyncDatabase } from '@powersync/web';
+import { createBaseLogger, LogLevels, PowerSyncDatabase } from '@powersync/web';
 import { CircularProgress } from '@mui/material';
-import Logger from 'js-logger';
 import React, { Suspense } from 'react';
 
-// eslint-disable-next-line react-hooks/rules-of-hooks
-Logger.useDefaults();
-Logger.setLevel(Logger.DEBUG);
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 const powerSync = new PowerSyncDatabase({
   database: { dbFilename: 'powersync2.db' },
diff --git a/demos/example-vite-encryption/src/index.js b/demos/example-vite-encryption/src/index.js
@@ -1,7 +1,8 @@
-import { column, Schema, Table, PowerSyncDatabase } from '@powersync/web';
-import Logger from 'js-logger';
+import { column, Schema, Table, PowerSyncDatabase, createBaseLogger, LogLevels } from '@powersync/web';
 
-Logger.useDefaults();
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 const customers = new Table({ name: column.text });
 
diff --git a/demos/example-vite/src/index.js b/demos/example-vite/src/index.js
@@ -1,7 +1,8 @@
-import { column, Schema, Table, PowerSyncDatabase } from '@powersync/web';
-import Logger from 'js-logger';
+import { column, Schema, Table, PowerSyncDatabase, createBaseLogger, LogLevels } from '@powersync/web';
 
-Logger.useDefaults();
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 /**
  * A placeholder connector which doesn't do anything.
@@ -19,7 +20,7 @@ class DummyConnector {
   async uploadData(database) {}
 }
 
-const customers = new Table({ name: column.text })
+const customers = new Table({ name: column.text });
 
 export const AppSchema = new Schema({ customers });
 
diff --git a/demos/example-webpack/src/index.js b/demos/example-webpack/src/index.js
@@ -1,7 +1,8 @@
-import { Schema, Table, PowerSyncDatabase, column } from '@powersync/web';
-import Logger from 'js-logger';
+import { Schema, Table, PowerSyncDatabase, column, createBaseLogger, LogLevels } from '@powersync/web';
 
-Logger.useDefaults();
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 /**
  * A placeholder connector which doesn't do anything.
@@ -19,7 +20,7 @@ class DummyConnector {
   async uploadData(database) {}
 }
 
-const customers = new Table({ name: column.text })
+const customers = new Table({ name: column.text });
 
 export const AppSchema = new Schema({ customers });
 
diff --git a/demos/react-multi-client/package.json b/demos/react-multi-client/package.json
@@ -18,7 +18,6 @@
     "@webflow/webflow-cli": "^1.6.9",
     "async-mutex": "^0.5.0",
     "autoprefixer": "10.4.14",
-    "js-logger": "^1.6.1",
     "lodash": "^4.17.21",
     "postcss": "8.4.27",
     "react": "^18.2.0",
diff --git a/demos/react-multi-client/src/components/providers/SystemProvider.tsx b/demos/react-multi-client/src/components/providers/SystemProvider.tsx
@@ -6,10 +6,11 @@ import { PowerSyncContext, usePowerSync as _usePowerSync } from '@powersync/reac
 import { AppSchema } from '@/definitions/Schema';
 import { SupabaseConnector } from '@/library/SupabaseConnector';
 import { useSupabase } from './SupabaseProvider';
-import Logger from 'js-logger';
+import { createBaseLogger, LogLevels } from '@powersync/web';
 
-Logger.useDefaults();
-Logger.setLevel(Logger.DEBUG);
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 export interface SystemProviderProps {
   dbFilename: string;
@@ -34,7 +35,7 @@ const SystemProvider: React.FC<PropsWithChildren<SystemProviderProps>> = (props)
     powersync.init();
 
     const l = connector.registerListener({
-      initialized: () => {},
+      initialized: () => { },
       sessionStarted: async () => {
         await powersync.connect(connector);
       }
diff --git a/demos/react-native-supabase-group-chat/src/providers/PowerSync.tsx b/demos/react-native-supabase-group-chat/src/providers/PowerSync.tsx
@@ -1,13 +1,14 @@
 import '@azure/core-asynciterator-polyfill';
-import { PowerSyncContext, PowerSyncDatabase } from '@powersync/react-native';
-import Logger from 'js-logger';
+import { createBaseLogger, LogLevels, PowerSyncContext, PowerSyncDatabase } from '@powersync/react-native';
 import { ReactNode, useEffect, useMemo } from 'react';
 
 import { useAuth } from './AuthProvider';
 import { Connector } from '../lib/connector';
 import { schema } from '../lib/schema';
 
-Logger.useDefaults();
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 const connector = new Connector();
 
diff --git a/demos/react-native-supabase-todolist/app/index.tsx b/demos/react-native-supabase-todolist/app/index.tsx
@@ -3,14 +3,15 @@ import { ActivityIndicator, View } from 'react-native';
 
 import { useSystem } from '../library/powersync/system';
 import { router } from 'expo-router';
-import Logger from 'js-logger';
 
 import { ThemeProvider, createTheme } from '@rneui/themed';
+import { createBaseLogger, LogLevels } from '@powersync/react-native';
 
 const theme = createTheme({
   mode: 'light'
 });
 
+
 /**
  * This is the entry point when the app loads.
  * Checks for a Supabase session.
@@ -21,8 +22,10 @@ const App: React.FC = () => {
   const { supabaseConnector } = useSystem();
 
   React.useEffect(() => {
-    Logger.useDefaults();
-    Logger.setLevel(Logger.DEBUG);
+    const defaultLogger = createBaseLogger();
+    defaultLogger.useDefaults();
+    defaultLogger.setLevel(LogLevels.DEBUG);
+
     supabaseConnector.client.auth
       .getSession()
       .then(({ data }) => {
diff --git a/demos/react-native-supabase-todolist/library/powersync/system.ts b/demos/react-native-supabase-todolist/library/powersync/system.ts
@@ -1,19 +1,20 @@
 import '@azure/core-asynciterator-polyfill';
 
-import { PowerSyncDatabase } from '@powersync/react-native';
+import { createBaseLogger, LogLevels, PowerSyncDatabase } from '@powersync/react-native';
 import React from 'react';
 import { SupabaseStorageAdapter } from '../storage/SupabaseStorageAdapter';
 
 import { type AttachmentRecord } from '@powersync/attachments';
-import Logger from 'js-logger';
 import { KVStorage } from '../storage/KVStorage';
 import { AppConfig } from '../supabase/AppConfig';
 import { SupabaseConnector } from '../supabase/SupabaseConnector';
 import { AppSchema } from './AppSchema';
 import { PhotoAttachmentQueue } from './PhotoAttachmentQueue';
 import { configureFts } from '../fts/fts_setup';
 
-Logger.useDefaults();
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 export class System {
   kvStorage: KVStorage;
diff --git a/demos/react-native-supabase-todolist/package.json b/demos/react-native-supabase-todolist/package.json
@@ -33,7 +33,6 @@
     "expo-secure-store": "~13.0.1",
     "expo-splash-screen": "~0.27.6",
     "expo-status-bar": "~1.12.1",
-    "js-logger": "^1.6.1",
     "lodash": "^4.17.21",
     "metro": "~0.80.8",
     "react": "18.2.0",
diff --git a/demos/react-native-web-supabase-todolist/app/index.tsx b/demos/react-native-web-supabase-todolist/app/index.tsx
@@ -3,7 +3,6 @@ import { ActivityIndicator, View } from 'react-native';
 
 import { useSystem } from '../library/powersync/system';
 import { router } from 'expo-router';
-import Logger from 'js-logger';
 
 /**
  * This is the entry point when the app loads.
@@ -13,10 +12,8 @@ import Logger from 'js-logger';
  */
 const App: React.FC = () => {
   const { supabaseConnector } = useSystem();
-
   React.useEffect(() => {
-    Logger.useDefaults();
-    Logger.setLevel(Logger.DEBUG);
+
     supabaseConnector.client.auth
       .getSession()
       .then(({ data }) => {
diff --git a/demos/react-native-web-supabase-todolist/library/powersync/system.ts b/demos/react-native-web-supabase-todolist/library/powersync/system.ts
@@ -3,17 +3,18 @@ import '@azure/core-asynciterator-polyfill';
 import React from 'react';
 import { PowerSyncDatabase as PowerSyncDatabaseNative } from '@powersync/react-native';
 import { PowerSyncDatabase as PowerSyncDatabaseWeb, WASQLiteOpenFactory } from '@powersync/web';
-import { AbstractPowerSyncDatabase } from '@powersync/common';
+import { AbstractPowerSyncDatabase, createBaseLogger, LogLevels } from '@powersync/common';
 import { SupabaseStorageAdapter } from '../storage/SupabaseStorageAdapter';
 import { type AttachmentRecord } from '@powersync/attachments';
-import Logger from 'js-logger';
 import { KVStorage } from '../storage/KVStorage';
 import { AppConfig } from '../supabase/AppConfig';
 import { SupabaseConnector } from '../supabase/SupabaseConnector';
 import { AppSchema } from './AppSchema';
 import { PhotoAttachmentQueue } from './PhotoAttachmentQueue';
 
-Logger.useDefaults();
+const defaultLogger = createBaseLogger();
+defaultLogger.useDefaults();
+defaultLogger.setLevel(LogLevels.DEBUG);
 
 export class System {
   kvStorage: KVStorage;
diff --git a/demos/react-native-web-supabase-todolist/package.json b/demos/react-native-web-supabase-todolist/package.json
@@ -36,7 +36,6 @@
     "expo-secure-store": "~13.0.1",
     "expo-splash-screen": "~0.27.4",
     "expo-status-bar": "~1.12.1",
-    "js-logger": "^1.6.1",
     "lodash": "^4.17.21",
     "metro": "~0.80.8",
     "react": "18.2.0",
diff --git a/demos/react-supabase-todolist-optional-sync/package.json b/demos/react-supabase-todolist-optional-sync/package.json
@@ -19,7 +19,6 @@
     "@mui/x-data-grid": "^6.19.6",
     "@supabase/supabase-js": "^2.39.7",
     "formik": "^2.4.6",
-    "js-logger": "^1.6.1",
     "lodash": "^4.17.21",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
diff --git a/demos/react-supabase-todolist-optional-sync/src/components/providers/SystemProvider.tsx b/demos/react-supabase-todolist-optional-sync/src/components/providers/SystemProvider.tsx
@@ -1,9 +1,8 @@
-import { AppSchema, makeSchema, switchToSyncedSchema } from '@/library/powersync/AppSchema';
+import { makeSchema, switchToSyncedSchema } from '@/library/powersync/AppSchema';
 import { SupabaseConnector } from '@/library/powersync/SupabaseConnector';
 import { CircularProgress } from '@mui/material';
 import { PowerSyncContext } from '@powersync/react';
-import { PowerSyncDatabase } from '@powersync/web';
-import Logger from 'js-logger';
+import { createBaseLogger, LogLevels, PowerSyncDatabase } from '@powersync/web';
 import React, { Suspense } from 'react';
 import { NavigationPanelContextProvider } from '../navigation/NavigationPanelContext';
 import { getSyncEnabled } from '@/library/powersync/SyncMode';
@@ -26,15 +25,16 @@ export const SystemProvider = ({ children }: { children: React.ReactNode }) => {
   const [powerSync] = React.useState(db);
 
   React.useEffect(() => {
-    // Linting thinks this is a hook due to it's name
-    Logger.useDefaults(); // eslint-disable-line
-    Logger.setLevel(Logger.DEBUG);
+    const defaultLogger = createBaseLogger();
+    defaultLogger.useDefaults();
+    defaultLogger.setLevel(LogLevels.DEBUG);
+
     // For console testing purposes
     (window as any)._powersync = powerSync;
 
     powerSync.init();
     const l = connector.registerListener({
-      initialized: () => {},
+      initialized: () => { },
       sessionStarted: async () => {
         var isSyncMode = getSyncEnabled(dbName);
 
diff --git a/demos/react-supabase-todolist/package.json b/demos/react-supabase-todolist/package.json
@@ -19,7 +19,6 @@
     "@mui/x-data-grid": "^6.19.6",
     "@supabase/supabase-js": "^2.39.7",
     "formik": "^2.4.6",
-    "js-logger": "^1.6.1",
     "lodash": "^4.17.21",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
diff --git a/demos/react-supabase-todolist/src/components/providers/SystemProvider.tsx b/demos/react-supabase-todolist/src/components/providers/SystemProvider.tsx
diff --git a/demos/vue-supabase-todolist/package.json b/demos/vue-supabase-todolist/package.json
diff --git a/demos/vue-supabase-todolist/src/App.vue b/demos/vue-supabase-todolist/src/App.vue
diff --git a/demos/yjs-react-supabase-text-collab/package.json b/demos/yjs-react-supabase-text-collab/package.json
diff --git a/demos/yjs-react-supabase-text-collab/src/components/providers/SystemProvider.tsx b/demos/yjs-react-supabase-text-collab/src/components/providers/SystemProvider.tsx
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/tools/diagnostics-app/package.json b/tools/diagnostics-app/package.json
diff --git a/tools/diagnostics-app/src/library/powersync/ConnectionManager.ts b/tools/diagnostics-app/src/library/powersync/ConnectionManager.ts
