refactor(registry): cleanup registry

CONTRIBUTING.md

@@ -1,88 +1,144 @@
 # Contributing Guide
 
-Thank you for investing your time in contributing to our project! Any contribution you make will be reflected on [tablecn](<[table.sadmn.com](https://github.com/sadmann7/tablecn)>).
-
-In this guide you will get an overview of the contribution workflow from opening an issue, creating a PR, reviewing, and merging the PR.
+Thank you for investing your time in contributing to tablecn.
+
+If you have any questions, feel free to reach out to [@sadmann17](https://x.com/sadmann17).
+
+## Project Structure
+
+This repository contains two table implementations, each with its own hooks, components, and demo pages:
+
+- **Data Table**: a server-driven table for displaying db records with sorting, filtering, pagination, and read-only rows.
+- **Data Grid**: an interactive spreadsheet-like grid with inline editing, virtualized rows, keyboard navigation, live data updates, and multiplayer collaboration.
+
+```text
+src/
+├── app/
+│   ├── page.tsx                  # Data Table demo (home page)
+│   ├── data-grid/                # Data Grid demo
+│   ├── data-grid-live/           # Data Grid with live data sync (TanStack DB and TanStack Query)
+│   ├── data-grid-multiplayer/    # Data Grid with multiplayer collaboration (PartyKit)
+│   └── data-grid-render/         # Data Grid cell renderer showcase (internal)
+│
+├── components/
+│   ├── data-table/               # Data Table UI components (toolbar, filters, pagination…)
+│   ├── data-grid/                # Data Grid UI components (cells, menus, presence…)
+│   ├── layouts/                  # Site header and mobile navigation
+│   └── ui/                       # shadcn/ui primitives
+│
+├── hooks/
+│   ├── use-data-table.ts         # Data Table logic (sorting, filtering, pagination)
+│   ├── use-data-grid.ts          # Data Grid logic (editing, selection, virtualization…)
+│   └── use-multiplayer-room.ts   # PartyKit WebSocket connection and collection sync
+│
+├── db/                           # Drizzle schema, migrations, and seed scripts
+├── config/                       # Site config and navigation links
+└── styles/                       # Global styles
+
+party/                            # PartyKit server (runs separately via pnpm dev:multiplayer)
+├── index.ts                      # WebSocket server for connections, presence, and mutations
+├── types.ts                      # Shared message types (client ↔ server)
+├── constants.ts                  # Shared constants (colors, adjectives, animals…)
+└── seeds.ts                      # Initial seed data for the multiplayer room
+
+### Data Table vs Data Grid
+
+| | Data Table | Data Grid |
+| --- | --- | --- |
+| **Hook** | `use-data-table.ts` | `use-data-grid.ts` |
+| **Data source** | PostgreSQL (server actions) | In-memory / TanStack DB |
+| **Editing** | Read-only rows | Inline cell editing |
+| **Virtualization** | Pagination | Infinite scrolling |
+| **Real-time sync** | No | Yes (TanStack DB collection) |
+| **Multiplayer** | No | Yes (via PartyKit) |
 
 ## Getting started
 
 ### Fork the repository
 
-Fork the project [on GitHub](https://github.com/sadmann7/tablecn)
+Fork the project by clicking the fork button in the top right corner of the [tablecn](https://github.com/sadmann7/tablecn) repository.
 
 ### Clone the project
 
-Clone your fork locally. Do not clone the original repository unless you plan to become a long-term contributor and have been given permission to do so.
+```shell
+git clone https://github.com/<your-username>/tablecn
+```
+
+### Navigate to the project
 
 ```shell
-git clone https://github.com/sadmann7/tablecn
 cd tablecn
 ```
 
-### Install dependencies
+### Create a new branch
 
-Install the project dependencies:
+```shell
+git checkout -b add-kickflip
+```
+
+### Install dependencies
 
 ```shell
 pnpm install
 ```
 
-### Create a branch
+### Start the dev server
 
-Create and check out your feature branch:
+For the standard data table and data grid:
 
 ```shell
-git checkout -b my-new-feature
+pnpm dev
 ```
 
-### Make changes locally
+For the multiplayer data-grid:
 
-Make your changes to the codebase. See the [development guide](contributing/development.md) for more information.
+```shell
+pnpm dev:multiplayer
+```
 
 ### Commit your changes
 
-Commit your changes:
+When commiting your changes, use the following format:
 
-```shell
-git commit -m 'Add some feature'
+```text
+<type>(<scope>): <description>
 ```
 
-### Push your changes
+**Types:**
+
+- `feat` : a new feature
+- `fix` : a bug fix
+- `refactor` : code change that is neither a feature nor a bug fix
+- `perf` : performance improvement
+- `style` : formatting, missing semicolons, etc. (no logic change)
+- `test` : adding or updating tests
+- `docs` : documentation changes only
+- `chore` : build process, dependency updates, tooling
+
+**Scope:**
+Scope your commit to the part of the codebase that is affected, for example `data-table`, `data-grid`, `multiplayer`, `ui`, or `deps`.
 
-Push your changes to your fork:
+Examples:
 
 ```shell
-git push -u origin my-new-feature
+git commit -m "fix(data-table): add advanced filtering"
+git commit -m "feat(data-grid): add real-time collaboration"
 ```
 
 ### Create a pull request
 
-When you're finished with the changes, create a pull request, also known as a PR.
-
-- Fill the "Ready for review" template so that we can review your PR. This template helps reviewers understand your changes as well as the purpose of your pull request.
+When you're finished pushing your changes, open a pull request.
 
 ### Issues
 
 #### Create a new issue
 
-If you spot a problem in the codebase that you believe needs to be fixed, or you have an idea for a new feature, take a look at the [Issues](https://github.com/sadmann7/tablecn/issues).
+If you find an issue in the codebase that needs to be fixed, or you have an idea for a new feature, take a look at the [Issues](https://github.com/sadmann7/tablecn/issues).
 
-If you can't find an open issue addressing the problem, [open a new one](https://github.com/sadmann7/tablecn/issues/new). Be sure to include a title and clear description, as much relevant information as possible, and a code sample or an executable test case demonstrating the expected behavior that is not occurring.
+If you can't find an open issue addressing the problem, [open a new one](https://github.com/sadmann7/tablecn/issues/new).
 
 #### Solve an issue
 
-Scan through our [existing issues](https://github.com/sadmann7/tablecn/issues) to find one that interests you. You can narrow down the search using `labels` and `projects` to find issues that need attention.
-
-Then, fork the repository, create a branch, and make your changes.
-
-Finally, open a pull request with the changes.
-
-### Your PR is merged
-
-Congratulations :tada::tada: The GitHub team thanks you :sparkles:.
-
-Once your PR is merged, your contributions will be publicly visible on the [tablecn](https://github.com/sadmann7/tablecn).
-
-### Credits
+Search for an [existing issue](https://github.com/sadmann7/tablecn/issues) that interests you. You can narrow down the search using `labels` and `projects`.
 
-This Contributing Guide is adapted from [GitHub docs contributing guide](https://github.com/github/docs/blob/main/CONTRIBUTING.md?plain=1).
+Then, fork the repository, create a branch, make your changes, and open a pull request.

README.md

@@ -1,11 +1,9 @@
 # [tablecn](https://tablecn.com)
 
-This is a shadcn table component with server-side sorting, filtering, and pagination. It is bootstrapped with `create-t3-app`.
+Data table and data grid components built with shadcn/ui, featuring sorting, filtering, pagination, infinite scrolling, and real-time collaboration.
 
 [![tablecn](./public/images/screenshot.png)](https://tablecn.com)
 
-[![Vercel OSS Program](https://vercel.com/oss/program-badge.svg)](https://vercel.com/oss)
-
 ## Documentation
 
 See the [documentation](https://diceui.com/docs/components/data-table) to get started.
@@ -15,24 +13,27 @@ See the [documentation](https://diceui.com/docs/components/data-table) to get st
 - **Framework:** [Next.js](https://nextjs.org)
 - **Styling:** [Tailwind CSS](https://tailwindcss.com)
 - **UI Components:** [shadcn/ui](https://ui.shadcn.com)
-- **Table package:** [TanStack/react-table](https://tanstack.com/table/latest)
-- **Database:** [PlanetScale](https://planetscale.com)
+- **Table:** [TanStack Table](https://tanstack.com/table/latest)
+- **Reactive store:** [TanStack DB](https://tanstack.com/db/latest)
+- **Database:** [PostgreSQL](https://www.postgresql.org)
 - **ORM:** [Drizzle ORM](https://orm.drizzle.team)
 - **Validation:** [Zod](https://zod.dev)
+- **Multiplayer:** [PartyKit](https://partykit.io)
 
 ## Features
 
 - [x] Server-side pagination, sorting, and filtering
 - [x] Customizable columns
 - [x] Auto generated filters from column definitions
-- [x] Dynamic `Data-Table-Toolbar` with search, filters, and actions
 - [x] `Notion/Airtable` like advanced filtering
 - [x] `Linear` like filter menu for command palette filtering
 - [x] Action bar on row selection
+- [x] Infinite scrolling with virtualization
+- [x] Real-time collaboration
 
 ## Running Locally
 
-### Quick Setup (with docker)
+### Quick Setup (with Docker)
 
 1. **Clone the repository**
 
@@ -41,19 +42,19 @@ See the [documentation](https://diceui.com/docs/components/data-table) to get st
    cd tablecn
    ```
 
-2. **Copy the environment variables**
+1. **Copy the environment variables**
 
    ```bash
    cp .env.example .env
    ```
 
-3. **Run the setup**
+1. **Run the setup**
 
    ```bash
    pnpm ollie
    ```
 
-   This will install dependencies, start the Docker PostgreSQL instance, set up the database schema, and seed it with sample data.
+   This installs dependencies, starts the Docker PostgreSQL instance, pushes the schema, and seeds sample data.
 
 ### Manual Setup
 
@@ -64,49 +65,49 @@ See the [documentation](https://diceui.com/docs/components/data-table) to get st
    cd tablecn
    ```
 
-2. **Install dependencies**
+1. **Install dependencies**
 
    ```bash
    pnpm install
    ```
 
-3. **Set up environment variables**
+1. **Set up environment variables**
 
    ```bash
    cp .env.example .env
    ```
 
-   Update the `.env` file with your database credentials.
-
-4. **Choose your database approach:**
+   Update `.env` with your database credentials.
 
-   **Option A: Use Docker PostgreSQL**
+1. **Start the database and dev server**
 
    ```bash
-   # Start PostgreSQL container
-   pnpm db:start
-
-   # Set up database schema and seed data
-   pnpm db:setup
-
-   # Start development server
-   pnpm dev
+   pnpm db:start   # start the PostgreSQL container
+   pnpm db:setup   # push schema and seed data
+   pnpm dev        # start the Next.js dev server
    ```
 
-   **Option B: Use existing PostgreSQL database**
+### Multiplayer
 
-   ```bash
-   # Update .env with your database URL
-   # Then set up database schema and seed data
-   pnpm db:setup
-
-   # Start development server
-   pnpm dev
-   ```
+To run the multiplayer demo locally:
+
+```bash
+pnpm dev:multiplayer
+```
+
+This starts both the Next.js and PartyKit dev servers concurrently.
+
+## Deployment
+
+Follow the deployment guides for [Vercel](https://create.t3.gg/en/deployment/vercel), [Netlify](https://create.t3.gg/en/deployment/netlify), and [Docker](https://create.t3.gg/en/deployment/docker).
+
+The multiplayer demo uses [PartyKit](https://partykit.io) as a separate deployment:
 
-## How do I deploy this?
+```bash
+pnpm deploy:multiplayer
+```
 
-Follow the deployment guides for [Vercel](https://create.t3.gg/en/deployment/vercel), [Netlify](https://create.t3.gg/en/deployment/netlify) and [Docker](https://create.t3.gg/en/deployment/docker) for more information.
+Set `NEXT_PUBLIC_PARTYKIT_HOST` in your deployment environment variables after deploying.
 
 ## Credits
 

package.json

@@ -8,6 +8,7 @@
     "build": "next build",
     "dev": "next dev",
     "dev:multiplayer": "concurrently \"next dev\" \"partykit dev\"",
+    "deploy:multiplayer": "partykit deploy",
     "test": "vitest run",
     "dev:docker": "pnpm db:start && pnpm dev",
     "start": "next start",

party/constants.ts

@@ -1,3 +1,62 @@
+export const ADJECTIVES = [
+  "Swift",
+  "Bold",
+  "Calm",
+  "Daring",
+  "Eager",
+  "Fierce",
+  "Gentle",
+  "Happy",
+  "Icy",
+  "Jolly",
+  "Kind",
+  "Lively",
+  "Merry",
+  "Noble",
+  "Odd",
+  "Proud",
+  "Quiet",
+  "Rapid",
+  "Silly",
+  "Tiny",
+] as const;
+
+export const ANIMALS = [
+  "Badger",
+  "Bear",
+  "Crane",
+  "Deer",
+  "Eagle",
+  "Fox",
+  "Goat",
+  "Hawk",
+  "Ibis",
+  "Jay",
+  "Kite",
+  "Lamb",
+  "Mink",
+  "Newt",
+  "Otter",
+  "Puma",
+  "Quail",
+  "Raven",
+  "Seal",
+  "Tiger",
+] as const;
+
+export const COLORS = [
+  "#ef4444",
+  "#f97316",
+  "#eab308",
+  "#22c55e",
+  "#06b6d4",
+  "#3b82f6",
+  "#8b5cf6",
+  "#ec4899",
+  "#14b8a6",
+  "#f59e0b",
+] as const;
+
 export const STANCES = ["regular", "goofy"] as const;
 
 export const STYLES = [