Fix type errors.

Author: rkistner

tools/diagnostics-app/src/app/views/layout.tsx

@@ -43,7 +43,7 @@ export default function ViewsLayout({ children }: { children: React.ReactNode })
   const powerSync = usePowerSync();
   const navigate = useNavigate();
 
-  const [syncStatus, setSyncStatus] = React.useState(sync.syncStatus);
+  const [syncStatus, setSyncStatus] = React.useState(sync?.syncStatus);
   const [syncError, setSyncError] = React.useState<Error | null>(null);
   const { title } = useNavigationPanel();
 
@@ -101,13 +101,13 @@ export default function ViewsLayout({ children }: { children: React.ReactNode })
 
   // Cannot use `useStatus()`, since we're not using the default sync implementation.
   React.useEffect(() => {
-    const l = sync.registerListener({
+    const l = sync?.registerListener({
       statusChanged: (status) => {
         setSyncStatus(status);
         setSyncError(status.dataFlowStatus.downloadError ?? null);
       }
     });
-    return () => l();
+    return () => l?.();
   }, []);
 
   const drawerWidth = 320;

tools/diagnostics-app/src/app/views/sync-diagnostics.tsx

@@ -82,7 +82,7 @@ export default function SyncDiagnosticsPage() {
     // Similar to db.currentState.hasSynced, but synchronized to the onChange events
     const { synced_at } = await db.get<{ synced_at: string | null }>('SELECT powersync_last_synced_at() as synced_at');
     setlastSyncedAt(synced_at ? new Date(synced_at + 'Z') : null);
-    if (synced_at != null && !sync.syncStatus.dataFlowStatus.downloading) {
+    if (synced_at != null && !sync?.syncStatus.dataFlowStatus.downloading) {
       // These are potentially expensive queries - do not run during initial sync
       const bucketRows = await db.getAll(BUCKETS_QUERY);
       const tableRows = await db.getAll(TABLES_QUERY);