fix: improve notes get and delete

This commit is contained in:
Kirill Siukhin 2025-07-15 01:37:20 +05:00
parent 1ba1949f41
commit 646bbaaeb9
6 changed files with 50 additions and 39 deletions

View File

@ -82,6 +82,12 @@ export async function register(_prevState: unknown, formData: FormData) {
redirect("/notes");
}
export async function logOut() {
const cookieStore = await cookies();
cookieStore.delete("session");
redirect("/auth");
}
export async function getAuth() {
const cookieStore = await cookies();
const token = cookieStore.get("session")?.value;
@ -109,8 +115,10 @@ export async function getAuth() {
}
}
export async function logOut() {
const cookieStore = await cookies();
cookieStore.delete("session");
redirect("/auth");
export async function requireAuth() {
const user = await getAuth();
if (!user) {
redirect("/auth");
}
return user;
}

View File

@ -2,11 +2,13 @@
import { revalidatePath } from "next/cache";
import { redirect } from "next/navigation";
import { desc, eq } from "drizzle-orm";
import { desc, eq, and } from "drizzle-orm";
import { INote, notesTable, usersTable } from "@/lib/db/schema";
import { db } from "@/lib/db";
import { INote, IUser, notesTable, usersTable } from "@/lib/db/schema";
import { requireAuth } from "./auth";
export async function createNote(user: IUser) {
export async function createNote() {
const user = await requireAuth();
const result = await db
.insert(notesTable)
.values({ authorId: user.id })
@ -15,7 +17,8 @@ export async function createNote(user: IUser) {
redirect(`/notes/${id}`);
}
export async function getNotes(user: IUser): Promise<INote[]> {
export async function getNotes(): Promise<INote[]> {
const user = await requireAuth();
return db
.select()
.from(notesTable)
@ -23,9 +26,11 @@ export async function getNotes(user: IUser): Promise<INote[]> {
.orderBy(desc(notesTable.lastEdited));
}
export async function deleteNote(note: INote) {
export async function deleteNote(formData: FormData) {
const user = await requireAuth();
const noteId = formData.get("noteId") as string;
await db
.delete(notesTable)
.where(eq(notesTable.id, note.id));
.where(and(eq(notesTable.id, noteId), eq(notesTable.authorId, user.id)));
revalidatePath("/notes");
}

View File

@ -1,6 +1,5 @@
import { Metadata } from "next";
import { Noto_Sans_Mono } from "next/font/google";
import { getAuth } from "./actions/auth";
import Header from "@/components/Header";
import "./globals.css";
@ -19,12 +18,10 @@ export default async function RootLayout({
}: Readonly<{
children: React.ReactNode;
}>) {
const user = await getAuth();
return (
<html lang="en">
<body className={`${notoSansMono.variable} font-mono antialiased`}>
<Header user={user} />
<Header />
<div className="m-4">
{children}
</div>

View File

@ -1,8 +1,7 @@
import { getAuth } from "@/app/actions/auth";
import { Metadata } from "next";
import { requireAuth } from "@/app/actions/auth";
import { getNotes } from "@/app/actions/notes";
import NoteCard from "@/components/ui/NoteCard";
import { Metadata } from "next";
import { redirect } from "next/navigation";
export const metadata: Metadata = {
title: "Notes - Rhyme",
@ -10,16 +9,17 @@ export const metadata: Metadata = {
};
export default async function Notes() {
const user = await getAuth();
if (!user) {
redirect("/auth");
}
const notes = await getNotes(user);
const user = await requireAuth();
const notes = await getNotes();
return (
<>
<h1 className="font-bold text-xl mb-4">Notes of {user.username}:</h1>
{notes.map((note) => <NoteCard key={note.id} note={note} /> )}
{notes.length === 0 ? (
<span className="text-neutral-400">You have no notes yet</span>
) : (
notes.map((note) => <NoteCard key={note.id} note={note} /> )
)}
</>
);
}

View File

@ -1,13 +1,12 @@
"use client";
import Link from "next/link";
import { CircleQuestionMark, List, Plus, UserRound, UserRoundMinus } from "lucide-react";
import { logOut } from "@/app/actions/auth";
import { getAuth, logOut } from "@/app/actions/auth";
import { createNote } from "@/app/actions/notes";
import { IUser } from "@/lib/db/schema";
import HeaderButton from "./ui/HeaderButton";
export default function Header({ user }: { user: IUser | null }) {
export default async function Header() {
const user = await getAuth();
return (
<header className="flex items-center gap-6 m-4">
<Link href={user ? "/notes" : "/"}>
@ -16,10 +15,12 @@ export default function Header({ user }: { user: IUser | null }) {
{user && (
<div className="flex gap-2">
<HeaderButton title="new" icon={<Plus size={20} />} onClick={() => createNote(user)} />
<Link href="/notes">
<HeaderButton title="list" icon={<List size={20} />} />
</Link>
<form action={createNote}>
<HeaderButton type="submit" title="new" icon={<Plus size={20} />} />
</form>
<Link href="/notes">
<HeaderButton title="list" icon={<List size={20} />} />
</Link>
</div>
)}
@ -28,7 +29,9 @@ export default function Header({ user }: { user: IUser | null }) {
<HeaderButton title="about" icon={<CircleQuestionMark size={20} />} />
</Link>
{user ? (
<HeaderButton onClick={logOut} title="log out" icon={<UserRoundMinus size={20} />} />
<form action={logOut}>
<HeaderButton type="submit" title="log out" icon={<UserRoundMinus size={20} />} />
</form>
) : (
<Link href="/auth">
<HeaderButton title="login" icon={<UserRound size={20} />} />

View File

@ -14,11 +14,6 @@ function makeTimestamp(date: Date) {
}
export default function NoteCard({ note }: { note: INote }) {
const deleteNoteAction = async () => {
"use server";
await deleteNote(note);
};
return (
<div className="flex items-center mb-3 gap-4">
<Link href={`/notes/${note.id}`} className="flex flex-col border border-neutral-500 py-3 px-4 rounded-lg hover:bg-neutral-800 w-full">
@ -26,7 +21,10 @@ export default function NoteCard({ note }: { note: INote }) {
<i className="text-neutral-400 text-sm">Last time edited: {makeTimestamp(note.lastEdited)}</i>
<i className="text-neutral-400 text-sm">Creation date: {makeTimestamp(note.creationTime)}</i>
</Link>
<IconOnlyButton icon={<X size={24} />} onClick={deleteNoteAction} />
<form action={deleteNote}>
<input type="hidden" name="noteId" value={note.id} />
<IconOnlyButton icon={<X size={24} />} type="submit" />
</form>
</div>
);
}