bustikiller/wedding-planner-frontend
1
0
Fork 0
Code Issues 1 Pull Requests 8 Actions Packages Projects Releases Wiki Activity

Adapt the guests table to use the new API format
Some checks failed
Check usage of free licenses / build-static-assets (pull_request) Successful in 34s
Details
Add copyright notice / copyright_notice (pull_request) Successful in 39s
Details
Playwright Tests / test (pull_request) Failing after 4m43s
Details

Browse Source
This commit is contained in:
Manuel Bustillo 2024-11-16 00:45:45 +01:00
parent 03f2d87b6e
commit 567ce207cf
2 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/lib/definitions.ts
View File

@ -23,7 +23,7 @@ export type Guest = {
name: string; name: string;
group_name?: string; group_name?: string;
color?: string; color?: string;
status?: 'Considered' | 'Invited' | 'Confirmed' | 'Declined' | 'Tentative'; status?: 'considered' | 'invited' | 'confirmed' | 'declined' | 'tentative';
} }
export type Expense = { export type Expense = {

24
app/ui/guests/table.tsx
View File

@ -17,12 +17,12 @@ export default function guestsTable() {
fetch("/api/guests.json") fetch("/api/guests.json")
.then((response) => response.json()) .then((response) => response.json())
.then((data) => { .then((data) => {
setGuests(data.data.map((record: any) => { setGuests(data.map((record: any) => {
return ({ return ({
id: record.id, id: record.id,
name: record.attributes.name, name: record.name,
group_name: record.attributes.group_name, status: record.status,
status: record.attributes.status group_name: record.group.name,
}); });
})); }));
}, (error) => { }, (error) => {
@ -82,11 +82,11 @@ export default function guestsTable() {
<span className={clsx( <span className={clsx(
'flex w-2.5 h-2.5 rounded-full me-1.5 flex-shrink-0', 'flex w-2.5 h-2.5 rounded-full me-1.5 flex-shrink-0',
{ {
'bg-gray-400': guest.status === 'Considered', 'bg-gray-400': guest.status === 'considered',
'bg-blue-400': guest.status === 'Invited', 'bg-blue-400': guest.status === 'invited',
'bg-green-600': guest.status === 'Confirmed', 'bg-green-600': guest.status === 'confirmed',
'bg-red-400': guest.status === 'Declined', 'bg-red-400': guest.status === 'declined',
'bg-yellow-400': guest.status === 'Tentative', 'bg-yellow-400': guest.status === 'tentative',
} }
)}> )}>
</span> </span>
@ -94,13 +94,13 @@ export default function guestsTable() {
</span> </span>
</td> </td>
<td> <td>
{guest.status === 'Considered' && (<button data-guest-id={guest.id} onClick={handleInviteGuest} className={classNames('blue')}> {guest.status === 'considered' && (<button data-guest-id={guest.id} onClick={handleInviteGuest} className={classNames('blue')}>
Invite Invite
</button>)} </button>)}
{(guest.status === 'Invited' || guest.status === 'Tentative') && ( {(guest.status === 'invited' || guest.status === 'tentative') && (
<> <>
<button data-guest-id={guest.id} onClick={handleConfirmGuest} className={classNames('green')}>Confirm</button> <button data-guest-id={guest.id} onClick={handleConfirmGuest} className={classNames('green')}>Confirm</button>
{guest.status != 'Tentative' && <button data-guest-id={guest.id} onClick={handleTentativeGuest} className={classNames('yellow')}>Tentative</button>} {guest.status != 'tentative' && <button data-guest-id={guest.id} onClick={handleTentativeGuest} className={classNames('yellow')}>Tentative</button>}
<button data-guest-id={guest.id} onClick={handleDeclineGuest} className={classNames('red')}>Decline</button> <button data-guest-id={guest.id} onClick={handleDeclineGuest} className={classNames('red')}>Decline</button>
</> </>
)} )}