Compare commits

..

No commits in common. "main" and "group-affinities" have entirely different histories.

69 changed files with 947 additions and 2371 deletions

View File

@ -1,6 +1,8 @@
name: Build Nginx-based docker image name: Build Nginx-based docker image
on: on:
push: push:
branches:
- main
concurrency: concurrency:
group: ${{ github.ref }} group: ${{ github.ref }}
cancel-in-progress: true cancel-in-progress: true
@ -23,31 +25,12 @@ jobs:
username: ${{ secrets.PRIVATE_REGISTRY_USERNAME }} username: ${{ secrets.PRIVATE_REGISTRY_USERNAME }}
password: ${{ secrets.PRIVATE_REGISTRY_TOKEN }} password: ${{ secrets.PRIVATE_REGISTRY_TOKEN }}
- name: Build and push intermediate stages (deps) - name: Build and push
uses: docker/build-push-action@v6 uses: docker/build-push-action@v6
with: with:
context: . context: .
target: deps push: ${{ github.event_name != 'pull_request' }}
push: ${{ github.ref == 'refs/heads/main' }} tags: |
tags: ${{ secrets.PRIVATE_REGISTRY_HOST }}/${{ env.GITHUB_REPOSITORY }}:deps ${{ secrets.PRIVATE_REGISTRY_HOST }}/${{ env.GITHUB_REPOSITORY }}:latest
cache-from: type=registry,ref=${{ secrets.PRIVATE_REGISTRY_HOST }}/${{ env.GITHUB_REPOSITORY }}:deps cache-from: type=registry,ref=user/app:latest
cache-to: type=inline
- name: Build and push intermediate stages (builder)
uses: docker/build-push-action@v6
with:
context: .
target: builder
push: ${{ github.ref == 'refs/heads/main' }}
tags: ${{ secrets.PRIVATE_REGISTRY_HOST }}/${{ env.GITHUB_REPOSITORY }}:builder
cache-from: type=registry,ref=${{ secrets.PRIVATE_REGISTRY_HOST }}/${{ env.GITHUB_REPOSITORY }}:builder
cache-to: type=inline
- name: Build and push (final)
uses: docker/build-push-action@v6
with:
context: .
push: ${{ github.ref == 'refs/heads/main' }}
tags: ${{ secrets.PRIVATE_REGISTRY_HOST }}/${{ env.GITHUB_REPOSITORY }}:latest
cache-from: type=registry,ref=${{ secrets.PRIVATE_REGISTRY_HOST }}/${{ env.GITHUB_REPOSITORY }}:latest
cache-to: type=inline cache-to: type=inline

View File

@ -16,7 +16,7 @@ jobs:
ref: ${{ github.head_ref }} ref: ${{ github.head_ref }}
- uses: VinnyBabuManjaly/copyright-action@v1.0.0 - uses: VinnyBabuManjaly/copyright-action@v1.0.0
with: with:
CopyrightString: '/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/\n\n' CopyrightString: '/* Copyright (C) 2024 Manuel Bustillo*/\n\n'
FileType: '.tsx, .jsx, .ts' FileType: '.tsx, .jsx, .ts'
Path: 'app/, config/, db/' Path: 'app/, config/, db/'
IgnorePath: 'testfolder1/a/, testfolder3' IgnorePath: 'testfolder1/a/, testfolder3'

View File

@ -9,6 +9,7 @@ concurrency:
cancel-in-progress: true cancel-in-progress: true
jobs: jobs:
test: test:
if: false
timeout-minutes: 60 timeout-minutes: 60
runs-on: ubuntu-latest runs-on: ubuntu-latest
container: container:
@ -17,19 +18,14 @@ jobs:
- uses: actions/checkout@v4 - uses: actions/checkout@v4
- uses: actions/setup-node@v4 - uses: actions/setup-node@v4
with: with:
node-version-file: .nvmrc node-version: lts/*
- name: Install dependencies - name: Install dependencies
run: npm install -g pnpm && pnpm install run: npm install -g pnpm && pnpm install
- name: Build the service that will be tested - name: Build the service that will be tested
run: | run: npm run build
pnpm run build
cp -r public .next/standalone/
cp -r .next/static .next/standalone/.next/
- name: Install Playwright Browsers - name: Install Playwright Browsers
run: pnpm exec playwright install --with-deps run: pnpm exec playwright install --with-deps
- name: Run the service that will be tested - name: Run the service that will be tested
run: HOSTNAME=127.0.0.1 node .next/standalone/server.js & run: npm run start &
- name: Wait for the service to be ready
run: npx wait-on http://127.0.0.1:3000/default/ --timeout 30000
- name: Run Playwright tests - name: Run Playwright tests
run: pnpm exec playwright test run: pnpm exec playwright test

2
.nvmrc
View File

@ -1 +1 @@
24.3.0 23.5.0

View File

@ -1,6 +1,6 @@
# Based on https://github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile # Based on https://github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile
FROM node:24-alpine AS base FROM node:23-alpine AS base
# Install dependencies only when needed # Install dependencies only when needed
FROM base AS deps FROM base AS deps

View File

@ -1,6 +1,6 @@
# Based on https://github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile # Based on https://github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile
FROM node:24-alpine AS base FROM node:23-alpine AS base
# Install dependencies only when needed # Install dependencies only when needed
FROM base AS deps FROM base AS deps

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client' 'use client'

View File

@ -1,11 +1,10 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
import { AbstractApi, } from '@/app/api/abstract-api'; import { AbstractApi, } from '@/app/api/abstract-api';
import { Group, GroupSerializer } from '@/app/lib/group'; import { Group, GroupSerializer } from '@/app/lib/group';
import { Guest, GuestSerializer } from '@/app/lib/guest'; import { Guest, GuestSerializer } from '@/app/lib/guest';
import { getCsrfToken, getSlug } from '@/app/lib/utils';
import AffinitiesFormDialog from '@/app/ui/components/affinities-form-dialog'; import AffinitiesFormDialog from '@/app/ui/components/affinities-form-dialog';
import { classNames } from '@/app/ui/components/button'; import { classNames } from '@/app/ui/components/button';
import GroupFormDialog from '@/app/ui/components/group-form-dialog'; import GroupFormDialog from '@/app/ui/components/group-form-dialog';
@ -14,97 +13,36 @@ import GroupsTable from '@/app/ui/groups/table';
import SkeletonTable from '@/app/ui/guests/skeleton-row'; import SkeletonTable from '@/app/ui/guests/skeleton-row';
import GuestsTable from '@/app/ui/guests/table'; import GuestsTable from '@/app/ui/guests/table';
import { TabPanel, TabView } from 'primereact/tabview'; import { TabPanel, TabView } from 'primereact/tabview';
import { Toast } from 'primereact/toast'; import { Suspense, useState } from 'react';
import { Suspense, useEffect, useRef, useState } from 'react';
import InvitationsBoard from '@/app/ui/invitations/board';
import { Invitation, InvitationSerializer } from '@/app/lib/invitation';
import { Entity } from '@/app/lib/definitions';
export default function Page() { export default function Page() {
const [slug, setSlug] = useState<string>("default");
useEffect(() => {
setSlug(getSlug());
refreshGroups();
refreshGuests();
refreshInvitations();
}, []);
const toast = useRef<Toast>(null);
function refreshGuests() { function refreshGuests() {
new AbstractApi<Guest>().getAll(new GuestSerializer(), (objects: Guest[]) => { new AbstractApi<Guest>().getAll(new GuestSerializer(), (objects: Guest[]) => {
setGuests(objects); setGuests(objects);
setGuestsLoaded(true);
}); });
} }
function refreshGroups() { function refreshGroups() {
new AbstractApi<Group>().getAll(new GroupSerializer(), (objects: Group[]) => { new AbstractApi<Group>().getAll(new GroupSerializer(), (objects: Group[]) => {
setGroups(objects); setGroups(objects);
setGroupsLoaded(true);
}); });
} }
function refreshInvitations() { const [groupsLoaded, setGroupsLoaded] = useState(false);
new AbstractApi<Invitation>().getAll(new InvitationSerializer(), (objects: Invitation[]) => {
setInvitations(objects);
});
}
function resetAffinities() {
fetch(`/api/${slug}/groups/affinities/reset`, {
method: 'POST',
headers: {
'Accept': 'application/json',
'X-CSRF-TOKEN': getCsrfToken(),
}
})
.then(response => {
if (response.ok) {
showAffinitiesResetSuccess();
} else {
console.error('Failed to reset affinities');
}
})
.catch(error => {
console.error('Error resetting affinities:', error);
});
}
function showAffinitiesResetSuccess() {
toast.current?.show({
severity: 'success',
summary: 'Affinities reset',
detail: 'All affinities have been reset to default values.'
});
}
const [groups, setGroups] = useState<Array<Group>>([]); const [groups, setGroups] = useState<Array<Group>>([]);
const [groupBeingEdited, setGroupBeingEdited] = useState<Group | undefined>(undefined); const [groupBeingEdited, setGroupBeingEdited] = useState<Group | undefined>(undefined);
const [groupAffinitiesBeingEditted, setGroupAffinitiesBeingEditted] = useState<Group | undefined>(undefined); const [groupAffinitiesBeingEditted, setGroupAffinitiesBeingEditted] = useState<Group | undefined>(undefined);
const [guestsLoaded, setGuestsLoaded] = useState(false);
const [guests, setGuests] = useState<Array<Guest>>([]); const [guests, setGuests] = useState<Array<Guest>>([]);
const [guestBeingEdited, setGuestBeingEdited] = useState<Guest | undefined>(undefined); const [guestBeingEdited, setGuestBeingEdited] = useState<Guest | undefined>(undefined);
const [invitations, setInvitations] = useState<Array<Invitation>>([]); !groupsLoaded && refreshGroups();
!guestsLoaded && refreshGuests();
function updateList<T extends Entity>(originalList: T[], element: T): T[] {
{
const index = originalList.findIndex(g => g.id === element?.id);
if (index !== -1) {
// Replace existing element
return [
element!,
...originalList.slice(0, index),
...originalList.slice(index + 1)
];
} else {
// Add new element at the start
return [element!, ...originalList];
}
}
}
return ( return (
<div className="w-full"> <div className="w-full">
@ -115,10 +53,7 @@ export default function Page() {
<GuestFormDialog <GuestFormDialog
key={guestBeingEdited?.id} key={guestBeingEdited?.id}
groups={groups} groups={groups}
onCreate={(newGuest) => { onCreate={() => { refreshGuests(); setGuestBeingEdited(undefined) }}
setGuests(guests => updateList(guests, newGuest));
setGuestBeingEdited(undefined);
}}
guest={guestBeingEdited} guest={guestBeingEdited}
visible={guestBeingEdited !== undefined} visible={guestBeingEdited !== undefined}
onHide={() => { setGuestBeingEdited(undefined) }} onHide={() => { setGuestBeingEdited(undefined) }}
@ -135,19 +70,11 @@ export default function Page() {
<TabPanel header="Groups" leftIcon="pi pi-sitemap mx-2"> <TabPanel header="Groups" leftIcon="pi pi-sitemap mx-2">
<div className="flex flex-col w-full items-center justify-between"> <div className="flex flex-col w-full items-center justify-between">
<div> <button onClick={() => setGroupBeingEdited({})} className={classNames('primary')}>Add new</button>
<Toast ref={toast} />
<button onClick={() => setGroupBeingEdited({})} className={classNames('primary')}>Add new</button>
<button onClick={resetAffinities} className={classNames('yellow')}>Reset affinities</button>
</div>
<GroupFormDialog <GroupFormDialog
key={groupBeingEdited?.id} key={groupBeingEdited?.id}
groups={groups} groups={groups}
onCreate={(newGroup) => { onCreate={() => { refreshGroups(); setGroupBeingEdited(undefined) }}
setGroups(groups => updateList(groups, newGroup));
setGroupBeingEdited(undefined)
}}
group={groupBeingEdited} group={groupBeingEdited}
visible={groupBeingEdited !== undefined} visible={groupBeingEdited !== undefined}
onHide={() => { setGroupBeingEdited(undefined) }} onHide={() => { setGroupBeingEdited(undefined) }}
@ -170,9 +97,6 @@ export default function Page() {
</Suspense> </Suspense>
</div> </div>
</ TabPanel> </ TabPanel>
<TabPanel header="Invitations" leftIcon="pi pi-envelope mx-2">
<InvitationsBoard guests={guests} invitations={invitations} />
</TabPanel>
</ TabView> </ TabView>
</div> </div>

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import SideNav from '@/app/ui/dashboard/sidenav'; import SideNav from '@/app/ui/dashboard/sidenav';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client' 'use client'

View File

@ -1,42 +1,16 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
import { AbstractApi } from '@/app/api/abstract-api';
import { TableSimulation, TableSimulationSerializer } from '@/app/lib/tableSimulation';
import Arrangement from '@/app/ui/arrangements/arrangement'; import Arrangement from '@/app/ui/arrangements/arrangement';
import React, { useState } from 'react';
import ArrangementsTable from '@/app/ui/arrangements/arrangements-table'; import ArrangementsTable from '@/app/ui/arrangements/arrangements-table';
import { classNames } from '@/app/ui/components/button';
import { Toast } from 'primereact/toast';
import React, { useRef, useState } from 'react';
export default function Page() { export default function Page() {
const toast = useRef<Toast>(null);
const show = () => {
toast.current?.show({
severity: 'success',
summary: 'Simulation created',
detail: 'Table distributions will be calculated shortly, please come back in some minutes'
});
};
const [currentArrangement, setCurrentArrangement] = useState<string | null>(null); const [currentArrangement, setCurrentArrangement] = useState<string | null>(null);
function createSimulation() {
const api = new AbstractApi<TableSimulation>();
const serializer = new TableSimulationSerializer();
api.create(serializer, new TableSimulation(), show);
}
return ( return (
<> <>
<div className="flex flex-col w-full items-center justify-between">
<Toast ref={toast} />
<button onClick={createSimulation} className={classNames('primary')}>Add new</button>
</div>
<ArrangementsTable onArrangementSelected={setCurrentArrangement} /> <ArrangementsTable onArrangementSelected={setCurrentArrangement} />
{currentArrangement && <Arrangement key={currentArrangement} id={currentArrangement} />} {currentArrangement && <Arrangement key={currentArrangement} id={currentArrangement} />}
</> </>

View File

@ -1,65 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
'use client'
import { AbstractApi } from '@/app/api/abstract-api';
import { getSlug } from '@/app/lib/utils';
import { Website, WebsiteSerializer } from '@/app/lib/website';
import { useEffect, useState } from 'react';
import Tiptap from '../../../components/Tiptap';
export default function Page() {
const [website, setWebsite] = useState<Website>()
const api = new AbstractApi<Website>();
const serializer = new WebsiteSerializer();
const [slug, setSlug] = useState<string>("default");
useEffect(() => { setSlug(getSlug()) }, []);
const [iframeKey, setIframeKey] = useState<number>(Math.random());
const [timeoutId, setTimeoutId] = useState<NodeJS.Timeout | null>(null);
useEffect(() => {
api.get(serializer, undefined, (loadedWebsite) => {
setWebsite(loadedWebsite);
});
}, []);
const updateWebsite = (newContent: string) => {
// Debounce API update: send after 500ms of no further changes
if (timeoutId) {
clearTimeout(timeoutId);
}
setTimeoutId(
setTimeout(() => {
api.update(serializer, new Website('', newContent), () => {
setIframeKey(Math.random()); // Change key to force iframe reload
});
}, 500)
);
}
return (
<div className="flex">
<div className="w-1/2 border rounded-lg p-4">
<Tiptap
key={website?.content ?? 'empty'}
content={website?.content || ''}
onUpdate={updateWebsite}
/>
</div>
<div className="w-1/2 border rounded-lg p-4 ml-4">
<iframe
key={iframeKey}
src={`/${slug}/site`}
title="Website Preview"
className="w-full h-[80vh] rounded"
/>
</div>
</div>
);
}

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -16,12 +16,12 @@ export default async function Page() {
if (getCsrfToken() == 'unknown') { if (getCsrfToken() == 'unknown') {
retrieveCSRFToken(); retrieveCSRFToken();
} }
if (typeof window !== 'undefined') {
localStorage.setItem('slug', params.slug);
}
}, []); }, []);
if (typeof window !== 'undefined') {
localStorage.setItem('slug', await params.slug);
}
return ( return (
<main className="flex min-h-screen flex-col p-6"> <main className="flex min-h-screen flex-col p-6">
<div className="flex flex-row"> <div className="flex flex-row">

View File

@ -1,119 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
'use client'
import { AbstractApi } from "@/app/api/abstract-api";
import { Invitation, InvitationSerializer } from "@/app/lib/invitation";
import { useParams } from "next/navigation";
import { useEffect, useState } from "react";
import { FloatLabel } from "primereact/floatlabel";
import { Dropdown } from "primereact/dropdown";
import { Guest, GuestSerializer, GuestStatus } from "@/app/lib/guest";
import { Button } from "primereact/button";
type FormResponse = {
attendance: GuestStatus;
};
function GuestForm({ guest, idx }: { guest: Guest, idx: number }) {
const [response, setResponse] = useState<FormResponse>({
attendance: guest.status!
});
const [pendingChanges, setPendingChanges] = useState(false);
const [sending, setSending] = useState(false);
console.log('GuestForm response', response.attendance);
const attendanceOptions: { name: string, code: GuestStatus }[] = [
{
name: 'Attending',
code: 'confirmed'
},
{
name: 'Declined',
code: 'declined'
},
{
name: 'Tentative',
code: 'tentative'
}
];
const api = new AbstractApi<Guest>();
const serializer = new GuestSerializer();
const submitForm = () => {
setSending(true);
setPendingChanges(false);
api.update(serializer, {
id: guest.id!,
status: response.attendance,
}, () => setSending(false));
}
return (
<div
key={guest.id}
className={`px-2 py-6 flex flex-col items-center ${idx !== 0 ? 'border-t border-gray-300' : ''}`}
>
<h2 className="m-2 text-xl font-semibold">{guest.name}</h2>
<Dropdown
value={response.attendance}
options={attendanceOptions}
optionLabel="name"
optionValue="code"
className="rounded-md w-full max-w-xs border border-gray-300"
checkmark={true}
highlightOnSelect={false}
onChange={(e) => {
setPendingChanges(true);
setResponse({ ...response, attendance: e.value })
}}
/>
<Button
label="Save"
icon="pi pi-save"
loading={sending}
onClick={submitForm}
disabled={!pendingChanges || sending}
className="mt-4 max-w-xs"
/>
</div>
)
}
export default function Page() {
const params = useParams<{ slug: string, id: string }>()
const [invitation, setInvitation] = useState<Invitation>();
useEffect(() => {
localStorage.setItem('slug', params.slug);
const api = new AbstractApi<Invitation>();
const serializer = new InvitationSerializer();
api.get(serializer, params.id, (invitation: Invitation) => {
setInvitation(invitation);
});
}, []);
return (
<div className="flex flex-col items-center">
<h1 className="text-2xl font-bold mb-4">Invitation</h1>
{invitation ? (
<div>
<p>We have reserved {invitation.guests.length} seats in your honor. Please, confirm attendance submitting the following form:</p>
{invitation.guests.map((guest, idx) => (
<GuestForm key={guest.id} guest={guest} idx={idx} />
))}
</div>
) : (
<p>Loading...</p>
)}
</div>
);
}

View File

@ -1,41 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
import SideNav from '@/app/ui/dashboard/sidenav';
import Image from 'next/image';
export default function Layout({ children }: { children: React.ReactNode }) {
return (
<div className="flex h-screen flex-col">
<div className="w-full lg:h-72 h-36 relative">
<Image
src="/header.png"
alt="Header"
fill
style={{ objectFit: 'cover', objectPosition: 'center', zIndex: 0 }}
priority
/>
</div>
<div className="flex-grow flex items-center justify-center lg:p-24 py-8 bg-[#e1d5c7] relative">
<div className="absolute left-1/2 lg:top-24 top-8 z-10 -translate-x-1/2 -translate-y-1/2 flex justify-center w-full pointer-events-none w-12 h-12 lg:w-24 lg:h-24">
<Image
src="/stamp.png"
alt="Stamp"
width={120}
height={120}
className="object-contain"
priority
/>
</div>
<div className="max-w-4xl w-full h-full bg-[#f9f9f7] shadow-lg">
<div
className="max-w-4xl lg:m-6 m-3 lg:px-6 px-3 lg:py-24 py-2 border-2 border-[#d3d3d1] rounded-xl text-[#958971] flex justify-center"
style={{ height: 'calc(100% - 3rem)' }}
>
{children}
</div>
</div>
</div>
</div>
);
}

View File

@ -1,34 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
'use client'
import { AbstractApi } from '@/app/api/abstract-api';
import { Website, WebsiteSerializer } from '@/app/lib/website';
import { useState, useEffect } from 'react';
import DOMPurify from "dompurify";
import { useParams } from 'next/navigation';
export default function Page() {
const params = useParams<{ slug: string }>()
useEffect(() => {
if (typeof window !== 'undefined') {
localStorage.setItem('slug', params.slug);
}
}, []);
const [websiteContent, setWebsiteContent] = useState<string>("");
const api = new AbstractApi<Website>();
const serializer = new WebsiteSerializer();
useEffect(() => {
api.get(serializer, undefined, (loadedWebsite) => {
setWebsiteContent(loadedWebsite.content || "");
});
}, []);
return (
<div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(websiteContent) }} />
);
}

View File

@ -1,12 +1,12 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Entity } from '@/app/lib/definitions'; import { Entity } from '@/app/lib/definitions';
import { getCsrfToken, getSlug } from '@/app/lib/utils'; import { getCsrfToken, getSlug } from '@/app/lib/utils';
export interface Api<T extends Entity> { export interface Api<T extends Entity> {
getAll(serializable: Serializable<T>, callback: (objets: T[]) => void): void; getAll(serializable: Serializable<T> ,callback: (objets: T[]) => void): void;
get(serializable: Serializable<T>, id: string, callback: (object: T) => void): void; get(serializable: Serializable<T>, id: string, callback: (object: T) => void): void;
create(serializable: Serializable<T>, object: T, callback: (object: T) => void): void; create(serializable: Serializable<T>, object: T, callback: () => void): void;
update(serializable: Serializable<T>, object: T, callback: () => void): void; update(serializable: Serializable<T>, object: T, callback: () => void): void;
destroy(serializable: Serializable<T>, object: T, callback: () => void): void; destroy(serializable: Serializable<T>, object: T, callback: () => void): void;
} }
@ -30,9 +30,8 @@ export class AbstractApi<T extends Entity> implements Api<T> {
}); });
} }
get(serializable: Serializable<T>, id: (string | undefined), callback: (object: T) => void): void { get(serializable: Serializable<T>, id: string, callback: (object: T) => void): void {
const endpoint = id ? `/api/${getSlug()}/${serializable.apiPath()}/${id}` : `/api/${getSlug()}/${serializable.apiPath()}`; fetch(`/api/${getSlug()}/${serializable.apiPath()}/${id}`)
fetch(endpoint)
.then((response) => response.json()) .then((response) => response.json())
.then((data) => { .then((data) => {
callback(serializable.fromJson(data)); callback(serializable.fromJson(data));
@ -41,38 +40,27 @@ export class AbstractApi<T extends Entity> implements Api<T> {
}); });
} }
update(serializable: Serializable<T>, object: T, callback: (updatedObject: T) => void): void { update(serializable: Serializable<T>, object: T, callback: () => void): void {
const endpoint = object.id ? `/api/${getSlug()}/${serializable.apiPath()}/${object.id}` : `/api/${getSlug()}/${serializable.apiPath()}`; fetch(`/api/${getSlug()}/${serializable.apiPath()}/${object.id}`, {
fetch(endpoint, {
method: 'PUT', method: 'PUT',
body: serializable.toJson(object), body: serializable.toJson(object),
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': getCsrfToken(), 'X-CSRF-TOKEN': getCsrfToken(),
} }
}).then((response) => response.json()) }).then(callback)
.then((data) => {
callback(serializable.fromJson(data));
})
.catch((error) => console.error(error)); .catch((error) => console.error(error));
} }
create(serializable: Serializable<T>, object: T, callback: (createdObject: T) => void): void { create(serializable: Serializable<T>, object: T, callback: () => void): void {
fetch(`/api/${getSlug()}/${serializable.apiPath()}`, { fetch(`/api/${getSlug()}/${serializable.apiPath()}`, {
method: 'POST', method: 'POST',
body: serializable.toJson(object), body: serializable.toJson(object),
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': getCsrfToken(), 'X-CSRF-TOKEN': getCsrfToken(),
} }
}) }).then(callback)
.then((response) => response.json())
.then((data) => {
callback(serializable.fromJson(data));
})
.catch((error) => console.error(error)); .catch((error) => console.error(error));
} }

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { asArray, getCsrfToken, getSlug } from '@/app/lib/utils'; import { asArray, getCsrfToken, getSlug } from '@/app/lib/utils';
import { Captcha, StructuredErrors, User } from '@/app/lib/definitions'; import { Captcha, StructuredErrors, User } from '@/app/lib/definitions';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { data } from "autoprefixer"; import { data } from "autoprefixer";
import { getCsrfToken } from "../lib/utils"; import { getCsrfToken } from "../lib/utils";

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { NextResponse } from "next/server"; import { NextResponse } from "next/server";

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { TableArrangement } from '@/app/lib/definitions'; import { TableArrangement } from '@/app/lib/definitions';
import { getSlug } from '../lib/utils'; import { getSlug } from '../lib/utils';
@ -12,7 +12,6 @@ export function loadTableSimulations(onLoad?: (tableSimulations: TableArrangemen
id: record.id, id: record.id,
name: record.name, name: record.name,
discomfort: record.discomfort, discomfort: record.discomfort,
valid: record.valid,
}); });
})); }));
}, (error) => { }, (error) => {

View File

@ -1,22 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
'use client'
import { useEditor, EditorContent } from '@tiptap/react'
import StarterKit from '@tiptap/starter-kit'
const Tiptap = ({ content, onUpdate }: { content: string, onUpdate: (newContent:string) => void }) => {
const editor = useEditor({
extensions: [StarterKit],
content: content || '<p>Type something here...</p>',
onUpdate({ editor }) {
onUpdate(editor.getHTML());
},
immediatelyRender: false,
})
return <EditorContent editor={editor} />
}
export default Tiptap

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import '@/app/ui/global.css' import '@/app/ui/global.css'

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
export class Affinities { export class Affinities {
[key:string]: number; [key:string]: number;

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { AttendanceSummary } from "./group"; import { AttendanceSummary } from "./group";
import { Guest } from "./guest"; import { Guest } from "./guest";
@ -12,8 +12,7 @@ export type TableArrangement = {
number: number; number: number;
name: string; name: string;
guests?: Guest[]; guests?: Guest[];
discomfort?: number; discomfort?: number
valid?: boolean;
} }
export type User = { export type User = {

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Serializable } from "../api/abstract-api"; import { Serializable } from "../api/abstract-api";
import { Entity } from "./definitions"; import { Entity } from "./definitions";

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Entity } from "./definitions"; import { Entity } from "./definitions";

View File

@ -1,8 +1,7 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Serializable } from "../api/abstract-api"; import { Serializable } from "../api/abstract-api";
import { Entity } from "./definitions"; import { Entity } from "./definitions";
import { Group } from "./group";
export const guestStatuses = ['considered', 'invited', 'confirmed', 'declined', 'tentative'] as const; export const guestStatuses = ['considered', 'invited', 'confirmed', 'declined', 'tentative'] as const;
export type GuestStatus = typeof guestStatuses[number]; export type GuestStatus = typeof guestStatuses[number];
@ -10,28 +9,30 @@ export type GuestStatus = typeof guestStatuses[number];
export class Guest implements Entity { export class Guest implements Entity {
id?: string; id?: string;
name?: string; name?: string;
group_name?: string;
groupId?: string;
color?: string; color?: string;
status?: GuestStatus; status?: GuestStatus;
children?: Guest[]; children?: Guest[];
group?: Group;
constructor(id?: string, name?: string, color?: string, status?: GuestStatus, children?: Guest[], Group?: Group) { constructor(id?: string, name?: string, group_name?: string, groupId?: string, color?: string, status?: GuestStatus, children?: Guest[]) {
this.id = id; this.id = id;
this.name = name; this.name = name;
this.group_name = group_name;
this.groupId = groupId;
this.color = color; this.color = color;
this.status = status; this.status = status;
this.children = children; this.children = children;
this.group = Group;
} }
} }
export class GuestSerializer implements Serializable<Guest> { export class GuestSerializer implements Serializable<Guest> {
fromJson(data: any): Guest { fromJson(data: any): Guest {
return new Guest(data.id, data.name, data.color, data.status, data.children, new Group(data.group?.id, data.group?.name)); return new Guest(data.id, data.name, data.group?.name, data.group?.id, data.color, data.status, data.children);
} }
toJson(guest: Guest): string { toJson(guest: Guest): string {
return JSON.stringify({ guest: { name: guest.name, status: guest.status, group_id: guest.group?.id } }); return JSON.stringify({ guest: { name: guest.name, status: guest.status, group_id: guest.groupId } });
} }
apiPath(): string { apiPath(): string {

View File

@ -1,28 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
import { Entity } from "./definitions";
import { Guest } from "./guest";
export class Invitation implements Entity {
id?: string;
guests: Array<Guest>;
constructor(id?: string, guests: Array<Guest> = []) {
this.id = id;
this.guests = guests;
}
}
export class InvitationSerializer {
fromJson(data: any): Invitation {
return new Invitation(data.id, (data.guests || []).map((guest: any) => new Guest(guest.id, guest.name, guest.color, guest.status, guest.children)));
}
toJson(invitation: Invitation): string {
return JSON.stringify({ invitation: { guest_ids: invitation.guests.map(guest => guest.id) } });
}
apiPath(): string {
return 'invitations';
}
}

View File

@ -1,8 +1,7 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Serializable } from "../api/abstract-api"; import { Serializable } from "../api/abstract-api";
import { Entity } from "./definitions"; import { Entity } from "./definitions";
import { Group } from "./group";
import { Guest } from "./guest"; import { Guest } from "./guest";
export type Discomfort = { export type Discomfort = {
@ -20,12 +19,12 @@ export type Table = {
} }
export class TableSimulation implements Entity { export class TableSimulation implements Entity {
id?: string; id: string;
tables: Table[]; tables: Table[];
constructor(id?: string, tables?: Table[]) { constructor(id: string, tables: Table[]) {
this.id = id; this.id = id;
this.tables = tables || []; this.tables = tables;
} }
} }
@ -34,7 +33,7 @@ export class TableSimulationSerializer implements Serializable<TableSimulation>
return new TableSimulation(data.id, data.tables.map((table: any) => { return new TableSimulation(data.id, data.tables.map((table: any) => {
return { return {
number: table.number, number: table.number,
guests: table.guests.map((guest: any) => new Guest(guest.id, guest.name, guest.color, guest.status, [], guest.group)), guests: table.guests.map((guest: any) => new Guest(guest.id, guest.name, guest.group?.name, guest.group?.id, guest.color)),
discomfort: { discomfort: {
discomfort: table.discomfort.discomfort, discomfort: table.discomfort.discomfort,
breakdown: { breakdown: {
@ -54,10 +53,10 @@ export class TableSimulationSerializer implements Serializable<TableSimulation>
return { return {
id: guest.id, id: guest.id,
name: guest.name, name: guest.name,
group_id: guest.groupId,
color: guest.color, color: guest.color,
status: guest.status, status: guest.status,
children: guest.children, children: guest.children,
group: new Group(guest.group?.id, guest.group?.name)
} }
}), }),
discomfort: table.discomfort, discomfort: table.discomfort,

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
export const getCsrfToken = () => { export const getCsrfToken = () => {
return document.cookie return document.cookie

View File

@ -1,30 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
import { Serializable } from "../api/abstract-api";
import { Entity } from "./definitions";
export class Website implements Entity {
id?: string;
content?: string;
constructor(id: string, content: string) {
this.id = id;
this.content = content;
}
}
export class WebsiteSerializer implements Serializable<Website> {
fromJson(data: any): Website {
return new Website("", data.content);
}
toJson(website: Website): string {
return JSON.stringify({ website: { content: website.content } });
}
apiPath(): string {
return 'website';
}
}

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import * as HeroIcon from '@heroicons/react/24/outline' import * as HeroIcon from '@heroicons/react/24/outline'
import { ComponentProps } from 'react' import { ComponentProps } from 'react'

View File

@ -1,10 +1,11 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
import { AbstractApi } from '@/app/api/abstract-api'; import { AbstractApi } from '@/app/api/abstract-api';
import { TableArrangement } from '@/app/lib/definitions'; import { TableArrangement } from '@/app/lib/definitions';
import { TableSimulation, TableSimulationSerializer } from '@/app/lib/tableSimulation'; import { TableSimulation, TableSimulationSerializer } from '@/app/lib/tableSimulation';
import { getSlug } from '@/app/lib/utils';
import { Table } from '@/app/ui/components/table'; import { Table } from '@/app/ui/components/table';
import { lusitana } from '@/app/ui/fonts'; import { lusitana } from '@/app/ui/fonts';
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client' 'use client'
@ -7,57 +7,42 @@ import { TableArrangement } from '@/app/lib/definitions';
import { classNames } from "../components/button"; import { classNames } from "../components/button";
import TableOfContents from "../components/table-of-contents"; import TableOfContents from "../components/table-of-contents";
import { loadTableSimulations } from "@/app/api/tableSimulations"; import { loadTableSimulations } from "@/app/api/tableSimulations";
import { ArchiveBoxXMarkIcon, CheckBadgeIcon } from "@heroicons/react/24/outline";
import { Tooltip } from "primereact/tooltip";
import clsx from "clsx";
export default function ArrangementsTable({ onArrangementSelected }: { onArrangementSelected: (arrangementId: string) => void }) { export default function ArrangementsTable ({onArrangementSelected}: {onArrangementSelected: (arrangementId: string) => void}) {
const [arrangements, setArrangements] = useState<Array<TableArrangement>>([]); const [arrangements, setArrangements] = useState<Array<TableArrangement>>([]);
const [arrangementsLoaded, setArrangementsLoaded] = useState(false); const [arrangementsLoaded, setArrangementsLoaded] = useState(false);
function refreshSimulations() { function refreshSimulations() {
loadTableSimulations((arrangements) => { loadTableSimulations((arrangements) => {
setArrangements(arrangements); setArrangements(arrangements);
setArrangementsLoaded(true); setArrangementsLoaded(true);
}); });
} }
function arrangementClicked(e: React.MouseEvent<HTMLElement>) { function arrangementClicked(e: React.MouseEvent<HTMLElement>) {
onArrangementSelected(e.currentTarget.getAttribute('data-arrangement-id') || ''); onArrangementSelected(e.currentTarget.getAttribute('data-arrangement-id') || '');
} }
!arrangementsLoaded && refreshSimulations(); !arrangementsLoaded && refreshSimulations();
return ( return(
<TableOfContents <TableOfContents
headers={['Name', 'Discomfort', 'Actions', 'Status']} headers={['Name', 'Discomfort', 'Actions']}
caption='Simulations' caption='Simulations'
elements={arrangements} elements={arrangements}
rowRender={(arrangement) => ( rowRender={(arrangement) => (
<tr key={arrangement.id} className={clsx("border-b", { <tr key={arrangement.id} className="bg-white border-b odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800">
"bg-white odd:bg-white even:bg-gray-50": arrangement.valid, <th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
"bg-red-50 odd:bg-red-50 even:bg-red-100": !arrangement.valid {arrangement.name}
})}> </th>
<th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap"> <td className="px-6 py-4">
{arrangement.name} {arrangement.discomfort}
</th> </td>
<td className="px-6 py-4"> <td>
{arrangement.discomfort} <button data-arrangement-id={arrangement.id} onClick={arrangementClicked} className={classNames('primary')}>Load</button>
</td> </td>
<td> </tr>
<button data-arrangement-id={arrangement.id} onClick={arrangementClicked} className={classNames('primary')}>Load</button> )}
</td> />
<td> );
<Tooltip target=".tooltip-status" />
{
arrangement.valid ?
<CheckBadgeIcon className='size-6 tooltip-status' data-pr-position="right" data-pr-tooltip="Simulation is valid" /> :
<ArchiveBoxXMarkIcon className='size-6 tooltip-status' data-pr-position="right" data-pr-tooltip="Simulation is expired due to attendance or affinity changes" />
}
</td>
</tr>
)}
/>
);
} }

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import clsx from 'clsx'; import clsx from 'clsx';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -48,16 +48,6 @@ export default function AffinitiesFormDialog({ groups, group, visible, onHide }:
}); });
} }
function resetAffinities() {
fetch(`/api/${getSlug()}/groups/${group?.id}/affinities/default`, {
method: 'GET',
headers: {
'Accept': 'application/json',
}
}).then((response) => response.json())
.then(setAffinities);
}
return ( return (
<Dialog header="Update affinities" visible={visible} style={{ width: '60vw' }} onHide={onHide}> <Dialog header="Update affinities" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
{!isLoadingAffinities && <div className="card justify-evenly py-5 bg-gray-200 flex flex-col"> {!isLoadingAffinities && <div className="card justify-evenly py-5 bg-gray-200 flex flex-col">
@ -71,10 +61,7 @@ export default function AffinitiesFormDialog({ groups, group, visible, onHide }:
</div>) </div>)
} }
<div className="flex justify-center"> <button className={classNames('primary')} onClick={submitAffinities} >Update</button>
<button className={classNames('gray')} onClick={resetAffinities} >Reset</button>
<button className={classNames('primary')} onClick={submitAffinities} >Update</button>
</div>
</div> </div>
} }
</Dialog> </Dialog>

View File

@ -1,15 +1,14 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import clsx from "clsx"; import clsx from "clsx";
type ButtonColor = 'primary' | 'blue' | 'green' | 'red' | 'yellow' | 'gray'; type ButtonColor = 'primary' | 'blue' | 'green' | 'red' | 'yellow';
export function classNames(type: ButtonColor) { export function classNames(type: ButtonColor) {
return (clsx("text-white py-1 px-2 mx-1 rounded disabled:opacity-50 disabled:cursor-not-allowed", { return (clsx("text-white py-1 px-2 mx-1 rounded disabled:opacity-50 disabled:cursor-not-allowed", {
'bg-blue-400 hover:bg-blue-600': type === 'primary' || type === 'blue', 'bg-blue-400 hover:bg-blue-600': type === 'primary' || type === 'blue',
'bg-green-500 hover:bg-green-600': type === 'green', 'bg-green-500 hover:bg-green-600': type === 'green',
'bg-red-500 hover:bg-red-600': type === 'red', 'bg-red-500 hover:bg-red-600': type === 'red',
'bg-yellow-500 hover:bg-yellow-700': type === 'yellow', 'bg-yellow-500 hover:bg-yellow-700': type === 'yellow'
'bg-gray-500 hover:bg-gray-700': type === 'gray'
})) }))
} }

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import clsx from "clsx" import clsx from "clsx"
import { Icon } from "../../types"; import { Icon } from "../../types";

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';

View File

@ -1,16 +1,9 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Slider } from 'primereact/slider'; import { Slider } from 'primereact/slider';
export default function AffinitySlider({ value, onChange }: { value: number, onChange: (value: number) => void }) { export default function AffinitySlider({ value, onChange }: { value: number, onChange: (value: number) => void }) {
const toNumber = (value : number | [number, number]) => {
if(value instanceof Array) {
return value[0];
}
return value;
}
const label = (value: number) => { const label = (value: number) => {
if (value < 0.2) { if (value < 0.2) {
return 'Nemesis'; return 'Nemesis';
@ -31,7 +24,7 @@ export default function AffinitySlider({ value, onChange }: { value: number, onC
return ( return (
<> <>
<Slider value={value} min={0} max={2} step={.1} onChange={(e) => onChange(toNumber(e.value))} className='w-80 bg-gray-400' /> <Slider value={value} min={0} max={2} step={.1} onChange={(e) => onChange(e.value)} className='w-80 bg-gray-400' />
<span className="px-4 w-1/5"> <span className="px-4 w-1/5">
{label(value)} {label(value)}
</span> </span>

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import React, { useState } from 'react'; import React, { useState } from 'react';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -14,7 +14,7 @@ import { useState } from 'react';
export default function GroupFormDialog({ groups, onCreate, onHide, group, visible }: { export default function GroupFormDialog({ groups, onCreate, onHide, group, visible }: {
groups: Group[], groups: Group[],
onCreate?: (newGroup: Group) => void, onCreate?: () => void,
onHide: () => void, onHide: () => void,
group?: Group, group?: Group,
visible: boolean, visible: boolean,
@ -46,15 +46,15 @@ export default function GroupFormDialog({ groups, onCreate, onHide, group, visib
group.color = color; group.color = color;
group.parentId = parentId; group.parentId = parentId;
api.update(serializer, group, (newGroup) => { api.update(serializer, group, () => {
resetForm(); resetForm();
onCreate && onCreate(newGroup); onCreate && onCreate();
}); });
} else { } else {
api.create(serializer, new Group(undefined, name, undefined, icon, undefined, parentId, color), (newGroup) => { api.create(serializer, new Group(undefined, name, undefined, icon, undefined, parentId, color), () => {
resetForm(); resetForm();
onCreate && onCreate(newGroup); onCreate && onCreate();
}); });
} }
} }

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -15,14 +15,14 @@ import { useState } from 'react';
export default function GuestFormDialog({ groups, onCreate, onHide, guest, visible }: { export default function GuestFormDialog({ groups, onCreate, onHide, guest, visible }: {
groups: Group[], groups: Group[],
onCreate?: (guest: Guest) => void, onCreate?: () => void,
onHide: () => void, onHide: () => void,
guest?: Guest, guest?: Guest,
visible: boolean, visible: boolean,
}) { }) {
const [name, setName] = useState(guest?.name || ''); const [name, setName] = useState(guest?.name || '');
const [group, setGroup] = useState(guest?.group?.id || null); const [group, setGroup] = useState(guest?.groupId || null);
const [status, setStatus] = useState<GuestStatus | null>(guest?.status || null); const [status, setStatus] = useState<GuestStatus | null>(guest?.status || null);
const api = new AbstractApi<Guest>(); const api = new AbstractApi<Guest>();
@ -41,17 +41,17 @@ export default function GuestFormDialog({ groups, onCreate, onHide, guest, visib
if (guest?.id !== undefined) { if (guest?.id !== undefined) {
guest.name = name; guest.name = name;
guest.group!.id = group; guest.groupId = group;
guest.status = status; guest.status = status;
api.update(serializer, guest, (updatedGuest) => { api.update(serializer, guest, () => {
resetForm(); resetForm();
onCreate && onCreate(updatedGuest); onCreate && onCreate();
}); });
} else { } else {
api.create(serializer, new Guest(undefined, name, undefined, status, [], groups.find((g) => g.id === group)), (newGuest)=> { api.create(serializer, new Guest(undefined, name, undefined, group, undefined, status), ()=> {
resetForm(); resetForm();
onCreate && onCreate(newGuest); onCreate && onCreate();
}); });
} }
} }
@ -62,8 +62,8 @@ export default function GuestFormDialog({ groups, onCreate, onHide, guest, visib
<Dialog header="Add guest" visible={visible} style={{ width: '60vw' }} onHide={onHide}> <Dialog header="Add guest" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
<div className="card flex justify-evenly py-5"> <div className="card flex justify-evenly py-5">
<FloatLabel> <FloatLabel>
<InputText id="name" className='rounded-sm' value={name} onChange={(e) => setName(e.target.value)} /> <InputText id="username" className='rounded-sm' value={name} onChange={(e) => setName(e.target.value)} />
<label htmlFor="name">Name</label> <label htmlFor="username">Username</label>
</FloatLabel> </FloatLabel>
<FloatLabel> <FloatLabel>
<Dropdown id="group" className='rounded-sm min-w-32' value={group} onChange={(e) => setGroup(e.target.value)} options={ <Dropdown id="group" className='rounded-sm min-w-32' value={group} onChange={(e) => setGroup(e.target.value)} options={

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -15,9 +15,6 @@ export default function LoginForm() {
const [email, setEmail] = useState(""); const [email, setEmail] = useState("");
const [password, setPassword] = useState(""); const [password, setPassword] = useState("");
const [slug, setSlug] = useState<string>("default");
useEffect(() => {setSlug(getSlug())}, []);
const router = useRouter(); const router = useRouter();
const [currentUser, setCurrentUser] = useState<User | null>(null); const [currentUser, setCurrentUser] = useState<User | null>(null);
@ -44,7 +41,7 @@ export default function LoginForm() {
password: password, password: password,
onLogin: (user) => { onLogin: (user) => {
setCurrentUser(user); setCurrentUser(user);
router.push(`${slug}/dashboard`) router.push(`${getSlug()}/dashboard`)
} }
})}> })}>
Sign in Sign in

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -17,9 +17,7 @@ export default function RegistrationForm() {
const [email, setEmail] = useState<string>(""); const [email, setEmail] = useState<string>("");
const [password, setPassword] = useState<string>(""); const [password, setPassword] = useState<string>("");
const [passwordConfirmation, setPasswordConfirmation] = useState<string>(""); const [passwordConfirmation, setPasswordConfirmation] = useState<string>("");
const [slug, setSlug] = useState<string>(getSlug());
const [slug, setSlug] = useState<string>("default");
useEffect(() => { setSlug(getSlug()) }, []);
const [captchaId, setCaptchaId] = useState<string>(""); const [captchaId, setCaptchaId] = useState<string>("");
const [captchaUrl, setCaptchaUrl] = useState<string>(""); const [captchaUrl, setCaptchaUrl] = useState<string>("");

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
export default function TableOfContents<Type>({ headers, caption, elements, rowRender }: { headers: string[], caption: string, elements: Type[], rowRender: (element: Type) => JSX.Element }) { export default function TableOfContents<Type>({ headers, caption, elements, rowRender }: { headers: string[], caption: string, elements: Type[], rowRender: (element: Type) => JSX.Element }) {
return ( return (

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Guest } from "@/app/lib/guest"; import { Guest } from "@/app/lib/guest";
import { Table as TableType } from "@/app/lib/tableSimulation"; import { Table as TableType } from "@/app/lib/tableSimulation";

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { GlobalSummary as Summary} from '@/app/lib/definitions'; import { GlobalSummary as Summary} from '@/app/lib/definitions';
import { MainCard, SecondaryCard } from '../components/dashboard-cards'; import { MainCard, SecondaryCard } from '../components/dashboard-cards';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
export default function Loading() { export default function Loading() {
return <div>Loading...</div>; return <div>Loading...</div>;

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client' 'use client'
@ -6,30 +6,24 @@ import {
UserGroupIcon, UserGroupIcon,
RectangleGroupIcon, RectangleGroupIcon,
BanknotesIcon, BanknotesIcon,
GlobeAltIcon,
} from '@heroicons/react/24/outline'; } from '@heroicons/react/24/outline';
import Link from 'next/link'; import Link from 'next/link';
import { usePathname } from 'next/navigation'; import { usePathname } from 'next/navigation';
import clsx from 'clsx'; import clsx from 'clsx';
import { getSlug } from '@/app/lib/utils'; import { getSlug } from '@/app/lib/utils';
import { useEffect, useState } from 'react';
// Map of links to display in the side navigation. // Map of links to display in the side navigation.
// Depending on the size of the application, this would be stored in a database. // Depending on the size of the application, this would be stored in a database.
const links = [
{ name: 'Guests', href: `/${getSlug()}/dashboard/guests`, icon: UserGroupIcon },
{ name: 'Expenses', href: `/${getSlug()}/dashboard/expenses`, icon: BanknotesIcon },
{ name: 'Table distributions', href: `/${getSlug()}/dashboard/tables`, icon: RectangleGroupIcon },
];
export default function NavLinks() { export default function NavLinks() {
const pathname = usePathname(); const pathname = usePathname();
const [slug, setSlug] = useState<string>("default");
useEffect(() => { setSlug(getSlug()) }, []);
const links = [
{ name: 'Guests', href: `/${slug}/dashboard/guests`, icon: UserGroupIcon },
{ name: 'Expenses', href: `/${slug}/dashboard/expenses`, icon: BanknotesIcon },
{ name: 'Table distributions', href: `/${slug}/dashboard/tables`, icon: RectangleGroupIcon },
{ name: 'Website builder', href: `/${slug}/dashboard/website`, icon: GlobeAltIcon },
];
return ( return (
<> <>
{links.map((link) => { {links.map((link) => {

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -9,23 +9,15 @@ import { gloriaHallelujah } from '@/app/ui/fonts';
import { logout } from '@/app/api/authentication'; import { logout } from '@/app/api/authentication';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { getSlug } from '@/app/lib/utils'; import { getSlug } from '@/app/lib/utils';
import { useEffect, useState } from 'react';
export default function SideNav() { export default function SideNav() {
const router = useRouter(); const router = useRouter();
const [slug, setSlug] = useState<string>("default");
useEffect(() => { setSlug(getSlug()) }, []);
const [currentUser, setCurrentUser] = useState<{ email: string } | null>(null);
useEffect(() => { setCurrentUser(JSON.parse(localStorage.getItem('currentUser') || '{}')) }, []);
return ( return (
<div className="flex h-full flex-col px-3 py-4 md:px-2"> <div className="flex h-full flex-col px-3 py-4 md:px-2">
<Link <Link
className="mb-2 flex h-20 items-center justify-start rounded-md bg-blue-600 p-4 md:h-20" className="mb-2 flex h-20 items-center justify-start rounded-md bg-blue-600 p-4 md:h-20"
href={`/${slug}/dashboard`} href={`/${getSlug()}/dashboard`}
> >
<div className={`${gloriaHallelujah.className} "w-32 text-white md:w-40 antialiased`}> <div className={`${gloriaHallelujah.className} "w-32 text-white md:w-40 antialiased`}>
<h1>Wedding Planner</h1> <h1>Wedding Planner</h1>
@ -34,14 +26,14 @@ export default function SideNav() {
<div className="flex grow flex-row justify-between space-x-2 md:flex-col md:space-x-0 md:space-y-2"> <div className="flex grow flex-row justify-between space-x-2 md:flex-col md:space-x-0 md:space-y-2">
<NavLinks /> <NavLinks />
<div className="hidden h-auto w-full grow rounded-md bg-gray-50 md:block"></div> <div className="hidden h-auto w-full grow rounded-md bg-gray-50 md:block"></div>
<span>Logged in as {currentUser?.email}</span> <span>Logged in as {JSON.parse(localStorage.getItem('currentUser') || '{}').email}</span>
<button <button
className="flex h-[48px] w-full grow items-center justify-center gap-2 rounded-md bg-gray-50 p-3 text-sm font-medium hover:bg-sky-100 hover:text-blue-600 md:flex-none md:justify-start md:p-2 md:px-3" className="flex h-[48px] w-full grow items-center justify-center gap-2 rounded-md bg-gray-50 p-3 text-sm font-medium hover:bg-sky-100 hover:text-blue-600 md:flex-none md:justify-start md:p-2 md:px-3"
onClick={() => { onClick={() => {
logout({ logout({
onLogout: () => { onLogout: () => {
localStorage.clear(); localStorage.clear();
router.push(`/${slug}`); router.push(`/${getSlug()}`);
} }
}); });
}} }}

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client' 'use client'

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import { Inter, Lusitana, Gloria_Hallelujah} from 'next/font/google'; import { Inter, Lusitana, Gloria_Hallelujah} from 'next/font/google';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
@ -21,12 +21,7 @@ export default function GroupsTable({ groups, onUpdate, onEdit, onEditAffinities
const actions = (group: Group) => ( const actions = (group: Group) => (
<div className="flex flex-row items-center"> <div className="flex flex-row items-center">
<TrashIcon className='size-6 cursor-pointer' onClick={() => { <TrashIcon className='size-6 cursor-pointer' onClick={() => { api.destroy(serializer, group, onUpdate) }} />
if (window.confirm(`Are you sure you want to delete guest "${group.name}"?`)) {
api.destroy(serializer, group, onUpdate)
}
}}
/>
<PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(group)} /> <PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(group)} />
<AdjustmentsHorizontalIcon className='size-6 cursor-pointer' onClick={() => onEditAffinities(group)} /> <AdjustmentsHorizontalIcon className='size-6 cursor-pointer' onClick={() => onEditAffinities(group)} />
</div> </div>
@ -40,7 +35,6 @@ export default function GroupsTable({ groups, onUpdate, onEdit, onEditAffinities
return acc; return acc;
}, new Map()); }, new Map());
groups.forEach(group => group.children = []);
groups.forEach(group => { groups.forEach(group => {
if (group.parentId) { if (group.parentId) {
const parent = index.get(group.parentId); const parent = index.get(group.parentId);

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
import Skeleton from '@/app/ui/skeleton'; import Skeleton from '@/app/ui/skeleton';

View File

@ -1,9 +1,9 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';
import { AbstractApi } from '@/app/api/abstract-api'; import { AbstractApi } from '@/app/api/abstract-api';
import { Guest, GuestSerializer } from '@/app/lib/guest'; import { Guest , GuestSerializer} from '@/app/lib/guest';
import { PencilIcon, TrashIcon } from '@heroicons/react/24/outline'; import { PencilIcon, TrashIcon } from '@heroicons/react/24/outline';
import clsx from 'clsx'; import clsx from 'clsx';
import TableOfContents from '../components/table-of-contents'; import TableOfContents from '../components/table-of-contents';
@ -28,7 +28,7 @@ export default function guestsTable({ guests, onUpdate, onEdit }: {
{guest.name} {guest.name}
</td> </td>
<td className="px-6 py-4"> <td className="px-6 py-4">
{guest.group?.name} {guest.group_name}
</td> </td>
<td className="px-6 py-4"> <td className="px-6 py-4">
<span className="flex items-center text-sm dark:text-white me-3"> <span className="flex items-center text-sm dark:text-white me-3">
@ -48,12 +48,7 @@ export default function guestsTable({ guests, onUpdate, onEdit }: {
</td> </td>
<td> <td>
<div className="flex flex-row items-center"> <div className="flex flex-row items-center">
<TrashIcon className='size-6 cursor-pointer' onClick={() => { <TrashIcon className='size-6 cursor-pointer' onClick={() => { api.destroy(serializer, guest, onUpdate)}} />
if (window.confirm(`Are you sure you want to delete guest "${guest.name}"?`)) {
api.destroy(serializer, guest, onUpdate)
}
}}
/>
<PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(guest)} /> <PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(guest)} />
</div> </div>
</td> </td>

View File

@ -1,197 +0,0 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
'use client';
import { AbstractApi } from "@/app/api/abstract-api";
import { Guest } from "@/app/lib/guest";
import { Invitation, InvitationSerializer } from "@/app/lib/invitation";
import { getSlug } from "@/app/lib/utils";
import { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
import { LinkIcon, TrashIcon } from "@heroicons/react/24/outline";
import { useEffect, useRef } from "react";
import { useState } from "react";
function InvitationCard({ invitation, allGuests, onGuestAdded, onDestroy }: {
invitation: Invitation,
allGuests: Guest[],
onGuestAdded: (guest: Guest) => void,
onDestroy: (invitation: Invitation) => void
}
) {
const [guests, setGuests] = useState<Guest[]>(invitation.guests);
const ref = useRef<HTMLDivElement | null>(null);
const api = new AbstractApi<Invitation>();
const serializer = new InvitationSerializer();
const iconClassName = "w-5 h-5 text-white absolute top-2 opacity-0 group-hover:opacity-100 cursor-pointer";
useEffect(() => {
if (ref.current) {
return dropTargetForElements({
element: ref.current,
onDrop: (data) => {
const guestId = data.source.element.dataset.guestId;
if (guestId) {
const guestToAdd = allGuests.find((guest) => guest.id === guestId);
if (guestToAdd) {
setGuests((prevGuests) => [...prevGuests, guestToAdd]);
invitation.guests.push(guestToAdd);
api.update(serializer, invitation, () => {
onGuestAdded(guestToAdd);
});
}
}
},
});
}
}, []);
return (
<div
key={invitation.id}
ref={ref}
className="relative flex items-center justify-center w-full bg-green-800 border border-green-900 group"
style={{ aspectRatio: "1.618 / 1" }}
>
<LinkIcon
className={`${iconClassName} right-8`}
onClick={() => {
navigator.clipboard.writeText(`https://${window.location.host}/${getSlug()}/site/invitation/${invitation.id}`);
}}
/>
<TrashIcon
className={`${iconClassName} right-2`}
onClick={() => {
if (window.confirm("Are you sure you want to delete this invitation?")) {
api.destroy(serializer, invitation, () => {
onDestroy(invitation);
});
}
}}
/>
{guests.length === 0 ? (
<p className="text-center text-yellow-500 text-lg italic">
(empty invitation)
</p>
) : (
<ul className="text-center text-yellow-500 text-lg">
{guests.map((guest) => (
<li key={guest.id}>{guest.name}</li>
))}
</ul>
)}
</div>
)
}
function GuestCard(guest: Guest) {
const ref = useRef<HTMLDivElement | null>(null);
useEffect(() => {
if (ref.current) {
return draggable({
element: ref.current,
});
}
}, [guest.id]);
return (
<div
key={guest.id}
ref={ref}
className="mb-4 p-4 border border-gray-300 rounded-lg shadow-sm bg-white cursor-move"
draggable="true"
data-guest-id={guest.id}>
<h3 className="text-md font-medium">{guest.name}</h3>
</div>
)
}
export default function InvitationsBoard({ guests, invitations: originalInvitations }: {
guests: Array<Guest>,
invitations: Array<Invitation>
}) {
const api = new AbstractApi<Invitation>();
const serializer = new InvitationSerializer();
const [invitations, setInvitations] = useState<Invitation[]>(originalInvitations);
const [unassignedGuests, setUnassignedGuests] = useState<Guest[]>(
guests.filter(
(guest) =>
guest.status !== 'considered' &&
!invitations.some((invitation) =>
invitation.guests.some((invitedGuest) => invitedGuest.id === guest.id)
)
)
);
// Sort invitations to display those without guests at the top
const sortedInvitations = [...invitations].sort((a, b) => {
if (a.guests.length === 0 && b.guests.length > 0) return -1;
if (a.guests.length > 0 && b.guests.length === 0) return 1;
return 0;
});
function handleCreateInvitation() {
api.create(serializer, new Invitation(), (createdInvitation) => {
setInvitations((prevInvitations) => [createdInvitation, ...prevInvitations]);
});
}
return (
<div className="flex h-screen">
{/* Left Column: Guests */}
<div className="w-1/4 h-full overflow-auto border-r border-gray-300 p-4">
<h2 className="text-lg font-semibold mb-4">{unassignedGuests.length} guests without invitation</h2>
<div>
{unassignedGuests.map((guest) => (
<GuestCard key={guest.id} {...guest} />
))}
</div>
</div>
{/* Right Column: Invitations */}
<div className="w-3/4 h-full overflow-auto p-4">
<h2 className="text-lg font-semibold mb-4">
{invitations.length} invitations
</h2>
<button
onClick={handleCreateInvitation}
className="mb-4 px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600"
>
Create New Invitation
</button>
<div className="grid grid-cols-4 gap-6">
{sortedInvitations.map((invitation) => (
<InvitationCard
key={invitation.id}
invitation={invitation}
allGuests={guests}
onGuestAdded={(guestAdded: Guest) => {
setUnassignedGuests((prevUnassignedGuests) => prevUnassignedGuests.filter(g => g.id !== guestAdded.id));
}}
onDestroy={(invitationToDestroy: Invitation) => {
setInvitations((prevInvitations) => prevInvitations.filter(i => i.id !== invitationToDestroy.id));
setUnassignedGuests((prevUnassignedGuests) => [
...prevUnassignedGuests,
...invitationToDestroy.guests
]);
}}
/>
))}
</div>
</div>
</div>
);
}

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
'use client'; 'use client';

View File

@ -1,4 +1,4 @@
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/ /* Copyright (C) 2024 Manuel Bustillo*/
export default function Skeleton({ className }: { className: string }) { export default function Skeleton({ className }: { className: string }) {
return <div className={`bg-slate-200 motion-safe:animate-pulse rounded ${className}`} />; return <div className={`bg-slate-200 motion-safe:animate-pulse rounded ${className}`} />;

View File

@ -6,39 +6,33 @@
"start": "next start" "start": "next start"
}, },
"dependencies": { "dependencies": {
"@atlaskit/pragmatic-drag-and-drop": "^1.7.0",
"@heroicons/react": "^2.1.4", "@heroicons/react": "^2.1.4",
"@tailwindcss/forms": "^0.5.7", "@tailwindcss/forms": "^0.5.7",
"@tiptap/pm": "^2.14.0", "autoprefixer": "10.4.20",
"@tiptap/react": "^2.14.0", "bcrypt": "^5.1.1",
"@tiptap/starter-kit": "^2.14.0",
"autoprefixer": "10.4.21",
"bcrypt": "^6.0.0",
"clsx": "^2.1.1", "clsx": "^2.1.1",
"dompurify": "^3.2.6", "next": "15.1.2",
"next": "15.3.4", "next-auth": "5.0.0-beta.25",
"next-auth": "5.0.0-beta.29", "postcss": "8.4.49",
"postcss": "8.5.6",
"primeicons": "^7.0.0", "primeicons": "^7.0.0",
"primereact": "^10.8.2", "primereact": "^10.8.2",
"react": "19.0.0-rc-f38c22b244-20240704", "react": "19.0.0-rc-f38c22b244-20240704",
"react-dom": "19.0.0-rc-f38c22b244-20240704", "react-dom": "19.0.0-rc-f38c22b244-20240704",
"tailwindcss": "3.4.17", "tailwindcss": "3.4.17",
"typescript": "5.8.3", "typescript": "5.7.2",
"use-debounce": "^10.0.1", "use-debounce": "^10.0.1",
"uuid": "11.1.0", "uuid": "11.0.3",
"zod": "^3.23.8" "zod": "^3.23.8"
}, },
"devDependencies": { "devDependencies": {
"@playwright/test": "^1.52.0", "@playwright/test": "^1.46.0",
"@types/bcrypt": "^5.0.2", "@types/bcrypt": "^5.0.2",
"@types/node": "24.0.7", "@types/node": "22.10.2",
"@types/react": "18.3.23", "@types/react": "18.3.18",
"@types/react-dom": "18.3.7", "@types/react-dom": "18.3.5"
"wait-on": "^8.0.3"
}, },
"engines": { "engines": {
"node": ">=23.0.0" "node": ">=23.0.0"
}, },
"packageManager": "pnpm@10.12.3+sha512.467df2c586056165580ad6dfb54ceaad94c5a30f80893ebdec5a44c5aa73c205ae4a5bb9d5ed6bb84ea7c249ece786642bbb49d06a307df218d03da41c317417" "packageManager": "pnpm@9.15.1+sha512.1acb565e6193efbebda772702950469150cf12bcc764262e7587e71d19dc98a423dff9536e57ea44c49bdf790ff694e83c27be5faa23d67e0c033b583be4bfcf"
} }

View File

@ -43,6 +43,11 @@ export default defineConfig({
use: { ...devices['Desktop Firefox'] }, use: { ...devices['Desktop Firefox'] },
}, },
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
/* Test against mobile viewports. */ /* Test against mobile viewports. */
// { // {
// name: 'Mobile Chrome', // name: 'Mobile Chrome',

1838
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

Binary file not shown.

Before

Width:  |  Height:  |  Size: 506 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 45 KiB

View File

@ -1,82 +0,0 @@
import { test, expect, Page } from '@playwright/test'
import mockGroupsAPI from './mocks/groups';
import mockGuestsAPI from './mocks/guests';
test('should allow CRUD on groups', async ({ page }) => {
await mockGuestsAPI({ page });
await mockGroupsAPI({ page });
await page.goto('/default/dashboard/guests');
await page.getByRole('tab', { name: 'Groups' }).click();
await expect(page.getByRole('button', { name: 'Add new' })).toBeVisible();
await expect(page.getByRole('button', { name: 'Reset affinities' })).toBeVisible();
// List all groups
await expect(page.getByRole('row')).toHaveCount(3); // 1 header row + 2 data rows
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(0)).toHaveText('Name');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(1)).toHaveText('Color');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(2)).toHaveText('Confirmed');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(3)).toHaveText('Tentative');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(4)).toHaveText('Pending');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(5)).toHaveText('Declined');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(6)).toHaveText('Considered');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(7)).toHaveText('Total');
await expect(page.getByRole('row').nth(0).getByRole('columnheader').nth(8)).toHaveText('Actions');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(0)).toContainText('Pam\'s family');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(2)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(3)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(4)).toHaveText('1');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(5)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(6)).toHaveText('2');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(7)).toHaveText('3');
await expect(page.getByRole('row').nth(1).locator('svg:visible')).toHaveCount(3);
await expect(page.getByRole('row').nth(2).getByRole('cell').nth(0)).toContainText('Pam\'s work');
await expect(page.getByRole('row').nth(2).getByRole('cell').nth(2)).toHaveText('0');
await expect(page.getByRole('row').nth(2).getByRole('cell').nth(3)).toHaveText('2');
await expect(page.getByRole('row').nth(2).getByRole('cell').nth(4)).toHaveText('0');
await expect(page.getByRole('row').nth(2).getByRole('cell').nth(5)).toHaveText('0');
await expect(page.getByRole('row').nth(2).getByRole('cell').nth(6)).toHaveText('0');
await expect(page.getByRole('row').nth(2).getByRole('cell').nth(7)).toHaveText('2');
await expect(page.getByRole('row').nth(2).locator('svg:visible')).toHaveCount(3);
// Add a new group
await page.getByRole('button', { name: 'Add new' }).click();
const dialog = page.getByRole('dialog');
await expect(dialog).toBeVisible();
await dialog.getByLabel('Name').fill("Pam's friends");
await dialog.getByRole('button', { name: 'Create' }).click();
await expect(page.getByRole('row')).toHaveCount(4); // 1 header row + 3 data rows
await expect(dialog).not.toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(0)).toContainText('Pam\'s friends');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(2)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(3)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(4)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(5)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(6)).toHaveText('0');
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(7)).toHaveText('0');
await expect(page.getByRole('row').nth(1).locator('svg:visible')).toHaveCount(3);
// Modify the newly added group
await page.getByRole('row').nth(1).locator('svg').nth(2).click(); // Click edit icon
await expect(dialog).toBeVisible();
await expect(dialog.getByLabel('Name')).toHaveValue("Pam's friends");
await dialog.getByLabel('Name').fill('Pam\'s best friends');
await dialog.getByRole('button', { name: 'Update' }).click();
await expect(page.getByRole('row').nth(1).getByRole('cell').nth(0)).toContainText('Pam\'s best friends');
// Delete the newly added group
page.on('dialog', dialog => dialog.accept());
await page.getByRole('row').nth(1).locator('svg').nth(1).click(); // Click delete icon
await expect(page.getByRole('row')).toHaveCount(3); // 1 header row + 2 data rows
});

View File

@ -1,76 +1,100 @@
import { expect, test } from '@playwright/test'; import { test, expect, Page } from '@playwright/test'
import mockGroupsAPI from './mocks/groups';
import mockGuestsAPI from './mocks/guests';
test('should allow CRUD on guests', async ({ page }) => { const mockGuestsAPI = ({ page }: { page: Page }) => {
page.route('*/**/api/default/guests', async route => {
const json = [
{
"id": "f4a09c28-40ea-4553-90a5-96935a59cac6",
"status": "tentative",
"name": "Kristofer Rohan DVM",
"group": {
"id": "2fcb8b22-6b07-4c34-92e3-a2535dbc5b14",
"name": "Childhood friends",
}
},
{
"id": "bd585c40-0937-4cde-960a-bb23acfd6f18",
"status": "invited",
"name": "Olevia Quigley Jr.",
"group": {
"id": "da8edf26-3e1e-4cbb-b985-450c49fffe01",
"name": "Work",
}
},
];
await route.fulfill({ json })
})
}
const mockGroupsAPI = ({ page }: { page: Page }) => {
page.route('*/**/api/default/groups', async route => {
const json = [
{
"id": "ee44ffb9-1147-4842-a378-9eaeb0f0871a",
"name": "Pam's family",
"icon": "pi pi-users",
"parent_id": "cd9645e1-02c6-4fb9-bba6-1a960754b01c",
"color": "#ff0000",
"total": 3,
"considered": 2,
"invited": 1,
"confirmed": 0,
"declined": 0,
"tentative": 0
},
{
"id": "c8bda6ca-d8af-4bb8-b2bf-e6ec1c21b1e6",
"name": "Pam's work",
"icon": "pi pi-desktop",
"parent_id": "cd9645e1-02c6-4fb9-bba6-1a960754b01c",
"color": "#00ff00",
"total": 2,
"considered": 0,
"invited": 0,
"confirmed": 0,
"declined": 0,
"tentative": 2
},
];
await route.fulfill({ json })
})
}
test('should display the list of guests', async ({ page }) => {
await mockGuestsAPI({ page }); await mockGuestsAPI({ page });
await mockGroupsAPI({ page });
await page.goto('/default/dashboard/guests'); await page.goto('/default/dashboard/guests');
await expect(page.getByRole('button', { name: 'Add new' })).toBeVisible();
await expect(page.getByRole('tab', { name: 'Guests' })).toBeVisible();
await expect(page.getByRole('tab', { name: 'Groups' })).toBeVisible(); await expect(page.getByRole('tab', { name: 'Groups' })).toBeVisible();
await expect(page.getByRole('tab', { name: 'Invitations' })).toBeVisible(); await expect(page.getByRole('tab', { name: 'Guests' })).toBeVisible();
// List all guests
await expect(page.getByText('There are 2 elements in the list')).toBeVisible(); await expect(page.getByText('There are 2 elements in the list')).toBeVisible();
await expect(page.getByRole('row')).toHaveCount(3); // 1 header row + 2 data rows
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Kristofer Rohan DVM' })).toBeVisible(); await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Kristofer Rohan DVM' })).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: "Pam's family" })).toBeVisible(); await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Childhood friends' })).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Tentative' })).toBeVisible(); await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Tentative' })).toBeVisible();
await expect(page.getByRole('row').nth(1).locator('svg')).toHaveCount(2); await expect(page.getByRole('row').nth(1).getByRole('button', { name: 'Confirm' })).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('button', { name: 'Decline' })).toBeVisible();
await expect(page.getByRole('row').nth(2).getByRole('cell', { name: 'Olevia Quigley Jr.' })).toBeVisible(); await expect(page.getByRole('row').nth(2).getByRole('cell', { name: 'Olevia Quigley Jr.' })).toBeVisible();
await expect(page.getByRole('row').nth(2).getByRole('cell', { name: "Pam's work" })).toBeVisible(); await expect(page.getByRole('row').nth(2).getByRole('cell', { name: 'Work' })).toBeVisible();
await expect(page.getByRole('row').nth(2).getByRole('cell', { name: 'Invited' })).toBeVisible(); await expect(page.getByRole('row').nth(2).getByRole('cell', { name: 'Invited' })).toBeVisible();
await expect(page.getByRole('row').nth(2).locator('svg')).toHaveCount(2); await expect(page.getByRole('row').nth(2).getByRole('button', { name: 'Confirm' })).toBeVisible();
await expect(page.getByRole('row').nth(2).getByRole('button', { name: 'Tentative' })).toBeVisible();
// Add a new guest await expect(page.getByRole('row').nth(2).getByRole('button', { name: 'Decline' })).toBeVisible();
await page.getByRole('button', { name: 'Add new' }).click(); });
await page.getByRole('dialog').getByLabel('Name').fill('John Snow'); test('should display the list of groups', async ({ page }) => {
await mockGroupsAPI({ page });
await page.locator('#group').click();
await page.getByRole('option', { name: "Pam's work" }).click(); await page.goto('/default/dashboard/guests');
await page.getByRole('tab', { name: 'Groups' }).click();
await page.locator('#status').click();
await page.getByRole('option', { name: 'Invited' }).click(); await expect(page.getByText('There are 2 elements in the list')).toBeVisible();
await page.getByRole('dialog').getByRole('button', { name: 'Create' }).click(); await expect(page.getByRole('row').nth(1).getByRole('cell', { name: "Pam's family" })).toBeVisible();
await expect(page.getByRole('row').nth(2).getByRole('cell', { name: "Pam's work" })).toBeVisible();
await expect(page.getByText('There are 3 elements in the list')).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'John Snow' })).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: "Pam\'s work" })).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Invited' })).toBeVisible();
await expect(page.getByRole('row').nth(1).locator('svg')).toHaveCount(2);
// Edit the just-added John Snow
await page.getByRole('row').nth(1).locator('svg').nth(1).click(); // Click edit icon
const dialog = page.getByRole('dialog');
await expect(dialog.getByLabel('Name')).toHaveValue('John Snow');
await dialog.getByLabel('Name').fill('John Fire');
await dialog.locator('#group').click();
await page.getByRole('option', { name: "Pam's family" }).click();
await dialog.locator('#status').click();
await page.getByRole('option', { name: 'Declined' }).click();
await dialog.getByRole('button', { name: 'Update' }).click();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'John Fire' })).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Pam\'s Family' })).toBeVisible();
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Declined' })).toBeVisible();
await expect(page.getByText('There are 3 elements in the list')).toBeVisible();
// Delete John Fire
page.on('dialog', dialog => dialog.accept());
await page.getByRole('row').nth(1).locator('svg').nth(0).click(); // Click delete icon
await expect(page.getByText('There are 2 elements in the list')).toBeVisible();
}); });

View File

@ -1,86 +0,0 @@
import { Page } from "@playwright/test";
export default async function mockGroupsAPI({ page }: { page: Page }): Promise<void> {
page.route('*/**/api/default/groups', async route => {
if (route.request().method() === 'GET') {
const json = [
{
"id": "ee44ffb9-1147-4842-a378-9eaeb0f0871a",
"name": "Pam's family",
"icon": "pi pi-users",
"parent_id": null,
"color": "#ff0000",
"attendance": {
"total": 3,
"considered": 2,
"invited": 1,
"confirmed": 0,
"declined": 0,
"tentative": 0
}
},
{
"id": "c8bda6ca-d8af-4bb8-b2bf-e6ec1c21b1e6",
"name": "Pam's work",
"icon": "pi pi-desktop",
"parent_id": null,
"color": "#00ff00",
"attendance": {
"total": 2,
"considered": 0,
"invited": 0,
"confirmed": 0,
"declined": 0,
"tentative": 2
}
},
];
await route.fulfill({ json })
} else if (route.request().method() === 'POST') {
const json = {
"id": "4d55bc34-6f42-4e2e-82a1-71ae32da2466",
"name": "Pam's friends",
"icon": "pi pi-desktop",
"parent_id": null,
"color": "#0000ff",
"attendance": {
"total": 0,
"considered": 0,
"invited": 0,
"confirmed": 0,
"declined": 0,
"tentative": 0
}
}
await route.fulfill({ json })
}
})
page.route("*/**/api/default/groups/*", async route => {
if (route.request().method() === 'PUT') {
const json = {
"id": "4d55bc34-6f42-4e2e-82a1-71ae32da2466",
"name": "Pam's best friends",
"icon": "pi pi-desktop",
"parent_id": null,
"color": "#0000ff",
"attendance": {
"total": 0,
"considered": 0,
"invited": 0,
"confirmed": 0,
"declined": 0,
"tentative": 0
}
}
await route.fulfill({ json });
} else if (route.request().method() === 'DELETE') {
const json = {}
await route.fulfill({ json });
}
});
}

View File

@ -1,61 +0,0 @@
import { Page } from "@playwright/test";
export default async function mockGuestsAPI({ page }: { page: Page }): Promise<void> {
page.route('*/**/api/default/guests', async route => {
if (route.request().method() === 'GET') {
const json = [
{
"id": "f4a09c28-40ea-4553-90a5-96935a59cac6",
"status": "tentative",
"name": "Kristofer Rohan DVM",
"group": {
"id": "ee44ffb9-1147-4842-a378-9eaeb0f0871a",
"name": "Pam's family",
}
},
{
"id": "bd585c40-0937-4cde-960a-bb23acfd6f18",
"status": "invited",
"name": "Olevia Quigley Jr.",
"group": {
"id": "c8bda6ca-d8af-4bb8-b2bf-e6ec1c21b1e6",
"name": "Pam's work",
}
},
];
await route.fulfill({ json })
} else if (route.request().method() === 'POST') {
const json = {
"id": "ff58aa2d-643d-4c29-be9c-50e10ae6853c",
"name": "John Snow",
"status": "invited",
"group": {
"id": "c8bda6ca-d8af-4bb8-b2bf-e6ec1c21b1e6",
"name": "Pam's work",
}
};
await route.fulfill({ json });
}
})
page.route("*/**/api/default/guests/*", async route => {
if (route.request().method() === 'PUT') {
const json = {
"id": "ff58aa2d-643d-4c29-be9c-50e10ae6853c",
"name": "John Fire",
"status": "declined",
"group": {
"id": "ee44ffb9-1147-4842-a378-9eaeb0f0871a",
"name": "Pam's family",
}
}
await route.fulfill({ json });
} else if (route.request().method() === 'DELETE') {
const json = {}
await route.fulfill({ json });
}
});
}