Fix/Feat: comment counters, actions based on role, pinned comment

prisma/schema.prisma

@@ -173,6 +173,7 @@ model Comment {
   createdAt    DateTime    @default(now())
   updatedAt    DateTime    @updatedAt
   votes        Vote[]
+  isPinned     Boolean     @default(false)
 }
 
 model Vote {
@@ -196,3 +197,4 @@ enum CommentType {
   INTRO
   DEFAULT
 }
+

src/actions/comment/index.ts

@@ -4,10 +4,12 @@ import {
   InputTypeApproveIntroComment,
   InputTypeCreateComment,
   InputTypeDeleteComment,
+  InputTypePinComment,
   InputTypeUpdateComment,
   ReturnTypeApproveIntroComment,
   ReturnTypeCreateComment,
   ReturnTypeDeleteComment,
+  ReturnTypePinComment,
   ReturnTypeUpdateComment,
 } from './types';
 import { authOptions } from '@/lib/auth';
@@ -17,11 +19,13 @@ import {
   CommentApproveIntroSchema,
   CommentDeleteSchema,
   CommentInsertSchema,
+  CommentPinSchema,
   CommentUpdateSchema,
 } from './schema';
 import { createSafeAction } from '@/lib/create-safe-action';
 import { CommentType, Prisma } from '@prisma/client';
 import { revalidatePath } from 'next/cache';
+import { ROLES } from '../types';
 
 export const getComments = async (
   q: Prisma.CommentFindManyArgs,
@@ -39,11 +43,30 @@ export const getComments = async (
   if (!parentComment) {
     delete q.where?.parentId;
   }
+  const pinnedComment = await prisma.comment.findFirst({
+    where: {
+      contentId: q.where?.contentId,
+      isPinned: true,
+      ...(parentId ? { parentId: parseInt(parentId.toString(), 10) } : {}),
+    },
+    include: q.include,
+  });
+  if (pinnedComment) {
+    q.where = {
+      ...q.where,
+      NOT: {
+        id: pinnedComment.id,
+      },
+    };
+  }
 
   const comments = await prisma.comment.findMany(q);
+  const combinedComments = pinnedComment
+    ? [pinnedComment, ...comments]
+    : comments;
 
   return {
-    comments,
+    comments: combinedComments,
     parentComment,
   };
 };
@@ -268,10 +291,15 @@ const updateCommentHandler = async (
 const approveIntroCommentHandler = async (
   data: InputTypeApproveIntroComment,
 ): Promise<ReturnTypeApproveIntroComment> => {
-  const { content_comment_ids, approved, adminPassword } = data;
+  const session = await getServerSession(authOptions);
+  const { content_comment_ids, approved, adminPassword, currentPath } = data;
 
-  if (adminPassword !== process.env.ADMIN_SECRET) {
-    return { error: 'Unauthorized' };
+  if (adminPassword) {
+    if (adminPassword !== process.env.ADMIN_SECRET) {
+      return { error: 'Unauthorized' };
+    }
+  } else if (!session || !session.user || session.user.role !== ROLES.ADMIN) {
+    return { error: 'Unauthorized ' };
   }
 
   const [contentId, commentId] = content_comment_ids.split(';');
@@ -315,7 +343,9 @@ const approveIntroCommentHandler = async (
         },
       });
     });
-
+    if (currentPath) {
+      revalidatePath(currentPath);
+    }
     return { data: updatedComment! };
   } catch (error) {
     return { error: 'Failed to update comment.' };
@@ -331,21 +361,24 @@ const deleteCommentHandler = async (
     return { error: 'Unauthorized or insufficient permissions' };
   }
 
-  const { commentId, adminPassword } = data;
+  const { commentId } = data;
   const userId = session.user.id;
 
   try {
     const existingComment = await prisma.comment.findUnique({
       where: { id: commentId },
+      include: {
+        parent: true,
+      },
     });
 
     if (!existingComment) {
       return { error: 'Comment not found.' };
     }
 
     if (
-      existingComment.userId !== userId &&
-      adminPassword !== process.env.ADMIN_SECRET
+      session.user?.role !== ROLES.ADMIN ||
+      existingComment.userId !== userId
     ) {
       return { error: 'Unauthorized to delete this comment.' };
     }
@@ -365,6 +398,15 @@ const deleteCommentHandler = async (
         await prisma.comment.deleteMany({
           where: { parentId: commentId },
         });
+        await prisma.content.update({
+          where: { id: existingComment.contentId },
+          data: { commentsCount: { decrement: 1 } },
+        });
+      } else {
+        await prisma.comment.update({
+          where: { id: existingComment.parentId },
+          data: { repliesCount: { decrement: 1 } },
+        });
       }
 
       // Then delete the comment itself
@@ -383,6 +425,38 @@ const deleteCommentHandler = async (
   }
 };
 
+const pinCommentHandler = async (
+  data: InputTypePinComment,
+): Promise<ReturnTypePinComment> => {
+  const { commentId, contentId, currentPath } = data;
+  const session = await getServerSession(authOptions);
+
+  if (!session || !session.user || session.user.role !== ROLES.ADMIN) {
+    return { error: 'Unauthorized or insufficient permissions' };
+  }
+  let updatedComment;
+  try {
+    await prisma.$transaction(async (prisma) => {
+      // Unpin any currently pinned comment for the content
+      await prisma.comment.updateMany({
+        where: { contentId, isPinned: true },
+        data: { isPinned: false },
+      });
+
+      updatedComment = await prisma.comment.update({
+        where: { id: commentId },
+        data: { isPinned: true },
+      });
+    });
+    if (currentPath) {
+      revalidatePath(currentPath);
+    }
+    return { data: updatedComment };
+  } catch (error: any) {
+    return { error: error.message || 'Failed to pin comment.' };
+  }
+};
+
 export const createMessage = createSafeAction(
   CommentInsertSchema,
   createCommentHandler,
@@ -399,3 +473,4 @@ export const approveComment = createSafeAction(
   CommentApproveIntroSchema,
   approveIntroCommentHandler,
 );
+export const pinComment = createSafeAction(CommentPinSchema, pinCommentHandler);

src/actions/comment/schema.ts

@@ -20,9 +20,15 @@ export const CommentApproveIntroSchema = z.object({
   content_comment_ids: z.string(),
   approved: z.boolean().optional(),
   adminPassword: z.string().optional(),
+  currentPath: z.string().optional(),
 });
 export const CommentDeleteSchema = z.object({
   adminPassword: z.string().optional(),
   commentId: z.number(),
   currentPath: z.string().optional(),
 });
+export const CommentPinSchema = z.object({
+  commentId: z.number(),
+  contentId: z.number(),
+  currentPath: z.string().optional(),
+});

src/actions/comment/types.ts

@@ -5,9 +5,10 @@ import {
   CommentUpdateSchema,
   CommentDeleteSchema,
   CommentApproveIntroSchema,
+  CommentPinSchema,
 } from './schema';
 import { Delete } from '../types';
-import { User, Comment } from '@prisma/client';
+import { User, Comment, Vote } from '@prisma/client';
 
 export type InputTypeCreateComment = z.infer<typeof CommentInsertSchema>;
 export type ReturnTypeCreateComment = ActionState<
@@ -33,7 +34,10 @@ export type ReturnTypeDeleteComment = ActionState<
   InputTypeDeleteComment,
   Delete
 >;
+export type InputTypePinComment = z.infer<typeof CommentPinSchema>;
+export type ReturnTypePinComment = ActionState<InputTypePinComment, Comment>;
 
 export interface ExtendedComment extends Comment {
-  user: User;
+  user?: User;
+  votes?: Vote[];
 }

src/actions/types.ts

@@ -21,3 +21,8 @@ export enum CommentFilter {
 export type Delete = {
   message: string;
 };
+
+export enum ROLES {
+  ADMIN = 'admin',
+  USER = 'user',
+}

src/app/admin/page.tsx

@@ -27,7 +27,6 @@ export default function Courses() {
   const { register, handleSubmit } = useForm<FormInput>();
 
   const onSubmit: SubmitHandler<FormInput> = async (data) => {
-    console.log(data);
     await fetch('/api/admin/course', {
       body: JSON.stringify(data),
       method: 'POST',

src/app/courses/[...courseId]/page.tsx

@@ -16,6 +16,7 @@ import { QueryParams } from '@/actions/types';
 
 const checkAccess = async (courseId: string) => {
   const session = await getServerSession(authOptions);
+
   if (!session?.user) {
     return false;
   }

src/components/Copy-to-clipbord.tsx

@@ -21,7 +21,9 @@ const CopyToClipboard = ({
   return (
     <div>
       <button onClick={handleCopyClick}>
-        <CopyIcon size={15} />
+        <div className="flex items-center gap-1">
+          Copy <CopyIcon size={15} />
+        </div>
       </button>
     </div>
   );

src/components/comment/CommentApproveForm.tsx

@@ -0,0 +1,47 @@
+'use client';
+
+import { approveComment } from '@/actions/comment';
+import { useAction } from '@/hooks/useAction';
+import { CheckIcon } from 'lucide-react';
+import { usePathname } from 'next/navigation';
+import React from 'react';
+import { toast } from 'sonner';
+
+const CommentApproveForm = ({
+  commentId,
+  contentId,
+}: {
+  commentId: number;
+  contentId: number;
+}) => {
+  const currentPath = usePathname();
+
+  const { execute } = useAction(approveComment, {
+    onSuccess: () => {
+      toast('Comment Approved');
+    },
+    onError: (error) => {
+      toast.error(error);
+    },
+  });
+  const handleFormSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+
+    execute({
+      content_comment_ids: `${contentId};${commentId}`,
+      approved: true,
+      currentPath,
+    });
+  };
+  return (
+    <form onSubmit={handleFormSubmit}>
+      <button type="submit">
+        <div className="flex gap-1 items-center">
+          Approve Chapters <CheckIcon className="w-4 h-4" />
+        </div>
+      </button>
+    </form>
+  );
+};
+
+export default CommentApproveForm;

src/components/comment/CommentDeleteForm.tsx

@@ -29,7 +29,9 @@ const CommentDeleteForm = ({ commentId }: { commentId: number }) => {
   return (
     <form onSubmit={handleFormSubmit}>
       <button type="submit">
-        <Trash2Icon className="w-4 h-4" />
+        <div className="flex gap-1 items-center">
+          Delete <Trash2Icon className="w-4 h-4" />
+        </div>
       </button>
     </form>
   );

src/components/comment/CommentPinForm.tsx

@@ -0,0 +1,47 @@
+'use client';
+
+import { pinComment } from '@/actions/comment';
+import { useAction } from '@/hooks/useAction';
+import { PinIcon } from 'lucide-react';
+import { usePathname } from 'next/navigation';
+import React from 'react';
+import { toast } from 'sonner';
+
+const CommentPinForm = ({
+  commentId,
+  contentId,
+}: {
+  commentId: number;
+  contentId: number;
+}) => {
+  const currentPath = usePathname();
+
+  const { execute } = useAction(pinComment, {
+    onSuccess: () => {
+      toast('Comment Pinned');
+    },
+    onError: (error) => {
+      toast.error(error);
+    },
+  });
+  const handleFormSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+
+    execute({
+      commentId,
+      contentId,
+      currentPath,
+    });
+  };
+  return (
+    <form onSubmit={handleFormSubmit}>
+      <button type="submit">
+        <div className="flex gap-1 items-center">
+          Pin <PinIcon className="w-4 h-4" />
+        </div>
+      </button>
+    </form>
+  );
+};
+
+export default CommentPinForm;