Data Browser App

The Data Browser App is a developer-focused tool for browsing and managing RxDB database collections. Inspired by Parse Dashboard, it provides a clean, intuitive interface for viewing collection schemas, querying documents with advanced filters, inline editing, and performing CRUD operations on database records.

Key Features

Collection Browsing: View all available RxDB collections in a sidebar navigation
Advanced Filtering: Parse Dashboard-style filter builder with multiple operators
Inline Editing: Click-to-edit cells with automatic type detection and enum dropdowns
Schema-Aware Forms: Dynamic forms generated from collection schemas using react-jsonschema-form
Dual Connection Mode: Switch between local database and REST API modes
Server Management: Configure and manage multiple RxDB server connections
Batch Operations: Select and delete multiple documents at once
Pagination: Configurable page sizes with server-side pagination support

Target Users

User Type	Primary Use Cases
Developers	Debug data issues, inspect collection contents, test queries
Administrators	Manage database records, clean up test data, verify data integrity
Support Engineers	Investigate user-reported issues, view entity relationships
QA Engineers	Verify data persistence, validate schema compliance

Quick Links

Features & Capabilities - Detailed feature documentation
Getting Started - Set up and configure the app

Getting Started

The app uses a simple two-page navigation structure:

Collections (/collections) - Browse and edit collection data
Servers (/servers) - Manage RxDB server configurations

Connection Modes

The Data Browser supports two connection modes, toggled from the navbar:

Local Mode (default): Connects directly to the local RxDB database with replication
REST Mode: Connects to an RxDB server via REST API endpoints

Browsing Collections

Navigate to the Collections page
Select a collection from the sidebar
Use the filter bar to add query conditions
Click on cells to edit values inline
Use the "Add New" button to create documents

Managing Servers

Navigate to the Servers page
Click "Add Server" to configure a new connection
Enter server URL, authentication token, and domain ID
Set a server as active using the star icon
Switch to REST mode in the navbar to use the configured server

App Identity

Property	Value
Package	`@epicdm/flowstate-app-data-browser`
Base Path	`/data-browser`
Icon	database
Color	#06B6D4

@epicdm/flowstate-app-framework - App container framework
@epicdm/flowstate-collections - Database schemas
@epicdm/flowstate-rxdb - Database utilities