Notes + Bug Fixes

Author: cvs0

package-lock.json

@@ -72,7 +72,10 @@ model PinItem {
 model NoteItem {
   id        String        @id @default(uuid())
   type      VaultItemType @default(NOTE)
-  note      String
+  title     String
+  content   String
+  titleIV   String
+  contentIV String
   createdAt DateTime      @default(now())
   updatedAt DateTime      @updatedAt
   userId    String

prisma/schema.prisma

@@ -1,13 +1,13 @@
 import { VaultPage } from "@/components/vault/vault-page";
 import { auth, currentUser } from "@clerk/nextjs/server";
-import { getPasswords, instantiateVault } from "../actions";
+import { getItems, instantiateVault } from "../actions";
 
 export default async function Page() {
   const { userId, redirectToSignIn } = await auth();
 
   if (!userId) return redirectToSignIn();
 
-  const user = await getPasswords();
+  const user = await getItems();
 
   if (!user) {
     const clerkUser = await currentUser();

src/app/(main)/page.tsx

@@ -124,6 +124,119 @@ export async function createPasswordItem(
   return newPasswordItem;
 }
 
+export async function updateNoteItem(
+  id: string,
+  newTitle: string,
+  newContent: string,
+  titleIV: string,
+  contentIV: string
+) {
+  const { userId } = await auth()
+
+  if (!userId) {
+    throw new Error("Not authenticated");
+  }
+
+  const user = await prismadb.user.findUnique({
+    where: {
+      id: userId,
+    },
+    include: {
+      noteItems: true,
+    },
+  });
+
+  if (!user) {
+    throw new Error("User not found");
+  }
+
+  const noteItem = user.noteItems.find((item) => item.id === id);
+
+  if (!noteItem) {
+    throw new Error("Note item not found");
+  }
+
+  const item = await prismadb.noteItem.update({
+    where: {
+      id: noteItem.id,
+    },
+    data: {
+      title: newTitle,
+      content: newContent,
+      titleIV,
+      contentIV,
+    },
+  });
+
+  return item;
+}
+
+export async function deleteNoteItem(id: string) {
+  const { userId } = await auth()
+
+  if (!userId) {
+    throw new Error("Not authenticated");
+  }
+
+  const user = await prismadb.user.findUnique({
+    where: {
+      id: userId,
+    },
+    include: {
+      noteItems: true,
+    },
+  });
+
+  if (!user) {
+    throw new Error("User not found");
+  }
+
+  const noteItem = user.noteItems.find((item) => item.id === id);
+
+  if (!noteItem) {
+    throw new Error("Note item not found");
+  }
+
+  await prismadb.noteItem.delete({
+    where: {
+      id: noteItem.id,
+    },
+  });
+
+  return { success: true };
+}
+
+export async function createNoteItem(
+  title: string,
+  content: string,
+  titleIV: string,
+  contentIV: string
+) {
+  const { userId } = await auth()
+
+  if (!userId) {
+    throw new Error("Not authenticated");
+  }
+
+  const newNoteItem = await prismadb.noteItem.create({
+    data: {
+      title,
+      content,
+      titleIV,
+      contentIV,
+      updatedAt: new Date().toISOString(),
+      createdAt: new Date().toISOString(),
+      user: {
+        connect: {
+          id: userId
+        }
+      }
+    },
+  });
+
+  return newNoteItem;
+}
+
 export async function resetVault() {
   const { userId } = await auth()
 
@@ -186,7 +299,7 @@ export async function instantiateVault(userId: string, username: string) {
   return vault;
 }
 
-export async function getPasswords() {
+export async function getItems() {
   const { userId } = await auth()
 
   if (!userId) {
@@ -215,3 +328,4 @@ export async function getPasswords() {
     },
   });
 }
+

src/app/actions.ts

@@ -126,7 +126,7 @@ function ContextMenuItem({
       data-inset={inset}
       data-variant={variant}
       className={cn(
-        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive-foreground data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/40 data-[variant=destructive]:focus:text-destructive-foreground data-[variant=destructive]:*:[svg]:!text-destructive-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive-foreground data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/40 data-[variant=destructive]:focus:text-destructive-foreground hover:cursor-pointer data-[variant=destructive]:*:[svg]:!text-destructive-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       )}
       {...props}

src/components/ui/context-menu.tsx

@@ -0,0 +1,105 @@
+import { createNoteItem } from "@/app/actions";
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { useState } from "react";
+import { toast } from "react-hot-toast";
+import { useUser } from "@clerk/nextjs";
+import {encrypt} from "@/utils/encryption";
+
+interface CreateNoteDialogProps {
+  open: boolean;
+  onClose: () => void;
+}
+
+export function CreateNoteDialog({ open, onClose }: CreateNoteDialogProps) {
+  const { user } = useUser();
+  const [isLoading, setIsLoading] = useState(false);
+  const [title, setTitle] = useState("");
+  const [content, setContent] = useState("");
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!user) return;
+
+    setIsLoading(true);
+    try {
+      const { encryptedData: encryptedTitle, iv: titleIV } = await encrypt(
+        title,
+        user.id
+      );
+      const { encryptedData: encryptedContent, iv: contentIV } = await encrypt(
+        content,
+        user.id
+      );
+
+      await createNoteItem(
+        encryptedTitle,
+        encryptedContent,
+        titleIV,
+        contentIV,
+      );
+
+      toast.success("Note created successfully");
+      onClose();
+      setTitle("");
+      setContent("");
+    } catch (error) {
+      console.error("Error creating note:", error);
+      toast.error("Failed to create note");
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={() => onClose()}>
+      <DialogContent className="sm:max-w-[425px]">
+        <form onSubmit={handleSubmit}>
+          <DialogHeader>
+            <DialogTitle>Create Note</DialogTitle>
+            <DialogDescription>
+              Add a new note to your vault
+            </DialogDescription>
+          </DialogHeader>
+          <div className="grid gap-4 py-4">
+            <Input
+              placeholder="Title"
+              value={title}
+              onChange={(e) => setTitle(e.target.value)}
+              required
+            />
+            <Textarea
+              placeholder="Content"
+              value={content}
+              onChange={(e) => setContent(e.target.value)}
+              required
+              rows={6}
+            />
+          </div>
+          <DialogFooter>
+            <Button
+              type="button"
+              variant="outline"
+              onClick={onClose}
+              disabled={isLoading}
+            >
+              Cancel
+            </Button>
+            <Button type="submit" disabled={isLoading}>
+              Create Note
+            </Button>
+          </DialogFooter>
+        </form>
+      </DialogContent>
+    </Dialog>
+  );
+}