@@ -0,0 +1,68 @@
|
||||
"use client"
|
||||
|
||||
// The organization's parties, a page at a time. The server renders the first page (`seed`); a search
|
||||
// and "Show more" are reads made on a person's action, through the page's data client.
|
||||
|
||||
import type { ProjectSlugs } from "@conusai-kit/ui"
|
||||
import { useDataClient } from "@conusai-kit/ui/data"
|
||||
import { type ResourceColumn, ResourceList, useResourceList } from "@conusai-kit/ui/patterns"
|
||||
import type { ReactElement } from "react"
|
||||
import type { PartyView } from "../contract/index.js"
|
||||
|
||||
export interface PartyListLabels {
|
||||
readonly caption: string
|
||||
readonly empty: string
|
||||
readonly name: string
|
||||
readonly kind: string
|
||||
readonly country: string
|
||||
readonly person: string
|
||||
readonly organization: string
|
||||
/** `Open {name}`: the link's accessible name. */
|
||||
readonly open: string
|
||||
readonly search: string
|
||||
}
|
||||
|
||||
type Page = { rows: PartyView[]; after?: string | undefined }
|
||||
|
||||
export function PartyList({
|
||||
slugs,
|
||||
seed,
|
||||
listHref,
|
||||
labels,
|
||||
}: {
|
||||
slugs: ProjectSlugs
|
||||
seed: Page
|
||||
listHref: string
|
||||
labels: PartyListLabels
|
||||
}): ReactElement {
|
||||
const client = useDataClient()
|
||||
const { list } = useResourceList<PartyView>({
|
||||
seed,
|
||||
rowId: (party) => party.partyId,
|
||||
searchLabel: labels.search,
|
||||
read: async ({ q, after }) => {
|
||||
const input = { ...slugs, ...(q ? { q } : {}), ...(after ? { after } : {}) }
|
||||
return (await client.call<Page>("crm.party.list", input)).value
|
||||
},
|
||||
})
|
||||
const columns: ResourceColumn<PartyView>[] = [
|
||||
{ id: "displayName", header: labels.name, wrap: true, minWidth: "10rem" },
|
||||
{
|
||||
id: "kind",
|
||||
header: labels.kind,
|
||||
cell: (party) => (party.kind === "person" ? labels.person : labels.organization),
|
||||
},
|
||||
{ id: "country", header: labels.country },
|
||||
]
|
||||
return (
|
||||
<ResourceList
|
||||
{...list}
|
||||
label={labels.caption}
|
||||
columns={columns}
|
||||
rowHref={(party) => `${listHref}/${encodeURIComponent(party.partyId)}`}
|
||||
rowLinkLabel={(party) => labels.open.replace("{name}", party.displayName)}
|
||||
rowLabel={(party) => party.displayName}
|
||||
empty={{ title: labels.empty }}
|
||||
/>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user