fix: improve notes get and delete
This commit is contained in:
parent
1ba1949f41
commit
646bbaaeb9
@ -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;
|
||||
}
|
||||
|
@ -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");
|
||||
}
|
||||
|
@ -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>
|
||||
|
@ -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} /> )
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
@ -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} />} />
|
||||
|
@ -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>
|
||||
);
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user