markus/finances
1
0
Fork 0
mirror of https://codeberg.org/MarkusThielker/finances.git synced 2025-04-12 05:08:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Compare commits

base: markus:main
Branches Tags
markus:development
markus:main
markus:v1.3.1
markus:v1.3.0
markus:v1.2.0
markus:v1.1.0
markus:v1.0.1
markus:v1.0.0
..
compare: markus:v1.2.0
Branches Tags
markus:development
markus:main
markus:v1.3.1
markus:v1.3.0
markus:v1.2.0
markus:v1.1.0
markus:v1.0.1
markus:v1.0.0

No commits in common. "main" and "v1.2.0" have entirely different histories.
main ... v1.2.0

54 changed files with 8418 additions and 1681 deletions
Show stats Expand all files Collapse all files

8
.env.example
View file

@ -5,10 +5,4 @@
#
# prisma database url
DATABASE_URL='postgresql://prisma:prisma@localhost:5432/finances?schema=public'
AUTH0_SECRET=''
AUTH0_BASE_URL='http://localhost:3000'
AUTH0_URL=''
AUTH0_CLIENT_ID=''
AUTH0_CLIENT_SECRET=''
DATABASE_URL="postgresql://prisma:prisma@localhost:5432/finances?schema=public"

34
.github/workflows/docker-image-build-and-push-manual.yaml vendored
View file

@ -1,34 +0,0 @@
name: Development Deployment
on:
workflow_dispatch:
inputs:
image_tag:
required: true
type: string
description: Docker image tag
jobs:
build-and-push:
runs-on: ubuntu-latest
steps:
- name: Checkout repository
uses: actions/checkout@v4
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v3
- name: Login to Docker Hub
uses: docker/login-action@v3
with:
username: ${{ secrets.DOCKERHUB_USERNAME }}
password: ${{ secrets.DOCKERHUB_TOKEN }}
- name: Build and push image
uses: docker/build-push-action@v5
with:
push: true
platforms: linux/amd64
tags: markusthielker/next-finances:development, markusthielker/next-finances:${{ github.event.inputs.image_tag }}-dev

2
.github/workflows/docker-image-build-and-push.yaml vendored
View file

@ -1,4 +1,4 @@
name: Production Deployment
name: Docker Image Build and Push
on:
push:

24
Dockerfile
View file

@ -1,4 +1,4 @@
FROM oven/bun:1-alpine AS base
FROM node:21-alpine AS base
# Install dependencies only when needed
FROM base AS deps
@ -6,8 +6,8 @@ FROM base AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app
COPY package.json bun.lockb* ./
RUN bun install
COPY package.json package-lock.json* ./
RUN npm ci
# Rebuild the source code only when needed
@ -18,23 +18,23 @@ COPY --from=deps /app/node_modules ./node_modules
COPY . .
# dependencies have to be changed depending on target architecture
RUN bun install @node-rs/argon2-linux-x64-musl # arm64 = @node-rs/argon2-linux-arm64-musl
RUN bun install @node-rs/bcrypt-linux-x64-musl # arm64 = @node-rs/bcrypt-linux-arm64-musl
RUN npm i @node-rs/argon2-linux-x64-musl # arm64 = @node-rs/argon2-linux-arm64-musl
RUN npm i @node-rs/bcrypt-linux-x64-musl # arm64 = @node-rs/bcrypt-linux-arm64-musl
COPY prisma/ ./prisma/
RUN bunx prisma generate
RUN npx prisma generate
ENV NEXT_TELEMETRY_DISABLED=1
RUN bun run build
ENV NEXT_TELEMETRY_DISABLED 1
RUN npm run build
# Production image, copy all the files and run next
FROM base AS runner
WORKDIR /app
ENV NODE_ENV=production
ENV NEXT_TELEMETRY_DISABLED=1
ENV NODE_ENV production
ENV NEXT_TELEMETRY_DISABLED 1
RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs
@ -52,7 +52,7 @@ USER nextjs
EXPOSE 3000
ENV PORT=3000
ENV HOSTNAME="0.0.0.0"
ENV PORT 3000
ENV HOSTNAME "0.0.0.0"
CMD ["node", "server.js"]

27
README.md
View file

