+ {Array.from({ length: 6 }, (_, i) => (
+
+
+
+ ))}
+
+
+
+
+ {courseCode}
-
-
+
- );
-}
\ No newline at end of file
+ )}
+
+);
+}
diff --git a/src/app/courses/loading.tsx b/src/app/courses/loading.tsx
new file mode 100644
index 0000000..de46936
--- /dev/null
+++ b/src/app/courses/loading.tsx
@@ -0,0 +1,30 @@
+import Link from "next/link";
+import { Skeleton } from "~/components/ui/skeleton";
+
+export default function Loading() {
+ return (
+
+
+ );
+}
diff --git a/src/app/dashboard/loading.tsx b/src/app/dashboard/loading.tsx
new file mode 100644
index 0000000..a94d7fa
--- /dev/null
+++ b/src/app/dashboard/loading.tsx
@@ -0,0 +1,23 @@
+import { Skeleton } from "~/components/ui/skeleton";
+
+export default function Loading() {
+ return (
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
new file mode 100644
index 0000000..a0dbd89
--- /dev/null
+++ b/src/app/dashboard/page.tsx
@@ -0,0 +1,53 @@
+import { redirect } from "next/navigation";
+import NoteCard from "~/components/NoteCard";
+import { auth } from "~/server/auth";
+import { api } from "~/trpc/server";
+
+export default async function Dashboard() {
+ const session = await auth();
+ if (!session) {
+ redirect("/api/auth/signin");
+ }
+
+ const notes = await api.note.getUserNotes();
+
+ return (
+
+
+ );
+}
diff --git a/src/app/notes/[id]/loading.tsx b/src/app/notes/[id]/loading.tsx
new file mode 100644
index 0000000..6eec05b
--- /dev/null
+++ b/src/app/notes/[id]/loading.tsx
@@ -0,0 +1,17 @@
+import { Skeleton } from "~/components/ui/skeleton";
+
+export default function NotePageSkeleton() {
+ return (
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/app/notes/[id]/page.tsx b/src/app/notes/[id]/page.tsx
new file mode 100644
index 0000000..6d08ad9
--- /dev/null
+++ b/src/app/notes/[id]/page.tsx
@@ -0,0 +1,64 @@
+import Image from "next/image";
+import { notFound, redirect } from "next/navigation";
+import { auth } from "~/server/auth";
+import { api } from "~/trpc/server";
+
+type paramsType = Promise<{ id: string }>;
+
+export default async function Note(props: { params: paramsType }) {
+ const { id } = await props.params;
+ const session = await auth();
+
+ if (!session) {
+ redirect("/api/auth/signin");
+ }
+
+ const note = await api.note.getNoteById({ id: id });
+ if (!note) {
+ notFound();
+ }
+
+ const isImage = note.fileType.startsWith("image/");
+
+ return (
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/components/DeleteNoteButton.tsx b/src/components/DeleteNoteButton.tsx
new file mode 100644
index 0000000..ea332ef
--- /dev/null
+++ b/src/components/DeleteNoteButton.tsx
@@ -0,0 +1,36 @@
+"use client";
+
+import { api } from "~/trpc/react";
+import { Button } from "./ui/button";
+import { Loader2 } from "lucide-react";
+import { toast } from "sonner";
+import { useRouter } from "next/navigation";
+
+export default function DeleteNoteButton({ id }: { id: string }) {
+ const router = useRouter();
+ const deleteNote = api.note.deleteNote.useMutation({
+ onSuccess: () => {
+ console.log("Note deleted")
+ router.refresh();
+ },
+ onError: (error) => {
+ toast.error("Something went wrong, try again");
+ console.error("Error deleting note:", error.data, error.message);
+ }
+ });
+
+ return (
+ <>
+ {deleteNote.isPending ? (
+
+ ) : (
+
+ )}
+
+ );
+}
diff --git a/src/components/NoteCard.tsx b/src/components/NoteCard.tsx
index 58d220d..05d897f 100644
--- a/src/components/NoteCard.tsx
+++ b/src/components/NoteCard.tsx
@@ -1,33 +1,50 @@
import Image from "next/image";
import Link from "next/link";
-import blurredNote from "../../public/blurredNote.png"
-//import { format } from "date-fns";
+import blurredNote from "../../public/blurredNote.png";
+import DeleteNoteButton from "./DeleteNoteButton";
type NoteCardProps = {
id: string;
title: string;
- createdAt: string;
+ createdAt: Date;
+ showDelete?: boolean;
+ fileType: string;
+ url: string;
};
-export default function NoteCard({ id, title, createdAt }: NoteCardProps) {
+export default function NoteCard({ id, title, createdAt, showDelete, fileType, url }: NoteCardProps) {
return (
-
- (null);
const [fileUrl, setFileUrl] = useState(undefined);
+ const [uploadLoading, setUploadLoading] = useState(false);
+ const router = useRouter();
+
+ const getSignedURL = api.note.getSignedURL.useMutation({
+ onSuccess: (result) => {
+ console.log(result.success);
+ },
+ onError: (error) => {
+ toast.error("Something went wrong");
+ console.error("Error uploading note:", error.message, error.data);
+ },
+ });
+
+ const computeSHA256 = async (file: File) => {
+ const buffer = await file.arrayBuffer();
+ const hashBuffer = await crypto.subtle.digest("SHA-256", buffer);
+ const hashArray = Array.from(new Uint8Array(hashBuffer));
+ const hashHex = hashArray
+ .map((b) => b.toString(16).padStart(2, "0"))
+ .join("");
+ return hashHex;
+ };
const dropZoneConfig = {
maxFiles: 1,
@@ -51,18 +76,38 @@ export default function UploadNoteForm({ courses }: { courses: Course[] }) {
resolver: zodResolver(formSchema),
});
- function onSubmit(values: z.infer) {
+ async function onSubmit(values: z.infer) {
+ setUploadLoading(true);
try {
- console.log(values.noteFile);
- console.log(values);
- toast(
-
)}
/>
-
)}
-
+ {uploadLoading ? (
+
+ ) : (
+
+ )}
);
diff --git a/src/components/ui/file-upload.tsx b/src/components/ui/file-upload.tsx
index 5e08a36..5636f1c 100644
--- a/src/components/ui/file-upload.tsx
+++ b/src/components/ui/file-upload.tsx
@@ -80,7 +80,8 @@ export const FileUploader = forwardRef<
const [activeIndex, setActiveIndex] = useState(-1);
const {
accept = {
- "image/*": [".jpg", ".jpeg", ".png", ".pdf"],
+ "image/*": [".jpg", ".jpeg", ".png",],
+ "application/pdf": [".pdf"],
},
maxFiles = 1,
maxSize = 4 * 1024 * 1024,
diff --git a/src/components/ui/header.tsx b/src/components/ui/header.tsx
index 8eebf9c..eb034d0 100644
--- a/src/components/ui/header.tsx
+++ b/src/components/ui/header.tsx
@@ -32,6 +32,11 @@ export const Header = async () => {
href: "/courses",
description: "",
},
+ {
+ title: "Upload",
+ href: "/upload",
+ description: "",
+ }
];
return (
@@ -58,9 +63,11 @@ export const Header = async () => {
{course.name}
+ {course.notes.length === 0 ? ( +
+
+ No notes have been uploaded for this course yet.
+
+ ) : (
+
+ {course.notes.map((note) => (
+
- Courses
+
+ {Array.from({ length: 6 }, (_, i)=> (
+
+
+
+ ))}
+
+
+
+
+ {"Don't see your course?"}
+ + Request a Course + +
+ {Array.from({ length: 6 }, (_, i)=> (
+
+
+
+ ))}
+
+
+
+
+ {`${session.user.name}'s Dashboard`}
+ {notes.length === 0 ? ( +
+
+
+ {"You haven't uploaded any notes yet."}
+
+
+ ) : (
+
+ {notes.map((note) => (
+
+ )}
+
+
+
+
+
+
+
+
);
-}
+}
\ No newline at end of file
diff --git a/src/components/UploadNoteForm.tsx b/src/components/UploadNoteForm.tsx
index 8570a94..f6ab32a 100644
--- a/src/components/UploadNoteForm.tsx
+++ b/src/components/UploadNoteForm.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-unsafe-argument */
"use client";
import { useState } from "react";
import { toast } from "sonner";
@@ -22,7 +23,7 @@ import {
SelectTrigger,
SelectValue,
} from "~/components/ui/select";
-import { CloudUpload, Paperclip } from "lucide-react";
+import { CloudUpload, Loader2, Paperclip } from "lucide-react";
import {
FileInput,
FileUploader,
@@ -31,6 +32,8 @@ import {
} from "~/components/ui/file-upload";
import type { Course } from "@prisma/client";
+import { api } from "~/trpc/react";
+import { useRouter } from "next/navigation";
const formSchema = z.object({
noteTitle: z.string().min(1).min(5),
@@ -41,6 +44,28 @@ const formSchema = z.object({
export default function UploadNoteForm({ courses }: { courses: Course[] }) {
const [files, setFiles] = useState
+
+
+ {showDelete && (
+
-
+ )}
+
-
{title}
-{"May 4, 2025, MMM d, yyyy"}
- {/*{format(new Date(createdAt), "MMM d, yyyy")}
*/} +{createdAt.toLocaleDateString()}
+
+
-
- {JSON.stringify(values, null, 2)}
- ,
- );
+ const checksum = await computeSHA256(values.noteFile);
+ const result = await getSignedURL.mutateAsync({
+ type: values.noteFile.type,
+ size: values.noteFile.size,
+ checksum: checksum,
+ title: values.noteTitle,
+ courseId: values.noteCourse,
+ });
+
+ if (result.failure !== undefined) {
+ throw new Error(result.failure);
+ }
+
+ const {url, note} = result.success;
+
+ await fetch(url, {
+ method: "PUT",
+ body: values.noteFile,
+ headers: {
+ "Content-type": values.noteFile.type,
+ },
+ });
+
+ router.push(`/notes/${note.id}`)
} catch (error) {
console.error("Form submission error", error);
toast.error("Failed to submit the form. Please try again.");
+ } finally {
+ setUploadLoading(false);
}
}
@@ -86,7 +131,6 @@ export default function UploadNoteForm({ courses }: { courses: Course[] }) {
)}
/>
-
- ![{files[0].name}]({fileUrl})
+ {files[0].type === "application/pdf" ? (
+
+ ) : (
+
+ )}
Public Notes
-
+
+
+
{session ? (
diff --git a/src/components/ui/skeleton.tsx b/src/components/ui/skeleton.tsx
new file mode 100644
index 0000000..1e29d7a
--- /dev/null
+++ b/src/components/ui/skeleton.tsx
@@ -0,0 +1,13 @@
+import { cn } from "~/lib/utils"
+
+function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
+ return (
+
+ )
+}
+
+export { Skeleton }
diff --git a/src/server/api/root.ts b/src/server/api/root.ts
index e8dd98d..73256b5 100644
--- a/src/server/api/root.ts
+++ b/src/server/api/root.ts
@@ -2,6 +2,7 @@ import { postRouter } from "~/server/api/routers/post";
import { createCallerFactory, createTRPCRouter } from "~/server/api/trpc";
import { courseRouter } from "./routers/course";
import { adminRouter } from "./routers/admin";
+import { noteRouter } from "./routers/note";
/**
* This is the primary router for your server.
@@ -12,6 +13,7 @@ export const appRouter = createTRPCRouter({
post: postRouter,
course: courseRouter,
admin: adminRouter,
+ note: noteRouter,
});
// export type definition of API
diff --git a/src/server/api/routers/note.ts b/src/server/api/routers/note.ts
new file mode 100644
index 0000000..e49e542
--- /dev/null
+++ b/src/server/api/routers/note.ts
@@ -0,0 +1,149 @@
+import { z } from "zod";
+import { createTRPCRouter, protectedProcedure } from "~/server/api/trpc";
+
+import { S3Client, PutObjectCommand, DeleteObjectCommand } from "@aws-sdk/client-s3";
+import { getSignedUrl } from "@aws-sdk/s3-request-presigner";
+import crypto from "crypto";
+
+const generateFileName = (bytes = 32) => crypto.randomBytes(bytes).toString("hex");
+
+const s3 = new S3Client({
+ region: process.env.AWS_BUCKET_REGION!,
+ credentials: {
+ accessKeyId: process.env.AWS_BUCKET_ACCESS_KEY!,
+ secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY!,
+ },
+})
+
+const acceptedTypes = ["image/jpeg", "image/jpg", "application/pdf", "image/png"]
+const maxFileSize = 1024 * 1024 * 4;
+
+export const noteRouter = createTRPCRouter({
+ getSignedURL: protectedProcedure
+ .input(z.object({
+ type: z.string(),
+ size: z.number(),
+ checksum: z.string(),
+ title: z.string(),
+ courseId: z.string(),
+ }))
+ .mutation(async ({ ctx, input }) => {
+ if(!acceptedTypes.includes(input.type)) {
+ return {failure: "Invalid file type"}
+ }
+
+ if(input.size > maxFileSize) {
+ return {failure: "File too large"}
+ }
+
+ // all this gets embedded into the url
+ const putObjectCommand = new PutObjectCommand({
+ Bucket: process.env.AWS_BUCKET_NAME!,
+ Key: generateFileName(),
+ ContentType: input.type,
+ ContentLength: input.size,
+ ChecksumSHA256: input.checksum,
+ Metadata: {
+ userId: ctx.session.user.id,
+ },
+ })
+
+ const signedUrl = await getSignedUrl(s3, putObjectCommand, {
+ expiresIn: 60,
+ });
+
+ const url = signedUrl.split("?")[0]
+ if(!url) {
+ throw new Error("Failed to generate signed url");
+ }
+
+ const note = await ctx.db.note.create({
+ data: {
+ Title: input.title,
+ url: url,
+ fileType: input.type,
+ createdById: ctx.session.user.id,
+ courseId: input.courseId,
+ },
+ select: {id: true,}
+ })
+
+ return {success: {url: signedUrl, note: note }}
+
+ }),
+
+ getNotesByCourse: protectedProcedure
+ .input(z.object({code: z.string()}))
+ .query(async ({ctx, input}) => {
+ const notes = await ctx.db.course.findUnique({
+ where: {
+ code: input.code,
+ },
+ select: {
+ name: true,
+ notes: {
+ select: {
+ Title: true,
+ createdAt: true,
+ id: true,
+ fileType: true,
+ url: true,
+ },
+ }
+ },
+ })
+
+ return notes;
+ }),
+
+ getNoteById: protectedProcedure
+ .input(z.object({id: z.string()}))
+ .query(async ({ctx, input}) => {
+ const note = await ctx.db.note.findUnique({
+ where: {id: input.id},
+ })
+
+ return note;
+ }),
+
+ getUserNotes: protectedProcedure
+ .query(async ({ctx}) => {
+ const notes = await ctx.db.note.findMany({
+ where: {
+ createdById: ctx.session.user.id,
+ },
+ orderBy: {
+ createdAt: "desc",
+ }
+ })
+
+ return notes;
+ }),
+
+ deleteNote: protectedProcedure
+ .input(z.object({noteId: z.string()}))
+ .mutation(async ({ctx, input}) => {
+ const note = await ctx.db.note.findUnique({
+ where: {
+ id: input.noteId,
+ createdById: ctx.session.user.id,
+ }
+ })
+
+ if(!note) {
+ return {failure: "Note not found"}
+ }
+
+ const deletedNote = await ctx.db.note.delete({
+ where: {id: input.noteId}
+ })
+
+ const deleteObjectCommand = new DeleteObjectCommand({
+ Bucket: process.env.AWS_BUCKET_NAME!,
+ Key: deletedNote.url.split("/").pop()!,
+ })
+
+ await s3.send(deleteObjectCommand);
+ })
+
+});
\ No newline at end of file