Function EntityGraphAlpinePlugin

Example

import Alpine from "alpinejs";
import { EntityGraphAlpinePlugin } from "@prometheus-ags/entity-graph-alpine";
import { registerEntityTransport, makeRestTransport } from "@prometheus-ags/entity-graph-core";

// 1. Register entity transports at app boot (once per type).
registerEntityTransport("Invoice", makeRestTransport({ supabase, table: "invoice" }));

// 2. Install the plugin.
Alpine.plugin(EntityGraphAlpinePlugin);

// 3. Start Alpine.
Alpine.start();
Copy

Then in HTML:

<div x-data="{ inv: $entity('Invoice', invoiceId) }">
  <span x-text="inv.data?.title ?? 'Loading…'"></span>
  <button @click="inv.refetch()">Refresh</button>
</div>

<div x-data="{ list: $entityList('Invoice', { queryKey: ['invoices'] }) }">
  <template x-for="item in list.items" :key="item.id">
    <span x-text="item.title"></span>
  </template>
  <button @click="list.loadMore()" x-show="list.hasNextPage">Load more</button>
</div>
Copy