@ -7,20 +7,20 @@ This is my simple finances tracker that I use to keep track of my spending.
### Understanding the Basics
- **Entities**: The core building blocks of your finances.
- Accounts: Where you hold money (e.g., bank accounts, PayPal account, cash)
- Entities: Where you spend money (e.g., Walmart, Spotify, Netflix)
- Accounts: Where you hold money (e.g., bank accounts, PayPal account, cash)
- Entities: Where you spend money (e.g., Walmart, Spotify, Netflix)
- **Payments**: Record money movement.
- Expenses: Money leaving an Account. (Account -> Entity)
- Income: Money entering an Account. (Entity -> Account)
- Expenses: Money leaving an Account. (Account -> Entity)
- Income: Money entering an Account. (Entity -> Account)
- **Categories** *(optional)*: Add labels to Payments for better tracking.
### Your First Steps
- Set up: Create Entities and Accounts that reflect your finances.
- Record a Payment:
- Enter the amount and date.
- Select payor and payee
- *(optional)* Assign a category or enter a note.
- Enter the amount and date.
- Select payor and payee
- *(optional)* Assign a category or enter a note.
- Explore: View your payment history and view your statics at the dashboard
### Tips
@ -42,22 +42,17 @@ cp .env.example .env
docker compose -f docker/finances-dev/docker-compose.yml up -d
## generate prisma client
bunx prisma generate
npx prisma generate
## apply database migrations
bunx prisma migrate deploy
npx prisma migrate deploy
## start the development server
bun run dev
npm run dev
```
This project relies on [Auth0](https://auth0.com) authentication. To use it you will have to create an Auth0 account,
create an application of type 'Single Page Application' and now add the required details to your .env file.
You will also have to add `http://localhost:3000/auth/callback` as an `Allowed Callback URL` and `http://localhost:3000`
as an `Allowed Logout URL` and `Allowed Web Origins` in your Auth0 console.
Now open [http://localhost:3000](http://localhost:3000) with your browser and create an account.
Then open [http://localhost:3000](http://localhost:3000) with your browser and create an account.
While in development mode, you can generate sample data from the [Account page](http://localhost:3000/account).
## Deployment

1203
bun.lock
View file

File diff suppressed because it is too large Load diff

4
docker/finances-prod/docker-compose.yaml
View file

@ -8,7 +8,7 @@ services:
depends_on:
postgres:
condition: service_healthy
command: bunx prisma migrate deploy
command: npx prisma migrate deploy
labels:
- "com.centurylinklabs.watchtower.enable=true"
networks:
@ -42,7 +42,7 @@ services:
depends_on:
app-migrations:
condition: service_completed_successfully
command: bunx prisma studio
command: npx prisma studio
restart: unless-stopped
labels:
- "traefik.enable=true"

2
docker/finances-prod/watchtower_setup.sh
View file

@ -10,4 +10,4 @@ docker run -d \
--restart unless-stopped \
-v $HOME/.docker/config.json:/config.json \
-v /var/run/docker.sock:/var/run/docker.sock \
containrrr/watchtower -s "*/30 * * * * *" --label-enable --include-stopped
containrrr/watchtower -s "*/30 * * * * *" --label-enable

7671
package-lock.json generated Normal file
View file

File diff suppressed because it is too large Load diff

87
package.json
View file

@ -2,7 +2,7 @@
"name": "next-finances",
"description": "A finances application to keep track of my personal spendings",
"homepage": "https://github.com/MarkusThielker/next-finances",
"version": "1.3.1",
"version": "1.2.0",
"author": {
"name": "Markus Thielker"
},
@ -18,53 +18,54 @@
"lint": "next lint"
},
"dependencies": {
"@auth0/nextjs-auth0": "^4.1.0",
"@hookform/resolvers": "^3.9.1",
"@prisma/client": "^6.1.0",
"@radix-ui/react-alert-dialog": "^1.1.4",
"@radix-ui/react-dialog": "^1.1.4",
"@radix-ui/react-dropdown-menu": "^2.1.4",
"@radix-ui/react-label": "^2.1.1",
"@radix-ui/react-navigation-menu": "^1.2.3",
"@radix-ui/react-popover": "^1.1.6",
"@radix-ui/react-scroll-area": "^1.2.2",
"@radix-ui/react-select": "^2.1.4",
"@radix-ui/react-separator": "^1.1.1",
"@radix-ui/react-slot": "^1.1.2",
"@serwist/next": "^9.0.11",
"@serwist/precaching": "^9.0.11",
"@serwist/sw": "^9.0.11",
"@tanstack/react-table": "^8.20.6",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cmdk": "^1.0.4",
"date-fns": "^4.1.0",
"lucia": "^3.2.2",
"lucide-react": "^0.469.0",
"next": "15.1.2",
"next-themes": "^0.4.4",
"react": "^19.0.0",
"react-day-picker": "8.10.1",
"react-dom": "^19.0.0",
"react-hook-form": "^7.54.2",
"sonner": "^1.7.1",
"swr": "^2.3.0",
"tailwind-merge": "^2.6.0",
"@hookform/resolvers": "^3.3.4",
"@lucia-auth/adapter-prisma": "^4.0.0",
"@prisma/client": "^5.10.2",
"@radix-ui/react-alert-dialog": "^1.0.5",
"@radix-ui/react-dialog": "^1.0.5",
"@radix-ui/react-dropdown-menu": "^2.0.6",
"@radix-ui/react-label": "^2.0.2",
"@radix-ui/react-navigation-menu": "^1.1.4",
"@radix-ui/react-popover": "^1.0.7",
"@radix-ui/react-scroll-area": "^1.0.5",
"@radix-ui/react-select": "^2.0.0",
"@radix-ui/react-separator": "^1.0.3",
"@radix-ui/react-slot": "^1.0.2",
"@serwist/next": "^8.4.4",
"@serwist/precaching": "^8.4.4",
"@serwist/sw": "^8.4.4",
"@tanstack/react-table": "^8.13.2",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
"cmdk": "^1.0.0",
"date-fns": "^3.3.1",
"lucia": "^3.0.1",
"lucide-react": "^0.350.0",
"next": "14.1.3",
"next-themes": "^0.2.1",
"oslo": "^1.1.3",
"react": "^18",
"react-day-picker": "^8.10.0",
"react-dom": "^18",
"react-hook-form": "^7.51.0",
"sonner": "^1.4.3",
"swr": "^2.2.5",
"tailwind-merge": "^2.2.1",
"tailwindcss-animate": "^1.0.7",
"vaul": "^1.1.2",
"zod": "^3.24.1"
"vaul": "^0.9.0",
"zod": "^3.22.4"
},
"devDependencies": {
"@types/node": "^22.10.2",
"@types/react": "^19.0.2",
"@types/react-dom": "^19.0.2",
"autoprefixer": "^10.4.20",
"@types/node": "^20.11.25",
"@types/react": "^18",
"@types/react-dom": "^18",
"autoprefixer": "^10.0.1",
"eslint": "^8",
"eslint-config-next": "15.1.2",
"eslint-config-next": "14.1.3",
"postcss": "^8",
"prisma": "^6.1.0",
"tailwindcss": "^3.4.17",
"prisma": "^5.10.2",
"tailwindcss": "^3.3.0",
"ts-node": "^10.9.2",
"typescript": "^5.7.2"
"typescript": "^5.4.2"
}
}

28
prisma/migrations/20240403224427_remove_lucia_authentication/migration.sql
View file

@ -1,28 +0,0 @@
/*
Warnings:
- You are about to drop the `lucia_session` table. If the table is not empty, all the data it contains will be lost.
- You are about to drop the `lucia_user` table. If the table is not empty, all the data it contains will be lost.
*/
-- DropForeignKey
ALTER TABLE "categories"
DROP CONSTRAINT "categories_user_id_fkey";
-- DropForeignKey
ALTER TABLE "entities"
DROP CONSTRAINT "entities_user_id_fkey";
-- DropForeignKey
ALTER TABLE "lucia_session"
DROP CONSTRAINT "lucia_session_userId_fkey";
-- DropForeignKey
ALTER TABLE "payments"
DROP CONSTRAINT "payments_user_id_fkey";
-- DropTable
DROP TABLE "lucia_session";
-- DropTable
DROP TABLE "lucia_user";

29
prisma/schema.prisma
View file

@ -7,9 +7,36 @@ datasource db {
url = env("DATABASE_URL")
}
model User {
// lucia internal fields
id String @id
sessions Session[]
// custom fields
username String @unique
password String
entities Entity[]
payments Payment[]
categories Category[]
@@map("lucia_user")
}
model Session {
// lucia internal fields
id String @id
userId String
expiresAt DateTime
user User @relation(references: [id], fields: [userId], onDelete: Cascade)
@@map("lucia_session")
}
model Entity {
id Int @id @default(autoincrement())
userId String @map("user_id")
user User @relation(fields: [userId], references: [id])
name String
type EntityType
defaultCategory Category? @relation(fields: [defaultCategoryId], references: [id])
@ -32,6 +59,7 @@ enum EntityType {
model Payment {
id Int @id @default(autoincrement())
userId String @map("user_id")
user User @relation(fields: [userId], references: [id])
amount Int
currency String @default("EUR")
date DateTime @default(now())
@ -51,6 +79,7 @@ model Payment {
model Category {
id Int @id @default(autoincrement())
userId String @map("user_id")
user User @relation(fields: [userId], references: [id])
name String
color String
createdAt DateTime @default(now()) @map("created_at")

15
public/logo_t_hq_o.svg
View file

@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 2250 2250"
version="1.1" xmlns="http://www.w3.org/2000/svg" xml:space="preserve"
style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g id="frame"><rect id="tl" x="0" y="0" width="125" height="520.833" style="fill:#f50;"/><rect
id="t" x="0" y="-0" width="2250" height="125" style="fill:#f50;"/><rect id="tr" x="2125" y="0" width="125"
height="520.833" style="fill:#f50;"/><rect
id="bl" x="0" y="1729.17" width="125" height="520.833" style="fill:#f50;"/><rect id="b" x="0" y="2125"
width="2250" height="125"
style="fill:#f50;"/><rect
id="br" x="2125" y="1729.17" width="125" height="520.833" style="fill:#f50;"/></g>
<g id="text"><g id="text1" serif:id="text" transform="matrix(1,0,0,0.947314,7.10543e-15,-3.78368)"><g transform="matrix(1636.19,0,0,1636.19,2149.91,1766.12)"></g><text
x="-57.321px" y="1766.12px" style="font-family:'Akshar-Regular', 'Akshar';font-size:1636.19px;fill:#f50;">t<tspan
x="513.711px 891.672px 1598.51px " y="1766.12px 1766.12px 1766.12px ">lkr</tspan></text></g>
<circle id="dot" cx="2156.78" cy="1578.59" r="88.542" style="fill:#f50;"/></g></svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.6 KiB

15
public/logo_t_hq_w.svg
View file

@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 2250 2250"
version="1.1" xmlns="http://www.w3.org/2000/svg" xml:space="preserve"
style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g id="frame"><rect id="tl" x="0" y="0" width="125" height="520.833" style="fill:#fff;"/><rect
id="t" x="0" y="-0" width="2250" height="125" style="fill:#fff;"/><rect id="tr" x="2125" y="0" width="125"
height="520.833" style="fill:#fff;"/><rect
id="bl" x="0" y="1729.17" width="125" height="520.833" style="fill:#fff;"/><rect id="b" x="0" y="2125"
width="2250" height="125"
style="fill:#fff;"/><rect
id="br" x="2125" y="1729.17" width="125" height="520.833" style="fill:#fff;"/></g>
<g id="text"><g id="text1" serif:id="text" transform="matrix(1,0,0,0.947314,7.10543e-15,-3.78368)"><g transform="matrix(1636.19,0,0,1636.19,2149.91,1766.12)"></g><text
x="-57.321px" y="1766.12px" style="font-family:'Akshar-Regular', 'Akshar';font-size:1636.19px;fill:#fff;">t<tspan
x="513.711px 891.672px 1598.51px " y="1766.12px 1766.12px 1766.12px ">lkr</tspan></text></g>
<circle id="dot" cx="2156.78" cy="1578.59" r="88.542" style="fill:#fff;"/></g></svg>
Side by side

Before

Width:  |  Height:  |  Size: 1.6 KiB

BIN
public/logo_white.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.8 KiB

2
public/manifest.json
View file

@ -3,7 +3,7 @@
"short_name": "Finances",
"icons": [
{
"src": "/logo_t_hq_o.png",
"src": "/logo_white.png",
"sizes": "512x512",
"type": "image/png"
}

50
src/app/account/page.tsx
View file

@ -1,42 +1,42 @@
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
import React from 'react';
import { getUser } from '@/auth';
import { redirect } from 'next/navigation';
import signOut from '@/lib/actions/signOut';
import { Label } from '@/components/ui/label';
import { Input } from '@/components/ui/input';
import { URL_SIGN_IN } from '@/lib/constants';
import generateSampleData from '@/lib/actions/generateSampleData';
import prisma from '@/prisma';
import { ServerActionTrigger } from '@/components/form/serverActionTrigger';
import clearAccountData from '@/lib/actions/clearAccountData';
import { Button } from '@/components/ui/button';
import { URL_SIGN_OUT } from '@/lib/constants';
import { auth0 } from '@/lib/auth';
import { redirect } from 'next/navigation';
import accountDelete from '@/lib/actions/accountDelete';
export default async function AccountPage() {
const session = await auth0.getSession();
if (!session) {
return redirect('/auth/login');
const user = await getUser();
if (!user) {
redirect(URL_SIGN_IN);
}
const user = session.user;
let paymentCount = 0;
paymentCount = await prisma.payment.count({
where: {
userId: user.sub,
userId: user.id,
},
});
let entityCount = 0;
entityCount = await prisma.entity.count({
where: {
userId: user.sub,
userId: user.id,
},
});
let categoryCount = 0;
categoryCount = await prisma.category.count({
where: {
userId: user.sub,
userId: user.id,
},
});
@ -44,7 +44,7 @@ export default async function AccountPage() {
<div className="flex flex-col items-center">
<Card className="w-full max-w-md md:mt-12">
<CardHeader>
<CardTitle>Hey, {user.name}!</CardTitle>
<CardTitle>Hey, {user?.username}!</CardTitle>
<CardDescription>This is your account overview.</CardDescription>
</CardHeader>
<CardContent className="space-y-2">
@ -52,13 +52,13 @@ export default async function AccountPage() {
<Label>ID</Label>
<Input
disabled
value={user.sub}/>
value={user?.id}/>
</div>
<div>
<Label>Username</Label>
<Input
disabled
value={user.name}/>
value={user?.username}/>
</div>
<div className="flex flex-row items-center space-x-4">
<div>
@ -83,21 +83,19 @@ export default async function AccountPage() {
</CardContent>
<CardFooter className="w-full grid gap-4 grid-cols-1 md:grid-cols-2">
<ServerActionTrigger
action={clearAccountData}
action={accountDelete}
dialog={{
title: 'Clear account data',
description: 'Are you sure you want to delete all payments, entities and categories from you account? This action is irreversible.',
actionText: 'Clear data',
actionVariant: 'destructive',
title: 'Delete Account',
description: 'Are you sure you want to delete your account? This action is irreversible.',
actionText: 'Delete Account',
}}
variant="outline">
Clear data
Delete Account
</ServerActionTrigger>
<ServerActionTrigger
action={signOut}>
Sign Out
</ServerActionTrigger>
<a href={URL_SIGN_OUT}>
<Button className="w-full">
Sign Out
</Button>
</a>
{
process.env.NODE_ENV === 'development' && (
<ServerActionTrigger

13
src/app/auth/layout.tsx Normal file
View file

@ -0,0 +1,13 @@
import React from 'react';
export default function AuthLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<div className="flex justify-center">
{children}
</div>
);
}

25
src/app/auth/signin/page.tsx Normal file
View file

@ -0,0 +1,25 @@
import React from 'react';
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
import SignInForm from '@/components/form/signInForm';
import signIn from '@/lib/actions/signIn';
import Link from 'next/link';
import { URL_SIGN_UP } from '@/lib/constants';
export default async function SignInPage() {
return (
<Card className="w-full max-w-md mt-12">
<CardHeader>
<CardTitle>Sign in</CardTitle>
<CardDescription>Sign into your existing account</CardDescription>
</CardHeader>
<CardContent>
<SignInForm onSubmit={signIn}/>
</CardContent>
<CardFooter>
<Link href={URL_SIGN_UP}>
Don&apos;t have an account? Sign up
</Link>
</CardFooter>
</Card>
);
}

25
src/app/auth/signup/page.tsx Normal file
View file

@ -0,0 +1,25 @@
import React from 'react';
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
import signUp from '@/lib/actions/signUp';
import SignUpForm from '@/components/form/signUpForm';
import Link from 'next/link';
import { URL_SIGN_IN } from '@/lib/constants';
export default async function SignUpPage() {
return (
<Card className="w-full max-w-md mt-12">
<CardHeader>
<CardTitle>Sign up</CardTitle>
<CardDescription>Create a new account.</CardDescription>
</CardHeader>
<CardContent>
<SignUpForm onSubmit={signUp}/>
</CardContent>
<CardFooter>
<Link href={URL_SIGN_IN}>
Already have an account? Sign in
</Link>
</CardFooter>
</Card>
);
}

9
src/app/categories/page.tsx
View file

@ -1,18 +1,13 @@
import { getUser } from '@/auth';
import prisma from '@/prisma';
import React from 'react';
import CategoryPageClientContent from '@/components/categoryPageClientComponents';
import categoryCreateUpdate from '@/lib/actions/categoryCreateUpdate';
import categoryDelete from '@/lib/actions/categoryDelete';
import { auth0 } from '@/lib/auth';
import { redirect } from 'next/navigation';
export default async function CategoriesPage() {
const session = await auth0.getSession();
if (!session) {
return redirect('/auth/login');
}
const user = session.user;
const user = await getUser();
const categories = await prisma.category.findMany({
where: {

9
src/app/entities/page.tsx
View file

@ -1,18 +1,13 @@
import prisma from '@/prisma';
import { getUser } from '@/auth';
import React from 'react';
import EntityPageClientContent from '@/components/entityPageClientComponents';
import entityCreateUpdate from '@/lib/actions/entityCreateUpdate';
import entityDelete from '@/lib/actions/entityDelete';
import { auth0 } from '@/lib/auth';
import { redirect } from 'next/navigation';
export default async function EntitiesPage() {
const session = await auth0.getSession();
if (!session) {
return redirect('/auth/login');
}
const user = session.user;
const user = await getUser();
const entities = await prisma.entity.findMany({
where: {

2
src/app/layout.tsx
View file

@ -46,7 +46,7 @@ export default function RootLayout({
<link crossOrigin="use-credentials" rel="manifest" href="/manifest.json"/>
<link
rel="icon"
href="/logo_t_hq_o.svg"
href="/logo_white.png"
/>
</head>
<body className={cn('dark', inter.className)}>

16
src/app/page.tsx
View file

@ -2,9 +2,8 @@ import React from 'react';
import { Category, Entity, EntityType } from '@prisma/client';
import { Scope, ScopeType } from '@/lib/types/scope';
import prisma from '@/prisma';
import { getUser } from '@/auth';
import DashboardPageClient from '@/components/dashboardPageClientComponents';
import { auth0 } from '@/lib/auth';
import { redirect } from 'next/navigation';
export type CategoryNumber = {
category: Category,
@ -16,20 +15,19 @@ export type EntityNumber = {
value: number,
}
export default async function DashboardPage(props: { searchParams?: Promise<{ scope: ScopeType }> }) {
export default async function DashboardPage(props: { searchParams?: { scope: ScopeType } }) {
const session = await auth0.getSession();
if (!session) {
return redirect('/auth/login');
const user = await getUser();
if (!user) {
return;
}
const user = session.user;
const scope = Scope.of((await props.searchParams)?.scope || ScopeType.ThisMonth);
const scope = Scope.of(props.searchParams?.scope || ScopeType.ThisMonth);
// get all payments in the current scope
const payments = await prisma.payment.findMany({
where: {
userId: user.sub,
userId: user?.id,
date: {
gte: scope.start,
lte: scope.end,

15
src/app/payments/page.tsx
View file

@ -1,22 +1,17 @@
import { getUser } from '@/auth';
import prisma from '@/prisma';
import React from 'react';
import PaymentPageClientContent from '@/components/paymentPageClientComponents';
import paymentCreateUpdate from '@/lib/actions/paymentCreateUpdate';
import paymentDelete from '@/lib/actions/paymentDelete';
import { auth0 } from '@/lib/auth';
import { redirect } from 'next/navigation';
export default async function PaymentsPage() {
const session = await auth0.getSession();
if (!session) {
return redirect('/auth/login');
}
const user = session.user;
const user = await getUser();
const payments = await prisma.payment.findMany({
where: {
userId: user.sub,
userId: user?.id,
},
orderBy: [
{
@ -30,7 +25,7 @@ export default async function PaymentsPage() {
const entities = await prisma.entity.findMany({
where: {
userId: user.sub,
userId: user?.id,
},
orderBy: [
{
@ -44,7 +39,7 @@ export default async function PaymentsPage() {
const categories = await prisma.category.findMany({
where: {
userId: user.sub,
userId: user?.id,
},
orderBy: [
{

37
src/app/service-worker.ts
View file

@ -1,46 +1,15 @@
import { defaultCache } from '@serwist/next/browser';
import type { PrecacheEntry } from '@serwist/precaching';
import { defaultCache } from '@serwist/next/worker';
import { Serwist, SerwistGlobalConfig } from 'serwist';
import { installSerwist } from '@serwist/sw';
declare const self: ServiceWorkerGlobalScope & {
__SW_MANIFEST: (PrecacheEntry | string)[] | undefined;
};
declare global {
interface WorkerGlobalScope extends SerwistGlobalConfig {
// Change this attribute's name to your \`injectionPoint\`.
// \`injectionPoint\` is an InjectManifest option.
// See https://serwist.pages.dev/docs/build/configuring
__SW_MANIFEST: (PrecacheEntry | string)[] | undefined;
}
}
const serwist = new Serwist({
// A list of URLs that should be cached. Usually, you don't generate
// this list yourself; rather, you'd rely on a Serwist build tool/your framework
// to do it for you. In this example, it is generated by \`@serwist/vite\`.
installSerwist({
precacheEntries: self.__SW_MANIFEST,
// Options to customize how Serwist precaches the URLs.
precacheOptions: {
// Whether outdated caches should be removed.
cleanupOutdatedCaches: true,
concurrency: 10,
ignoreURLParametersMatching: [],
},
// Whether the service worker should skip waiting and become the active one.
skipWaiting: true,
// Whether the service worker should claim any currently available clients.
clientsClaim: true,
// Whether navigation preloading should be used.
navigationPreload: true,
// Whether Serwist should log in development mode.
disableDevLogs: true,
// A list of runtime caching entries. When a request is made and its URL match
// any of the entries, the response to it will be cached according to the matching
// entry's \`handler\`. This does not apply to precached URLs.
runtimeCaching: defaultCache,
// Other options...
// See https://serwist.pages.dev/docs/serwist/core/serwist
});
serwist.addEventListeners();

67
src/auth.ts Normal file
View file

@ -0,0 +1,67 @@
import { Lucia } from 'lucia';
import { PrismaAdapter } from '@lucia-auth/adapter-prisma';
import { cookies } from 'next/headers';
import prisma from '@/prisma';
const adapter = new PrismaAdapter(prisma.session, prisma.user);
export const lucia = new Lucia(adapter, {
sessionCookie: {
expires: false,
attributes: {
sameSite: 'strict',
domain: process.env.NODE_ENV === 'production' ? process.env.COOKIE_DOMAIN : undefined,
secure: process.env.NODE_ENV === 'production',
},
},
getUserAttributes: (attributes) => {
return {
username: attributes.username,
};
},
});
declare module 'lucia' {
interface Register {
Lucia: typeof lucia;
DatabaseUserAttributes: DatabaseUserAttributes;
}
}
interface DatabaseUserAttributes {
username: string;
}
export function getSessionId() {
return cookies().get(lucia.sessionCookieName)?.value ?? null;
}
export async function getSession() {
const sessionId = getSessionId();
if (!sessionId) {
return null;
}
const {session} = await lucia.validateSession(sessionId);
return session;
}
export async function getUser() {
const sessionId = getSessionId();
if (!sessionId) {
return null;
}
const {user, session} = await lucia.validateSession(sessionId);
try {
if (session && session.fresh) {
const sessionCookie = lucia.createSessionCookie(session.id);
cookies().set(sessionCookie.name, sessionCookie.value, sessionCookie.attributes);
}
if (!session) {
const sessionCookie = lucia.createBlankSessionCookie();
cookies().set(sessionCookie.name, sessionCookie.value, sessionCookie.attributes);
}
} catch {
// Next.js throws error when attempting to set cookies when rendering page
}
return user;
}

40
src/components/form/paymentForm.tsx
View file

@ -67,9 +67,9 @@ export default function PaymentForm({value, entities, categories, onSubmit, clas
};
}) ?? [];
const payeeRef = useRef<HTMLInputElement>({} as HTMLInputElement);
const categoryRef = useRef<HTMLInputElement>({} as HTMLInputElement);
const submitRef = useRef<HTMLButtonElement>({} as HTMLButtonElement);
const payeeRef = useRef<HTMLInputElement>(null);
const categoryRef = useRef<HTMLInputElement>(null);
const noteRef = useRef<HTMLInputElement>(null);
return (
<Form {...form}>
@ -125,7 +125,10 @@ export default function PaymentForm({value, entities, categories, onSubmit, clas
<Calendar
mode="single"
selected={field.value}
onSelect={field.onChange}
onSelect={(e) => {
field.onChange(e);
}}
initialFocus
/>
</PopoverContent>
</Popover>
@ -144,13 +147,8 @@ export default function PaymentForm({value, entities, categories, onSubmit, clas
<AutoCompleteInput
placeholder="Select payor"
items={entitiesMapped}
{...field}
onChange={(e) => {
field.onChange(e);
if (e && e.target.value) {
payeeRef && payeeRef.current.focus();
}
}}/>
next={payeeRef}
{...field} />
</FormControl>
<FormMessage/>
</FormItem>
@ -167,18 +165,15 @@ export default function PaymentForm({value, entities, categories, onSubmit, clas
<AutoCompleteInput
placeholder="Select payee"
items={entitiesMapped}
next={categoryRef}
{...field}
onChange={(e) => {
field.onChange(e);
if (e && e.target.value) {
const entity = entities.find((entity) => entity.id === Number(e.target.value));
// only focus category input if payee has no default category
console.log(entity?.defaultCategoryId);
if (entity?.defaultCategoryId !== null) {
form.setValue('categoryId', entity?.defaultCategoryId);
submitRef && submitRef.current.focus();
} else {
categoryRef && categoryRef.current.focus();
}
}
}}/>
@ -198,14 +193,8 @@ export default function PaymentForm({value, entities, categories, onSubmit, clas
<AutoCompleteInput
placeholder="Select category"
items={categoriesMapped}
{...field}
onChange={(e) => {
field.onChange(e);
if (e && e.target.value) {
submitRef && submitRef.current.focus();
}
}}
/>
next={noteRef}
{...field} />
</FormControl>
<FormMessage/>
</FormItem>
@ -227,8 +216,7 @@ export default function PaymentForm({value, entities, categories, onSubmit, clas
)}
/>
<Button type="submit" ref={submitRef}
className="w-full">{value?.id ? 'Update Payment' : 'Create Payment'}</Button>
<Button type="submit" className="w-full">{value?.id ? 'Update Payment' : 'Create Payment'}</Button>
</form>
</Form>
);

11
src/components/form/serverActionTrigger.tsx
View file

@ -1,6 +1,6 @@
'use client';
import { Button, buttonVariants } from '@/components/ui/button';
import { buttonVariants } from '@/components/ui/button';
import React from 'react';
import { Slot } from '@radix-ui/react-slot';
import { cn } from '@/lib/utils';
@ -25,7 +25,6 @@ export interface ConfirmationDialogProps {
title: string;
description?: string;
actionText?: string;
actionVariant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link';
}
export interface ButtonWithActionProps<T = any>
@ -77,11 +76,9 @@ const ServerActionTrigger = React.forwardRef<HTMLButtonElement, ButtonWithAction
<AlertDialogCancel>
Cancel
</AlertDialogCancel>
<Button variant={props.dialog.actionVariant || 'default'} asChild>
<AlertDialogAction onClick={handleSubmit}>
{props.dialog.actionText || 'Confirm'}
</AlertDialogAction>
</Button>
<AlertDialogAction onClick={handleSubmit}>
{props.dialog.actionText || 'Confirm'}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>

71
src/components/form/signInForm.tsx Normal file
View file

@ -0,0 +1,71 @@
'use client';
import { zodResolver } from '@hookform/resolvers/zod';
import { useForm } from 'react-hook-form';
import { z } from 'zod';
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form';
import { Input } from '@/components/ui/input';
import React from 'react';
import { Button } from '@/components/ui/button';
import { signInFormSchema } from '@/lib/form-schemas/signInFormSchema';
import { ActionResponse } from '@/lib/types/actionResponse';
import { useRouter } from 'next/navigation';
import { toast } from 'sonner';
import { sonnerContent } from '@/components/ui/sonner';
export default function SignInForm({onSubmit}: {
onSubmit: (data: z.infer<typeof signInFormSchema>) => Promise<ActionResponse>
}) {
const router = useRouter();
const form = useForm<z.infer<typeof signInFormSchema>>({
resolver: zodResolver(signInFormSchema),
defaultValues: {
username: '',
password: '',
},
});
const handleSubmit = async (data: z.infer<typeof signInFormSchema>) => {
const response = await onSubmit(data);
toast(sonnerContent(response));
if (response.redirect) {
router.push(response.redirect);
}
};
return (
<Form {...form}>
<form onSubmit={form.handleSubmit(handleSubmit)} className="space-y-2">
<FormField
control={form.control}
name="username"
render={({field}) => (
<FormItem>
<FormLabel>Username</FormLabel>
<FormControl>
<Input placeholder="Username" {...field} />
</FormControl>
<FormMessage/>
</FormItem>
)}
/>
<FormField
control={form.control}
name="password"
render={({field}) => (
<FormItem>
<FormLabel>Password</FormLabel>
<FormControl>
<Input placeholder="••••••••" type="password" {...field} />
</FormControl>
<FormMessage/>
</FormItem>
)}
/>
<Button type="submit" className="w-full">Sign in</Button>
</form>
</Form>
);
}

84
src/components/form/signUpForm.tsx Normal file
View file

@ -0,0 +1,84 @@
'use client';
import { zodResolver } from '@hookform/resolvers/zod';
import { useForm } from 'react-hook-form';
import { z } from 'zod';
import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form';
import { Input } from '@/components/ui/input';
import React from 'react';
import { Button } from '@/components/ui/button';
import { signUpFormSchema } from '@/lib/form-schemas/signUpFormSchema';
import { ActionResponse } from '@/lib/types/actionResponse';
import { useRouter } from 'next/navigation';
import { toast } from 'sonner';
import { sonnerContent } from '@/components/ui/sonner';
export default function SignUpForm({onSubmit}: {
onSubmit: (data: z.infer<typeof signUpFormSchema>) => Promise<ActionResponse>
}) {
const router = useRouter();
const form = useForm<z.infer<typeof signUpFormSchema>>({
resolver: zodResolver(signUpFormSchema),
defaultValues: {
username: '',
password: '',
},
});
const handleSubmit = async (data: z.infer<typeof signUpFormSchema>) => {
const response = await onSubmit(data);
toast(sonnerContent(response));
if (response.redirect) {
router.push(response.redirect);
}
};
return (
<Form {...form}>
<form onSubmit={form.handleSubmit(handleSubmit)} className="space-y-2">
<FormField
control={form.control}
name="username"
render={({field}) => (
<FormItem>
<FormLabel>Username</FormLabel>
<FormControl>
<Input placeholder="Username" {...field} />
</FormControl>
<FormMessage/>
</FormItem>
)}
/>
<FormField
control={form.control}
name="password"
render={({field}) => (
<FormItem>
<FormLabel>Password</FormLabel>
<FormControl>
<Input placeholder="••••••••" type="password" {...field} />
</FormControl>
<FormMessage/>
</FormItem>
)}
/>
<FormField
control={form.control}
name="confirm"
render={({field}) => (
<FormItem>
<FormLabel>Confirm password</FormLabel>
<FormControl>
<Input placeholder="••••••••" type="password" {...field} />
</FormControl>
<FormMessage/>
</FormItem>
)}
/>
<Button type="submit" className="w-full">Create Account</Button>
</form>
</Form>
);
}

2
src/components/navigation.tsx
View file

@ -78,7 +78,7 @@ export default function Navigation() {
<NavigationMenuList className="flex w-screen items-center justify-between sm:px-4 py-2">
<div className="inline-flex space-x-2">
<img src={'/logo_t_hq_w.svg'} alt="Finances" className="h-10 w-10 mx-3"/>
<img src={'/logo_white.png'} alt="Finances" className="h-10 w-10 mx-3"/>
<NavigationMenuItem>
<Link href="/" legacyBehavior passHref>

14
src/components/ui/auto-complete-input.tsx
View file

@ -9,6 +9,7 @@ import { Button } from '@/components/ui/button';
export interface AutoCompleteInputProps
extends React.InputHTMLAttributes<HTMLInputElement> {
items: { label: string, value: any }[];
next?: React.RefObject<HTMLInputElement>;
}
const AutoCompleteInput = React.forwardRef<HTMLInputElement, AutoCompleteInputProps>(
@ -31,6 +32,7 @@ const AutoCompleteInput = React.forwardRef<HTMLInputElement, AutoCompleteInputPr
function handleChange(e: React.ChangeEvent<HTMLInputElement>) {
props.onChange?.(undefined as any);
const value = e.target.value;
setFilteredItems(props?.items?.filter((item) => {
@ -39,26 +41,19 @@ const AutoCompleteInput = React.forwardRef<HTMLInputElement, AutoCompleteInputPr
setValue(value);
setOpen(value.length > 0);
// on typing only the internal state is changed while the form state is
// set to undefined. This way only the predefined items are actual values
// for the form validation
props.onChange?.(undefined as any);
}
// since typing changes the internal values and therefor the selected value, this effect
// handles every filteredItems change to check if only one item is left
useEffect(() => {
// only one item is left and the last character was a letter or digit.
// the last condition has to be checked to make it possible to use the backspace
if (filteredItems.length === 1 && /^[a-zA-Z0-9]$/.test(lastKey)) {
setValue(filteredItems[0].label);
setOpen(false);
props.onChange?.({target: {value: filteredItems[0].value}} as any);
props.next && props.next.current?.focus();
}
}, [filteredItems]);
useEffect(() => {
console.log('Prop value changed', value, props.value);
if (props.value) {
setValue(getNameOfPropValue());
} else {
@ -110,6 +105,7 @@ const AutoCompleteInput = React.forwardRef<HTMLInputElement, AutoCompleteInputPr
className="px-3 py-3 hover:bg-accent hover:text-accent-foreground cursor-pointer text-sm font-medium"
onClick={() => {
props.onChange?.({target: {value: item.value}} as any);
props.next && props.next.current?.focus();
setValue(item.label);
setOpen(false);
}}

6
src/components/ui/button.tsx
View file

@ -5,7 +5,7 @@ import { cva, type VariantProps } from 'class-variance-authority';
import { cn } from '@/lib/utils';
const buttonVariants = cva(
'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
{
variants: {
variant: {
@ -40,11 +40,11 @@ export interface ButtonProps
}
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
({ className, variant, size, asChild = false, ...props }, ref) => {
({className, variant, size, asChild = false, ...props}, ref) => {
const Comp = asChild ? Slot : 'button';
return (
<Comp
className={cn(buttonVariants({ variant, size, className }))}
className={cn(buttonVariants({variant, size, className}))}
ref={ref}
{...props}
/>

24
src/components/ui/calendar.tsx
View file

@ -10,11 +10,11 @@ import { buttonVariants } from '@/components/ui/button';
export type CalendarProps = React.ComponentProps<typeof DayPicker>
function Calendar({
className,
classNames,
showOutsideDays = true,
...props
}: CalendarProps) {
className,
classNames,
showOutsideDays = true,
...props
}: CalendarProps) {
return (
<DayPicker
showOutsideDays={showOutsideDays}
@ -26,7 +26,7 @@ function Calendar({
caption_label: 'text-sm font-medium',
nav: 'space-x-1 flex items-center',
nav_button: cn(
buttonVariants({ variant: 'outline' }),
buttonVariants({variant: 'outline'}),
'h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100',
),
nav_button_previous: 'absolute left-1',
@ -38,7 +38,7 @@ function Calendar({
row: 'flex w-full mt-2',
cell: 'h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].day-range-end)]:rounded-r-md [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20',
day: cn(
buttonVariants({ variant: 'ghost' }),
buttonVariants({variant: 'ghost'}),
'h-9 w-9 p-0 font-normal aria-selected:opacity-100',
),
day_range_end: 'day-range-end',
@ -46,7 +46,7 @@ function Calendar({
'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',
day_today: 'bg-accent text-accent-foreground',
day_outside:
'day-outside text-muted-foreground aria-selected:bg-accent/50 aria-selected:text-muted-foreground',
'day-outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30',
day_disabled: 'text-muted-foreground opacity-50',
day_range_middle:
'aria-selected:bg-accent aria-selected:text-accent-foreground',
@ -54,12 +54,8 @@ function Calendar({
...classNames,
}}
components={{
IconLeft: ({ className, ...props }) => (
<ChevronLeft className={cn('h-4 w-4', className)} {...props} />
),
IconRight: ({ className, ...props }) => (
<ChevronRight className={cn('h-4 w-4', className)} {...props} />
),
IconLeft: ({...props}) => <ChevronLeft className="h-4 w-4"/>,
IconRight: ({...props}) => <ChevronRight className="h-4 w-4"/>,
}}
{...props}
/>

2
src/components/ui/popover.tsx
View file

@ -12,7 +12,7 @@ const PopoverTrigger = PopoverPrimitive.Trigger;
const PopoverContent = React.forwardRef<
React.ElementRef<typeof PopoverPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
>(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (
>(({className, align = 'center', sideOffset = 4, ...props}, ref) => (
<PopoverPrimitive.Portal>
<PopoverPrimitive.Content
ref={ref}

58
src/lib/actions/accountDelete.ts Normal file
View file

@ -0,0 +1,58 @@
import { ActionResponse } from '@/lib/types/actionResponse';
import { URL_SIGN_IN } from '@/lib/constants';
import { getUser, lucia } from '@/auth';
import prisma from '@/prisma';
import { cookies } from 'next/headers';
export default async function accountDelete(): Promise<ActionResponse> {
'use server';
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
redirect: URL_SIGN_IN,
};
}
await prisma.payment.deleteMany({
where: {
userId: user.id,
},
});
await prisma.entity.deleteMany({
where: {
userId: user.id,
},
});
await prisma.category.deleteMany({
where: {
userId: user.id,
},
});
await prisma.session.deleteMany({
where: {
userId: user.id,
},
});
await prisma.user.delete({
where: {
id: user.id,
},
});
const sessionCookie = lucia.createBlankSessionCookie();
cookies().set(sessionCookie.name, sessionCookie.value, sessionCookie.attributes);
return {
type: 'success',
message: 'Your account was removed.',
redirect: URL_SIGN_IN,
};
}

12
src/lib/actions/categoryCreateUpdate.ts
View file

@ -1,9 +1,9 @@
import { z } from 'zod';
import { ActionResponse } from '@/lib/types/actionResponse';
import prisma from '@/prisma';
import { getUser } from '@/auth';
import { URL_SIGN_IN } from '@/lib/constants';
import { categoryFormSchema } from '@/lib/form-schemas/categoryFormSchema';
import { auth0 } from '@/lib/auth';
export default async function categoryCreateUpdate({
id,
@ -12,15 +12,15 @@ export default async function categoryCreateUpdate({
}: z.infer<typeof categoryFormSchema>): Promise<ActionResponse> {
'use server';
const session = await auth0.getSession();
if (!session) {
// check that user is logged in
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
message: 'You must be logged in to create/update an category.',
redirect: URL_SIGN_IN,
};
}
const user = session.user;
// create/update category
try {
@ -44,7 +44,7 @@ export default async function categoryCreateUpdate({
} else {
await prisma.category.create({
data: {
userId: user.sub,
userId: user.id,
name: name,
color: color,
},

32
src/lib/actions/categoryDelete.ts
View file

@ -1,7 +1,7 @@
import { ActionResponse } from '@/lib/types/actionResponse';
import prisma from '@/prisma';
import { getUser } from '@/auth';
import { URL_SIGN_IN } from '@/lib/constants';
import { auth0 } from '@/lib/auth';
export default async function categoryDelete(id: number): Promise<ActionResponse> {
'use server';
@ -14,21 +14,21 @@ export default async function categoryDelete(id: number): Promise<ActionResponse
};
}
const session = await auth0.getSession();
if (!session) {
// check that user is logged in
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
message: 'You must be logged in to delete an category.',
redirect: URL_SIGN_IN,
};
}
const user = session.user;
// check that category is associated with user
const category = await prisma.category.findFirst({
where: {
id: id,
userId: user.sub,
userId: user.id,
},
});
if (!category) {
@ -38,25 +38,15 @@ export default async function categoryDelete(id: number): Promise<ActionResponse
};
}
// delete category
try {
await prisma.$transaction(async (tx) => {
// update related payments
await tx.payment.updateMany({
where: {categoryId: category.id},
data: {categoryId: null},
});
// delete the category
await tx.category.delete({
await prisma.category.delete({
where: {
id: category.id,
userId: user.sub,
userId: user.id,
},
});
});
},
);
} catch (e) {
return {
type: 'error',

40
src/lib/actions/clearAccountData.ts
View file

@ -1,40 +0,0 @@
import { ActionResponse } from '@/lib/types/actionResponse';
import { URL_SIGN_IN } from '@/lib/constants';
import prisma from '@/prisma';
import { auth0 } from '@/lib/auth';
export default async function clearAccountData(): Promise<ActionResponse> {
'use server';
const session = await auth0.getSession();
if (!session) {
return {
type: 'error',
message: 'You aren\'t signed in.',
redirect: URL_SIGN_IN,
};
}
await prisma.payment.deleteMany({
where: {
userId: session.user.sub,
},
});
await prisma.entity.deleteMany({
where: {
userId: session.user.sub,
},
});
await prisma.category.deleteMany({
where: {
userId: session.user.sub,
},
});
return {
type: 'success',
message: 'Your account data was cleared.',
};
}

12
src/lib/actions/entityCreateUpdate.ts
View file

@ -2,8 +2,8 @@ import { z } from 'zod';
import { ActionResponse } from '@/lib/types/actionResponse';
import { entityFormSchema } from '@/lib/form-schemas/entityFormSchema';
import prisma from '@/prisma';
import { getUser } from '@/auth';
import { URL_SIGN_IN } from '@/lib/constants';
import { auth0 } from '@/lib/auth';
export default async function entityCreateUpdate({
id,
@ -13,15 +13,15 @@ export default async function entityCreateUpdate({
}: z.infer<typeof entityFormSchema>): Promise<ActionResponse> {
'use server';
const session = await auth0.getSession();
if (!session) {
// check that user is logged in
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
message: 'You must be logged in to create/update an entity.',
redirect: URL_SIGN_IN,
};
}
const user = session.user;
// create/update entity
try {
@ -46,7 +46,7 @@ export default async function entityCreateUpdate({
} else {
await prisma.entity.create({
data: {
userId: user.sub,
userId: user.id,
name: name,
type: type,
defaultCategoryId: defaultCategoryId ?? null,

14
src/lib/actions/entityDelete.ts
View file

@ -1,7 +1,7 @@
import { ActionResponse } from '@/lib/types/actionResponse';
import prisma from '@/prisma';
import { getUser } from '@/auth';
import { URL_SIGN_IN } from '@/lib/constants';
import { auth0 } from '@/lib/auth';
export default async function entityDelete(id: number): Promise<ActionResponse> {
'use server';
@ -14,21 +14,21 @@ export default async function entityDelete(id: number): Promise<ActionResponse>
};
}
const session = await auth0.getSession();
if (!session) {
// check that user is logged in
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
message: 'You must be logged in to delete an entity.',
redirect: URL_SIGN_IN,
};
}
const user = session.user;
// check that entity is associated with user
const entity = await prisma.entity.findFirst({
where: {
id: id,
userId: user.sub,
userId: user.id,
},
});
if (!entity) {
@ -43,7 +43,7 @@ export default async function entityDelete(id: number): Promise<ActionResponse>
await prisma.entity.delete({
where: {
id: entity.id,
userId: user.sub,
userId: user.id,
},
},
);

51
src/lib/actions/generateSampleData.ts
View file

@ -1,32 +1,32 @@
import prisma from '@/prisma';
import type { Category, Entity } from '@prisma/client';
import { EntityType } from '@prisma/client';
import { getUser } from '@/auth';
import { URL_SIGN_IN } from '@/lib/constants';
import { ActionResponse } from '@/lib/types/actionResponse';
import { auth0 } from '@/lib/auth';
export default async function generateSampleData(): Promise<ActionResponse> {
'use server';
const session = await auth0.getSession();
if (!session) {
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
message: 'You must be logged in to create/update an category.',
redirect: URL_SIGN_IN,
};
}
const user = session.user;
// Categories: create sample data
const categories: Category[] = await prisma.category.findMany({where: {userId: user.sub}});
if (await prisma.category.count({where: {userId: user.sub}}) == 0) {
const categories: Category[] = await prisma.category.findMany({where: {userId: user.id}});
if (await prisma.category.count({where: {userId: user.id}}) == 0) {
console.log('Creating sample categories...');
categories.push(await prisma.category.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Groceries',
color: '#FFBEAC',
},
@ -34,7 +34,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
categories.push(await prisma.category.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Drugstore items',
color: '#9CBCFF',
},
@ -42,7 +42,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
categories.push(await prisma.category.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Going out',
color: '#F1ADFF',
},
@ -50,7 +50,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
categories.push(await prisma.category.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Random stuff',
color: '#C1FFA9',
},
@ -58,7 +58,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
categories.push(await prisma.category.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Salary',
color: '#FFF787',
},
@ -69,14 +69,14 @@ export default async function generateSampleData(): Promise<ActionResponse> {
console.log(categories);
// Entities: create sample data
const entities: Entity[] = await prisma.entity.findMany({where: {userId: user.sub}});
if (await prisma.entity.count({where: {userId: user.sub}}) == 0) {
const entities: Entity[] = await prisma.entity.findMany({where: {userId: user.id}});
if (await prisma.entity.count({where: {userId: user.id}}) == 0) {
console.log('Creating sample entities...');
entities.push(await prisma.entity.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Main Account',
type: EntityType.Account,
},
@ -84,7 +84,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
entities.push(await prisma.entity.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Company',
type: EntityType.Entity,
},
@ -92,7 +92,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
entities.push(await prisma.entity.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Supermarket 1',
type: EntityType.Entity,
},
@ -100,7 +100,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
entities.push(await prisma.entity.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Supermarket 2',
type: EntityType.Entity,
},
@ -108,7 +108,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
entities.push(await prisma.entity.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Supermarket 3',
type: EntityType.Entity,
},
@ -116,7 +116,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
entities.push(await prisma.entity.create({
data: {
userId: user.sub,
userId: user.id,
name: 'Supermarket 4',
type: EntityType.Entity,
},
@ -129,24 +129,21 @@ export default async function generateSampleData(): Promise<ActionResponse> {
// Payments: create sample data
console.log('Creating sample payments...');
if (await prisma.payment.count({where: {userId: user.sub}}) == 0) {
if (await prisma.payment.count({where: {userId: user.id}}) == 0) {
for (let i = 0; i < 4; i++) {
const date = new Date();
date.setDate(1);
date.setMonth(date.getMonth() - i);
const categoryId =
categories.find((it) => it.name === 'Salary')?.id!;
await prisma.payment.create({
data: {
userId: user.sub,
userId: user.id,
amount: 200000,
date: date,
payorId: entities[1].id,
payeeId: entities[0].id,
categoryId: categoryId,
categoryId: 5,
createdAt: date,
updatedAt: date,
},
@ -169,7 +166,7 @@ export default async function generateSampleData(): Promise<ActionResponse> {
await prisma.payment.create({
data: {
userId: user.sub,
userId: user.id,
amount: Math.floor(
Math.random() * (maxAmount - minAmount) + minAmount),
date: date,

12
src/lib/actions/paymentCreateUpdate.ts
View file

@ -1,9 +1,9 @@
import { z } from 'zod';
import { ActionResponse } from '@/lib/types/actionResponse';
import prisma from '@/prisma';
import { getUser } from '@/auth';
import { URL_SIGN_IN } from '@/lib/constants';
import { paymentFormSchema } from '@/lib/form-schemas/paymentFormSchema';
import { auth0 } from '@/lib/auth';
export default async function paymentCreateUpdate({
id,
@ -16,15 +16,15 @@ export default async function paymentCreateUpdate({
}: z.infer<typeof paymentFormSchema>): Promise<ActionResponse> {
'use server';
const session = await auth0.getSession();
if (!session) {
// check that user is logged in
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
message: 'You must be logged in to create/update a payment.',
redirect: URL_SIGN_IN,
};
}
const user = session.user;
// create/update payment
try {
@ -52,7 +52,7 @@ export default async function paymentCreateUpdate({
} else {
await prisma.payment.create({
data: {
userId: user.sub,
userId: user.id,
amount: amount,
date: date,
payorId: payorId,

14
src/lib/actions/paymentDelete.ts
View file

@ -1,7 +1,7 @@
import { ActionResponse } from '@/lib/types/actionResponse';
import prisma from '@/prisma';
import { getUser } from '@/auth';
import { URL_SIGN_IN } from '@/lib/constants';
import { auth0 } from '@/lib/auth';
export default async function paymentDelete(id: number): Promise<ActionResponse> {
'use server';
@ -14,21 +14,21 @@ export default async function paymentDelete(id: number): Promise<ActionResponse>
};
}
const session = await auth0.getSession();
if (!session) {
// check that user is logged in
const user = await getUser();
if (!user) {
return {
type: 'error',
message: 'You aren\'t signed in.',
message: 'You must be logged in to delete a payment.',
redirect: URL_SIGN_IN,
};
}
const user = session.user;
// check that payment is associated with user
const payment = await prisma.payment.findFirst({
where: {
id: id,
userId: user.sub,
userId: user.id,
},
});
if (!payment) {
@ -43,7 +43,7 @@ export default async function paymentDelete(id: number): Promise<ActionResponse>
await prisma.payment.delete({
where: {
id: payment.id,
userId: user.sub,
userId: user.id,
},
},
);

41
src/lib/actions/signIn.ts Normal file
View file

@ -0,0 +1,41 @@
import { z } from 'zod';
import { Argon2id } from 'oslo/password';
import { lucia } from '@/auth';
import { cookies } from 'next/headers';
import { signInFormSchema } from '@/lib/form-schemas/signInFormSchema';
import { ActionResponse } from '@/lib/types/actionResponse';
import { URL_HOME } from '@/lib/constants';
import prisma from '@/prisma';
export default async function signIn({username, password}: z.infer<typeof signInFormSchema>): Promise<ActionResponse> {
'use server';
const existingUser = await prisma.user.findFirst({
where: {
username: username.toLowerCase(),
},
});
if (!existingUser) {
return {
type: 'error',
message: 'Incorrect username or password',
};
}
const validPassword = await new Argon2id().verify(existingUser.password, password);
if (!validPassword) {
return {
type: 'error',
message: 'Incorrect username or password',
};
}
const session = await lucia.createSession(existingUser.id, {});
const sessionCookie = lucia.createSessionCookie(session.id);
cookies().set(sessionCookie.name, sessionCookie.value, sessionCookie.attributes);
return {
type: 'success',
message: 'Signed in successfully',
redirect: URL_HOME,
};
}

26
src/lib/actions/signOut.ts Normal file
View file

@ -0,0 +1,26 @@
import { getSession, lucia } from '@/auth';
import { cookies } from 'next/headers';
import { ActionResponse } from '@/lib/types/actionResponse';
import { URL_SIGN_IN } from '@/lib/constants';
export default async function signOut(): Promise<ActionResponse> {
'use server';
const session = await getSession();
if (!session) {
return {
type: 'error',
message: 'You aren\'t signed in',
};
}
await lucia.invalidateSession(session.id);
const sessionCookie = lucia.createBlankSessionCookie();
cookies().set(sessionCookie.name, sessionCookie.value, sessionCookie.attributes);
return {
type: 'success',
message: 'Signed out successfully',
redirect: URL_SIGN_IN,
};
}

46
src/lib/actions/signUp.ts Normal file
View file

@ -0,0 +1,46 @@
import { z } from 'zod';
import { Argon2id } from 'oslo/password';
import { generateId } from 'lucia';
import { lucia } from '@/auth';
import { cookies } from 'next/headers';
import { signUpFormSchema } from '@/lib/form-schemas/signUpFormSchema';
import { ActionResponse } from '@/lib/types/actionResponse';
import { URL_HOME } from '@/lib/constants';
import prisma from '@/prisma';
export default async function signUp({username, password}: z.infer<typeof signUpFormSchema>): Promise<ActionResponse> {
'use server';
const hashedPassword = await new Argon2id().hash(password);
const userId = generateId(15);
const existingUser = await prisma.user.findFirst({
where: {
username: username.toLowerCase(),
},
});
if (existingUser) {
return {
type: 'error',
message: 'Username already exists',
};
}
await prisma.user.create({
data: {
id: userId,
username: username,
password: hashedPassword,
},
});
const session = await lucia.createSession(userId, {});
const sessionCookie = lucia.createSessionCookie(session.id);
cookies().set(sessionCookie.name, sessionCookie.value, sessionCookie.attributes);
return {
type: 'success',
message: 'Signed up successfully',
redirect: URL_HOME,
};
}

9
src/lib/auth.ts
View file

@ -1,9 +0,0 @@
import { Auth0Client } from "@auth0/nextjs-auth0/server"
export const auth0 = new Auth0Client({
appBaseUrl: process.env.AUTH0_BASE_URL,
domain: process.env.AUTH0_URL,
secret: process.env.AUTH0_SECRET,
clientId: process.env.AUTH0_CLIENT_ID,
clientSecret: process.env.AUTH0_CLIENT_SECRET,
})

7
src/lib/constants.ts
View file

@ -1,6 +1,7 @@
export const URL_SIGN_IN = `/auth/login`;
export const URL_SIGN_OUT = `/auth/logout`;
// auth urls
export const URL_AUTH = '/auth';
export const URL_SIGN_IN = `${URL_AUTH}/signin`;
export const URL_SIGN_UP = `${URL_AUTH}/signup`;
// main urls
export const URL_HOME = '/';

6
src/lib/form-schemas/signInFormSchema.ts Normal file
View file

@ -0,0 +1,6 @@
import { z } from 'zod';
export const signInFormSchema = z.object({
username: z.string().min(3).max(16),
password: z.string().min(8).max(255),
});

10
src/lib/form-schemas/signUpFormSchema.ts Normal file
View file

@ -0,0 +1,10 @@
import { z } from 'zod';
export const signUpFormSchema = z.object({
username: z.string().min(3).max(16),
password: z.string().min(8).max(255),
confirm: z.string().min(8).max(255),
}).refine(data => data.password === data.confirm, {
message: 'Passwords do not match',
path: ['confirm'],
});

33
src/middleware.ts
View file

@ -1,22 +1,27 @@
import { NextRequest } from 'next/server';
import { auth0 } from '@/lib/auth';
import type { NextRequest } from 'next/server';
import { NextResponse } from 'next/server';
import { URL_AUTH, URL_HOME, URL_SIGN_IN } from './lib/constants';
export async function middleware(request: NextRequest) {
try {
return await auth0.middleware(request);
} catch (error) {
console.error("Auth0 middleware error:", error);
// get session id from cookies
const sessionId = request.cookies.get('auth_session')?.value ?? null;
// redirect to home if user is already authenticated
if (request.nextUrl.pathname.startsWith(URL_AUTH) && sessionId) {
return NextResponse.redirect(new URL(URL_HOME, request.url));
}
// redirect to sign in if user is not authenticated
if (!request.nextUrl.pathname.startsWith(URL_AUTH) && !sessionId) {
return NextResponse.redirect(new URL(URL_SIGN_IN, request.url));
}
return NextResponse.next();
}
export const config = {
matcher: [
/*
* Match all request paths except for the ones starting with:
* - _next/static (static files)
* - _next/image (image optimization files)
* - favicon.ico, sitemap.xml, robots.txt (metadata files)
*/
"/((?!_next/static|_next/image|favicon.ico|sitemap.xml|robots.txt).*)",
'/((?!api|_next/static|_next/image|favicon.ico).*)',
],
}
};

3
tsconfig.json
View file

@ -29,8 +29,7 @@
},
"types": [
"@serwist/next/typings"
],
"target": "ES2017"
]
},
"include": [
"next-env.d.ts",