[Feat] Inertia Table

[RichardAnderson]

Inertia Table - Initial Setup

Summary

Introduces the forjedio/inertia-table package to replace the custom DataTable component with a backend-driven, declarative table system. Table columns, search, sorting, and pagination are now defined in PHP Table classes, with the frontend rendering handled by a shared VitoTable component built on shadcn/ui.

This PR migrates three tables as the initial rollout: Servers, Sites, and Hosted Domains.

Key Changes

Backend

• Table classes (app/Tables/) define columns, search fields, sorting, eager loading, and realtime settings in one place:
  • ServerTable - Servers list with name, IP, status columns. Searchable by name and IP.
  • SiteTable - Sites list with conditional server column (when viewing all sites vs server-scoped). Searchable by domain. Supports forServer() fluent setter.
  • HostedDomainTable - Domains list with type icons, SSL method enum, certificate details, expiry badge, and status. Custom ordering (primary domains first).
• Enums updated to implement HasTableDisplay (SiteStatus, ServerStatus, HostedDomainStatus, SslMethod) enabling automatic badge rendering with colors.
• Controllers simplified - query building, eager loading, and pagination moved into Table classes. Controllers now pass the base relation and call ->simplePaginate().

Frontend

• VitoTable component (resources/js/components/vito-table.tsx) - Headless rendering using useTable() hook with shadcn/ui table primitives. Supports actions, cellRenderers, onRowClick, and modal props. Badge displays are intercepted and rendered with the project's shadcn Badge component.
• vito-table-setup.ts - Registers global table hooks (realtime) and icons (lucide) at app boot.
• Column definition files removed - servers/components/columns.tsx, sites/components/columns.tsx, hosted-domains/components/columns.tsx are no longer needed. Custom cell rendering (actions, certificate details) is now inline in index pages.

Tables Migrated

Table	Search	Sort	Realtime	Custom Cells
Servers	name, IP	id, name, ip, created_at, status	Yes	Actions (view button)
Sites	domain	id, domain, type, created_at, status	Yes	Actions (warnings + view button)
Hosted Domains	-	domain, status	Yes	Certificate details, actions (edit/delete/activate/deactivate dropdown)

Realtime Updates

Table data is generated server-side in PHP (column values, enum colors, computed fields like warnings and SSL expiry). Because of this, raw WebSocket event payloads cannot be used to update individual rows in-place - they lack the computed display values that the Table class produces.

Instead, a global registerTableHook listens for socket events matching the table's realtime setting (e.g., server.updated, site.created). When an event is received, it calls refresh() which triggers an Inertia partial reload - fetching fresh table data from the server. This ensures all computed fields (enum badges, warnings, SSL expiry, icons) are always consistent.

The reload is debounced at 900ms to prevent multiple rapid socket events (e.g., bulk status changes) from triggering redundant server requests. Only the last event in a burst triggers the reload.

This approach trades a server round-trip per update for guaranteed data consistency. A future enhancement to the forjedio/inertia-table-react package could expose a setData function in the hook context, enabling in-place row updates where appropriate.

Files Created

• app/Tables/ServerTable.php
• app/Tables/SiteTable.php
• app/Tables/HostedDomainTable.php
• resources/js/components/vito-table.tsx
• resources/js/vito-table-setup.ts

Files Modified

• app/Enums/SiteStatus.php - Added HasTableDisplay
• app/Enums/ServerStatus.php - Added HasTableDisplay
• app/Enums/HostedDomainStatus.php - Added HasTableDisplay
• app/Enums/SslMethod.php - Added HasTableDisplay, updated getColor() and getText()
• app/Http/Controllers/ServerController.php - Uses ServerTable
• app/Http/Controllers/SiteController.php - Uses SiteTable
• app/Http/Controllers/HostedDomainController.php - Uses HostedDomainTable
• resources/js/pages/servers/index.tsx - Uses VitoTable
• resources/js/pages/sites/index.tsx - Uses VitoTable
• resources/js/pages/hosted-domains/index.tsx - Uses VitoTable with inline cellRenderers and actions
• resources/js/app.tsx - Imports vito-table-setup

Files Removed

• resources/js/pages/servers/components/columns.tsx
• resources/js/pages/sites/components/columns.tsx
• resources/js/pages/hosted-domains/components/columns.tsx

[Copilot]

Pull request overview

This PR introduces the forjedio/inertia-table (PHP) + @forjedio/inertia-table-react (React) packages and migrates existing list views from the custom DataTable approach to backend-declared Table classes rendered via a shared VitoTable component, with realtime refresh handled via a global table hook.

Changes:

• Add backend Table definitions for Servers, Sites, and Hosted Domains and update controllers to return InertiaTableData.
• Add VitoTable React component plus global setup (vito-table-setup.ts) for realtime refresh + icon registration.
• Migrate the Servers/Sites/Hosted Domains pages to use VitoTable and remove the old column-definition modules.

Reviewed changes

Copilot reviewed 21 out of 23 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
resources/js/vito-table-setup.ts	Registers table icons and a realtime table hook that debounces Inertia refresh on socket events.
resources/js/components/vito-table.tsx	New shared table renderer built on shadcn/ui and useTable() from the inertia-table React package.
resources/js/pages/servers/index.tsx	Migrates Servers listing to VitoTable with inline actions.
resources/js/pages/sites/index.tsx	Migrates Sites listing to VitoTable with inline warnings + action button rendering.
resources/js/pages/hosted-domains/index.tsx	Migrates Hosted Domains listing to VitoTable with inline certificate/actions UI.
resources/js/app.tsx	Imports vito-table-setup during client boot.
package.json	Adds @forjedio/inertia-table-react.
package-lock.json	Locks the new JS dependency and updates lock metadata.
composer.json	Adds forjedio/inertia-table.
composer.lock	Locks the new PHP dependency.
app/Tables/ServerTable.php	Adds server table definition (columns/search/realtime).
app/Tables/SiteTable.php	Adds site table definition including warnings computed server-side.
app/Tables/HostedDomainTable.php	Adds hosted domain table definition including icons and SSL-related computed/display fields.
app/Http/Controllers/ServerController.php	Switches Servers index to ServerTable.
app/Http/Controllers/SiteController.php	Switches Sites index to SiteTable (including server-scoped view).
app/Http/Controllers/HostedDomainController.php	Switches Hosted Domains index to HostedDomainTable.
app/Enums/ServerStatus.php	Adds HasTableDisplay implementation marker.
app/Enums/SiteStatus.php	Adds HasTableDisplay implementation marker.
app/Enums/HostedDomainStatus.php	Adds HasTableDisplay implementation marker.
app/Enums/SslMethod.php	Adds HasTableDisplay and modifies display text/color mapping.
resources/js/pages/servers/components/columns.tsx	Removed (no longer needed with backend-driven tables).
resources/js/pages/sites/components/columns.tsx	Removed (no longer needed with backend-driven tables).
resources/js/pages/hosted-domains/components/columns.tsx	Removed (no longer needed with backend-driven tables).

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[RichardAnderson]

@saeedvaziry bumped the version, updated the link