diff --git a/app/lib/definitions.ts b/app/lib/definitions.ts index 9b49c7e..52924fc 100644 --- a/app/lib/definitions.ts +++ b/app/lib/definitions.ts @@ -20,8 +20,17 @@ export type Guest = { id: string; name: string; email: string; + group_name: string; } +export type Group = { + id: string; + name: string; + guest_count: number; + icon: string; + children: Group[]; +}; + export type Invoice = { id: string; customer_id: string; diff --git a/app/ui/guests/affinity-groups-tree.tsx b/app/ui/guests/affinity-groups-tree.tsx index 95863da..5476850 100644 --- a/app/ui/guests/affinity-groups-tree.tsx +++ b/app/ui/guests/affinity-groups-tree.tsx @@ -1,27 +1,41 @@ 'use client' import React, { useState, useEffect, Suspense } from 'react'; -import { Tree } from 'primereact/tree'; +import { Tree, TreeNode } from 'primereact/tree'; import { PrimeIcons } from 'primereact/api'; import { debug } from 'console'; +import { Group } from '@/app/lib/definitions'; export default function AffinityGroupsTree() { const [nodes, setNodes] = useState([]); - const parseNode = (record: any, included: any[]) => { + + const groupToNode = (group: Group): TreeNode => { + return({ + key: group.id, + label: `${group.name} (${group.guest_count})`, + icon: group.icon, + children: group.children.map((child) => groupToNode(child)), + className: "px-4", + }) + } + + const parseNode = (record: any, included: any[]): Group => { if (!record.attributes) { record = included.find((a) => a.id === record.id); } - const children = (record?.relationships?.children?.data || []).map((child: any) => { + const children: Group[] = (record?.relationships?.children?.data || []).map((child: any) => { return (parseNode(child, included)); }); + const children_guest_count: number = children.reduce((acc: number, child: Group) => acc + child.guest_count, 0); + return ({ - key: record.id, - label: record.attributes.name, + id: record.id, + name: record.attributes.name, + guest_count: record.attributes.guest_count + children_guest_count, icon: record.attributes.icon, children: children, - className: "px-4", }) } @@ -34,7 +48,7 @@ export default function AffinityGroupsTree() { .then((response) => response.json()) .then((data) => { setNodes(data.data.map((record: any) => { - return (parseNode(record, data.included)); + return (groupToNode(parseNode(record, data.included))); })) }); }); diff --git a/app/ui/guests/table.tsx b/app/ui/guests/table.tsx index 6340b5c..2138350 100644 --- a/app/ui/guests/table.tsx +++ b/app/ui/guests/table.tsx @@ -19,6 +19,7 @@ export default function guestsTable() { id: record.id, name: record.attributes.name, email: record.attributes.email, + group_name: record.attributes.group_name }); })) }); @@ -37,7 +38,7 @@ export default function guestsTable() { Email