Compare commits
No commits in common. "main" and "tentative-status" have entirely different histories.
main
...
tentative-
@ -1,13 +0,0 @@
|
|||||||
node_modules
|
|
||||||
npm-debug.log
|
|
||||||
Dockerfile*
|
|
||||||
docker-compose*
|
|
||||||
.dockerignore
|
|
||||||
.git
|
|
||||||
.gitignore
|
|
||||||
README.md
|
|
||||||
LICENSE
|
|
||||||
.vscode
|
|
||||||
.next
|
|
||||||
*.swp
|
|
||||||
/scripts
|
|
||||||
36
.github/workflows/build.yml
vendored
36
.github/workflows/build.yml
vendored
@ -1,13 +1,12 @@
|
|||||||
name: Build Nginx-based docker image
|
name: Build Nginx-based docker image
|
||||||
on:
|
on:
|
||||||
push:
|
push:
|
||||||
concurrency:
|
branches:
|
||||||
group: ${{ github.ref }}
|
- main
|
||||||
cancel-in-progress: true
|
pull_request:
|
||||||
jobs:
|
jobs:
|
||||||
build-static-assets:
|
build-static-assets:
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
timeout-minutes: 30
|
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/checkout@v4
|
- uses: actions/checkout@v4
|
||||||
with:
|
with:
|
||||||
@ -23,31 +22,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
|
||||||
35
.github/workflows/copyright_notice.yml
vendored
35
.github/workflows/copyright_notice.yml
vendored
@ -1,35 +0,0 @@
|
|||||||
name: Add copyright notice
|
|
||||||
on:
|
|
||||||
pull_request:
|
|
||||||
permissions:
|
|
||||||
contents: write
|
|
||||||
concurrency:
|
|
||||||
group: ${{ github.ref }}
|
|
||||||
cancel-in-progress: true
|
|
||||||
jobs:
|
|
||||||
copyright_notice:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@v4
|
|
||||||
with:
|
|
||||||
token: ${{ secrets.ACTIONS_TOKEN }}
|
|
||||||
ref: ${{ github.head_ref }}
|
|
||||||
- uses: VinnyBabuManjaly/copyright-action@v1.0.0
|
|
||||||
with:
|
|
||||||
CopyrightString: '/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/\n\n'
|
|
||||||
FileType: '.tsx, .jsx, .ts'
|
|
||||||
Path: 'app/, config/, db/'
|
|
||||||
IgnorePath: 'testfolder1/a/, testfolder3'
|
|
||||||
- name: Commit changes
|
|
||||||
run: |
|
|
||||||
git config --local user.email "bustikiller@bustikiller.com"
|
|
||||||
git config --local user.name "Manuel Bustillo"
|
|
||||||
git add .
|
|
||||||
|
|
||||||
if [ -n "$(git status --porcelain)" ]; then
|
|
||||||
echo "there are changes";
|
|
||||||
git commit -m "Add copyright notice"
|
|
||||||
git push
|
|
||||||
else
|
|
||||||
echo "no changes";
|
|
||||||
fi
|
|
||||||
3
.github/workflows/license_finder.yml
vendored
3
.github/workflows/license_finder.yml
vendored
@ -4,9 +4,6 @@ on:
|
|||||||
branches:
|
branches:
|
||||||
- main
|
- main
|
||||||
pull_request:
|
pull_request:
|
||||||
concurrency:
|
|
||||||
group: ${{ github.ref }}
|
|
||||||
cancel-in-progress: true
|
|
||||||
jobs:
|
jobs:
|
||||||
build-static-assets:
|
build-static-assets:
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|||||||
4
.github/workflows/playwright.yml
vendored
4
.github/workflows/playwright.yml
vendored
@ -4,12 +4,8 @@ on:
|
|||||||
branches: [ main, master ]
|
branches: [ main, master ]
|
||||||
pull_request:
|
pull_request:
|
||||||
branches: [ main, master ]
|
branches: [ main, master ]
|
||||||
concurrency:
|
|
||||||
group: ${{ github.ref }}
|
|
||||||
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:
|
||||||
|
|||||||
660
COPYING.md
660
COPYING.md
@ -1,660 +0,0 @@
|
|||||||
# GNU AFFERO GENERAL PUBLIC LICENSE
|
|
||||||
|
|
||||||
Version 3, 19 November 2007
|
|
||||||
|
|
||||||
Copyright (C) 2007 Free Software Foundation, Inc.
|
|
||||||
<https://fsf.org/>
|
|
||||||
|
|
||||||
Everyone is permitted to copy and distribute verbatim copies of this
|
|
||||||
license document, but changing it is not allowed.
|
|
||||||
|
|
||||||
## Preamble
|
|
||||||
|
|
||||||
The GNU Affero General Public License is a free, copyleft license for
|
|
||||||
software and other kinds of works, specifically designed to ensure
|
|
||||||
cooperation with the community in the case of network server software.
|
|
||||||
|
|
||||||
The licenses for most software and other practical works are designed
|
|
||||||
to take away your freedom to share and change the works. By contrast,
|
|
||||||
our General Public Licenses are intended to guarantee your freedom to
|
|
||||||
share and change all versions of a program--to make sure it remains
|
|
||||||
free software for all its users.
|
|
||||||
|
|
||||||
When we speak of free software, we are referring to freedom, not
|
|
||||||
price. Our General Public Licenses are designed to make sure that you
|
|
||||||
have the freedom to distribute copies of free software (and charge for
|
|
||||||
them if you wish), that you receive source code or can get it if you
|
|
||||||
want it, that you can change the software or use pieces of it in new
|
|
||||||
free programs, and that you know you can do these things.
|
|
||||||
|
|
||||||
Developers that use our General Public Licenses protect your rights
|
|
||||||
with two steps: (1) assert copyright on the software, and (2) offer
|
|
||||||
you this License which gives you legal permission to copy, distribute
|
|
||||||
and/or modify the software.
|
|
||||||
|
|
||||||
A secondary benefit of defending all users' freedom is that
|
|
||||||
improvements made in alternate versions of the program, if they
|
|
||||||
receive widespread use, become available for other developers to
|
|
||||||
incorporate. Many developers of free software are heartened and
|
|
||||||
encouraged by the resulting cooperation. However, in the case of
|
|
||||||
software used on network servers, this result may fail to come about.
|
|
||||||
The GNU General Public License permits making a modified version and
|
|
||||||
letting the public access it on a server without ever releasing its
|
|
||||||
source code to the public.
|
|
||||||
|
|
||||||
The GNU Affero General Public License is designed specifically to
|
|
||||||
ensure that, in such cases, the modified source code becomes available
|
|
||||||
to the community. It requires the operator of a network server to
|
|
||||||
provide the source code of the modified version running there to the
|
|
||||||
users of that server. Therefore, public use of a modified version, on
|
|
||||||
a publicly accessible server, gives the public access to the source
|
|
||||||
code of the modified version.
|
|
||||||
|
|
||||||
An older license, called the Affero General Public License and
|
|
||||||
published by Affero, was designed to accomplish similar goals. This is
|
|
||||||
a different license, not a version of the Affero GPL, but Affero has
|
|
||||||
released a new version of the Affero GPL which permits relicensing
|
|
||||||
under this license.
|
|
||||||
|
|
||||||
The precise terms and conditions for copying, distribution and
|
|
||||||
modification follow.
|
|
||||||
|
|
||||||
## TERMS AND CONDITIONS
|
|
||||||
|
|
||||||
### 0. Definitions.
|
|
||||||
|
|
||||||
"This License" refers to version 3 of the GNU Affero General Public
|
|
||||||
License.
|
|
||||||
|
|
||||||
"Copyright" also means copyright-like laws that apply to other kinds
|
|
||||||
of works, such as semiconductor masks.
|
|
||||||
|
|
||||||
"The Program" refers to any copyrightable work licensed under this
|
|
||||||
License. Each licensee is addressed as "you". "Licensees" and
|
|
||||||
"recipients" may be individuals or organizations.
|
|
||||||
|
|
||||||
To "modify" a work means to copy from or adapt all or part of the work
|
|
||||||
in a fashion requiring copyright permission, other than the making of
|
|
||||||
an exact copy. The resulting work is called a "modified version" of
|
|
||||||
the earlier work or a work "based on" the earlier work.
|
|
||||||
|
|
||||||
A "covered work" means either the unmodified Program or a work based
|
|
||||||
on the Program.
|
|
||||||
|
|
||||||
To "propagate" a work means to do anything with it that, without
|
|
||||||
permission, would make you directly or secondarily liable for
|
|
||||||
infringement under applicable copyright law, except executing it on a
|
|
||||||
computer or modifying a private copy. Propagation includes copying,
|
|
||||||
distribution (with or without modification), making available to the
|
|
||||||
public, and in some countries other activities as well.
|
|
||||||
|
|
||||||
To "convey" a work means any kind of propagation that enables other
|
|
||||||
parties to make or receive copies. Mere interaction with a user
|
|
||||||
through a computer network, with no transfer of a copy, is not
|
|
||||||
conveying.
|
|
||||||
|
|
||||||
An interactive user interface displays "Appropriate Legal Notices" to
|
|
||||||
the extent that it includes a convenient and prominently visible
|
|
||||||
feature that (1) displays an appropriate copyright notice, and (2)
|
|
||||||
tells the user that there is no warranty for the work (except to the
|
|
||||||
extent that warranties are provided), that licensees may convey the
|
|
||||||
work under this License, and how to view a copy of this License. If
|
|
||||||
the interface presents a list of user commands or options, such as a
|
|
||||||
menu, a prominent item in the list meets this criterion.
|
|
||||||
|
|
||||||
### 1. Source Code.
|
|
||||||
|
|
||||||
The "source code" for a work means the preferred form of the work for
|
|
||||||
making modifications to it. "Object code" means any non-source form of
|
|
||||||
a work.
|
|
||||||
|
|
||||||
A "Standard Interface" means an interface that either is an official
|
|
||||||
standard defined by a recognized standards body, or, in the case of
|
|
||||||
interfaces specified for a particular programming language, one that
|
|
||||||
is widely used among developers working in that language.
|
|
||||||
|
|
||||||
The "System Libraries" of an executable work include anything, other
|
|
||||||
than the work as a whole, that (a) is included in the normal form of
|
|
||||||
packaging a Major Component, but which is not part of that Major
|
|
||||||
Component, and (b) serves only to enable use of the work with that
|
|
||||||
Major Component, or to implement a Standard Interface for which an
|
|
||||||
implementation is available to the public in source code form. A
|
|
||||||
"Major Component", in this context, means a major essential component
|
|
||||||
(kernel, window system, and so on) of the specific operating system
|
|
||||||
(if any) on which the executable work runs, or a compiler used to
|
|
||||||
produce the work, or an object code interpreter used to run it.
|
|
||||||
|
|
||||||
The "Corresponding Source" for a work in object code form means all
|
|
||||||
the source code needed to generate, install, and (for an executable
|
|
||||||
work) run the object code and to modify the work, including scripts to
|
|
||||||
control those activities. However, it does not include the work's
|
|
||||||
System Libraries, or general-purpose tools or generally available free
|
|
||||||
programs which are used unmodified in performing those activities but
|
|
||||||
which are not part of the work. For example, Corresponding Source
|
|
||||||
includes interface definition files associated with source files for
|
|
||||||
the work, and the source code for shared libraries and dynamically
|
|
||||||
linked subprograms that the work is specifically designed to require,
|
|
||||||
such as by intimate data communication or control flow between those
|
|
||||||
subprograms and other parts of the work.
|
|
||||||
|
|
||||||
The Corresponding Source need not include anything that users can
|
|
||||||
regenerate automatically from other parts of the Corresponding Source.
|
|
||||||
|
|
||||||
The Corresponding Source for a work in source code form is that same
|
|
||||||
work.
|
|
||||||
|
|
||||||
### 2. Basic Permissions.
|
|
||||||
|
|
||||||
All rights granted under this License are granted for the term of
|
|
||||||
copyright on the Program, and are irrevocable provided the stated
|
|
||||||
conditions are met. This License explicitly affirms your unlimited
|
|
||||||
permission to run the unmodified Program. The output from running a
|
|
||||||
covered work is covered by this License only if the output, given its
|
|
||||||
content, constitutes a covered work. This License acknowledges your
|
|
||||||
rights of fair use or other equivalent, as provided by copyright law.
|
|
||||||
|
|
||||||
You may make, run and propagate covered works that you do not convey,
|
|
||||||
without conditions so long as your license otherwise remains in force.
|
|
||||||
You may convey covered works to others for the sole purpose of having
|
|
||||||
them make modifications exclusively for you, or provide you with
|
|
||||||
facilities for running those works, provided that you comply with the
|
|
||||||
terms of this License in conveying all material for which you do not
|
|
||||||
control copyright. Those thus making or running the covered works for
|
|
||||||
you must do so exclusively on your behalf, under your direction and
|
|
||||||
control, on terms that prohibit them from making any copies of your
|
|
||||||
copyrighted material outside their relationship with you.
|
|
||||||
|
|
||||||
Conveying under any other circumstances is permitted solely under the
|
|
||||||
conditions stated below. Sublicensing is not allowed; section 10 makes
|
|
||||||
it unnecessary.
|
|
||||||
|
|
||||||
### 3. Protecting Users' Legal Rights From Anti-Circumvention Law.
|
|
||||||
|
|
||||||
No covered work shall be deemed part of an effective technological
|
|
||||||
measure under any applicable law fulfilling obligations under article
|
|
||||||
11 of the WIPO copyright treaty adopted on 20 December 1996, or
|
|
||||||
similar laws prohibiting or restricting circumvention of such
|
|
||||||
measures.
|
|
||||||
|
|
||||||
When you convey a covered work, you waive any legal power to forbid
|
|
||||||
circumvention of technological measures to the extent such
|
|
||||||
circumvention is effected by exercising rights under this License with
|
|
||||||
respect to the covered work, and you disclaim any intention to limit
|
|
||||||
operation or modification of the work as a means of enforcing, against
|
|
||||||
the work's users, your or third parties' legal rights to forbid
|
|
||||||
circumvention of technological measures.
|
|
||||||
|
|
||||||
### 4. Conveying Verbatim Copies.
|
|
||||||
|
|
||||||
You may convey verbatim copies of the Program's source code as you
|
|
||||||
receive it, in any medium, provided that you conspicuously and
|
|
||||||
appropriately publish on each copy an appropriate copyright notice;
|
|
||||||
keep intact all notices stating that this License and any
|
|
||||||
non-permissive terms added in accord with section 7 apply to the code;
|
|
||||||
keep intact all notices of the absence of any warranty; and give all
|
|
||||||
recipients a copy of this License along with the Program.
|
|
||||||
|
|
||||||
You may charge any price or no price for each copy that you convey,
|
|
||||||
and you may offer support or warranty protection for a fee.
|
|
||||||
|
|
||||||
### 5. Conveying Modified Source Versions.
|
|
||||||
|
|
||||||
You may convey a work based on the Program, or the modifications to
|
|
||||||
produce it from the Program, in the form of source code under the
|
|
||||||
terms of section 4, provided that you also meet all of these
|
|
||||||
conditions:
|
|
||||||
|
|
||||||
- a) The work must carry prominent notices stating that you modified
|
|
||||||
it, and giving a relevant date.
|
|
||||||
- b) The work must carry prominent notices stating that it is
|
|
||||||
released under this License and any conditions added under
|
|
||||||
section 7. This requirement modifies the requirement in section 4
|
|
||||||
to "keep intact all notices".
|
|
||||||
- c) You must license the entire work, as a whole, under this
|
|
||||||
License to anyone who comes into possession of a copy. This
|
|
||||||
License will therefore apply, along with any applicable section 7
|
|
||||||
additional terms, to the whole of the work, and all its parts,
|
|
||||||
regardless of how they are packaged. This License gives no
|
|
||||||
permission to license the work in any other way, but it does not
|
|
||||||
invalidate such permission if you have separately received it.
|
|
||||||
- d) If the work has interactive user interfaces, each must display
|
|
||||||
Appropriate Legal Notices; however, if the Program has interactive
|
|
||||||
interfaces that do not display Appropriate Legal Notices, your
|
|
||||||
work need not make them do so.
|
|
||||||
|
|
||||||
A compilation of a covered work with other separate and independent
|
|
||||||
works, which are not by their nature extensions of the covered work,
|
|
||||||
and which are not combined with it such as to form a larger program,
|
|
||||||
in or on a volume of a storage or distribution medium, is called an
|
|
||||||
"aggregate" if the compilation and its resulting copyright are not
|
|
||||||
used to limit the access or legal rights of the compilation's users
|
|
||||||
beyond what the individual works permit. Inclusion of a covered work
|
|
||||||
in an aggregate does not cause this License to apply to the other
|
|
||||||
parts of the aggregate.
|
|
||||||
|
|
||||||
### 6. Conveying Non-Source Forms.
|
|
||||||
|
|
||||||
You may convey a covered work in object code form under the terms of
|
|
||||||
sections 4 and 5, provided that you also convey the machine-readable
|
|
||||||
Corresponding Source under the terms of this License, in one of these
|
|
||||||
ways:
|
|
||||||
|
|
||||||
- a) Convey the object code in, or embodied in, a physical product
|
|
||||||
(including a physical distribution medium), accompanied by the
|
|
||||||
Corresponding Source fixed on a durable physical medium
|
|
||||||
customarily used for software interchange.
|
|
||||||
- b) Convey the object code in, or embodied in, a physical product
|
|
||||||
(including a physical distribution medium), accompanied by a
|
|
||||||
written offer, valid for at least three years and valid for as
|
|
||||||
long as you offer spare parts or customer support for that product
|
|
||||||
model, to give anyone who possesses the object code either (1) a
|
|
||||||
copy of the Corresponding Source for all the software in the
|
|
||||||
product that is covered by this License, on a durable physical
|
|
||||||
medium customarily used for software interchange, for a price no
|
|
||||||
more than your reasonable cost of physically performing this
|
|
||||||
conveying of source, or (2) access to copy the Corresponding
|
|
||||||
Source from a network server at no charge.
|
|
||||||
- c) Convey individual copies of the object code with a copy of the
|
|
||||||
written offer to provide the Corresponding Source. This
|
|
||||||
alternative is allowed only occasionally and noncommercially, and
|
|
||||||
only if you received the object code with such an offer, in accord
|
|
||||||
with subsection 6b.
|
|
||||||
- d) Convey the object code by offering access from a designated
|
|
||||||
place (gratis or for a charge), and offer equivalent access to the
|
|
||||||
Corresponding Source in the same way through the same place at no
|
|
||||||
further charge. You need not require recipients to copy the
|
|
||||||
Corresponding Source along with the object code. If the place to
|
|
||||||
copy the object code is a network server, the Corresponding Source
|
|
||||||
may be on a different server (operated by you or a third party)
|
|
||||||
that supports equivalent copying facilities, provided you maintain
|
|
||||||
clear directions next to the object code saying where to find the
|
|
||||||
Corresponding Source. Regardless of what server hosts the
|
|
||||||
Corresponding Source, you remain obligated to ensure that it is
|
|
||||||
available for as long as needed to satisfy these requirements.
|
|
||||||
- e) Convey the object code using peer-to-peer transmission,
|
|
||||||
provided you inform other peers where the object code and
|
|
||||||
Corresponding Source of the work are being offered to the general
|
|
||||||
public at no charge under subsection 6d.
|
|
||||||
|
|
||||||
A separable portion of the object code, whose source code is excluded
|
|
||||||
from the Corresponding Source as a System Library, need not be
|
|
||||||
included in conveying the object code work.
|
|
||||||
|
|
||||||
A "User Product" is either (1) a "consumer product", which means any
|
|
||||||
tangible personal property which is normally used for personal,
|
|
||||||
family, or household purposes, or (2) anything designed or sold for
|
|
||||||
incorporation into a dwelling. In determining whether a product is a
|
|
||||||
consumer product, doubtful cases shall be resolved in favor of
|
|
||||||
coverage. For a particular product received by a particular user,
|
|
||||||
"normally used" refers to a typical or common use of that class of
|
|
||||||
product, regardless of the status of the particular user or of the way
|
|
||||||
in which the particular user actually uses, or expects or is expected
|
|
||||||
to use, the product. A product is a consumer product regardless of
|
|
||||||
whether the product has substantial commercial, industrial or
|
|
||||||
non-consumer uses, unless such uses represent the only significant
|
|
||||||
mode of use of the product.
|
|
||||||
|
|
||||||
"Installation Information" for a User Product means any methods,
|
|
||||||
procedures, authorization keys, or other information required to
|
|
||||||
install and execute modified versions of a covered work in that User
|
|
||||||
Product from a modified version of its Corresponding Source. The
|
|
||||||
information must suffice to ensure that the continued functioning of
|
|
||||||
the modified object code is in no case prevented or interfered with
|
|
||||||
solely because modification has been made.
|
|
||||||
|
|
||||||
If you convey an object code work under this section in, or with, or
|
|
||||||
specifically for use in, a User Product, and the conveying occurs as
|
|
||||||
part of a transaction in which the right of possession and use of the
|
|
||||||
User Product is transferred to the recipient in perpetuity or for a
|
|
||||||
fixed term (regardless of how the transaction is characterized), the
|
|
||||||
Corresponding Source conveyed under this section must be accompanied
|
|
||||||
by the Installation Information. But this requirement does not apply
|
|
||||||
if neither you nor any third party retains the ability to install
|
|
||||||
modified object code on the User Product (for example, the work has
|
|
||||||
been installed in ROM).
|
|
||||||
|
|
||||||
The requirement to provide Installation Information does not include a
|
|
||||||
requirement to continue to provide support service, warranty, or
|
|
||||||
updates for a work that has been modified or installed by the
|
|
||||||
recipient, or for the User Product in which it has been modified or
|
|
||||||
installed. Access to a network may be denied when the modification
|
|
||||||
itself materially and adversely affects the operation of the network
|
|
||||||
or violates the rules and protocols for communication across the
|
|
||||||
network.
|
|
||||||
|
|
||||||
Corresponding Source conveyed, and Installation Information provided,
|
|
||||||
in accord with this section must be in a format that is publicly
|
|
||||||
documented (and with an implementation available to the public in
|
|
||||||
source code form), and must require no special password or key for
|
|
||||||
unpacking, reading or copying.
|
|
||||||
|
|
||||||
### 7. Additional Terms.
|
|
||||||
|
|
||||||
"Additional permissions" are terms that supplement the terms of this
|
|
||||||
License by making exceptions from one or more of its conditions.
|
|
||||||
Additional permissions that are applicable to the entire Program shall
|
|
||||||
be treated as though they were included in this License, to the extent
|
|
||||||
that they are valid under applicable law. If additional permissions
|
|
||||||
apply only to part of the Program, that part may be used separately
|
|
||||||
under those permissions, but the entire Program remains governed by
|
|
||||||
this License without regard to the additional permissions.
|
|
||||||
|
|
||||||
When you convey a copy of a covered work, you may at your option
|
|
||||||
remove any additional permissions from that copy, or from any part of
|
|
||||||
it. (Additional permissions may be written to require their own
|
|
||||||
removal in certain cases when you modify the work.) You may place
|
|
||||||
additional permissions on material, added by you to a covered work,
|
|
||||||
for which you have or can give appropriate copyright permission.
|
|
||||||
|
|
||||||
Notwithstanding any other provision of this License, for material you
|
|
||||||
add to a covered work, you may (if authorized by the copyright holders
|
|
||||||
of that material) supplement the terms of this License with terms:
|
|
||||||
|
|
||||||
- a) Disclaiming warranty or limiting liability differently from the
|
|
||||||
terms of sections 15 and 16 of this License; or
|
|
||||||
- b) Requiring preservation of specified reasonable legal notices or
|
|
||||||
author attributions in that material or in the Appropriate Legal
|
|
||||||
Notices displayed by works containing it; or
|
|
||||||
- c) Prohibiting misrepresentation of the origin of that material,
|
|
||||||
or requiring that modified versions of such material be marked in
|
|
||||||
reasonable ways as different from the original version; or
|
|
||||||
- d) Limiting the use for publicity purposes of names of licensors
|
|
||||||
or authors of the material; or
|
|
||||||
- e) Declining to grant rights under trademark law for use of some
|
|
||||||
trade names, trademarks, or service marks; or
|
|
||||||
- f) Requiring indemnification of licensors and authors of that
|
|
||||||
material by anyone who conveys the material (or modified versions
|
|
||||||
of it) with contractual assumptions of liability to the recipient,
|
|
||||||
for any liability that these contractual assumptions directly
|
|
||||||
impose on those licensors and authors.
|
|
||||||
|
|
||||||
All other non-permissive additional terms are considered "further
|
|
||||||
restrictions" within the meaning of section 10. If the Program as you
|
|
||||||
received it, or any part of it, contains a notice stating that it is
|
|
||||||
governed by this License along with a term that is a further
|
|
||||||
restriction, you may remove that term. If a license document contains
|
|
||||||
a further restriction but permits relicensing or conveying under this
|
|
||||||
License, you may add to a covered work material governed by the terms
|
|
||||||
of that license document, provided that the further restriction does
|
|
||||||
not survive such relicensing or conveying.
|
|
||||||
|
|
||||||
If you add terms to a covered work in accord with this section, you
|
|
||||||
must place, in the relevant source files, a statement of the
|
|
||||||
additional terms that apply to those files, or a notice indicating
|
|
||||||
where to find the applicable terms.
|
|
||||||
|
|
||||||
Additional terms, permissive or non-permissive, may be stated in the
|
|
||||||
form of a separately written license, or stated as exceptions; the
|
|
||||||
above requirements apply either way.
|
|
||||||
|
|
||||||
### 8. Termination.
|
|
||||||
|
|
||||||
You may not propagate or modify a covered work except as expressly
|
|
||||||
provided under this License. Any attempt otherwise to propagate or
|
|
||||||
modify it is void, and will automatically terminate your rights under
|
|
||||||
this License (including any patent licenses granted under the third
|
|
||||||
paragraph of section 11).
|
|
||||||
|
|
||||||
However, if you cease all violation of this License, then your license
|
|
||||||
from a particular copyright holder is reinstated (a) provisionally,
|
|
||||||
unless and until the copyright holder explicitly and finally
|
|
||||||
terminates your license, and (b) permanently, if the copyright holder
|
|
||||||
fails to notify you of the violation by some reasonable means prior to
|
|
||||||
60 days after the cessation.
|
|
||||||
|
|
||||||
Moreover, your license from a particular copyright holder is
|
|
||||||
reinstated permanently if the copyright holder notifies you of the
|
|
||||||
violation by some reasonable means, this is the first time you have
|
|
||||||
received notice of violation of this License (for any work) from that
|
|
||||||
copyright holder, and you cure the violation prior to 30 days after
|
|
||||||
your receipt of the notice.
|
|
||||||
|
|
||||||
Termination of your rights under this section does not terminate the
|
|
||||||
licenses of parties who have received copies or rights from you under
|
|
||||||
this License. If your rights have been terminated and not permanently
|
|
||||||
reinstated, you do not qualify to receive new licenses for the same
|
|
||||||
material under section 10.
|
|
||||||
|
|
||||||
### 9. Acceptance Not Required for Having Copies.
|
|
||||||
|
|
||||||
You are not required to accept this License in order to receive or run
|
|
||||||
a copy of the Program. Ancillary propagation of a covered work
|
|
||||||
occurring solely as a consequence of using peer-to-peer transmission
|
|
||||||
to receive a copy likewise does not require acceptance. However,
|
|
||||||
nothing other than this License grants you permission to propagate or
|
|
||||||
modify any covered work. These actions infringe copyright if you do
|
|
||||||
not accept this License. Therefore, by modifying or propagating a
|
|
||||||
covered work, you indicate your acceptance of this License to do so.
|
|
||||||
|
|
||||||
### 10. Automatic Licensing of Downstream Recipients.
|
|
||||||
|
|
||||||
Each time you convey a covered work, the recipient automatically
|
|
||||||
receives a license from the original licensors, to run, modify and
|
|
||||||
propagate that work, subject to this License. You are not responsible
|
|
||||||
for enforcing compliance by third parties with this License.
|
|
||||||
|
|
||||||
An "entity transaction" is a transaction transferring control of an
|
|
||||||
organization, or substantially all assets of one, or subdividing an
|
|
||||||
organization, or merging organizations. If propagation of a covered
|
|
||||||
work results from an entity transaction, each party to that
|
|
||||||
transaction who receives a copy of the work also receives whatever
|
|
||||||
licenses to the work the party's predecessor in interest had or could
|
|
||||||
give under the previous paragraph, plus a right to possession of the
|
|
||||||
Corresponding Source of the work from the predecessor in interest, if
|
|
||||||
the predecessor has it or can get it with reasonable efforts.
|
|
||||||
|
|
||||||
You may not impose any further restrictions on the exercise of the
|
|
||||||
rights granted or affirmed under this License. For example, you may
|
|
||||||
not impose a license fee, royalty, or other charge for exercise of
|
|
||||||
rights granted under this License, and you may not initiate litigation
|
|
||||||
(including a cross-claim or counterclaim in a lawsuit) alleging that
|
|
||||||
any patent claim is infringed by making, using, selling, offering for
|
|
||||||
sale, or importing the Program or any portion of it.
|
|
||||||
|
|
||||||
### 11. Patents.
|
|
||||||
|
|
||||||
A "contributor" is a copyright holder who authorizes use under this
|
|
||||||
License of the Program or a work on which the Program is based. The
|
|
||||||
work thus licensed is called the contributor's "contributor version".
|
|
||||||
|
|
||||||
A contributor's "essential patent claims" are all patent claims owned
|
|
||||||
or controlled by the contributor, whether already acquired or
|
|
||||||
hereafter acquired, that would be infringed by some manner, permitted
|
|
||||||
by this License, of making, using, or selling its contributor version,
|
|
||||||
but do not include claims that would be infringed only as a
|
|
||||||
consequence of further modification of the contributor version. For
|
|
||||||
purposes of this definition, "control" includes the right to grant
|
|
||||||
patent sublicenses in a manner consistent with the requirements of
|
|
||||||
this License.
|
|
||||||
|
|
||||||
Each contributor grants you a non-exclusive, worldwide, royalty-free
|
|
||||||
patent license under the contributor's essential patent claims, to
|
|
||||||
make, use, sell, offer for sale, import and otherwise run, modify and
|
|
||||||
propagate the contents of its contributor version.
|
|
||||||
|
|
||||||
In the following three paragraphs, a "patent license" is any express
|
|
||||||
agreement or commitment, however denominated, not to enforce a patent
|
|
||||||
(such as an express permission to practice a patent or covenant not to
|
|
||||||
sue for patent infringement). To "grant" such a patent license to a
|
|
||||||
party means to make such an agreement or commitment not to enforce a
|
|
||||||
patent against the party.
|
|
||||||
|
|
||||||
If you convey a covered work, knowingly relying on a patent license,
|
|
||||||
and the Corresponding Source of the work is not available for anyone
|
|
||||||
to copy, free of charge and under the terms of this License, through a
|
|
||||||
publicly available network server or other readily accessible means,
|
|
||||||
then you must either (1) cause the Corresponding Source to be so
|
|
||||||
available, or (2) arrange to deprive yourself of the benefit of the
|
|
||||||
patent license for this particular work, or (3) arrange, in a manner
|
|
||||||
consistent with the requirements of this License, to extend the patent
|
|
||||||
license to downstream recipients. "Knowingly relying" means you have
|
|
||||||
actual knowledge that, but for the patent license, your conveying the
|
|
||||||
covered work in a country, or your recipient's use of the covered work
|
|
||||||
in a country, would infringe one or more identifiable patents in that
|
|
||||||
country that you have reason to believe are valid.
|
|
||||||
|
|
||||||
If, pursuant to or in connection with a single transaction or
|
|
||||||
arrangement, you convey, or propagate by procuring conveyance of, a
|
|
||||||
covered work, and grant a patent license to some of the parties
|
|
||||||
receiving the covered work authorizing them to use, propagate, modify
|
|
||||||
or convey a specific copy of the covered work, then the patent license
|
|
||||||
you grant is automatically extended to all recipients of the covered
|
|
||||||
work and works based on it.
|
|
||||||
|
|
||||||
A patent license is "discriminatory" if it does not include within the
|
|
||||||
scope of its coverage, prohibits the exercise of, or is conditioned on
|
|
||||||
the non-exercise of one or more of the rights that are specifically
|
|
||||||
granted under this License. You may not convey a covered work if you
|
|
||||||
are a party to an arrangement with a third party that is in the
|
|
||||||
business of distributing software, under which you make payment to the
|
|
||||||
third party based on the extent of your activity of conveying the
|
|
||||||
work, and under which the third party grants, to any of the parties
|
|
||||||
who would receive the covered work from you, a discriminatory patent
|
|
||||||
license (a) in connection with copies of the covered work conveyed by
|
|
||||||
you (or copies made from those copies), or (b) primarily for and in
|
|
||||||
connection with specific products or compilations that contain the
|
|
||||||
covered work, unless you entered into that arrangement, or that patent
|
|
||||||
license was granted, prior to 28 March 2007.
|
|
||||||
|
|
||||||
Nothing in this License shall be construed as excluding or limiting
|
|
||||||
any implied license or other defenses to infringement that may
|
|
||||||
otherwise be available to you under applicable patent law.
|
|
||||||
|
|
||||||
### 12. No Surrender of Others' Freedom.
|
|
||||||
|
|
||||||
If conditions are imposed on you (whether by court order, agreement or
|
|
||||||
otherwise) that contradict the conditions of this License, they do not
|
|
||||||
excuse you from the conditions of this License. If you cannot convey a
|
|
||||||
covered work so as to satisfy simultaneously your obligations under
|
|
||||||
this License and any other pertinent obligations, then as a
|
|
||||||
consequence you may not convey it at all. For example, if you agree to
|
|
||||||
terms that obligate you to collect a royalty for further conveying
|
|
||||||
from those to whom you convey the Program, the only way you could
|
|
||||||
satisfy both those terms and this License would be to refrain entirely
|
|
||||||
from conveying the Program.
|
|
||||||
|
|
||||||
### 13. Remote Network Interaction; Use with the GNU General Public License.
|
|
||||||
|
|
||||||
Notwithstanding any other provision of this License, if you modify the
|
|
||||||
Program, your modified version must prominently offer all users
|
|
||||||
interacting with it remotely through a computer network (if your
|
|
||||||
version supports such interaction) an opportunity to receive the
|
|
||||||
Corresponding Source of your version by providing access to the
|
|
||||||
Corresponding Source from a network server at no charge, through some
|
|
||||||
standard or customary means of facilitating copying of software. This
|
|
||||||
Corresponding Source shall include the Corresponding Source for any
|
|
||||||
work covered by version 3 of the GNU General Public License that is
|
|
||||||
incorporated pursuant to the following paragraph.
|
|
||||||
|
|
||||||
Notwithstanding any other provision of this License, you have
|
|
||||||
permission to link or combine any covered work with a work licensed
|
|
||||||
under version 3 of the GNU General Public License into a single
|
|
||||||
combined work, and to convey the resulting work. The terms of this
|
|
||||||
License will continue to apply to the part which is the covered work,
|
|
||||||
but the work with which it is combined will remain governed by version
|
|
||||||
3 of the GNU General Public License.
|
|
||||||
|
|
||||||
### 14. Revised Versions of this License.
|
|
||||||
|
|
||||||
The Free Software Foundation may publish revised and/or new versions
|
|
||||||
of the GNU Affero General Public License from time to time. Such new
|
|
||||||
versions will be similar in spirit to the present version, but may
|
|
||||||
differ in detail to address new problems or concerns.
|
|
||||||
|
|
||||||
Each version is given a distinguishing version number. If the Program
|
|
||||||
specifies that a certain numbered version of the GNU Affero General
|
|
||||||
Public License "or any later version" applies to it, you have the
|
|
||||||
option of following the terms and conditions either of that numbered
|
|
||||||
version or of any later version published by the Free Software
|
|
||||||
Foundation. If the Program does not specify a version number of the
|
|
||||||
GNU Affero General Public License, you may choose any version ever
|
|
||||||
published by the Free Software Foundation.
|
|
||||||
|
|
||||||
If the Program specifies that a proxy can decide which future versions
|
|
||||||
of the GNU Affero General Public License can be used, that proxy's
|
|
||||||
public statement of acceptance of a version permanently authorizes you
|
|
||||||
to choose that version for the Program.
|
|
||||||
|
|
||||||
Later license versions may give you additional or different
|
|
||||||
permissions. However, no additional obligations are imposed on any
|
|
||||||
author or copyright holder as a result of your choosing to follow a
|
|
||||||
later version.
|
|
||||||
|
|
||||||
### 15. Disclaimer of Warranty.
|
|
||||||
|
|
||||||
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
|
|
||||||
APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
|
|
||||||
HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT
|
|
||||||
WARRANTY OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT
|
|
||||||
LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
|
||||||
A PARTICULAR PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND
|
|
||||||
PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE PROGRAM PROVE
|
|
||||||
DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, REPAIR OR
|
|
||||||
CORRECTION.
|
|
||||||
|
|
||||||
### 16. Limitation of Liability.
|
|
||||||
|
|
||||||
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
|
|
||||||
WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR
|
|
||||||
CONVEYS THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES,
|
|
||||||
INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES
|
|
||||||
ARISING OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT
|
|
||||||
NOT LIMITED TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR
|
|
||||||
LOSSES SUSTAINED BY YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM
|
|
||||||
TO OPERATE WITH ANY OTHER PROGRAMS), EVEN IF SUCH HOLDER OR OTHER
|
|
||||||
PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES.
|
|
||||||
|
|
||||||
### 17. Interpretation of Sections 15 and 16.
|
|
||||||
|
|
||||||
If the disclaimer of warranty and limitation of liability provided
|
|
||||||
above cannot be given local legal effect according to their terms,
|
|
||||||
reviewing courts shall apply local law that most closely approximates
|
|
||||||
an absolute waiver of all civil liability in connection with the
|
|
||||||
Program, unless a warranty or assumption of liability accompanies a
|
|
||||||
copy of the Program in return for a fee.
|
|
||||||
|
|
||||||
END OF TERMS AND CONDITIONS
|
|
||||||
|
|
||||||
## How to Apply These Terms to Your New Programs
|
|
||||||
|
|
||||||
If you develop a new program, and you want it to be of the greatest
|
|
||||||
possible use to the public, the best way to achieve this is to make it
|
|
||||||
free software which everyone can redistribute and change under these
|
|
||||||
terms.
|
|
||||||
|
|
||||||
To do so, attach the following notices to the program. It is safest to
|
|
||||||
attach them to the start of each source file to most effectively state
|
|
||||||
the exclusion of warranty; and each file should have at least the
|
|
||||||
"copyright" line and a pointer to where the full notice is found.
|
|
||||||
|
|
||||||
<one line to give the program's name and a brief idea of what it does.>
|
|
||||||
Copyright (C) <year> <name of author>
|
|
||||||
|
|
||||||
This program is free software: you can redistribute it and/or modify
|
|
||||||
it under the terms of the GNU Affero General Public License as
|
|
||||||
published by the Free Software Foundation, either version 3 of the
|
|
||||||
License, or (at your option) any later version.
|
|
||||||
|
|
||||||
This program is distributed in the hope that it will be useful,
|
|
||||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
||||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
||||||
GNU Affero General Public License for more details.
|
|
||||||
|
|
||||||
You should have received a copy of the GNU Affero General Public License
|
|
||||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
||||||
|
|
||||||
Also add information on how to contact you by electronic and paper
|
|
||||||
mail.
|
|
||||||
|
|
||||||
If your software can interact with users remotely through a computer
|
|
||||||
network, you should also make sure that it provides a way for users to
|
|
||||||
get its source. For example, if your program is a web application, its
|
|
||||||
interface could display a "Source" link that leads users to an archive
|
|
||||||
of the code. There are many ways you could offer source, and different
|
|
||||||
solutions will be better for different programs; see section 13 for
|
|
||||||
the specific requirements.
|
|
||||||
|
|
||||||
You should also get your employer (if you work as a programmer) or
|
|
||||||
school, if any, to sign a "copyright disclaimer" for the program, if
|
|
||||||
necessary. For more information on this, and how to apply and follow
|
|
||||||
the GNU AGPL, see <https://www.gnu.org/licenses/>.
|
|
||||||
@ -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:23-alpine AS base
|
FROM node:22-alpine AS base
|
||||||
|
|
||||||
# Install dependencies only when needed
|
# Install dependencies only when needed
|
||||||
FROM base AS deps
|
FROM base AS deps
|
||||||
|
|||||||
@ -1,28 +0,0 @@
|
|||||||
# Based on https://github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile
|
|
||||||
|
|
||||||
FROM node:23-alpine AS base
|
|
||||||
|
|
||||||
# Install dependencies only when needed
|
|
||||||
FROM base AS deps
|
|
||||||
# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
|
|
||||||
RUN apk add --no-cache libc6-compat
|
|
||||||
WORKDIR /app
|
|
||||||
|
|
||||||
# Install dependencies based on the preferred package manager
|
|
||||||
COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
|
|
||||||
RUN \
|
|
||||||
if [ -f yarn.lock ]; then yarn --frozen-lockfile; \
|
|
||||||
elif [ -f package-lock.json ]; then npm ci; \
|
|
||||||
elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm i --frozen-lockfile; \
|
|
||||||
else echo "Lockfile not found." && exit 1; \
|
|
||||||
fi
|
|
||||||
|
|
||||||
COPY . /app/
|
|
||||||
|
|
||||||
ENV NODE_ENV development
|
|
||||||
ENV NEXT_TELEMETRY_DISABLED 1
|
|
||||||
|
|
||||||
EXPOSE 3000
|
|
||||||
ENV PORT=3000
|
|
||||||
|
|
||||||
CMD HOSTNAME="0.0.0.0" pnpm run dev
|
|
||||||
@ -1,45 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { Expense, ExpenseSerializer } from '@/app/lib/expense';
|
|
||||||
import { classNames } from '@/app/ui/components/button';
|
|
||||||
import ExpenseFormDialog from '@/app/ui/components/expense-form-dialog';
|
|
||||||
import ExpensesTable from '@/app/ui/expenses/table';
|
|
||||||
import SkeletonTable from '@/app/ui/guests/skeleton-row';
|
|
||||||
import { Suspense, useEffect, useState } from 'react';
|
|
||||||
|
|
||||||
export default function Page() {
|
|
||||||
const refreshExpenses = () => {
|
|
||||||
new AbstractApi<Expense>().getAll(new ExpenseSerializer(), (expenses: Expense[]) => {
|
|
||||||
setExpenses(expenses);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
const [expenses, setExpenses] = useState<Expense[]>([]);
|
|
||||||
const [expenseBeingEdited, setExpenseBeingEdited] = useState<Expense | undefined>(undefined);
|
|
||||||
useEffect(() => { refreshExpenses() }, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="w-full">
|
|
||||||
<div className="flex flex-col w-full items-center justify-between">
|
|
||||||
<button onClick={() => setExpenseBeingEdited({})} className={classNames('primary')}>Add new</button>
|
|
||||||
<ExpenseFormDialog
|
|
||||||
key={expenseBeingEdited?.id}
|
|
||||||
onCreate={() => { refreshExpenses(); setExpenseBeingEdited(undefined) }}
|
|
||||||
expense={expenseBeingEdited}
|
|
||||||
visible={expenseBeingEdited !== undefined}
|
|
||||||
onHide={() => { setExpenseBeingEdited(undefined) }}
|
|
||||||
/>
|
|
||||||
<Suspense fallback={<SkeletonTable />}>
|
|
||||||
<ExpensesTable
|
|
||||||
expenses={expenses}
|
|
||||||
onUpdate={refreshExpenses}
|
|
||||||
onEdit={(expense) => setExpenseBeingEdited(expense)}
|
|
||||||
/>
|
|
||||||
</Suspense>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,119 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { AbstractApi, } from '@/app/api/abstract-api';
|
|
||||||
import { Group, GroupSerializer } from '@/app/lib/group';
|
|
||||||
import { Guest, GuestSerializer } from '@/app/lib/guest';
|
|
||||||
import { getCsrfToken, getSlug } from '@/app/lib/utils';
|
|
||||||
import AffinitiesFormDialog from '@/app/ui/components/affinities-form-dialog';
|
|
||||||
import { classNames } from '@/app/ui/components/button';
|
|
||||||
import GroupFormDialog from '@/app/ui/components/group-form-dialog';
|
|
||||||
import GuestFormDialog from '@/app/ui/components/guest-form-dialog';
|
|
||||||
import GroupsTable from '@/app/ui/groups/table';
|
|
||||||
import SkeletonTable from '@/app/ui/guests/skeleton-row';
|
|
||||||
import GuestsTable from '@/app/ui/guests/table';
|
|
||||||
import { TabPanel, TabView } from 'primereact/tabview';
|
|
||||||
import { Suspense, useState } from 'react';
|
|
||||||
|
|
||||||
|
|
||||||
export default function Page() {
|
|
||||||
function refreshGuests() {
|
|
||||||
new AbstractApi<Guest>().getAll(new GuestSerializer(), (objects: Guest[]) => {
|
|
||||||
setGuests(objects);
|
|
||||||
setGuestsLoaded(true);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function refreshGroups() {
|
|
||||||
new AbstractApi<Group>().getAll(new GroupSerializer(), (objects: Group[]) => {
|
|
||||||
setGroups(objects);
|
|
||||||
setGroupsLoaded(true);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function resetAffinities() {
|
|
||||||
fetch(`/api/${getSlug()}/groups/affinities/reset`, {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Accept': 'application/json',
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const [groupsLoaded, setGroupsLoaded] = useState(false);
|
|
||||||
const [groups, setGroups] = useState<Array<Group>>([]);
|
|
||||||
const [groupBeingEdited, setGroupBeingEdited] = useState<Group | undefined>(undefined);
|
|
||||||
|
|
||||||
const [groupAffinitiesBeingEditted, setGroupAffinitiesBeingEditted] = useState<Group | undefined>(undefined);
|
|
||||||
|
|
||||||
const [guestsLoaded, setGuestsLoaded] = useState(false);
|
|
||||||
const [guests, setGuests] = useState<Array<Guest>>([]);
|
|
||||||
const [guestBeingEdited, setGuestBeingEdited] = useState<Guest | undefined>(undefined);
|
|
||||||
|
|
||||||
!groupsLoaded && refreshGroups();
|
|
||||||
!guestsLoaded && refreshGuests();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="w-full">
|
|
||||||
<TabView>
|
|
||||||
<TabPanel header="Guests" leftIcon="pi pi-users mx-2">
|
|
||||||
<div className="flex flex-col w-full items-center justify-between">
|
|
||||||
<button onClick={() => setGuestBeingEdited({})} className={classNames('primary')}>Add new</button>
|
|
||||||
<GuestFormDialog
|
|
||||||
key={guestBeingEdited?.id}
|
|
||||||
groups={groups}
|
|
||||||
onCreate={() => { refreshGuests(); setGuestBeingEdited(undefined) }}
|
|
||||||
guest={guestBeingEdited}
|
|
||||||
visible={guestBeingEdited !== undefined}
|
|
||||||
onHide={() => { setGuestBeingEdited(undefined) }}
|
|
||||||
/>
|
|
||||||
<Suspense fallback={<SkeletonTable />}>
|
|
||||||
<GuestsTable
|
|
||||||
guests={guests}
|
|
||||||
onUpdate={refreshGuests}
|
|
||||||
onEdit={(guest) => setGuestBeingEdited(guest)}
|
|
||||||
/>
|
|
||||||
</Suspense>
|
|
||||||
</div>
|
|
||||||
</ TabPanel>
|
|
||||||
<TabPanel header="Groups" leftIcon="pi pi-sitemap mx-2">
|
|
||||||
<div className="flex flex-col w-full items-center justify-between">
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<button onClick={() => setGroupBeingEdited({})} className={classNames('primary')}>Add new</button>
|
|
||||||
<button onClick={resetAffinities} className={classNames('yellow')}>Reset affinities</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<GroupFormDialog
|
|
||||||
key={groupBeingEdited?.id}
|
|
||||||
groups={groups}
|
|
||||||
onCreate={() => { refreshGroups(); setGroupBeingEdited(undefined) }}
|
|
||||||
group={groupBeingEdited}
|
|
||||||
visible={groupBeingEdited !== undefined}
|
|
||||||
onHide={() => { setGroupBeingEdited(undefined) }}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<AffinitiesFormDialog
|
|
||||||
groups={groups}
|
|
||||||
group={groupAffinitiesBeingEditted}
|
|
||||||
visible={groupAffinitiesBeingEditted !== undefined}
|
|
||||||
onHide={() => { setGroupAffinitiesBeingEditted(undefined) }}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Suspense fallback={<SkeletonTable />}>
|
|
||||||
<GroupsTable
|
|
||||||
groups={groups}
|
|
||||||
onUpdate={refreshGroups}
|
|
||||||
onEdit={(group) => setGroupBeingEdited(group)}
|
|
||||||
onEditAffinities={(group) => setGroupAffinitiesBeingEditted(group)}
|
|
||||||
/>
|
|
||||||
</Suspense>
|
|
||||||
</div>
|
|
||||||
</ TabPanel>
|
|
||||||
</ TabView>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,26 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { GlobalSummary as Summary } from '@/app/lib/definitions';
|
|
||||||
import { getSlug } from '@/app/lib/utils';
|
|
||||||
import GlobalSummary from '@/app/ui/dashboard/global-summary';
|
|
||||||
import { useEffect, useState } from 'react';
|
|
||||||
|
|
||||||
export default function Page() {
|
|
||||||
const [globalSummary, setGlobalSummary] = useState<Summary | undefined>(undefined);
|
|
||||||
|
|
||||||
function refreshSummary() {
|
|
||||||
fetch(`/api/${getSlug()}/summary`)
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) => {
|
|
||||||
setGlobalSummary(data);
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(refreshSummary, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
globalSummary && <GlobalSummary summary={globalSummary} />
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,18 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import Arrangement from '@/app/ui/arrangements/arrangement';
|
|
||||||
import React, { useState } from 'react';
|
|
||||||
import ArrangementsTable from '@/app/ui/arrangements/arrangements-table';
|
|
||||||
|
|
||||||
export default function Page() {
|
|
||||||
const [currentArrangement, setCurrentArrangement] = useState<string | null>(null);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<ArrangementsTable onArrangementSelected={setCurrentArrangement} />
|
|
||||||
{currentArrangement && <Arrangement key={currentArrangement} id={currentArrangement} />}
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,40 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import LoginForm from '@/app/ui/components/login-form';
|
|
||||||
import RegistrationForm from '@/app/ui/components/registration-form';
|
|
||||||
import { useParams } from 'next/navigation'
|
|
||||||
import { useEffect } from 'react';
|
|
||||||
import { retrieveCSRFToken } from '../api/authentication';
|
|
||||||
import { getCsrfToken } from '../lib/utils';
|
|
||||||
|
|
||||||
export default async function Page() {
|
|
||||||
const params = useParams<{ slug: string }>()
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (getCsrfToken() == 'unknown') {
|
|
||||||
retrieveCSRFToken();
|
|
||||||
}
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
if (typeof window !== 'undefined') {
|
|
||||||
localStorage.setItem('slug', await params.slug);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<main className="flex min-h-screen flex-col p-6">
|
|
||||||
<div className="flex flex-row">
|
|
||||||
<div className="w-1/2">
|
|
||||||
Already have an account? Sign in
|
|
||||||
<LoginForm />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="w-1/2">
|
|
||||||
Don't have an account? Register now!
|
|
||||||
<RegistrationForm />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,76 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Entity } from '@/app/lib/definitions';
|
|
||||||
import { getCsrfToken, getSlug } from '@/app/lib/utils';
|
|
||||||
|
|
||||||
export interface Api<T extends Entity> {
|
|
||||||
getAll(serializable: Serializable<T> ,callback: (objets: T[]) => void): void;
|
|
||||||
get(serializable: Serializable<T>, id: string, callback: (object: T) => void): void;
|
|
||||||
create(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;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface Serializable<T> {
|
|
||||||
fromJson(json: any): T;
|
|
||||||
toJson(object: T): string;
|
|
||||||
apiPath(): string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export class AbstractApi<T extends Entity> implements Api<T> {
|
|
||||||
getAll(serializable: Serializable<T>, callback: (objets: T[]) => void): void {
|
|
||||||
fetch(`/api/${getSlug()}/${serializable.apiPath()}`)
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) => {
|
|
||||||
callback(data.map((record: any) => {
|
|
||||||
return serializable.fromJson(record);
|
|
||||||
}));
|
|
||||||
}, (error) => {
|
|
||||||
return [];
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
get(serializable: Serializable<T>, id: string, callback: (object: T) => void): void {
|
|
||||||
fetch(`/api/${getSlug()}/${serializable.apiPath()}/${id}`)
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) => {
|
|
||||||
callback(serializable.fromJson(data));
|
|
||||||
}, (error) => {
|
|
||||||
return [];
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
update(serializable: Serializable<T>, object: T, callback: () => void): void {
|
|
||||||
fetch(`/api/${getSlug()}/${serializable.apiPath()}/${object.id}`, {
|
|
||||||
method: 'PUT',
|
|
||||||
body: serializable.toJson(object),
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
}).then(callback)
|
|
||||||
.catch((error) => console.error(error));
|
|
||||||
}
|
|
||||||
|
|
||||||
create(serializable: Serializable<T>, object: T, callback: () => void): void {
|
|
||||||
fetch(`/api/${getSlug()}/${serializable.apiPath()}`, {
|
|
||||||
method: 'POST',
|
|
||||||
body: serializable.toJson(object),
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
}).then(callback)
|
|
||||||
.catch((error) => console.error(error));
|
|
||||||
}
|
|
||||||
|
|
||||||
destroy(serializable: Serializable<T>, object: T, callback: () => void): void {
|
|
||||||
fetch(`/api/${getSlug()}/${serializable.apiPath()}/${object.id}`, {
|
|
||||||
method: 'DELETE',
|
|
||||||
headers: {
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
}).then(callback)
|
|
||||||
.catch((error) => console.error(error));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,86 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { asArray, getCsrfToken, getSlug } from '@/app/lib/utils';
|
|
||||||
import { Captcha, StructuredErrors, User } from '@/app/lib/definitions';
|
|
||||||
|
|
||||||
export function login({ email, password, onLogin }: { email: string, password: string, onLogin: (user: User) => void }) {
|
|
||||||
return fetch(`/api/${getSlug()}/users/sign_in`, {
|
|
||||||
method: 'POST',
|
|
||||||
body: JSON.stringify({ user: { email, password } }),
|
|
||||||
headers: {
|
|
||||||
'Accept': 'application/json',
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data: any) => {
|
|
||||||
console.log(data);
|
|
||||||
onLogin({
|
|
||||||
id: data.id || '',
|
|
||||||
email: data.email || '',
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch((error) => console.error(error));
|
|
||||||
}
|
|
||||||
|
|
||||||
export function logout({ onLogout }: { onLogout: () => void }) {
|
|
||||||
fetch(`/api/${getSlug()}/users/sign_out`, {
|
|
||||||
method: 'DELETE',
|
|
||||||
headers: {
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
}).then(onLogout)
|
|
||||||
.catch((error) => console.error(error));
|
|
||||||
}
|
|
||||||
|
|
||||||
function flattenErrors(errors: StructuredErrors): string[] {
|
|
||||||
if (errors instanceof Array) {
|
|
||||||
return errors;
|
|
||||||
}
|
|
||||||
return Object.keys(errors).map((key) => {
|
|
||||||
return `${key}: ${asArray(errors[key]).join(', ')}`;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// At this moment we're making an initial request to get a valid CSRF token
|
|
||||||
export function retrieveCSRFToken() {
|
|
||||||
return fetch(`/api/token`, {
|
|
||||||
headers: {
|
|
||||||
'Accept': 'application/json',
|
|
||||||
}
|
|
||||||
}).then((response) => { return null });
|
|
||||||
}
|
|
||||||
|
|
||||||
export function register({ slug, email, password, passwordConfirmation, captcha, onRegister, onError }: {
|
|
||||||
slug: string,
|
|
||||||
email: string,
|
|
||||||
password: string,
|
|
||||||
passwordConfirmation: string,
|
|
||||||
captcha: Captcha,
|
|
||||||
onRegister: () => void,
|
|
||||||
onError: (errors: string[]) => void
|
|
||||||
}) {
|
|
||||||
fetch(`/api/${slug}/users`, {
|
|
||||||
method: 'POST',
|
|
||||||
body: JSON.stringify(
|
|
||||||
{
|
|
||||||
user: { email, password, password_confirmation: passwordConfirmation },
|
|
||||||
captcha: { id: captcha.id, answer: captcha.answer }
|
|
||||||
}
|
|
||||||
),
|
|
||||||
headers: {
|
|
||||||
'Accept': 'application/json',
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
}).then((response) => {
|
|
||||||
if (response.ok) {
|
|
||||||
response.json().then(onRegister);
|
|
||||||
} else {
|
|
||||||
response.json().then((data: any) => {
|
|
||||||
onError(data.errors && flattenErrors(data.errors) || [data.error]);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
@ -1,19 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { data } from "autoprefixer";
|
|
||||||
import { getCsrfToken } from "../lib/utils";
|
|
||||||
|
|
||||||
export function getCaptchaChallenge({onRetrieve}: {onRetrieve: (id: string, url: string) => void}){
|
|
||||||
return fetch('/api/captcha', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Accept': 'application/json',
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data: any) => {
|
|
||||||
onRetrieve(data.id, data.media_url)
|
|
||||||
})
|
|
||||||
.catch((error) => console.error(error));
|
|
||||||
}
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { NextResponse } from "next/server";
|
|
||||||
|
|
||||||
export function GET() {
|
|
||||||
return NextResponse.json({});
|
|
||||||
}
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { TableArrangement } from '@/app/lib/definitions';
|
|
||||||
import { getSlug } from '../lib/utils';
|
|
||||||
|
|
||||||
export function loadTableSimulations(onLoad?: (tableSimulations: TableArrangement[]) => void) {
|
|
||||||
fetch(`/api/${getSlug()}/tables_arrangements`)
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) => {
|
|
||||||
onLoad && onLoad(data.map((record: any) => {
|
|
||||||
return ({
|
|
||||||
id: record.id,
|
|
||||||
name: record.name,
|
|
||||||
discomfort: record.discomfort,
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
}, (error) => {
|
|
||||||
return [];
|
|
||||||
});
|
|
||||||
}
|
|
||||||
11
app/dashboard/expenses/page.tsx
Normal file
11
app/dashboard/expenses/page.tsx
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
|
||||||
|
export default function Page () {
|
||||||
|
return (
|
||||||
|
<div className="w-full">
|
||||||
|
<div className="flex w-full items-center justify-between">
|
||||||
|
<h1 className={`${lusitana.className} text-2xl`}>Expenses</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
22
app/dashboard/guests/page.tsx
Normal file
22
app/dashboard/guests/page.tsx
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
import AffinityGroupsTree from '@/app/ui/guests/affinity-groups-tree';
|
||||||
|
import GuestsTable from '@/app/ui/guests/table';
|
||||||
|
import React, { Suspense } from 'react';
|
||||||
|
import SkeletonTable from '@/app/ui/guests/skeleton-row';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
export default function Page() {
|
||||||
|
return (
|
||||||
|
<div className="w-full">
|
||||||
|
<AffinityGroupsTree />
|
||||||
|
|
||||||
|
<h1 className={`${lusitana.className} text-2xl py-4`}>Guests</h1>
|
||||||
|
<div className="flex w-full items-center justify-between">
|
||||||
|
<Suspense fallback={<SkeletonTable />}>
|
||||||
|
<GuestsTable />
|
||||||
|
</Suspense>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import SideNav from '@/app/ui/dashboard/sidenav';
|
import SideNav from '@/app/ui/dashboard/sidenav';
|
||||||
|
|
||||||
export default function Layout({ children }: { children: React.ReactNode }) {
|
export default function Layout({ children }: { children: React.ReactNode }) {
|
||||||
@ -8,7 +6,7 @@ export default function Layout({ children }: { children: React.ReactNode }) {
|
|||||||
<div className="w-full flex-none md:w-64">
|
<div className="w-full flex-none md:w-64">
|
||||||
<SideNav />
|
<SideNav />
|
||||||
</div>
|
</div>
|
||||||
<div data-testid="main-container" className="flex-grow p-6 md:overflow-y-auto md:p-12">{children}</div>
|
<div className="flex-grow p-6 md:overflow-y-auto md:p-12">{children}</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
3
app/dashboard/page.tsx
Normal file
3
app/dashboard/page.tsx
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
export default function Page() {
|
||||||
|
return <p>Dashboard Page</p>;
|
||||||
|
}
|
||||||
11
app/dashboard/tables/page.tsx
Normal file
11
app/dashboard/tables/page.tsx
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
|
||||||
|
export default function Page () {
|
||||||
|
return (
|
||||||
|
<div className="w-full">
|
||||||
|
<div className="flex w-full items-center justify-between">
|
||||||
|
<h1 className={`${lusitana.className} text-2xl`}>Table distributions</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import '@/app/ui/global.css'
|
import '@/app/ui/global.css'
|
||||||
|
|
||||||
import 'primereact/resources/themes/lara-light-cyan/theme.css';
|
import 'primereact/resources/themes/lara-light-cyan/theme.css';
|
||||||
|
|||||||
@ -1,5 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
export class Affinities {
|
|
||||||
[key:string]: number;
|
|
||||||
}
|
|
||||||
@ -1,49 +1,104 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
// This file contains type definitions for your data.
|
||||||
|
// It describes the shape of the data, and what data type each property should accept.
|
||||||
import { AttendanceSummary } from "./group";
|
// For simplicity of teaching, we're manually defining these types.
|
||||||
import { Guest } from "./guest";
|
// However, these types are generated automatically if you're using an ORM such as Prisma.
|
||||||
|
|
||||||
export interface Entity {
|
|
||||||
id?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export type TableArrangement = {
|
|
||||||
id: string;
|
|
||||||
number: number;
|
|
||||||
name: string;
|
|
||||||
guests?: Guest[];
|
|
||||||
discomfort?: number
|
|
||||||
}
|
|
||||||
|
|
||||||
export type User = {
|
export type User = {
|
||||||
id: string;
|
id: string;
|
||||||
|
name: string;
|
||||||
email: string;
|
email: string;
|
||||||
}
|
password: string;
|
||||||
|
|
||||||
export type Captcha = {
|
|
||||||
id: string;
|
|
||||||
answer: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export type StructuredErrors = {
|
|
||||||
[key: string]: string[] | string;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export type GlobalSummary = {
|
export type Customer = {
|
||||||
expenses: ExpenseSummary;
|
id: string;
|
||||||
guests: AttendanceSummary
|
name: string;
|
||||||
|
email: string;
|
||||||
|
image_url: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type Guest = {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
email: string;
|
||||||
|
group_name: string;
|
||||||
|
status: 'Considered' | 'Invited' | 'Confirmed' | 'Declined' | 'Tentative';
|
||||||
}
|
}
|
||||||
|
|
||||||
export type ExpenseSummary = {
|
export type Group = {
|
||||||
projected: ExpensePossibleSummary;
|
id: string;
|
||||||
confirmed: ExpensePossibleSummary;
|
name: string;
|
||||||
status: StatusSummary;
|
guest_count: number;
|
||||||
}
|
icon: string;
|
||||||
|
children: Group[];
|
||||||
|
};
|
||||||
|
|
||||||
export type ExpensePossibleSummary = {
|
export type Invoice = {
|
||||||
total: number;
|
id: string;
|
||||||
guests: number;
|
customer_id: string;
|
||||||
}
|
amount: number;
|
||||||
export type StatusSummary = {
|
date: string;
|
||||||
paid: number;
|
// In TypeScript, this is called a string union type.
|
||||||
}
|
// It means that the "status" property can only be one of the two strings: 'pending' or 'paid'.
|
||||||
|
status: 'pending' | 'paid';
|
||||||
|
};
|
||||||
|
|
||||||
|
export type Revenue = {
|
||||||
|
month: string;
|
||||||
|
revenue: number;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type LatestInvoice = {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
image_url: string;
|
||||||
|
email: string;
|
||||||
|
amount: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
// The database returns a number for amount, but we later format it to a string with the formatCurrency function
|
||||||
|
export type LatestInvoiceRaw = Omit<LatestInvoice, 'amount'> & {
|
||||||
|
amount: number;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type guestsTable = {
|
||||||
|
id: string;
|
||||||
|
customer_id: string;
|
||||||
|
name: string;
|
||||||
|
email: string;
|
||||||
|
image_url: string;
|
||||||
|
date: string;
|
||||||
|
amount: number;
|
||||||
|
status: 'pending' | 'paid';
|
||||||
|
};
|
||||||
|
|
||||||
|
export type CustomersTableType = {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
email: string;
|
||||||
|
image_url: string;
|
||||||
|
total_guests: number;
|
||||||
|
total_pending: number;
|
||||||
|
total_paid: number;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type FormattedCustomersTable = {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
email: string;
|
||||||
|
image_url: string;
|
||||||
|
total_guests: number;
|
||||||
|
total_pending: string;
|
||||||
|
total_paid: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type CustomerField = {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type InvoiceForm = {
|
||||||
|
id: string;
|
||||||
|
customer_id: string;
|
||||||
|
amount: number;
|
||||||
|
status: 'pending' | 'paid';
|
||||||
|
};
|
||||||
|
|||||||
@ -1,41 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Serializable } from "../api/abstract-api";
|
|
||||||
import { Entity } from "./definitions";
|
|
||||||
|
|
||||||
export const pricingTypes = ['fixed', 'per_person'] as const;
|
|
||||||
export type PricingType = typeof pricingTypes[number];
|
|
||||||
|
|
||||||
export class Expense implements Entity {
|
|
||||||
id?: string;
|
|
||||||
name?: string;
|
|
||||||
amount?: number;
|
|
||||||
pricingType?: PricingType;
|
|
||||||
|
|
||||||
constructor(id?: string, name?: string, amount?: number, pricingType?: PricingType) {
|
|
||||||
this.id = id;
|
|
||||||
this.name = name || '';
|
|
||||||
this.amount = amount || 0;
|
|
||||||
this.pricingType = pricingType || 'fixed';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class ExpenseSerializer implements Serializable<Expense>{
|
|
||||||
fromJson(data: any): Expense {
|
|
||||||
return new Expense(data.id, data.name, data.amount, data.pricing_type);
|
|
||||||
}
|
|
||||||
|
|
||||||
toJson(expense: Expense): string {
|
|
||||||
return JSON.stringify({
|
|
||||||
expense: {
|
|
||||||
name: expense.name,
|
|
||||||
amount: expense.amount,
|
|
||||||
pricing_type: expense.pricingType
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
apiPath(): string {
|
|
||||||
return 'expenses';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,64 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Entity } from "./definitions";
|
|
||||||
|
|
||||||
export type AttendanceSummary = {
|
|
||||||
considered: number;
|
|
||||||
invited: number;
|
|
||||||
confirmed: number;
|
|
||||||
declined: number;
|
|
||||||
tentative: number;
|
|
||||||
total: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
export class Group implements Entity {
|
|
||||||
id?: string;
|
|
||||||
name?: string;
|
|
||||||
guest_count?: number;
|
|
||||||
icon?: string;
|
|
||||||
children?: Group[];
|
|
||||||
parentId?: string;
|
|
||||||
color?: string;
|
|
||||||
attendance?: AttendanceSummary
|
|
||||||
|
|
||||||
constructor(id?: string, name?: string, guest_count?: number, icon?: string, children?: Group[], parentId?: string, color?: string, attendance?: AttendanceSummary) {
|
|
||||||
this.id = id;
|
|
||||||
this.name = name;
|
|
||||||
this.guest_count = guest_count;
|
|
||||||
this.icon = icon;
|
|
||||||
this.children = children;
|
|
||||||
this.parentId = parentId;
|
|
||||||
this.color = color;
|
|
||||||
this.attendance = attendance;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class GroupSerializer {
|
|
||||||
fromJson(data: any): Group {
|
|
||||||
return new Group(
|
|
||||||
data.id,
|
|
||||||
data.name,
|
|
||||||
data.guest_count,
|
|
||||||
data.icon,
|
|
||||||
data.children,
|
|
||||||
data.parent_id,
|
|
||||||
data.color,
|
|
||||||
data.attendance
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
toJson(group: Group): string {
|
|
||||||
return JSON.stringify({
|
|
||||||
group: {
|
|
||||||
name: group.name,
|
|
||||||
color: group.color,
|
|
||||||
icon: group.icon,
|
|
||||||
parent_id: group.parentId
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
apiPath(): string {
|
|
||||||
return 'groups';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,42 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Serializable } from "../api/abstract-api";
|
|
||||||
import { Entity } from "./definitions";
|
|
||||||
|
|
||||||
export const guestStatuses = ['considered', 'invited', 'confirmed', 'declined', 'tentative'] as const;
|
|
||||||
export type GuestStatus = typeof guestStatuses[number];
|
|
||||||
|
|
||||||
export class Guest implements Entity {
|
|
||||||
id?: string;
|
|
||||||
name?: string;
|
|
||||||
group_name?: string;
|
|
||||||
groupId?: string;
|
|
||||||
color?: string;
|
|
||||||
status?: GuestStatus;
|
|
||||||
children?: Guest[];
|
|
||||||
|
|
||||||
constructor(id?: string, name?: string, group_name?: string, groupId?: string, color?: string, status?: GuestStatus, children?: Guest[]) {
|
|
||||||
this.id = id;
|
|
||||||
this.name = name;
|
|
||||||
this.group_name = group_name;
|
|
||||||
this.groupId = groupId;
|
|
||||||
this.color = color;
|
|
||||||
this.status = status;
|
|
||||||
this.children = children;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class GuestSerializer implements Serializable<Guest> {
|
|
||||||
fromJson(data: any): Guest {
|
|
||||||
return new Guest(data.id, data.name, data.group?.name, data.group?.id, data.color, data.status, data.children);
|
|
||||||
}
|
|
||||||
|
|
||||||
toJson(guest: Guest): string {
|
|
||||||
return JSON.stringify({ guest: { name: guest.name, status: guest.status, group_id: guest.groupId } });
|
|
||||||
}
|
|
||||||
|
|
||||||
apiPath(): string {
|
|
||||||
return 'guests';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
147
app/lib/placeholder-data.ts
Normal file
147
app/lib/placeholder-data.ts
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
// This file contains placeholder data that you'll be replacing with real data in the Data Fetching chapter:
|
||||||
|
// https://nextjs.org/learn/dashboard-app/fetching-data
|
||||||
|
const users = [
|
||||||
|
{
|
||||||
|
id: '410544b2-4001-4271-9855-fec4b6a6442a',
|
||||||
|
name: 'User',
|
||||||
|
email: 'user@nextmail.com',
|
||||||
|
password: '123456',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const customers = [
|
||||||
|
{
|
||||||
|
id: 'd6e15727-9fe1-4961-8c5b-ea44a9bd81aa',
|
||||||
|
name: 'Evil Rabbit',
|
||||||
|
email: 'evil@rabbit.com',
|
||||||
|
image_url: '/customers/evil-rabbit.png',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3958dc9e-712f-4377-85e9-fec4b6a6442a',
|
||||||
|
name: 'Delba de Oliveira',
|
||||||
|
email: 'delba@oliveira.com',
|
||||||
|
image_url: '/customers/delba-de-oliveira.png',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3958dc9e-742f-4377-85e9-fec4b6a6442a',
|
||||||
|
name: 'Lee Robinson',
|
||||||
|
email: 'lee@robinson.com',
|
||||||
|
image_url: '/customers/lee-robinson.png',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '76d65c26-f784-44a2-ac19-586678f7c2f2',
|
||||||
|
name: 'Michael Novotny',
|
||||||
|
email: 'michael@novotny.com',
|
||||||
|
image_url: '/customers/michael-novotny.png',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'CC27C14A-0ACF-4F4A-A6C9-D45682C144B9',
|
||||||
|
name: 'Amy Burns',
|
||||||
|
email: 'amy@burns.com',
|
||||||
|
image_url: '/customers/amy-burns.png',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '13D07535-C59E-4157-A011-F8D2EF4E0CBB',
|
||||||
|
name: 'Balazs Orban',
|
||||||
|
email: 'balazs@orban.com',
|
||||||
|
image_url: '/customers/balazs-orban.png',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const guests = [
|
||||||
|
{
|
||||||
|
customer_id: customers[0].id,
|
||||||
|
amount: 15795,
|
||||||
|
status: 'pending',
|
||||||
|
date: '2022-12-06',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[1].id,
|
||||||
|
amount: 20348,
|
||||||
|
status: 'pending',
|
||||||
|
date: '2022-11-14',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[4].id,
|
||||||
|
amount: 3040,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2022-10-29',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[3].id,
|
||||||
|
amount: 44800,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2023-09-10',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[5].id,
|
||||||
|
amount: 34577,
|
||||||
|
status: 'pending',
|
||||||
|
date: '2023-08-05',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[2].id,
|
||||||
|
amount: 54246,
|
||||||
|
status: 'pending',
|
||||||
|
date: '2023-07-16',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[0].id,
|
||||||
|
amount: 666,
|
||||||
|
status: 'pending',
|
||||||
|
date: '2023-06-27',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[3].id,
|
||||||
|
amount: 32545,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2023-06-09',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[4].id,
|
||||||
|
amount: 1250,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2023-06-17',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[5].id,
|
||||||
|
amount: 8546,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2023-06-07',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[1].id,
|
||||||
|
amount: 500,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2023-08-19',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[5].id,
|
||||||
|
amount: 8945,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2023-06-03',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
customer_id: customers[2].id,
|
||||||
|
amount: 1000,
|
||||||
|
status: 'paid',
|
||||||
|
date: '2022-06-05',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const revenue = [
|
||||||
|
{ month: 'Jan', revenue: 2000 },
|
||||||
|
{ month: 'Feb', revenue: 1800 },
|
||||||
|
{ month: 'Mar', revenue: 2200 },
|
||||||
|
{ month: 'Apr', revenue: 2500 },
|
||||||
|
{ month: 'May', revenue: 2300 },
|
||||||
|
{ month: 'Jun', revenue: 3200 },
|
||||||
|
{ month: 'Jul', revenue: 3500 },
|
||||||
|
{ month: 'Aug', revenue: 3700 },
|
||||||
|
{ month: 'Sep', revenue: 2500 },
|
||||||
|
{ month: 'Oct', revenue: 2800 },
|
||||||
|
{ month: 'Nov', revenue: 3000 },
|
||||||
|
{ month: 'Dec', revenue: 4800 },
|
||||||
|
];
|
||||||
|
|
||||||
|
export { users, customers, guests, revenue };
|
||||||
@ -1,71 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Serializable } from "../api/abstract-api";
|
|
||||||
import { Entity } from "./definitions";
|
|
||||||
import { Guest } from "./guest";
|
|
||||||
|
|
||||||
export type Discomfort = {
|
|
||||||
discomfort: number;
|
|
||||||
breakdown: {
|
|
||||||
tableSizePenalty: number;
|
|
||||||
cohesionPenalty: number;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export type Table = {
|
|
||||||
number: number;
|
|
||||||
guests: Guest[];
|
|
||||||
discomfort: Discomfort;
|
|
||||||
}
|
|
||||||
|
|
||||||
export class TableSimulation implements Entity {
|
|
||||||
id: string;
|
|
||||||
tables: Table[];
|
|
||||||
|
|
||||||
constructor(id: string, tables: Table[]) {
|
|
||||||
this.id = id;
|
|
||||||
this.tables = tables;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class TableSimulationSerializer implements Serializable<TableSimulation> {
|
|
||||||
fromJson(data: any): TableSimulation {
|
|
||||||
return new TableSimulation(data.id, data.tables.map((table: any) => {
|
|
||||||
return {
|
|
||||||
number: table.number,
|
|
||||||
guests: table.guests.map((guest: any) => new Guest(guest.id, guest.name, guest.group?.name, guest.group?.id, guest.color)),
|
|
||||||
discomfort: {
|
|
||||||
discomfort: table.discomfort.discomfort,
|
|
||||||
breakdown: {
|
|
||||||
tableSizePenalty: table.discomfort.breakdown.table_size_penalty,
|
|
||||||
cohesionPenalty: table.discomfort.breakdown.cohesion_penalty,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}));
|
|
||||||
}
|
|
||||||
|
|
||||||
toJson(simulation: TableSimulation): string {
|
|
||||||
return JSON.stringify({ simulation: { tables: simulation.tables.map((table) => {
|
|
||||||
return {
|
|
||||||
number: table.number,
|
|
||||||
guests: table.guests.map((guest) => {
|
|
||||||
return {
|
|
||||||
id: guest.id,
|
|
||||||
name: guest.name,
|
|
||||||
group_id: guest.groupId,
|
|
||||||
color: guest.color,
|
|
||||||
status: guest.status,
|
|
||||||
children: guest.children,
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
discomfort: table.discomfort,
|
|
||||||
}
|
|
||||||
}) } });
|
|
||||||
}
|
|
||||||
|
|
||||||
apiPath(): string {
|
|
||||||
return 'tables_arrangements';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,20 +1,69 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
import { Revenue } from './definitions';
|
||||||
|
|
||||||
export const getCsrfToken = () => {
|
export const formatCurrency = (amount: number) => {
|
||||||
return document.cookie
|
return (amount / 100).toLocaleString('en-US', {
|
||||||
.split("; ")
|
style: 'currency',
|
||||||
.find((row) => row.startsWith("csrf-token"))
|
currency: 'USD',
|
||||||
?.split("=")[1] || 'unknown';
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
export const formatDateToLocal = (
|
||||||
|
dateStr: string,
|
||||||
|
locale: string = 'en-US',
|
||||||
|
) => {
|
||||||
|
const date = new Date(dateStr);
|
||||||
|
const options: Intl.DateTimeFormatOptions = {
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'short',
|
||||||
|
year: 'numeric',
|
||||||
|
};
|
||||||
|
const formatter = new Intl.DateTimeFormat(locale, options);
|
||||||
|
return formatter.format(date);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const generateYAxis = (revenue: Revenue[]) => {
|
||||||
|
// Calculate what labels we need to display on the y-axis
|
||||||
|
// based on highest record and in 1000s
|
||||||
|
const yAxisLabels = [];
|
||||||
|
const highestRecord = Math.max(...revenue.map((month) => month.revenue));
|
||||||
|
const topLabel = Math.ceil(highestRecord / 1000) * 1000;
|
||||||
|
|
||||||
|
for (let i = topLabel; i >= 0; i -= 1000) {
|
||||||
|
yAxisLabels.push(`$${i / 1000}K`);
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getSlug = () => localStorage.getItem('slug') || 'default';
|
return { yAxisLabels, topLabel };
|
||||||
|
};
|
||||||
|
|
||||||
// From https://stackoverflow.com/a/1026087/3607039
|
export const generatePagination = (currentPage: number, totalPages: number) => {
|
||||||
export const capitalize = (val:string) => {
|
// If the total number of pages is 7 or less,
|
||||||
return String(val).charAt(0).toUpperCase() + String(val).slice(1);
|
// display all pages without any ellipsis.
|
||||||
|
if (totalPages <= 7) {
|
||||||
|
return Array.from({ length: totalPages }, (_, i) => i + 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
// From https://stackoverflow.com/a/62118163/3607039
|
// If the current page is among the first 3 pages,
|
||||||
export function asArray<T>(value: T | T[]): T[] {
|
// show the first 3, an ellipsis, and the last 2 pages.
|
||||||
return ([] as T[]).concat(value)
|
if (currentPage <= 3) {
|
||||||
|
return [1, 2, 3, '...', totalPages - 1, totalPages];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// If the current page is among the last 3 pages,
|
||||||
|
// show the first 2, an ellipsis, and the last 3 pages.
|
||||||
|
if (currentPage >= totalPages - 2) {
|
||||||
|
return [1, 2, '...', totalPages - 2, totalPages - 1, totalPages];
|
||||||
|
}
|
||||||
|
|
||||||
|
// If the current page is somewhere in the middle,
|
||||||
|
// show the first page, an ellipsis, the current page and its neighbors,
|
||||||
|
// another ellipsis, and the last page.
|
||||||
|
return [
|
||||||
|
1,
|
||||||
|
'...',
|
||||||
|
currentPage - 1,
|
||||||
|
currentPage,
|
||||||
|
currentPage + 1,
|
||||||
|
'...',
|
||||||
|
totalPages,
|
||||||
|
];
|
||||||
|
};
|
||||||
|
|||||||
10
app/page.tsx
Normal file
10
app/page.tsx
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
import Link from 'next/link';
|
||||||
|
import styles from '@/app/ui/home.module.css';
|
||||||
|
|
||||||
|
export default function Page() {
|
||||||
|
return (
|
||||||
|
<main className="flex min-h-screen flex-col p-6">
|
||||||
|
|
||||||
|
</main>
|
||||||
|
);
|
||||||
|
}
|
||||||
122
app/seed/route.ts
Normal file
122
app/seed/route.ts
Normal file
@ -0,0 +1,122 @@
|
|||||||
|
// import bcrypt from 'bcrypt';
|
||||||
|
// import { db } from '@vercel/postgres';
|
||||||
|
// import { guests, customers, revenue, users } from '../lib/placeholder-data';
|
||||||
|
|
||||||
|
// const client = await db.connect();
|
||||||
|
|
||||||
|
// async function seedUsers() {
|
||||||
|
// await client.sql`CREATE EXTENSION IF NOT EXISTS "uuid-ossp"`;
|
||||||
|
// await client.sql`
|
||||||
|
// CREATE TABLE IF NOT EXISTS users (
|
||||||
|
// id UUID DEFAULT uuid_generate_v4() PRIMARY KEY,
|
||||||
|
// name VARCHAR(255) NOT NULL,
|
||||||
|
// email TEXT NOT NULL UNIQUE,
|
||||||
|
// password TEXT NOT NULL
|
||||||
|
// );
|
||||||
|
// `;
|
||||||
|
|
||||||
|
// const insertedUsers = await Promise.all(
|
||||||
|
// users.map(async (user) => {
|
||||||
|
// const hashedPassword = await bcrypt.hash(user.password, 10);
|
||||||
|
// return client.sql`
|
||||||
|
// INSERT INTO users (id, name, email, password)
|
||||||
|
// VALUES (${user.id}, ${user.name}, ${user.email}, ${hashedPassword})
|
||||||
|
// ON CONFLICT (id) DO NOTHING;
|
||||||
|
// `;
|
||||||
|
// }),
|
||||||
|
// );
|
||||||
|
|
||||||
|
// return insertedUsers;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// async function seedguests() {
|
||||||
|
// await client.sql`CREATE EXTENSION IF NOT EXISTS "uuid-ossp"`;
|
||||||
|
|
||||||
|
// await client.sql`
|
||||||
|
// CREATE TABLE IF NOT EXISTS guests (
|
||||||
|
// id UUID DEFAULT uuid_generate_v4() PRIMARY KEY,
|
||||||
|
// customer_id UUID NOT NULL,
|
||||||
|
// amount INT NOT NULL,
|
||||||
|
// status VARCHAR(255) NOT NULL,
|
||||||
|
// date DATE NOT NULL
|
||||||
|
// );
|
||||||
|
// `;
|
||||||
|
|
||||||
|
// const insertedguests = await Promise.all(
|
||||||
|
// guests.map(
|
||||||
|
// (invoice) => client.sql`
|
||||||
|
// INSERT INTO guests (customer_id, amount, status, date)
|
||||||
|
// VALUES (${invoice.customer_id}, ${invoice.amount}, ${invoice.status}, ${invoice.date})
|
||||||
|
// ON CONFLICT (id) DO NOTHING;
|
||||||
|
// `,
|
||||||
|
// ),
|
||||||
|
// );
|
||||||
|
|
||||||
|
// return insertedguests;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// async function seedCustomers() {
|
||||||
|
// await client.sql`CREATE EXTENSION IF NOT EXISTS "uuid-ossp"`;
|
||||||
|
|
||||||
|
// await client.sql`
|
||||||
|
// CREATE TABLE IF NOT EXISTS customers (
|
||||||
|
// id UUID DEFAULT uuid_generate_v4() PRIMARY KEY,
|
||||||
|
// name VARCHAR(255) NOT NULL,
|
||||||
|
// email VARCHAR(255) NOT NULL,
|
||||||
|
// image_url VARCHAR(255) NOT NULL
|
||||||
|
// );
|
||||||
|
// `;
|
||||||
|
|
||||||
|
// const insertedCustomers = await Promise.all(
|
||||||
|
// customers.map(
|
||||||
|
// (customer) => client.sql`
|
||||||
|
// INSERT INTO customers (id, name, email, image_url)
|
||||||
|
// VALUES (${customer.id}, ${customer.name}, ${customer.email}, ${customer.image_url})
|
||||||
|
// ON CONFLICT (id) DO NOTHING;
|
||||||
|
// `,
|
||||||
|
// ),
|
||||||
|
// );
|
||||||
|
|
||||||
|
// return insertedCustomers;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// async function seedRevenue() {
|
||||||
|
// await client.sql`
|
||||||
|
// CREATE TABLE IF NOT EXISTS revenue (
|
||||||
|
// month VARCHAR(4) NOT NULL UNIQUE,
|
||||||
|
// revenue INT NOT NULL
|
||||||
|
// );
|
||||||
|
// `;
|
||||||
|
|
||||||
|
// const insertedRevenue = await Promise.all(
|
||||||
|
// revenue.map(
|
||||||
|
// (rev) => client.sql`
|
||||||
|
// INSERT INTO revenue (month, revenue)
|
||||||
|
// VALUES (${rev.month}, ${rev.revenue})
|
||||||
|
// ON CONFLICT (month) DO NOTHING;
|
||||||
|
// `,
|
||||||
|
// ),
|
||||||
|
// );
|
||||||
|
|
||||||
|
// return insertedRevenue;
|
||||||
|
// }
|
||||||
|
|
||||||
|
export async function GET() {
|
||||||
|
return Response.json({
|
||||||
|
message:
|
||||||
|
'Uncomment this file and remove this line. You can delete this file when you are finished.',
|
||||||
|
});
|
||||||
|
// try {
|
||||||
|
// await client.sql`BEGIN`;
|
||||||
|
// await seedUsers();
|
||||||
|
// await seedCustomers();
|
||||||
|
// await seedguests();
|
||||||
|
// await seedRevenue();
|
||||||
|
// await client.sql`COMMIT`;
|
||||||
|
|
||||||
|
// return Response.json({ message: 'Database seeded successfully' });
|
||||||
|
// } catch (error) {
|
||||||
|
// await client.sql`ROLLBACK`;
|
||||||
|
// return Response.json({ error }, { status: 500 });
|
||||||
|
// }
|
||||||
|
}
|
||||||
@ -1,13 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import * as HeroIcon from '@heroicons/react/24/outline'
|
|
||||||
import { ComponentProps } from 'react'
|
|
||||||
|
|
||||||
type Props = {
|
|
||||||
name: keyof typeof HeroIcon
|
|
||||||
} & ComponentProps<typeof HeroIcon.AcademicCapIcon>
|
|
||||||
|
|
||||||
export const Icon = ({ name, ...props }: Props) => {
|
|
||||||
const IconComponent = HeroIcon[name]
|
|
||||||
return <IconComponent {...props} />
|
|
||||||
}
|
|
||||||
@ -1,38 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { TableArrangement } from '@/app/lib/definitions';
|
|
||||||
import { TableSimulation, TableSimulationSerializer } from '@/app/lib/tableSimulation';
|
|
||||||
import { getSlug } from '@/app/lib/utils';
|
|
||||||
import { Table } from '@/app/ui/components/table';
|
|
||||||
import { lusitana } from '@/app/ui/fonts';
|
|
||||||
import { useState, useEffect } from 'react';
|
|
||||||
|
|
||||||
export default function Arrangement({ id }: { id: string }) {
|
|
||||||
|
|
||||||
const [simulation, setSimulation] = useState<TableSimulation | undefined>(undefined);
|
|
||||||
|
|
||||||
function loadSimulation() {
|
|
||||||
new AbstractApi<TableSimulation>().get(new TableSimulationSerializer(), id, (object: TableSimulation) => {
|
|
||||||
setSimulation(object);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(loadSimulation, []);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="w-full">
|
|
||||||
<div className="w-full items-center justify-between">
|
|
||||||
<h1 className={`${lusitana.className} text-2xl my-5`}>Table distributions</h1>
|
|
||||||
<div className="flex flex-row flex-wrap justify-around">
|
|
||||||
{simulation && simulation.tables.map((table) => (
|
|
||||||
<Table key={table.number} table={table} style="rounded" />
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
|
|
||||||
}
|
|
||||||
@ -1,48 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client'
|
|
||||||
|
|
||||||
import React, { useState } from "react"
|
|
||||||
import { TableArrangement } from '@/app/lib/definitions';
|
|
||||||
import { classNames } from "../components/button";
|
|
||||||
import TableOfContents from "../components/table-of-contents";
|
|
||||||
import { loadTableSimulations } from "@/app/api/tableSimulations";
|
|
||||||
|
|
||||||
export default function ArrangementsTable ({onArrangementSelected}: {onArrangementSelected: (arrangementId: string) => void}) {
|
|
||||||
const [arrangements, setArrangements] = useState<Array<TableArrangement>>([]);
|
|
||||||
const [arrangementsLoaded, setArrangementsLoaded] = useState(false);
|
|
||||||
|
|
||||||
function refreshSimulations() {
|
|
||||||
loadTableSimulations((arrangements) => {
|
|
||||||
setArrangements(arrangements);
|
|
||||||
setArrangementsLoaded(true);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function arrangementClicked(e: React.MouseEvent<HTMLElement>) {
|
|
||||||
onArrangementSelected(e.currentTarget.getAttribute('data-arrangement-id') || '');
|
|
||||||
}
|
|
||||||
|
|
||||||
!arrangementsLoaded && refreshSimulations();
|
|
||||||
|
|
||||||
return(
|
|
||||||
<TableOfContents
|
|
||||||
headers={['Name', 'Discomfort', 'Actions']}
|
|
||||||
caption='Simulations'
|
|
||||||
elements={arrangements}
|
|
||||||
rowRender={(arrangement) => (
|
|
||||||
<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">
|
|
||||||
<th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{arrangement.name}
|
|
||||||
</th>
|
|
||||||
<td className="px-6 py-4">
|
|
||||||
{arrangement.discomfort}
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<button data-arrangement-id={arrangement.id} onClick={arrangementClicked} className={classNames('primary')}>Load</button>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import clsx from 'clsx';
|
import clsx from 'clsx';
|
||||||
|
|
||||||
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
||||||
|
|||||||
@ -1,82 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { Affinities } from '@/app/lib/affinities';
|
|
||||||
import { Group } from '@/app/lib/group';
|
|
||||||
import { getCsrfToken, getSlug } from '@/app/lib/utils';
|
|
||||||
import { classNames } from '@/app/ui/components/button';
|
|
||||||
import { Dialog } from 'primereact/dialog';
|
|
||||||
import { useEffect, useState } from 'react';
|
|
||||||
import AffinitySlider from './form/affinitySlider';
|
|
||||||
|
|
||||||
export default function AffinitiesFormDialog({ groups, group, visible, onHide }: {
|
|
||||||
groups: Group[],
|
|
||||||
group?: Group,
|
|
||||||
visible: boolean,
|
|
||||||
onHide: () => void,
|
|
||||||
}) {
|
|
||||||
const [affinities, setAffinities] = useState<Affinities>({});
|
|
||||||
const [isLoadingAffinities, setIsLoadingAffinities] = useState(true);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setIsLoadingAffinities(true);
|
|
||||||
if (group?.id === undefined) {
|
|
||||||
setAffinities({});
|
|
||||||
setIsLoadingAffinities(false)
|
|
||||||
} else {
|
|
||||||
fetch(`/api/${getSlug()}/groups/${group?.id}/affinities`)
|
|
||||||
.then((response) => response.json())
|
|
||||||
.then((data) => {
|
|
||||||
setAffinities(data);
|
|
||||||
setIsLoadingAffinities(false)
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}, [group]);
|
|
||||||
|
|
||||||
function submitAffinities() {
|
|
||||||
const formattedAffinities = Object.entries(affinities).map(([groupId, affinity]) => ({ group_id: groupId, affinity: affinity }));
|
|
||||||
fetch(`/api/${getSlug()}/groups/${group?.id}/affinities/bulk_update`, {
|
|
||||||
method: 'PUT',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
'X-CSRF-TOKEN': getCsrfToken(),
|
|
||||||
},
|
|
||||||
body: JSON.stringify({ affinities: formattedAffinities })
|
|
||||||
}).then(() => {
|
|
||||||
onHide();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function resetAffinities() {
|
|
||||||
fetch(`/api/${getSlug()}/groups/${group?.id}/affinities/default`, {
|
|
||||||
method: 'GET',
|
|
||||||
headers: {
|
|
||||||
'Accept': 'application/json',
|
|
||||||
}
|
|
||||||
}).then((response) => response.json())
|
|
||||||
.then(setAffinities);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<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">
|
|
||||||
<span className="text-center p-4">Describe the affinity with the rest of the groups</span>
|
|
||||||
|
|
||||||
{
|
|
||||||
groups.filter((currentGroup) => currentGroup.id !== group?.id).map((group) =>
|
|
||||||
<div key={group.id} className="flex flex-row hover:bg-gray-300 px-3 py-2 items-center">
|
|
||||||
<span className="w-1/3 text-right px-4">{group.name}</span>
|
|
||||||
<AffinitySlider value={group.id && affinities[group.id] || 1} onChange={(value) => setAffinities({ ...affinities, [group.id || "default"]: value })} />
|
|
||||||
</div>)
|
|
||||||
}
|
|
||||||
|
|
||||||
<div className="flex justify-center">
|
|
||||||
<button className={classNames('gray')} onClick={resetAffinities} >Reset</button>
|
|
||||||
<button className={classNames('primary')} onClick={submitAffinities} >Update</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
</Dialog>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,15 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import clsx from "clsx";
|
|
||||||
|
|
||||||
type ButtonColor = 'primary' | 'blue' | 'green' | 'red' | 'yellow' | 'gray';
|
|
||||||
|
|
||||||
export function classNames(type: ButtonColor) {
|
|
||||||
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-green-500 hover:bg-green-600': type === 'green',
|
|
||||||
'bg-red-500 hover:bg-red-600': type === 'red',
|
|
||||||
'bg-yellow-500 hover:bg-yellow-700': type === 'yellow',
|
|
||||||
'bg-gray-500 hover:bg-gray-700': type === 'gray'
|
|
||||||
}))
|
|
||||||
}
|
|
||||||
@ -1,53 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import clsx from "clsx"
|
|
||||||
import { Icon } from "../../types";
|
|
||||||
import * as HeroIcon from '@heroicons/react/24/outline'
|
|
||||||
|
|
||||||
type Style = "green" | "blue" | "red" | "orange" | "gray"
|
|
||||||
|
|
||||||
const colorClasses = (style: Style) => {
|
|
||||||
switch (style) {
|
|
||||||
case "green":
|
|
||||||
return "bg-green-700 hover:bg-green-800"
|
|
||||||
case "blue":
|
|
||||||
return "bg-blue-500 hover:bg-blue-700"
|
|
||||||
case "red":
|
|
||||||
return "bg-red-600 hover:bg-red-700"
|
|
||||||
case "orange":
|
|
||||||
return "bg-orange-600 hover:bg-orange-700"
|
|
||||||
case "gray":
|
|
||||||
return "bg-gray-600 hover:bg-gray-700"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export function MainCard({ amount, title, subtitle, style, iconName }:
|
|
||||||
{
|
|
||||||
amount: string,
|
|
||||||
title: string,
|
|
||||||
subtitle?: string,
|
|
||||||
style: Style,
|
|
||||||
iconName: keyof typeof HeroIcon
|
|
||||||
}) {
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={`w-80 m-1 py-2 px-6 text-white flex flex-row items-center ${colorClasses(style)}`}>
|
|
||||||
<Icon className="m-3 h-14 w-14" name={iconName} />
|
|
||||||
<div className="flex flex-col justify-evenly">
|
|
||||||
<div className="text-4xl font-medium">{amount}</div>
|
|
||||||
<div className="text-xl">{title}</div>
|
|
||||||
<div className="text-sm">{subtitle || 'ㅤ'}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SecondaryCard({ amount, title, iconName, style }: { amount: string, title: string, iconName: keyof typeof HeroIcon, style: Style }) {
|
|
||||||
return (
|
|
||||||
<div className={`h-12 w-80 m-1 p-2 text-white flex flex-row items-center ${colorClasses(style)}`}>
|
|
||||||
<Icon className="m-3 h-7 w-7" name={iconName} />
|
|
||||||
<span className="text-2xl font-medium mx-1">{amount}</span>
|
|
||||||
<span className="text-l mx-1">{title}</span>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,83 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { Expense, ExpenseSerializer, PricingType, pricingTypes } from '@/app/lib/expense';
|
|
||||||
import { capitalize } from '@/app/lib/utils';
|
|
||||||
import { classNames } from '@/app/ui/components/button';
|
|
||||||
import { Dialog } from 'primereact/dialog';
|
|
||||||
import { Dropdown } from 'primereact/dropdown';
|
|
||||||
import { FloatLabel } from 'primereact/floatlabel';
|
|
||||||
import { InputText } from 'primereact/inputtext';
|
|
||||||
import { useState } from 'react';
|
|
||||||
|
|
||||||
export default function ExpenseFormDialog({ onCreate, onHide, expense, visible }: {
|
|
||||||
onCreate?: () => void,
|
|
||||||
onHide: () => void,
|
|
||||||
expense?: Expense,
|
|
||||||
visible: boolean,
|
|
||||||
}) {
|
|
||||||
|
|
||||||
const [name, setName] = useState<string>(expense?.name || '');
|
|
||||||
const [amount, setAmount] = useState<number>(expense?.amount || 0);
|
|
||||||
const [pricingType, setPricingType] = useState<PricingType>(expense?.pricingType || 'fixed');
|
|
||||||
|
|
||||||
const api = new AbstractApi<Expense>();
|
|
||||||
const serializer = new ExpenseSerializer();
|
|
||||||
|
|
||||||
function resetForm() {
|
|
||||||
setName('');
|
|
||||||
setAmount(0);
|
|
||||||
setPricingType('fixed');
|
|
||||||
}
|
|
||||||
|
|
||||||
function submitGroup() {
|
|
||||||
if (expense?.id !== undefined) {
|
|
||||||
expense.name = name;
|
|
||||||
expense.amount = amount;
|
|
||||||
expense.pricingType = pricingType;
|
|
||||||
|
|
||||||
api.update(serializer, expense, () => {
|
|
||||||
resetForm();
|
|
||||||
onCreate && onCreate();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
|
|
||||||
api.create(serializer, new Expense(undefined, name, amount, pricingType), () => {
|
|
||||||
resetForm();
|
|
||||||
onCreate && onCreate();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
|
|
||||||
<Dialog header="Add/edit expense" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
|
|
||||||
<div className="card flex justify-evenly py-5">
|
|
||||||
<FloatLabel>
|
|
||||||
<InputText id="name" className='rounded-sm' value={name} onChange={(e) => setName(e.target.value)} />
|
|
||||||
<label htmlFor="name">Name</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<InputText id="amount" className='rounded-sm' value={amount.toString()} onChange={(e) => setAmount(parseFloat(e.target.value))} />
|
|
||||||
<label htmlFor="amount">Amount</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<Dropdown id="pricingType" className='rounded-sm min-w-32' value={pricingType} onChange={(e) => setPricingType(e.target.value)} options={
|
|
||||||
pricingTypes.map((type) => {
|
|
||||||
return { label: capitalize(type), value: type };
|
|
||||||
})
|
|
||||||
} />
|
|
||||||
<label htmlFor="pricingType">Pricing type</label>
|
|
||||||
</FloatLabel>
|
|
||||||
|
|
||||||
<button className={classNames('primary')} onClick={submitGroup} disabled={!(name.length > 0)}>
|
|
||||||
{expense?.id !== undefined ? 'Update' : 'Create'}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</Dialog>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,40 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Slider } from 'primereact/slider';
|
|
||||||
|
|
||||||
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) => {
|
|
||||||
if (value < 0.2) {
|
|
||||||
return 'Nemesis';
|
|
||||||
} else if (value < 0.5) {
|
|
||||||
return 'Enemies';
|
|
||||||
} else if (value < 0.9) {
|
|
||||||
return 'Bad vibes';
|
|
||||||
} else if (value < 1.1) {
|
|
||||||
return 'Neutral';
|
|
||||||
} else if (value < 1.5) {
|
|
||||||
return 'Good vibes';
|
|
||||||
} else if (value < 1.8) {
|
|
||||||
return 'Good friends';
|
|
||||||
} else {
|
|
||||||
return 'Besties';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Slider value={value} min={0} max={2} step={.1} onChange={(e) => onChange(toNumber(e.value))} className='w-80 bg-gray-400' />
|
|
||||||
<span className="px-4 w-1/5">
|
|
||||||
{label(value)}
|
|
||||||
</span>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,34 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import React, { useState } from 'react';
|
|
||||||
|
|
||||||
export default function InlineTextField({ initialValue, onChange }: { initialValue: string, onChange: (value: string) => void }) {
|
|
||||||
const [editing, setEditing] = useState(false);
|
|
||||||
const [value, setValue] = useState(initialValue);
|
|
||||||
|
|
||||||
const renderText = () => <span onClick={() => setEditing(true)}>{value}</span>
|
|
||||||
|
|
||||||
const onConfirm = () => {
|
|
||||||
onChange(value);
|
|
||||||
setEditing(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
function renderForm() {
|
|
||||||
return (
|
|
||||||
<div className="flex flex-row">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
value={value}
|
|
||||||
className="px-2 py-0 h-5 max-w-48"
|
|
||||||
onChange={(e) => setValue(e.target.value)}
|
|
||||||
onBlur={onConfirm}
|
|
||||||
autoFocus
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
editing ? (renderForm()) : (renderText())
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,95 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { Group, GroupSerializer } from '@/app/lib/group';
|
|
||||||
import { classNames } from '@/app/ui/components/button';
|
|
||||||
import { ColorPicker } from 'primereact/colorpicker';
|
|
||||||
import { Dialog } from 'primereact/dialog';
|
|
||||||
import { Dropdown } from 'primereact/dropdown';
|
|
||||||
import { FloatLabel } from 'primereact/floatlabel';
|
|
||||||
import { InputText } from 'primereact/inputtext';
|
|
||||||
import { useState } from 'react';
|
|
||||||
|
|
||||||
export default function GroupFormDialog({ groups, onCreate, onHide, group, visible }: {
|
|
||||||
groups: Group[],
|
|
||||||
onCreate?: () => void,
|
|
||||||
onHide: () => void,
|
|
||||||
group?: Group,
|
|
||||||
visible: boolean,
|
|
||||||
}) {
|
|
||||||
|
|
||||||
const [name, setName] = useState(group?.name || '');
|
|
||||||
const [icon, setIcon] = useState(group?.icon || '');
|
|
||||||
const [color, setColor] = useState<string>(group?.color || '');
|
|
||||||
const [parentId, setParentId] = useState(group?.parentId || '');
|
|
||||||
|
|
||||||
const api = new AbstractApi<Group>();
|
|
||||||
const serializer = new GroupSerializer();
|
|
||||||
|
|
||||||
function resetForm() {
|
|
||||||
setName('');
|
|
||||||
setIcon('');
|
|
||||||
setColor('');
|
|
||||||
setParentId('');
|
|
||||||
}
|
|
||||||
|
|
||||||
function submitGroup() {
|
|
||||||
if (!(name)) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (group?.id !== undefined) {
|
|
||||||
group.name = name;
|
|
||||||
group.icon = icon;
|
|
||||||
group.color = color;
|
|
||||||
group.parentId = parentId;
|
|
||||||
|
|
||||||
api.update(serializer, group, () => {
|
|
||||||
resetForm();
|
|
||||||
onCreate && onCreate();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
|
|
||||||
api.create(serializer, new Group(undefined, name, undefined, icon, undefined, parentId, color), () => {
|
|
||||||
resetForm();
|
|
||||||
onCreate && onCreate();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
|
|
||||||
<Dialog header="Add group" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
|
|
||||||
<div className="card flex justify-evenly py-5">
|
|
||||||
<FloatLabel>
|
|
||||||
<InputText id="name" className='rounded-sm' value={name} onChange={(e) => setName(e.target.value)} />
|
|
||||||
<label htmlFor="name">Name</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<InputText id="icon" className='rounded-sm' value={icon} onChange={(e) => setIcon(e.target.value)} />
|
|
||||||
<label htmlFor="icon">Icon</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<ColorPicker value={color} format='hex' onChange={(e) => setColor(`#${e.value}`)} />
|
|
||||||
<label htmlFor="color" />
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<Dropdown id="parentId" className='rounded-sm min-w-32' value={parentId} onChange={(e) => setParentId(e.target.value)} options={
|
|
||||||
groups.map((group) => {
|
|
||||||
return { label: group.name, value: group.id };
|
|
||||||
})
|
|
||||||
} />
|
|
||||||
<label htmlFor="parentId">Parent</label>
|
|
||||||
</FloatLabel>
|
|
||||||
|
|
||||||
<button className={classNames('primary')} onClick={submitGroup} disabled={!(name.length > 0)}>
|
|
||||||
{group?.id !== undefined ? 'Update' : 'Create'}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</Dialog>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,91 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { Group } from '@/app/lib/group';
|
|
||||||
import { Guest, GuestSerializer, GuestStatus, guestStatuses } from '@/app/lib/guest';
|
|
||||||
import { capitalize } from '@/app/lib/utils';
|
|
||||||
import { classNames } from '@/app/ui/components/button';
|
|
||||||
import { Dialog } from 'primereact/dialog';
|
|
||||||
import { Dropdown } from 'primereact/dropdown';
|
|
||||||
import { FloatLabel } from 'primereact/floatlabel';
|
|
||||||
import { InputText } from 'primereact/inputtext';
|
|
||||||
import { useState } from 'react';
|
|
||||||
|
|
||||||
export default function GuestFormDialog({ groups, onCreate, onHide, guest, visible }: {
|
|
||||||
groups: Group[],
|
|
||||||
onCreate?: () => void,
|
|
||||||
onHide: () => void,
|
|
||||||
guest?: Guest,
|
|
||||||
visible: boolean,
|
|
||||||
}) {
|
|
||||||
|
|
||||||
const [name, setName] = useState(guest?.name || '');
|
|
||||||
const [group, setGroup] = useState(guest?.groupId || null);
|
|
||||||
const [status, setStatus] = useState<GuestStatus | null>(guest?.status || null);
|
|
||||||
|
|
||||||
const api = new AbstractApi<Guest>();
|
|
||||||
const serializer = new GuestSerializer();
|
|
||||||
|
|
||||||
function resetForm() {
|
|
||||||
setName('');
|
|
||||||
setGroup(null);
|
|
||||||
setStatus(null);
|
|
||||||
}
|
|
||||||
|
|
||||||
function submitGuest() {
|
|
||||||
if (!(name && group && status)) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (guest?.id !== undefined) {
|
|
||||||
guest.name = name;
|
|
||||||
guest.groupId = group;
|
|
||||||
guest.status = status;
|
|
||||||
|
|
||||||
api.update(serializer, guest, () => {
|
|
||||||
resetForm();
|
|
||||||
onCreate && onCreate();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
api.create(serializer, new Guest(undefined, name, undefined, group, undefined, status), ()=> {
|
|
||||||
resetForm();
|
|
||||||
onCreate && onCreate();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
|
|
||||||
<Dialog header="Add guest" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
|
|
||||||
<div className="card flex justify-evenly py-5">
|
|
||||||
<FloatLabel>
|
|
||||||
<InputText id="username" className='rounded-sm' value={name} onChange={(e) => setName(e.target.value)} />
|
|
||||||
<label htmlFor="username">Username</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<Dropdown id="group" className='rounded-sm min-w-32' value={group} onChange={(e) => setGroup(e.target.value)} options={
|
|
||||||
groups.map((group) => {
|
|
||||||
return { label: group.name, value: group.id };
|
|
||||||
})
|
|
||||||
} />
|
|
||||||
<label htmlFor="group">Group</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<Dropdown id="status" className='rounded-sm min-w-32' value={status} onChange={(e) => setStatus(e.target.value)} options={
|
|
||||||
guestStatuses.map((status) => {
|
|
||||||
return { label: capitalize(status), value: status };
|
|
||||||
})
|
|
||||||
} />
|
|
||||||
<label htmlFor="status">Status</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<button className={classNames('primary')} onClick={submitGuest} disabled={!(name.length > 0 && group && status)}>
|
|
||||||
{guest?.id !== undefined ? 'Update' : 'Create'}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</Dialog>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,51 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { FloatLabel } from 'primereact/floatlabel';
|
|
||||||
import { InputText } from 'primereact/inputtext';
|
|
||||||
import { login } from '../../api/authentication';
|
|
||||||
import { useState, useEffect } from 'react';
|
|
||||||
import { classNames } from './button';
|
|
||||||
import { useRouter } from 'next/navigation'
|
|
||||||
import { User } from '../../lib/definitions';
|
|
||||||
import { getSlug } from '@/app/lib/utils';
|
|
||||||
|
|
||||||
export default function LoginForm() {
|
|
||||||
const [email, setEmail] = useState("");
|
|
||||||
const [password, setPassword] = useState("");
|
|
||||||
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const [currentUser, setCurrentUser] = useState<User | null>(null);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
localStorage.setItem('currentUser', JSON.stringify(currentUser));
|
|
||||||
}, [currentUser]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="card flex justify-evenly py-5">
|
|
||||||
<FloatLabel>
|
|
||||||
<InputText id="email" type="email" className='rounded-sm' onChange={(e) => setEmail(e.target.value)} />
|
|
||||||
<label htmlFor="email">Email</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel>
|
|
||||||
<InputText id="password" type="password" className='rounded-sm' onChange={(e) => setPassword(e.target.value)} />
|
|
||||||
<label htmlFor="password">Password</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<button
|
|
||||||
className={classNames('primary')}
|
|
||||||
disabled={email.length == 0 || password.length == 0}
|
|
||||||
onClick={() => login({
|
|
||||||
email: email,
|
|
||||||
password: password,
|
|
||||||
onLogin: (user) => {
|
|
||||||
setCurrentUser(user);
|
|
||||||
router.push(`${getSlug()}/dashboard`)
|
|
||||||
}
|
|
||||||
})}>
|
|
||||||
Sign in
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,98 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { FloatLabel } from 'primereact/floatlabel';
|
|
||||||
import { InputText } from 'primereact/inputtext';
|
|
||||||
import { useState, useEffect } from 'react';
|
|
||||||
import { classNames } from './button';
|
|
||||||
import { getSlug } from '@/app/lib/utils';
|
|
||||||
import { register } from '@/app/api/authentication';
|
|
||||||
import { getCaptchaChallenge } from '@/app/api/captcha';
|
|
||||||
|
|
||||||
export default function RegistrationForm() {
|
|
||||||
const [submitted, setSubmitted] = useState<boolean>(false);
|
|
||||||
const [errors, setErrors] = useState<string[]>([]);
|
|
||||||
|
|
||||||
const [email, setEmail] = useState<string>("");
|
|
||||||
const [password, setPassword] = useState<string>("");
|
|
||||||
const [passwordConfirmation, setPasswordConfirmation] = useState<string>("");
|
|
||||||
const [slug, setSlug] = useState<string>(getSlug());
|
|
||||||
|
|
||||||
const [captchaId, setCaptchaId] = useState<string>("");
|
|
||||||
const [captchaUrl, setCaptchaUrl] = useState<string>("");
|
|
||||||
const [captchaAnswer, setCaptchaAnswer] = useState<string>("");
|
|
||||||
|
|
||||||
const refreshCaptcha = () => {
|
|
||||||
getCaptchaChallenge({
|
|
||||||
onRetrieve: (id, url) => {
|
|
||||||
console.log(id, url);
|
|
||||||
setCaptchaId(id);
|
|
||||||
setCaptchaUrl(url);
|
|
||||||
setCaptchaAnswer("");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(refreshCaptcha, [])
|
|
||||||
|
|
||||||
return (
|
|
||||||
submitted ? (
|
|
||||||
<div className="card flex justify-evenly py-5 flex-col">
|
|
||||||
<div className="text-green-500">Registration successful. Check your email for a confirmation link.</div>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
|
|
||||||
<div className="card flex justify-evenly py-5 flex-col">
|
|
||||||
<FloatLabel className="my-4">
|
|
||||||
<InputText id="email" type="email" className='rounded-sm' onChange={(e) => setEmail(e.target.value)} />
|
|
||||||
<label htmlFor="email">Email</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel className="my-4">
|
|
||||||
<InputText id="password" type="password" className='rounded-sm' onChange={(e) => setPassword(e.target.value)} />
|
|
||||||
<label htmlFor="password">Password</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel className="my-4">
|
|
||||||
<InputText id="passwordConfirmation" type="password" className='rounded-sm' onChange={(e) => setPasswordConfirmation(e.target.value)} />
|
|
||||||
<label htmlFor="passwordConfirmation">Confirm Password</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<FloatLabel className="my-4">
|
|
||||||
<InputText id="slug" type="text" className='rounded-sm' onChange={(e) => setSlug(e.target.value)} />
|
|
||||||
<label htmlFor="slug">Slug</label>
|
|
||||||
</FloatLabel>
|
|
||||||
<img className="w-96" src={captchaUrl} alt="captcha" />
|
|
||||||
<FloatLabel className="my-4">
|
|
||||||
<InputText id="captcha" type="text" className='rounded-sm' value={captchaAnswer} onChange={(e) => setCaptchaAnswer(e.target.value)} />
|
|
||||||
<label htmlFor="captcha">Captcha</label>
|
|
||||||
</FloatLabel>
|
|
||||||
|
|
||||||
{errors.map((error, index) => (
|
|
||||||
<div key={index} className="text-red-500">{error}</div>
|
|
||||||
))}
|
|
||||||
|
|
||||||
|
|
||||||
<button
|
|
||||||
className={classNames('primary')}
|
|
||||||
disabled={!(email && password && passwordConfirmation && slug && captchaAnswer)}
|
|
||||||
onClick={() => register(
|
|
||||||
{
|
|
||||||
slug: slug,
|
|
||||||
email: email,
|
|
||||||
password: password,
|
|
||||||
passwordConfirmation: passwordConfirmation,
|
|
||||||
captcha: {
|
|
||||||
id: captchaId,
|
|
||||||
answer: captchaAnswer
|
|
||||||
},
|
|
||||||
onRegister: () => { setErrors([]); setSubmitted(true) },
|
|
||||||
onError: (errors) => { refreshCaptcha(); setErrors(errors) }
|
|
||||||
}
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
Register
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,28 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
export default function TableOfContents<Type>({ headers, caption, elements, rowRender }: { headers: string[], caption: string, elements: Type[], rowRender: (element: Type) => JSX.Element }) {
|
|
||||||
return (
|
|
||||||
<div className="w-full relative overflow-x-auto shadow-md sm:rounded-lg">
|
|
||||||
<table className="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
|
|
||||||
<caption className="p-5 text-lg font-semibold text-left rtl:text-right text-gray-900 bg-white dark:text-white dark:bg-gray-800">
|
|
||||||
{caption}
|
|
||||||
<p className="mt-1 text-sm font-normal text-gray-500 dark:text-gray-400">
|
|
||||||
There are {elements.length} elements in the list
|
|
||||||
</p>
|
|
||||||
</caption>
|
|
||||||
<thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
|
|
||||||
<tr>
|
|
||||||
{headers.map((header) => (
|
|
||||||
<th scope="col" className="px-6 py-3">
|
|
||||||
{header}
|
|
||||||
</th>
|
|
||||||
))}
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
{elements.map((element) => rowRender(element))}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,107 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Guest } from "@/app/lib/guest";
|
|
||||||
import { Table as TableType } from "@/app/lib/tableSimulation";
|
|
||||||
import { RectangleGroupIcon, UserGroupIcon } from "@heroicons/react/24/outline";
|
|
||||||
import { v4 as uuidv4 } from 'uuid';
|
|
||||||
import { Tooltip } from "primereact/tooltip";
|
|
||||||
import clsx from "clsx";
|
|
||||||
|
|
||||||
|
|
||||||
function Dish({ guest, rotation }: { guest: Guest, rotation?: number }) {
|
|
||||||
rotation = rotation || 0
|
|
||||||
return (
|
|
||||||
<div className={`m-3 w-24 h-24 rounded-full content-center text-center cursor-default`} style={{
|
|
||||||
rotate: `${360 - rotation}deg`,
|
|
||||||
backgroundColor: guest.color,
|
|
||||||
}}>
|
|
||||||
{guest.name}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function GuestRow({ guests }: { guests: Guest[] }) {
|
|
||||||
return (
|
|
||||||
<div className="justify-around flex flex-row">
|
|
||||||
{guests.map((guest) => <Dish key={guest.id} guest={guest} />)}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function RectangularTable({ table }: { table: TableType }) {
|
|
||||||
const guests = table.guests;
|
|
||||||
const halfwayThrough = Math.floor(guests.length / 2)
|
|
||||||
const arrayFirstHalf = guests.slice(0, halfwayThrough);
|
|
||||||
const arraySecondHalf = guests.slice(halfwayThrough, guests.length);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="m-12 h-64 bg-cyan-800 flex flex-col justify-between">
|
|
||||||
<GuestRow guests={arrayFirstHalf} />
|
|
||||||
<GuestRow guests={arraySecondHalf} />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function RoundedTable({ table }: { table: TableType }) {
|
|
||||||
const guests = table.guests;
|
|
||||||
const size = 500
|
|
||||||
const rotation = 360 / guests.length
|
|
||||||
|
|
||||||
const className = (penalty: number) => {
|
|
||||||
return clsx("px-2 tooltip-cohesion", {
|
|
||||||
"hidden": penalty === 0,
|
|
||||||
"text-orange-300": penalty <= 5,
|
|
||||||
"text-orange-500": penalty > 5 && penalty <= 10,
|
|
||||||
"text-orange-700": penalty > 10,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={`m-12 rounded-full bg-cyan-800 relative z-0 grid flex items-center justify-items-center`} style={{ width: `${size}px`, height: `${size}px` }}>
|
|
||||||
|
|
||||||
{
|
|
||||||
guests.map((guest, index) => {
|
|
||||||
return (
|
|
||||||
<div key={guest.id} className={`border-dashed grid justify-items-center absolute inset-0`} style={{
|
|
||||||
rotate: `${index * rotation}deg`,
|
|
||||||
height: `${size}px`,
|
|
||||||
width: `${size}px`,
|
|
||||||
}}>
|
|
||||||
<Dish guest={guest} rotation={index * rotation} />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
<div className="bg-zinc-200 w-48 h-12 p-3 flex flex-row rounded z-10">
|
|
||||||
<div className="px-2 text-slate-800">{`Table #${table.number}`}</div>
|
|
||||||
|
|
||||||
|
|
||||||
<Tooltip target=".tooltip-cohesion" />
|
|
||||||
<Tooltip target=".tooltip-size" />
|
|
||||||
|
|
||||||
<RectangleGroupIcon
|
|
||||||
className={className(table.discomfort.breakdown.cohesionPenalty)}
|
|
||||||
data-pr-tooltip={`Cohesion penalty: ${Math.round(table.discomfort.breakdown.cohesionPenalty)}`}
|
|
||||||
data-pr-position="top"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<UserGroupIcon
|
|
||||||
className={className(table.discomfort.breakdown.tableSizePenalty)}
|
|
||||||
data-pr-tooltip={`Table size penalty: ${Math.round(table.discomfort.breakdown.tableSizePenalty)}`}
|
|
||||||
data-pr-position="top"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export function Table({ table, style }: { table: TableType, style: "rectangular" | "rounded" }) {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{style === "rectangular" && <RectangularTable table={table} />}
|
|
||||||
{style === "rounded" && <RoundedTable table={table} />}
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
123
app/ui/customers/table.tsx
Normal file
123
app/ui/customers/table.tsx
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
import Image from 'next/image';
|
||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
import Search from '@/app/ui/search';
|
||||||
|
import {
|
||||||
|
CustomersTableType,
|
||||||
|
FormattedCustomersTable,
|
||||||
|
} from '@/app/lib/definitions';
|
||||||
|
|
||||||
|
export default async function CustomersTable({
|
||||||
|
customers,
|
||||||
|
}: {
|
||||||
|
customers: FormattedCustomersTable[];
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<div className="w-full">
|
||||||
|
<h1 className={`${lusitana.className} mb-8 text-xl md:text-2xl`}>
|
||||||
|
Customers
|
||||||
|
</h1>
|
||||||
|
<Search placeholder="Search customers..." />
|
||||||
|
<div className="mt-6 flow-root">
|
||||||
|
<div className="overflow-x-auto">
|
||||||
|
<div className="inline-block min-w-full align-middle">
|
||||||
|
<div className="overflow-hidden rounded-md bg-gray-50 p-2 md:pt-0">
|
||||||
|
<div className="md:hidden">
|
||||||
|
{customers?.map((customer) => (
|
||||||
|
<div
|
||||||
|
key={customer.id}
|
||||||
|
className="mb-2 w-full rounded-md bg-white p-4"
|
||||||
|
>
|
||||||
|
<div className="flex items-center justify-between border-b pb-4">
|
||||||
|
<div>
|
||||||
|
<div className="mb-2 flex items-center">
|
||||||
|
<div className="flex items-center gap-3">
|
||||||
|
<Image
|
||||||
|
src={customer.image_url}
|
||||||
|
className="rounded-full"
|
||||||
|
alt={`${customer.name}'s profile picture`}
|
||||||
|
width={28}
|
||||||
|
height={28}
|
||||||
|
/>
|
||||||
|
<p>{customer.name}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<p className="text-sm text-gray-500">
|
||||||
|
{customer.email}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex w-full items-center justify-between border-b py-5">
|
||||||
|
<div className="flex w-1/2 flex-col">
|
||||||
|
<p className="text-xs">Pending</p>
|
||||||
|
<p className="font-medium">{customer.total_pending}</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex w-1/2 flex-col">
|
||||||
|
<p className="text-xs">Paid</p>
|
||||||
|
<p className="font-medium">{customer.total_paid}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="pt-4 text-sm">
|
||||||
|
<p>{customer.total_guests} guests</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
<table className="hidden min-w-full rounded-md text-gray-900 md:table">
|
||||||
|
<thead className="rounded-md bg-gray-50 text-left text-sm font-normal">
|
||||||
|
<tr>
|
||||||
|
<th scope="col" className="px-4 py-5 font-medium sm:pl-6">
|
||||||
|
Name
|
||||||
|
</th>
|
||||||
|
<th scope="col" className="px-3 py-5 font-medium">
|
||||||
|
Email
|
||||||
|
</th>
|
||||||
|
<th scope="col" className="px-3 py-5 font-medium">
|
||||||
|
Total guests
|
||||||
|
</th>
|
||||||
|
<th scope="col" className="px-3 py-5 font-medium">
|
||||||
|
Total Pending
|
||||||
|
</th>
|
||||||
|
<th scope="col" className="px-4 py-5 font-medium">
|
||||||
|
Total Paid
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<tbody className="divide-y divide-gray-200 text-gray-900">
|
||||||
|
{customers.map((customer) => (
|
||||||
|
<tr key={customer.id} className="group">
|
||||||
|
<td className="whitespace-nowrap bg-white py-5 pl-4 pr-3 text-sm text-black group-first-of-type:rounded-md group-last-of-type:rounded-md sm:pl-6">
|
||||||
|
<div className="flex items-center gap-3">
|
||||||
|
<Image
|
||||||
|
src={customer.image_url}
|
||||||
|
className="rounded-full"
|
||||||
|
alt={`${customer.name}'s profile picture`}
|
||||||
|
width={28}
|
||||||
|
height={28}
|
||||||
|
/>
|
||||||
|
<p>{customer.name}</p>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td className="whitespace-nowrap bg-white px-4 py-5 text-sm">
|
||||||
|
{customer.email}
|
||||||
|
</td>
|
||||||
|
<td className="whitespace-nowrap bg-white px-4 py-5 text-sm">
|
||||||
|
{customer.total_guests}
|
||||||
|
</td>
|
||||||
|
<td className="whitespace-nowrap bg-white px-4 py-5 text-sm">
|
||||||
|
{customer.total_pending}
|
||||||
|
</td>
|
||||||
|
<td className="whitespace-nowrap bg-white px-4 py-5 text-sm group-first-of-type:rounded-md group-last-of-type:rounded-md">
|
||||||
|
{customer.total_paid}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
58
app/ui/dashboard/cards.tsx
Normal file
58
app/ui/dashboard/cards.tsx
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
import {
|
||||||
|
BanknotesIcon,
|
||||||
|
ClockIcon,
|
||||||
|
UserGroupIcon,
|
||||||
|
InboxIcon,
|
||||||
|
} from '@heroicons/react/24/outline';
|
||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
|
||||||
|
const iconMap = {
|
||||||
|
collected: BanknotesIcon,
|
||||||
|
customers: UserGroupIcon,
|
||||||
|
pending: ClockIcon,
|
||||||
|
guests: InboxIcon,
|
||||||
|
};
|
||||||
|
|
||||||
|
export default async function CardWrapper() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{/* NOTE: Uncomment this code in Chapter 9 */}
|
||||||
|
|
||||||
|
{/* <Card title="Collected" value={totalPaidguests} type="collected" />
|
||||||
|
<Card title="Pending" value={totalPendingguests} type="pending" />
|
||||||
|
<Card title="Total guests" value={numberOfguests} type="guests" />
|
||||||
|
<Card
|
||||||
|
title="Total Customers"
|
||||||
|
value={numberOfCustomers}
|
||||||
|
type="customers"
|
||||||
|
/> */}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function Card({
|
||||||
|
title,
|
||||||
|
value,
|
||||||
|
type,
|
||||||
|
}: {
|
||||||
|
title: string;
|
||||||
|
value: number | string;
|
||||||
|
type: 'guests' | 'customers' | 'pending' | 'collected';
|
||||||
|
}) {
|
||||||
|
const Icon = iconMap[type];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="rounded-xl bg-gray-50 p-2 shadow-sm">
|
||||||
|
<div className="flex p-4">
|
||||||
|
{Icon ? <Icon className="h-5 w-5 text-gray-700" /> : null}
|
||||||
|
<h3 className="ml-2 text-sm font-medium">{title}</h3>
|
||||||
|
</div>
|
||||||
|
<p
|
||||||
|
className={`${lusitana.className}
|
||||||
|
truncate rounded-xl bg-white px-4 py-8 text-center text-2xl`}
|
||||||
|
>
|
||||||
|
{value}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,41 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { GlobalSummary as Summary} from '@/app/lib/definitions';
|
|
||||||
import { MainCard, SecondaryCard } from '../components/dashboard-cards';
|
|
||||||
|
|
||||||
export default function GlobalSummary({ summary }: { summary: Summary }) {
|
|
||||||
return (
|
|
||||||
<div className="my-4">
|
|
||||||
<div className="flex flex-row w-full my-2">
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<MainCard amount={`${summary.expenses.projected.total}€`} title="Projected" subtitle={`${summary.expenses.projected.guests} guests`} style="blue" iconName="ArrowTrendingUpIcon" />
|
|
||||||
<MainCard amount={`${Math.round(summary.expenses.projected.total / summary.expenses.projected.guests)}€`} title="/ guest" iconName="UserIcon" style='blue' />
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<MainCard amount={`${summary.expenses.confirmed.total}€`} title="Min." subtitle={`${summary.expenses.confirmed.guests} guests`} iconName="ChevronDoubleDownIcon" style="green" />
|
|
||||||
<MainCard amount={`${Math.round(summary.expenses.confirmed.total / summary.expenses.confirmed.guests)}€`} title="/ guest" iconName="UserIcon" style='green' />
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<MainCard amount={`${summary.expenses.status.paid}€`} title="Paid already" subtitle={`${Math.round(summary.expenses.status.paid / summary.expenses.projected.total * 100)}% of projected`} iconName="CheckIcon" style='blue' />
|
|
||||||
<MainCard amount={`${summary.expenses.projected.total - summary.expenses.status.paid}€`} title="To pay" subtitle={`${100 - Math.round(summary.expenses.status.paid / summary.expenses.projected.total * 100)}% of projected`} iconName="BanknotesIcon" style="orange" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex flex-row w-full my-2">
|
|
||||||
<MainCard style="blue" amount={summary.guests.total.toString()} title="Invites sent" iconName="UsersIcon" />
|
|
||||||
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<SecondaryCard amount={`${Math.round(summary.guests.confirmed / summary.guests.total * 100)}%`} title={`confirmed (${summary.guests.confirmed} guests)`} iconName="CheckIcon" style='green' />
|
|
||||||
<SecondaryCard amount={`${Math.round(summary.guests.declined / summary.guests.total * 100)}%`} title={`declined (${summary.guests.declined} guests)`} iconName="XMarkIcon" style='red' />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<SecondaryCard amount={`${Math.round(summary.guests.tentative / summary.guests.total * 100)}%`} title={`tentative (${summary.guests.tentative} guests)`} iconName="QuestionMarkCircleIcon" style='orange' />
|
|
||||||
<SecondaryCard amount={`${Math.round(summary.guests.invited / summary.guests.total * 100)}%`} title={`awaiting (${summary.guests.invited} guests)`} iconName="EllipsisHorizontalIcon" style='gray' />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
64
app/ui/dashboard/latest-invoices.tsx
Normal file
64
app/ui/dashboard/latest-invoices.tsx
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
import { ArrowPathIcon } from '@heroicons/react/24/outline';
|
||||||
|
import clsx from 'clsx';
|
||||||
|
import Image from 'next/image';
|
||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
import { LatestInvoice } from '@/app/lib/definitions';
|
||||||
|
export default async function Latestguests({
|
||||||
|
latestguests,
|
||||||
|
}: {
|
||||||
|
latestguests: LatestInvoice[];
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<div className="flex w-full flex-col md:col-span-4">
|
||||||
|
<h2 className={`${lusitana.className} mb-4 text-xl md:text-2xl`}>
|
||||||
|
Latest guests
|
||||||
|
</h2>
|
||||||
|
<div className="flex grow flex-col justify-between rounded-xl bg-gray-50 p-4">
|
||||||
|
{/* NOTE: Uncomment this code in Chapter 7 */}
|
||||||
|
|
||||||
|
{/* <div className="bg-white px-6">
|
||||||
|
{latestguests.map((invoice, i) => {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
key={invoice.id}
|
||||||
|
className={clsx(
|
||||||
|
'flex flex-row items-center justify-between py-4',
|
||||||
|
{
|
||||||
|
'border-t': i !== 0,
|
||||||
|
},
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<div className="flex items-center">
|
||||||
|
<Image
|
||||||
|
src={invoice.image_url}
|
||||||
|
alt={`${invoice.name}'s profile picture`}
|
||||||
|
className="mr-4 rounded-full"
|
||||||
|
width={32}
|
||||||
|
height={32}
|
||||||
|
/>
|
||||||
|
<div className="min-w-0">
|
||||||
|
<p className="truncate text-sm font-semibold md:text-base">
|
||||||
|
{invoice.name}
|
||||||
|
</p>
|
||||||
|
<p className="hidden text-sm text-gray-500 sm:block">
|
||||||
|
{invoice.email}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<p
|
||||||
|
className={`${lusitana.className} truncate text-sm font-medium md:text-base`}
|
||||||
|
>
|
||||||
|
{invoice.amount}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div> */}
|
||||||
|
<div className="flex items-center pb-2 pt-6">
|
||||||
|
<ArrowPathIcon className="h-5 w-5 text-gray-500" />
|
||||||
|
<h3 className="ml-2 text-sm text-gray-500 ">Updated just now</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
export default function Loading() {
|
export default function Loading() {
|
||||||
return <div>Loading...</div>;
|
return <div>Loading...</div>;
|
||||||
}
|
}
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import {
|
import {
|
||||||
@ -10,14 +8,13 @@ import {
|
|||||||
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';
|
|
||||||
|
|
||||||
// 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 = [
|
const links = [
|
||||||
{ name: 'Guests', href: `/${getSlug()}/dashboard/guests`, icon: UserGroupIcon },
|
{ name: 'Guests', href: '/dashboard/guests', icon: UserGroupIcon },
|
||||||
{ name: 'Expenses', href: `/${getSlug()}/dashboard/expenses`, icon: BanknotesIcon },
|
{ name: 'Expenses', href: '/dashboard/expenses', icon: BanknotesIcon },
|
||||||
{ name: 'Table distributions', href: `/${getSlug()}/dashboard/tables`, icon: RectangleGroupIcon },
|
{ name: 'Table distributions', href: '/dashboard/tables', icon: RectangleGroupIcon },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
65
app/ui/dashboard/revenue-chart.tsx
Normal file
65
app/ui/dashboard/revenue-chart.tsx
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
import { generateYAxis } from '@/app/lib/utils';
|
||||||
|
import { CalendarIcon } from '@heroicons/react/24/outline';
|
||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
import { Revenue } from '@/app/lib/definitions';
|
||||||
|
|
||||||
|
// This component is representational only.
|
||||||
|
// For data visualization UI, check out:
|
||||||
|
// https://www.tremor.so/
|
||||||
|
// https://www.chartjs.org/
|
||||||
|
// https://airbnb.io/visx/
|
||||||
|
|
||||||
|
export default async function RevenueChart({
|
||||||
|
revenue,
|
||||||
|
}: {
|
||||||
|
revenue: Revenue[];
|
||||||
|
}) {
|
||||||
|
const chartHeight = 350;
|
||||||
|
// NOTE: Uncomment this code in Chapter 7
|
||||||
|
|
||||||
|
// const { yAxisLabels, topLabel } = generateYAxis(revenue);
|
||||||
|
|
||||||
|
// if (!revenue || revenue.length === 0) {
|
||||||
|
// return <p className="mt-4 text-gray-400">No data available.</p>;
|
||||||
|
// }
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="w-full md:col-span-4">
|
||||||
|
<h2 className={`${lusitana.className} mb-4 text-xl md:text-2xl`}>
|
||||||
|
Recent Revenue
|
||||||
|
</h2>
|
||||||
|
{/* NOTE: Uncomment this code in Chapter 7 */}
|
||||||
|
|
||||||
|
{/* <div className="rounded-xl bg-gray-50 p-4">
|
||||||
|
<div className="sm:grid-cols-13 mt-0 grid grid-cols-12 items-end gap-2 rounded-md bg-white p-4 md:gap-4">
|
||||||
|
<div
|
||||||
|
className="mb-6 hidden flex-col justify-between text-sm text-gray-400 sm:flex"
|
||||||
|
style={{ height: `${chartHeight}px` }}
|
||||||
|
>
|
||||||
|
{yAxisLabels.map((label) => (
|
||||||
|
<p key={label}>{label}</p>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{revenue.map((month) => (
|
||||||
|
<div key={month.month} className="flex flex-col items-center gap-2">
|
||||||
|
<div
|
||||||
|
className="w-full rounded-md bg-blue-300"
|
||||||
|
style={{
|
||||||
|
height: `${(chartHeight / topLabel) * month.revenue}px`,
|
||||||
|
}}
|
||||||
|
></div>
|
||||||
|
<p className="-rotate-90 text-sm text-gray-400 sm:rotate-0">
|
||||||
|
{month.month}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center pb-2 pt-6">
|
||||||
|
<CalendarIcon className="h-5 w-5 text-gray-500" />
|
||||||
|
<h3 className="ml-2 text-sm text-gray-500 ">Last 12 months</h3>
|
||||||
|
</div>
|
||||||
|
</div> */}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,23 +1,14 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
import NavLinks from '@/app/ui/dashboard/nav-links';
|
import NavLinks from '@/app/ui/dashboard/nav-links';
|
||||||
import { PowerIcon } from '@heroicons/react/24/outline';
|
import { PowerIcon } from '@heroicons/react/24/outline';
|
||||||
import { gloriaHallelujah } from '@/app/ui/fonts';
|
import { gloriaHallelujah } from '@/app/ui/fonts';
|
||||||
import { logout } from '@/app/api/authentication';
|
|
||||||
import { useRouter } from 'next/navigation';
|
|
||||||
import { getSlug } from '@/app/lib/utils';
|
|
||||||
|
|
||||||
export default function SideNav() {
|
export default function SideNav() {
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
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={`/${getSlug()}/dashboard`}
|
href="/dashboard/guests"
|
||||||
>
|
>
|
||||||
<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>
|
||||||
@ -26,21 +17,12 @@ 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 {JSON.parse(localStorage.getItem('currentUser') || '{}').email}</span>
|
<form>
|
||||||
<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={() => {
|
|
||||||
logout({
|
|
||||||
onLogout: () => {
|
|
||||||
localStorage.clear();
|
|
||||||
router.push(`/${getSlug()}`);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<PowerIcon className="w-6" />
|
<PowerIcon className="w-6" />
|
||||||
<div className="hidden md:block">Sign Out</div>
|
<div className="hidden md:block">Sign Out</div>
|
||||||
</button>
|
</button>
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -1,46 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { Expense, ExpenseSerializer } from '@/app/lib/expense';
|
|
||||||
import { PencilIcon, TrashIcon } from '@heroicons/react/24/outline';
|
|
||||||
import TableOfContents from "../components/table-of-contents";
|
|
||||||
|
|
||||||
|
|
||||||
export default function ExpensesTable({ expenses, onUpdate, onEdit }: {
|
|
||||||
expenses: Expense[],
|
|
||||||
onUpdate: () => void,
|
|
||||||
onEdit: (expense: Expense) => void,
|
|
||||||
}) {
|
|
||||||
|
|
||||||
const api = new AbstractApi<Expense>();
|
|
||||||
const serializer = new ExpenseSerializer();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<TableOfContents
|
|
||||||
headers={['Name', 'Amount (€)', 'Pricing Type', 'Actions']}
|
|
||||||
caption='Expenses'
|
|
||||||
elements={expenses}
|
|
||||||
rowRender={(expense) => (
|
|
||||||
<tr key={expense.id} className="bg-white border-b odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800">
|
|
||||||
<th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
|
||||||
{expense.name}
|
|
||||||
</th>
|
|
||||||
<td className="px-6 py-4">
|
|
||||||
{expense.amount}
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
{expense.pricingType}
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<div className="flex flex-row items-center">
|
|
||||||
<TrashIcon className='size-6 cursor-pointer' onClick={() => { api.destroy(serializer, expense, onUpdate) }} />
|
|
||||||
<PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(expense)} />
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import { Inter, Lusitana, Gloria_Hallelujah} from 'next/font/google';
|
import { Inter, Lusitana, Gloria_Hallelujah} from 'next/font/google';
|
||||||
|
|
||||||
export const inter = Inter({ subsets: ['latin'] });
|
export const inter = Inter({ subsets: ['latin'] });
|
||||||
|
|||||||
@ -1,105 +0,0 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { Group, GroupSerializer } from '@/app/lib/group';
|
|
||||||
import { AdjustmentsHorizontalIcon, PencilIcon, TrashIcon } from '@heroicons/react/24/outline';
|
|
||||||
import { Column } from 'primereact/column';
|
|
||||||
import { TreeNode } from 'primereact/treenode';
|
|
||||||
import { TreeTable } from 'primereact/treetable';
|
|
||||||
|
|
||||||
export default function GroupsTable({ groups, onUpdate, onEdit, onEditAffinities }: {
|
|
||||||
groups: Group[],
|
|
||||||
onUpdate: () => void,
|
|
||||||
onEdit: (group: Group) => void,
|
|
||||||
onEditAffinities: (group: Group) => void,
|
|
||||||
}) {
|
|
||||||
|
|
||||||
const api = new AbstractApi<Group>();
|
|
||||||
const serializer = new GroupSerializer();
|
|
||||||
|
|
||||||
const actions = (group: Group) => (
|
|
||||||
<div className="flex flex-row items-center">
|
|
||||||
<TrashIcon className='size-6 cursor-pointer' onClick={() => { api.destroy(serializer, group, onUpdate) }} />
|
|
||||||
<PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(group)} />
|
|
||||||
<AdjustmentsHorizontalIcon className='size-6 cursor-pointer' onClick={() => onEditAffinities(group)} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
|
|
||||||
const index = groups.reduce((acc, group) => {
|
|
||||||
if (group.id) {
|
|
||||||
acc.set(group.id, group)
|
|
||||||
}
|
|
||||||
|
|
||||||
return acc;
|
|
||||||
}, new Map());
|
|
||||||
|
|
||||||
groups.forEach(group => group.children = []);
|
|
||||||
groups.forEach(group => {
|
|
||||||
if (group.parentId) {
|
|
||||||
const parent = index.get(group.parentId);
|
|
||||||
if (parent) {
|
|
||||||
if (!parent.children) {
|
|
||||||
parent.children = [];
|
|
||||||
}
|
|
||||||
parent.children.push(group);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const renderTree = (group: Group): TreeNode => {
|
|
||||||
const childrenAttendance = (group.children || []).reduce((acc, child) => {
|
|
||||||
acc.confirmed += child.attendance?.confirmed || 0;
|
|
||||||
acc.tentative += child.attendance?.tentative || 0;
|
|
||||||
acc.invited += child.attendance?.invited || 0;
|
|
||||||
acc.declined += child.attendance?.declined || 0;
|
|
||||||
acc.considered += child.attendance?.considered || 0;
|
|
||||||
acc.total += child.attendance?.total || 0;
|
|
||||||
return acc;
|
|
||||||
}, { confirmed: 0, tentative: 0, invited: 0, declined: 0, considered: 0, total: 0 });
|
|
||||||
|
|
||||||
return {
|
|
||||||
id: group.id,
|
|
||||||
key: group.id,
|
|
||||||
label: group.name,
|
|
||||||
data: {
|
|
||||||
name: group.name,
|
|
||||||
color: <div className="w-8 h-8 rounded-full" style={{ backgroundColor: group.color }} />,
|
|
||||||
confirmed: childrenAttendance.confirmed + (group.attendance?.confirmed || 0),
|
|
||||||
tentative: childrenAttendance.tentative + (group.attendance?.tentative || 0),
|
|
||||||
pending: childrenAttendance.invited + (group.attendance?.invited || 0),
|
|
||||||
declined: childrenAttendance.declined + (group.attendance?.declined || 0),
|
|
||||||
considered: childrenAttendance.considered + (group.attendance?.considered || 0),
|
|
||||||
total: childrenAttendance.total + (group.attendance?.total || 0),
|
|
||||||
actions: actions(group),
|
|
||||||
},
|
|
||||||
children: group.children?.map(renderTree),
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const nodes: TreeNode[] = groups
|
|
||||||
.filter(group => !group.parentId)
|
|
||||||
.map(renderTree)
|
|
||||||
|
|
||||||
const headers = ['Name', 'Color', 'Confirmed', 'Tentative', 'Pending', 'Declined', 'Considered', 'Total', 'Actions'];
|
|
||||||
const rowClassName = () => {
|
|
||||||
return { 'border-b odd:bg-white even:bg-gray-50 hover:bg-gray-100': true };
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<TreeTable value={nodes} rowClassName={rowClassName} className='py-4'>
|
|
||||||
<Column expander field="name" header="Name" className='w-2/5' />
|
|
||||||
<Column field="color" header="Color" bodyClassName="text-sm" />
|
|
||||||
<Column field="confirmed" header="Confirmed" bodyClassName="text-sm" />
|
|
||||||
<Column field="tentative" header="Tentative" bodyClassName="text-sm" />
|
|
||||||
<Column field="pending" header="Pending" bodyClassName="text-sm" />
|
|
||||||
<Column field="declined" header="Declined" bodyClassName="text-sm" />
|
|
||||||
<Column field="considered" header="Considered" bodyClassName="text-sm" />
|
|
||||||
<Column field="total" header="Total" bodyClassName="text-sm" />
|
|
||||||
<Column field="actions" header="Actions" />
|
|
||||||
</TreeTable>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
63
app/ui/guests/affinity-groups-tree.tsx
Normal file
63
app/ui/guests/affinity-groups-tree.tsx
Normal file
@ -0,0 +1,63 @@
|
|||||||
|
'use client'
|
||||||
|
|
||||||
|
import React, { useState, useEffect, Suspense } from 'react';
|
||||||
|
import { Tree } 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 groupToNode = (group: Group): any => {
|
||||||
|
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: 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 ({
|
||||||
|
id: record.id,
|
||||||
|
name: record.attributes.name,
|
||||||
|
guest_count: record.attributes.guest_count + children_guest_count,
|
||||||
|
icon: record.attributes.icon,
|
||||||
|
children: children,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (nodes.length > 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
fetch("http://localhost:3001/groups.json")
|
||||||
|
.then((response) => response.json())
|
||||||
|
.then((data) => {
|
||||||
|
setNodes(data.data.map((record: any) => {
|
||||||
|
return (groupToNode(parseNode(record, data.included)));
|
||||||
|
}))
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="card flex justify-content-center">
|
||||||
|
<Suspense>
|
||||||
|
<Tree value={nodes} dragdropScope="affinity-groups" onDragDrop={(e) => setNodes(e.value as any)} className="w-full md:w-30rem" />
|
||||||
|
</Suspense>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
36
app/ui/guests/breadcrumbs.tsx
Normal file
36
app/ui/guests/breadcrumbs.tsx
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
import { clsx } from 'clsx';
|
||||||
|
import Link from 'next/link';
|
||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
|
||||||
|
interface Breadcrumb {
|
||||||
|
label: string;
|
||||||
|
href: string;
|
||||||
|
active?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function Breadcrumbs({
|
||||||
|
breadcrumbs,
|
||||||
|
}: {
|
||||||
|
breadcrumbs: Breadcrumb[];
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<nav aria-label="Breadcrumb" className="mb-6 block">
|
||||||
|
<ol className={clsx(lusitana.className, 'flex text-xl md:text-2xl')}>
|
||||||
|
{breadcrumbs.map((breadcrumb, index) => (
|
||||||
|
<li
|
||||||
|
key={breadcrumb.href}
|
||||||
|
aria-current={breadcrumb.active}
|
||||||
|
className={clsx(
|
||||||
|
breadcrumb.active ? 'text-gray-900' : 'text-gray-500',
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<Link href={breadcrumb.href}>{breadcrumb.label}</Link>
|
||||||
|
{index < breadcrumbs.length - 1 ? (
|
||||||
|
<span className="mx-3 inline-block">/</span>
|
||||||
|
) : null}
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ol>
|
||||||
|
</nav>
|
||||||
|
);
|
||||||
|
}
|
||||||
36
app/ui/guests/buttons.tsx
Normal file
36
app/ui/guests/buttons.tsx
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
import { PencilIcon, PlusIcon, TrashIcon } from '@heroicons/react/24/outline';
|
||||||
|
import Link from 'next/link';
|
||||||
|
|
||||||
|
export function CreateInvoice() {
|
||||||
|
return (
|
||||||
|
<Link
|
||||||
|
href="/dashboard/guests/create"
|
||||||
|
className="flex h-10 items-center rounded-lg bg-blue-600 px-4 text-sm font-medium text-white transition-colors hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
|
||||||
|
>
|
||||||
|
<span className="hidden md:block">Create Invoice</span>{' '}
|
||||||
|
<PlusIcon className="h-5 md:ml-4" />
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function UpdateInvoice({ id }: { id: string }) {
|
||||||
|
return (
|
||||||
|
<Link
|
||||||
|
href="/dashboard/guests"
|
||||||
|
className="rounded-md border p-2 hover:bg-gray-100"
|
||||||
|
>
|
||||||
|
<PencilIcon className="w-5" />
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function DeleteInvoice({ id }: { id: string }) {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<button className="rounded-md border p-2 hover:bg-gray-100">
|
||||||
|
<span className="sr-only">Delete</span>
|
||||||
|
<TrashIcon className="w-5" />
|
||||||
|
</button>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
112
app/ui/guests/create-form.tsx
Normal file
112
app/ui/guests/create-form.tsx
Normal file
@ -0,0 +1,112 @@
|
|||||||
|
import { CustomerField } from '@/app/lib/definitions';
|
||||||
|
import Link from 'next/link';
|
||||||
|
import {
|
||||||
|
CheckIcon,
|
||||||
|
ClockIcon,
|
||||||
|
CurrencyDollarIcon,
|
||||||
|
UserCircleIcon,
|
||||||
|
} from '@heroicons/react/24/outline';
|
||||||
|
import { Button } from '@/app/ui/button';
|
||||||
|
|
||||||
|
export default function Form({ customers }: { customers: CustomerField[] }) {
|
||||||
|
return (
|
||||||
|
<form>
|
||||||
|
<div className="rounded-md bg-gray-50 p-4 md:p-6">
|
||||||
|
{/* Customer Name */}
|
||||||
|
<div className="mb-4">
|
||||||
|
<label htmlFor="customer" className="mb-2 block text-sm font-medium">
|
||||||
|
Choose customer
|
||||||
|
</label>
|
||||||
|
<div className="relative">
|
||||||
|
<select
|
||||||
|
id="customer"
|
||||||
|
name="customerId"
|
||||||
|
className="peer block w-full cursor-pointer rounded-md border border-gray-200 py-2 pl-10 text-sm outline-2 placeholder:text-gray-500"
|
||||||
|
defaultValue=""
|
||||||
|
>
|
||||||
|
<option value="" disabled>
|
||||||
|
Select a customer
|
||||||
|
</option>
|
||||||
|
{customers.map((customer) => (
|
||||||
|
<option key={customer.id} value={customer.id}>
|
||||||
|
{customer.name}
|
||||||
|
</option>
|
||||||
|
))}
|
||||||
|
</select>
|
||||||
|
<UserCircleIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Invoice Amount */}
|
||||||
|
<div className="mb-4">
|
||||||
|
<label htmlFor="amount" className="mb-2 block text-sm font-medium">
|
||||||
|
Choose an amount
|
||||||
|
</label>
|
||||||
|
<div className="relative mt-2 rounded-md">
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
id="amount"
|
||||||
|
name="amount"
|
||||||
|
type="number"
|
||||||
|
step="0.01"
|
||||||
|
placeholder="Enter USD amount"
|
||||||
|
className="peer block w-full rounded-md border border-gray-200 py-2 pl-10 text-sm outline-2 placeholder:text-gray-500"
|
||||||
|
/>
|
||||||
|
<CurrencyDollarIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500 peer-focus:text-gray-900" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Invoice Status */}
|
||||||
|
<fieldset>
|
||||||
|
<legend className="mb-2 block text-sm font-medium">
|
||||||
|
Set the invoice status
|
||||||
|
</legend>
|
||||||
|
<div className="rounded-md border border-gray-200 bg-white px-[14px] py-3">
|
||||||
|
<div className="flex gap-4">
|
||||||
|
<div className="flex items-center">
|
||||||
|
<input
|
||||||
|
id="pending"
|
||||||
|
name="status"
|
||||||
|
type="radio"
|
||||||
|
value="pending"
|
||||||
|
className="h-4 w-4 cursor-pointer border-gray-300 bg-gray-100 text-gray-600 focus:ring-2"
|
||||||
|
/>
|
||||||
|
<label
|
||||||
|
htmlFor="pending"
|
||||||
|
className="ml-2 flex cursor-pointer items-center gap-1.5 rounded-full bg-gray-100 px-3 py-1.5 text-xs font-medium text-gray-600"
|
||||||
|
>
|
||||||
|
Pending <ClockIcon className="h-4 w-4" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center">
|
||||||
|
<input
|
||||||
|
id="paid"
|
||||||
|
name="status"
|
||||||
|
type="radio"
|
||||||
|
value="paid"
|
||||||
|
className="h-4 w-4 cursor-pointer border-gray-300 bg-gray-100 text-gray-600 focus:ring-2"
|
||||||
|
/>
|
||||||
|
<label
|
||||||
|
htmlFor="paid"
|
||||||
|
className="ml-2 flex cursor-pointer items-center gap-1.5 rounded-full bg-green-500 px-3 py-1.5 text-xs font-medium text-white"
|
||||||
|
>
|
||||||
|
Paid <CheckIcon className="h-4 w-4" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
<div className="mt-6 flex justify-end gap-4">
|
||||||
|
<Link
|
||||||
|
href="/dashboard/guests"
|
||||||
|
className="flex h-10 items-center rounded-lg bg-gray-100 px-4 text-sm font-medium text-gray-600 transition-colors hover:bg-gray-200"
|
||||||
|
>
|
||||||
|
Cancel
|
||||||
|
</Link>
|
||||||
|
<Button type="submit">Create Invoice</Button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
);
|
||||||
|
}
|
||||||
123
app/ui/guests/edit-form.tsx
Normal file
123
app/ui/guests/edit-form.tsx
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import { CustomerField, InvoiceForm } from '@/app/lib/definitions';
|
||||||
|
import {
|
||||||
|
CheckIcon,
|
||||||
|
ClockIcon,
|
||||||
|
CurrencyDollarIcon,
|
||||||
|
UserCircleIcon,
|
||||||
|
} from '@heroicons/react/24/outline';
|
||||||
|
import Link from 'next/link';
|
||||||
|
import { Button } from '@/app/ui/button';
|
||||||
|
|
||||||
|
export default function EditInvoiceForm({
|
||||||
|
invoice,
|
||||||
|
customers,
|
||||||
|
}: {
|
||||||
|
invoice: InvoiceForm;
|
||||||
|
customers: CustomerField[];
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<form>
|
||||||
|
<div className="rounded-md bg-gray-50 p-4 md:p-6">
|
||||||
|
{/* Customer Name */}
|
||||||
|
<div className="mb-4">
|
||||||
|
<label htmlFor="customer" className="mb-2 block text-sm font-medium">
|
||||||
|
Choose customer
|
||||||
|
</label>
|
||||||
|
<div className="relative">
|
||||||
|
<select
|
||||||
|
id="customer"
|
||||||
|
name="customerId"
|
||||||
|
className="peer block w-full cursor-pointer rounded-md border border-gray-200 py-2 pl-10 text-sm outline-2 placeholder:text-gray-500"
|
||||||
|
defaultValue={invoice.customer_id}
|
||||||
|
>
|
||||||
|
<option value="" disabled>
|
||||||
|
Select a customer
|
||||||
|
</option>
|
||||||
|
{customers.map((customer) => (
|
||||||
|
<option key={customer.id} value={customer.id}>
|
||||||
|
{customer.name}
|
||||||
|
</option>
|
||||||
|
))}
|
||||||
|
</select>
|
||||||
|
<UserCircleIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Invoice Amount */}
|
||||||
|
<div className="mb-4">
|
||||||
|
<label htmlFor="amount" className="mb-2 block text-sm font-medium">
|
||||||
|
Choose an amount
|
||||||
|
</label>
|
||||||
|
<div className="relative mt-2 rounded-md">
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
id="amount"
|
||||||
|
name="amount"
|
||||||
|
type="number"
|
||||||
|
step="0.01"
|
||||||
|
defaultValue={invoice.amount}
|
||||||
|
placeholder="Enter USD amount"
|
||||||
|
className="peer block w-full rounded-md border border-gray-200 py-2 pl-10 text-sm outline-2 placeholder:text-gray-500"
|
||||||
|
/>
|
||||||
|
<CurrencyDollarIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500 peer-focus:text-gray-900" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Invoice Status */}
|
||||||
|
<fieldset>
|
||||||
|
<legend className="mb-2 block text-sm font-medium">
|
||||||
|
Set the invoice status
|
||||||
|
</legend>
|
||||||
|
<div className="rounded-md border border-gray-200 bg-white px-[14px] py-3">
|
||||||
|
<div className="flex gap-4">
|
||||||
|
<div className="flex items-center">
|
||||||
|
<input
|
||||||
|
id="pending"
|
||||||
|
name="status"
|
||||||
|
type="radio"
|
||||||
|
value="pending"
|
||||||
|
defaultChecked={invoice.status === 'pending'}
|
||||||
|
className="h-4 w-4 cursor-pointer border-gray-300 bg-gray-100 text-gray-600 focus:ring-2"
|
||||||
|
/>
|
||||||
|
<label
|
||||||
|
htmlFor="pending"
|
||||||
|
className="ml-2 flex cursor-pointer items-center gap-1.5 rounded-full bg-gray-100 px-3 py-1.5 text-xs font-medium text-gray-600"
|
||||||
|
>
|
||||||
|
Pending <ClockIcon className="h-4 w-4" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center">
|
||||||
|
<input
|
||||||
|
id="paid"
|
||||||
|
name="status"
|
||||||
|
type="radio"
|
||||||
|
value="paid"
|
||||||
|
defaultChecked={invoice.status === 'paid'}
|
||||||
|
className="h-4 w-4 cursor-pointer border-gray-300 bg-gray-100 text-gray-600 focus:ring-2"
|
||||||
|
/>
|
||||||
|
<label
|
||||||
|
htmlFor="paid"
|
||||||
|
className="ml-2 flex cursor-pointer items-center gap-1.5 rounded-full bg-green-500 px-3 py-1.5 text-xs font-medium text-white"
|
||||||
|
>
|
||||||
|
Paid <CheckIcon className="h-4 w-4" />
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
<div className="mt-6 flex justify-end gap-4">
|
||||||
|
<Link
|
||||||
|
href="/dashboard/guests"
|
||||||
|
className="flex h-10 items-center rounded-lg bg-gray-100 px-4 text-sm font-medium text-gray-600 transition-colors hover:bg-gray-200"
|
||||||
|
>
|
||||||
|
Cancel
|
||||||
|
</Link>
|
||||||
|
<Button type="submit">Edit Invoice</Button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
);
|
||||||
|
}
|
||||||
119
app/ui/guests/pagination.tsx
Normal file
119
app/ui/guests/pagination.tsx
Normal file
@ -0,0 +1,119 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import { ArrowLeftIcon, ArrowRightIcon } from '@heroicons/react/24/outline';
|
||||||
|
import clsx from 'clsx';
|
||||||
|
import Link from 'next/link';
|
||||||
|
import { generatePagination } from '@/app/lib/utils';
|
||||||
|
|
||||||
|
export default function Pagination({ totalPages }: { totalPages: number }) {
|
||||||
|
// NOTE: Uncomment this code in Chapter 11
|
||||||
|
|
||||||
|
// const allPages = generatePagination(currentPage, totalPages);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{/* NOTE: Uncomment this code in Chapter 11 */}
|
||||||
|
|
||||||
|
{/* <div className="inline-flex">
|
||||||
|
<PaginationArrow
|
||||||
|
direction="left"
|
||||||
|
href={createPageURL(currentPage - 1)}
|
||||||
|
isDisabled={currentPage <= 1}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="flex -space-x-px">
|
||||||
|
{allPages.map((page, index) => {
|
||||||
|
let position: 'first' | 'last' | 'single' | 'middle' | undefined;
|
||||||
|
|
||||||
|
if (index === 0) position = 'first';
|
||||||
|
if (index === allPages.length - 1) position = 'last';
|
||||||
|
if (allPages.length === 1) position = 'single';
|
||||||
|
if (page === '...') position = 'middle';
|
||||||
|
|
||||||
|
return (
|
||||||
|
<PaginationNumber
|
||||||
|
key={page}
|
||||||
|
href={createPageURL(page)}
|
||||||
|
page={page}
|
||||||
|
position={position}
|
||||||
|
isActive={currentPage === page}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<PaginationArrow
|
||||||
|
direction="right"
|
||||||
|
href={createPageURL(currentPage + 1)}
|
||||||
|
isDisabled={currentPage >= totalPages}
|
||||||
|
/>
|
||||||
|
</div> */}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function PaginationNumber({
|
||||||
|
page,
|
||||||
|
href,
|
||||||
|
isActive,
|
||||||
|
position,
|
||||||
|
}: {
|
||||||
|
page: number | string;
|
||||||
|
href: string;
|
||||||
|
position?: 'first' | 'last' | 'middle' | 'single';
|
||||||
|
isActive: boolean;
|
||||||
|
}) {
|
||||||
|
const className = clsx(
|
||||||
|
'flex h-10 w-10 items-center justify-center text-sm border',
|
||||||
|
{
|
||||||
|
'rounded-l-md': position === 'first' || position === 'single',
|
||||||
|
'rounded-r-md': position === 'last' || position === 'single',
|
||||||
|
'z-10 bg-blue-600 border-blue-600 text-white': isActive,
|
||||||
|
'hover:bg-gray-100': !isActive && position !== 'middle',
|
||||||
|
'text-gray-300': position === 'middle',
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
return isActive || position === 'middle' ? (
|
||||||
|
<div className={className}>{page}</div>
|
||||||
|
) : (
|
||||||
|
<Link href={href} className={className}>
|
||||||
|
{page}
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function PaginationArrow({
|
||||||
|
href,
|
||||||
|
direction,
|
||||||
|
isDisabled,
|
||||||
|
}: {
|
||||||
|
href: string;
|
||||||
|
direction: 'left' | 'right';
|
||||||
|
isDisabled?: boolean;
|
||||||
|
}) {
|
||||||
|
const className = clsx(
|
||||||
|
'flex h-10 w-10 items-center justify-center rounded-md border',
|
||||||
|
{
|
||||||
|
'pointer-events-none text-gray-300': isDisabled,
|
||||||
|
'hover:bg-gray-100': !isDisabled,
|
||||||
|
'mr-2 md:mr-4': direction === 'left',
|
||||||
|
'ml-2 md:ml-4': direction === 'right',
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
const icon =
|
||||||
|
direction === 'left' ? (
|
||||||
|
<ArrowLeftIcon className="w-4" />
|
||||||
|
) : (
|
||||||
|
<ArrowRightIcon className="w-4" />
|
||||||
|
);
|
||||||
|
|
||||||
|
return isDisabled ? (
|
||||||
|
<div className={className}>{icon}</div>
|
||||||
|
) : (
|
||||||
|
<Link className={className} href={href}>
|
||||||
|
{icon}
|
||||||
|
</Link>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
import Skeleton from '@/app/ui/skeleton';
|
import Skeleton from '@/app/ui/skeleton';
|
||||||
|
|
||||||
export function SkeletonRow() {
|
export function SkeletonRow() {
|
||||||
|
|||||||
29
app/ui/guests/status.tsx
Normal file
29
app/ui/guests/status.tsx
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
import { CheckIcon, ClockIcon } from '@heroicons/react/24/outline';
|
||||||
|
import clsx from 'clsx';
|
||||||
|
|
||||||
|
export default function gueststatus({ status }: { status: string }) {
|
||||||
|
return (
|
||||||
|
<span
|
||||||
|
className={clsx(
|
||||||
|
'inline-flex items-center rounded-full px-2 py-1 text-xs',
|
||||||
|
{
|
||||||
|
'bg-gray-100 text-gray-500': status === 'pending',
|
||||||
|
'bg-green-500 text-white': status === 'paid',
|
||||||
|
},
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{status === 'pending' ? (
|
||||||
|
<>
|
||||||
|
Pending
|
||||||
|
<ClockIcon className="ml-1 w-4 text-gray-500" />
|
||||||
|
</>
|
||||||
|
) : null}
|
||||||
|
{status === 'paid' ? (
|
||||||
|
<>
|
||||||
|
Paid
|
||||||
|
<CheckIcon className="ml-1 w-4 text-white" />
|
||||||
|
</>
|
||||||
|
) : null}
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,31 +1,65 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { AbstractApi } from '@/app/api/abstract-api';
|
|
||||||
import { Guest , GuestSerializer} from '@/app/lib/guest';
|
|
||||||
import { PencilIcon, TrashIcon } from '@heroicons/react/24/outline';
|
|
||||||
import clsx from 'clsx';
|
import clsx from 'clsx';
|
||||||
import TableOfContents from '../components/table-of-contents';
|
import React, { useState, useEffect } from 'react';
|
||||||
|
import { Guest } from '@/app/lib/definitions';
|
||||||
|
|
||||||
export default function guestsTable({ guests, onUpdate, onEdit }: {
|
export default function guestsTable() {
|
||||||
guests: Guest[],
|
function loadGuests() {
|
||||||
onUpdate: () => void,
|
fetch("http://localhost:3001/guests.json")
|
||||||
onEdit: (guest: Guest) => void
|
.then((response) => response.json())
|
||||||
}) {
|
.then((data) => {
|
||||||
|
setGuests(data.data.map((record: any) => {
|
||||||
|
return ({
|
||||||
|
id: record.id,
|
||||||
|
name: record.attributes.name,
|
||||||
|
email: record.attributes.email,
|
||||||
|
group_name: record.attributes.group_name,
|
||||||
|
status: record.attributes.status
|
||||||
|
});
|
||||||
|
}));
|
||||||
|
}, (error) => {
|
||||||
|
return [];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
const api = new AbstractApi<Guest>();
|
const [guests, setGuests] = useState<Array<Guest>>([]);
|
||||||
const serializer = new GuestSerializer();
|
|
||||||
|
guests.length === 0 && loadGuests();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<TableOfContents
|
<div className="w-full relative overflow-x-auto shadow-md sm:rounded-lg">
|
||||||
headers={['Name', 'Group', 'Status', 'Actions']}
|
<table className="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
|
||||||
caption='Guests'
|
<caption className="p-5 text-lg font-semibold text-left rtl:text-right text-gray-900 bg-white dark:text-white dark:bg-gray-800">
|
||||||
elements={guests}
|
Guests
|
||||||
rowRender={(guest) => (
|
<p className="mt-1 text-sm font-normal text-gray-500 dark:text-gray-400">
|
||||||
|
There are {guests.length} guests in the list
|
||||||
|
</p>
|
||||||
|
</caption>
|
||||||
|
<thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
|
||||||
|
<tr>
|
||||||
|
<th scope="col" className="px-6 py-3">
|
||||||
|
Name
|
||||||
|
</th>
|
||||||
|
<th scope="col" className="px-6 py-3">
|
||||||
|
Email
|
||||||
|
</th>
|
||||||
|
<th scope="col" className="px-6 py-3">
|
||||||
|
Group
|
||||||
|
</th>
|
||||||
|
<th scope="col" className="px-6 py-3">
|
||||||
|
Status
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{guests.map((guest) => (
|
||||||
<tr key={guest.id} className="bg-white border-b odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800">
|
<tr key={guest.id} className="bg-white border-b odd:bg-white odd:dark:bg-gray-900 even:bg-gray-50 even:dark:bg-gray-800">
|
||||||
<td scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
<th scope="row" className="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
|
||||||
{guest.name}
|
{guest.name}
|
||||||
|
</th>
|
||||||
|
<td className="px-6 py-4">
|
||||||
|
{guest.email}
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4">
|
<td className="px-6 py-4">
|
||||||
{guest.group_name}
|
{guest.group_name}
|
||||||
@ -35,25 +69,21 @@ export default function guestsTable({ guests, onUpdate, onEdit }: {
|
|||||||
<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>
|
||||||
{guest.status}
|
{guest.status}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
|
||||||
<div className="flex flex-row items-center">
|
|
||||||
<TrashIcon className='size-6 cursor-pointer' onClick={() => { api.destroy(serializer, guest, onUpdate)}} />
|
|
||||||
<PencilIcon className='size-6 cursor-pointer' onClick={() => onEdit(guest)} />
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
)}
|
))}
|
||||||
/>
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
67
app/ui/login-form.tsx
Normal file
67
app/ui/login-form.tsx
Normal file
@ -0,0 +1,67 @@
|
|||||||
|
import { lusitana } from '@/app/ui/fonts';
|
||||||
|
import {
|
||||||
|
AtSymbolIcon,
|
||||||
|
KeyIcon,
|
||||||
|
ExclamationCircleIcon,
|
||||||
|
} from '@heroicons/react/24/outline';
|
||||||
|
import { ArrowRightIcon } from '@heroicons/react/20/solid';
|
||||||
|
import { Button } from './button';
|
||||||
|
|
||||||
|
export default function LoginForm() {
|
||||||
|
return (
|
||||||
|
<form className="space-y-3">
|
||||||
|
<div className="flex-1 rounded-lg bg-gray-50 px-6 pb-4 pt-8">
|
||||||
|
<h1 className={`${lusitana.className} mb-3 text-2xl`}>
|
||||||
|
Please log in to continue.
|
||||||
|
</h1>
|
||||||
|
<div className="w-full">
|
||||||
|
<div>
|
||||||
|
<label
|
||||||
|
className="mb-3 mt-5 block text-xs font-medium text-gray-900"
|
||||||
|
htmlFor="email"
|
||||||
|
>
|
||||||
|
Email
|
||||||
|
</label>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
className="peer block w-full rounded-md border border-gray-200 py-[9px] pl-10 text-sm outline-2 placeholder:text-gray-500"
|
||||||
|
id="email"
|
||||||
|
type="email"
|
||||||
|
name="email"
|
||||||
|
placeholder="Enter your email address"
|
||||||
|
required
|
||||||
|
/>
|
||||||
|
<AtSymbolIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500 peer-focus:text-gray-900" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="mt-4">
|
||||||
|
<label
|
||||||
|
className="mb-3 mt-5 block text-xs font-medium text-gray-900"
|
||||||
|
htmlFor="password"
|
||||||
|
>
|
||||||
|
Password
|
||||||
|
</label>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
className="peer block w-full rounded-md border border-gray-200 py-[9px] pl-10 text-sm outline-2 placeholder:text-gray-500"
|
||||||
|
id="password"
|
||||||
|
type="password"
|
||||||
|
name="password"
|
||||||
|
placeholder="Enter password"
|
||||||
|
required
|
||||||
|
minLength={6}
|
||||||
|
/>
|
||||||
|
<KeyIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500 peer-focus:text-gray-900" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Button className="mt-4 w-full">
|
||||||
|
Log in <ArrowRightIcon className="ml-auto h-5 w-5 text-gray-50" />
|
||||||
|
</Button>
|
||||||
|
<div className="flex h-8 items-end space-x-1">
|
||||||
|
{/* Add form errors here */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { MagnifyingGlassIcon } from '@heroicons/react/24/outline';
|
import { MagnifyingGlassIcon } from '@heroicons/react/24/outline';
|
||||||
|
|||||||
@ -1,5 +1,3 @@
|
|||||||
/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/
|
|
||||||
|
|
||||||
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}`} />;
|
||||||
}
|
}
|
||||||
21
package.json
21
package.json
@ -8,31 +8,30 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@heroicons/react": "^2.1.4",
|
"@heroicons/react": "^2.1.4",
|
||||||
"@tailwindcss/forms": "^0.5.7",
|
"@tailwindcss/forms": "^0.5.7",
|
||||||
|
"@vercel/postgres": "^0.9.0",
|
||||||
"autoprefixer": "10.4.20",
|
"autoprefixer": "10.4.20",
|
||||||
"bcrypt": "^5.1.1",
|
"bcrypt": "^5.1.1",
|
||||||
"clsx": "^2.1.1",
|
"clsx": "^2.1.1",
|
||||||
"next": "15.1.4",
|
"next": "15.0.1",
|
||||||
"next-auth": "5.0.0-beta.25",
|
"next-auth": "5.0.0-beta.25",
|
||||||
"postcss": "8.5.1",
|
"postcss": "8.4.47",
|
||||||
"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.14",
|
||||||
"typescript": "5.7.3",
|
"typescript": "5.6.3",
|
||||||
"use-debounce": "^10.0.1",
|
"use-debounce": "^10.0.1",
|
||||||
"uuid": "11.0.5",
|
|
||||||
"zod": "^3.23.8"
|
"zod": "^3.23.8"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@playwright/test": "^1.46.0",
|
"@playwright/test": "^1.46.0",
|
||||||
"@types/bcrypt": "^5.0.2",
|
"@types/bcrypt": "^5.0.2",
|
||||||
"@types/node": "22.10.7",
|
"@types/node": "22.7.9",
|
||||||
"@types/react": "18.3.18",
|
"@types/react": "18.3.5",
|
||||||
"@types/react-dom": "18.3.5"
|
"@types/react-dom": "18.3.1"
|
||||||
},
|
},
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=23.0.0"
|
"node": ">=20.12.0"
|
||||||
},
|
}
|
||||||
"packageManager": "pnpm@9.15.4+sha512.b2dc20e2fc72b3e18848459b37359a32064663e5627a51e4c74b2c29dd8e8e0491483c3abb40789cfd578bf362fb6ba8261b05f0387d76792ed6e23ea3b1b6a0"
|
|
||||||
}
|
}
|
||||||
|
|||||||
522
pnpm-lock.yaml
generated
522
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
BIN
public/customers/amy-burns.png
Normal file
BIN
public/customers/amy-burns.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
public/customers/balazs-orban.png
Normal file
BIN
public/customers/balazs-orban.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
public/customers/delba-de-oliveira.png
Normal file
BIN
public/customers/delba-de-oliveira.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
BIN
public/customers/evil-rabbit.png
Normal file
BIN
public/customers/evil-rabbit.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1019 B |
BIN
public/customers/lee-robinson.png
Normal file
BIN
public/customers/lee-robinson.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
BIN
public/customers/michael-novotny.png
Normal file
BIN
public/customers/michael-novotny.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.7 KiB |
@ -1,100 +1,7 @@
|
|||||||
import { test, expect, Page } from '@playwright/test'
|
import { test, expect } from '@playwright/test'
|
||||||
|
|
||||||
const mockGuestsAPI = ({ page }: { page: Page }) => {
|
test('should navigate to the guests page', async ({ page }) => {
|
||||||
page.route('*/**/api/default/guests', async route => {
|
await page.goto('/dashboard/guests')
|
||||||
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 })
|
await expect(page.getByRole('heading', { name: 'Guests' })).toContainText('Guests')
|
||||||
})
|
})
|
||||||
}
|
|
||||||
|
|
||||||
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 page.goto('/default/dashboard/guests');
|
|
||||||
|
|
||||||
await expect(page.getByRole('tab', { name: 'Groups' })).toBeVisible();
|
|
||||||
await expect(page.getByRole('tab', { name: 'Guests' })).toBeVisible();
|
|
||||||
|
|
||||||
await expect(page.getByText('There are 2 elements in the list')).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: 'Childhood friends' })).toBeVisible();
|
|
||||||
await expect(page.getByRole('row').nth(1).getByRole('cell', { name: 'Tentative' })).toBeVisible();
|
|
||||||
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: 'Work' })).toBeVisible();
|
|
||||||
await expect(page.getByRole('row').nth(2).getByRole('cell', { name: 'Invited' })).toBeVisible();
|
|
||||||
await expect(page.getByRole('row').nth(2).getByRole('button', { name: 'Confirm' })).toBeVisible();
|
|
||||||
await expect(page.getByRole('row').nth(2).getByRole('button', { name: 'Tentative' })).toBeVisible();
|
|
||||||
await expect(page.getByRole('row').nth(2).getByRole('button', { name: 'Decline' })).toBeVisible();
|
|
||||||
});
|
|
||||||
|
|
||||||
test('should display the list of groups', async ({ page }) => {
|
|
||||||
await mockGroupsAPI({ page });
|
|
||||||
|
|
||||||
await page.goto('/default/dashboard/guests');
|
|
||||||
await page.getByRole('tab', { name: 'Groups' }).click();
|
|
||||||
|
|
||||||
await expect(page.getByText('There are 2 elements in the list')).toBeVisible();
|
|
||||||
|
|
||||||
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();
|
|
||||||
});
|
|
||||||
Loading…
x
Reference in New Issue
Block a user