Skip to content

Add SQLite File Inspector to Sync Diagnostics Client#846

Closed
bean1352 wants to merge 37 commits intomainfrom
feat/refactor-sync-diagnostics-client-inspector
Closed

Add SQLite File Inspector to Sync Diagnostics Client#846
bean1352 wants to merge 37 commits intomainfrom
feat/refactor-sync-diagnostics-client-inspector

Conversation

@bean1352
Copy link
Copy Markdown
Contributor

  • Add SQLite File Inspector: upload sqlite files to browse tables, views, indexes, and run SQL queries in-browser (via wa-sqlite MemoryAsyncVFS)
  • Rewrite DataTable with TanStack Table (pagination, sorting, mobile column hiding, custom cell renderers)
  • Add shared SQLConsoleCore component with query history (persisted in local DB), auto-LIMIT to prevent UI freezes on large result sets, and a ready prop to defer auto-execution until the database schema is applied
  • Add shared PowerSyncStats utility for consistent stat computation (Total Rows, Data Size, Metadata Size, CRUD Queue, Buckets) across sync diagnostics and file inspector
  • Add PowerSync stats cards to inspector overview with compacting/defragmentation alert and CRUD queue warning
  • Add stream subscription management: unsubscribe button, NewStreamSubscription modal fixes
  • Add FileDropZone component with drag-and-drop support for the inspector landing page
  • Consolidate duplicate formatBytes into shared @/lib/utils

…k/react-table for data handling. Improved SQL console with auto-limiting feature for query results.
…k/react-table for data handling. Improved SQL console with auto-limiting feature for query results.
…hub.com:powersync-ja/powersync-js into feat/refactor-sync-diagnostics-client-inspector
…for deferred query execution and implemented useSchemaReady hook to manage dynamic schema application before executing queries.
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Feb 11, 2026

🦋 Changeset detected

Latest commit: c8619df

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@powersync/diagnostics-app Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@bean1352 bean1352 requested a review from Chriztiaan February 11, 2026 11:38
@bean1352 bean1352 marked this pull request as ready for review February 11, 2026 14:16
Copy link
Copy Markdown
Collaborator

@stevensJourney stevensJourney left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks very nice! I left some comments.

Comment thread tools/diagnostics-app/src/app/views/shared/sql-console-core.tsx Outdated
Comment thread tools/diagnostics-app/src/app/views/shared/sql-console-core.tsx Outdated
try {
// Auto-limit queries without an explicit LIMIT to avoid fetching hundreds of thousands of rows
const hasLimit = /\bLIMIT\s+\d+/i.test(sql);
const effectiveSql = hasLimit ? sql : `${sql.replace(/;\s*$/, '')} LIMIT ${MAX_RESULT_ROWS + 1}`;
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The PR description mentions

auto-LIMIT to prevent UI freezes on large result sets

It looks like the results are displayed in a paged table with a configurable Rows per page. Is it just the fact that having >10_000 rows in memory makes the app slow, or is the table rendering widgets for all items (even those not visible)?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The 10k limit is mainly about memory, holding that many row objects in state slows the app down. Sorting also becomes very compute-heavy with too many rows, since TanStack Table re-sorts the entire dataset on every sort change.

Comment thread tools/diagnostics-app/src/app/views/shared/sql-console-core.tsx Outdated
Comment thread tools/diagnostics-app/src/app/views/shared/sql-console-core.tsx Outdated
Comment thread tools/diagnostics-app/src/app/views/sync-diagnostics.tsx Outdated
Comment thread tools/diagnostics-app/src/components/providers/SystemProvider.tsx
Comment thread tools/diagnostics-app/src/components/widgets/NewStreamSubscription.tsx Outdated
Comment thread tools/diagnostics-app/public/images/landing-page.png
Comment thread tools/diagnostics-app/src/routes/index.tsx Outdated
Comment thread tools/diagnostics-app/public/images/landing-page-new.png Outdated
Comment thread tools/diagnostics-app/src/app/views/shared/sql-console-core.tsx Outdated
Comment thread tools/diagnostics-app/src/app/views/sync-diagnostics.tsx Outdated
Comment thread tools/diagnostics-app/src/app/views/sync-diagnostics.tsx Outdated
Comment thread tools/diagnostics-app/src/app/views/sync-diagnostics.tsx Outdated
Comment thread tools/diagnostics-app/src/library/powersync/TokenConnector.ts Outdated
Comment thread .changeset/giant-ways-fix.md Outdated
@bean1352 bean1352 closed this Feb 17, 2026
@bean1352
Copy link
Copy Markdown
Contributor Author

Created new PR here: #854

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants