From 632439dad486b14f206bcb91dc119eaabe246b48 Mon Sep 17 00:00:00 2001
From: Su Yin <53945359+tnsyn@users.noreply.github.com>
Date: Sun, 9 Oct 2022 16:45:16 +0800
Subject: [PATCH] [resumes][refactor] Filter comments on FE (#336)

* [resumes][fix] Fix fetch id

* [resumes][refactor] Change to filtering on FE for comments

* [resumes][fix] Fix lint errors
---
 .../resumes/comments/CommentsList.tsx         | 25 +++++++++----------
 .../resumes-resume-protected-tabs-router.ts   |  2 +-
 .../server/router/resumes-reviews-router.ts   |  5 +---
 3 files changed, 14 insertions(+), 18 deletions(-)

diff --git a/apps/portal/src/components/resumes/comments/CommentsList.tsx b/apps/portal/src/components/resumes/comments/CommentsList.tsx
index 54843bca..7e15e4d8 100644
--- a/apps/portal/src/components/resumes/comments/CommentsList.tsx
+++ b/apps/portal/src/components/resumes/comments/CommentsList.tsx
@@ -21,10 +21,7 @@ export default function CommentsList({
   const { data: session } = useSession();
 
   // Fetch the most updated comments to render
-  const commentsQuery = trpc.useQuery([
-    'resumes.reviews.list',
-    { resumeId, section: tab },
-  ]);
+  const commentsQuery = trpc.useQuery(['resumes.reviews.list', { resumeId }]);
 
   // TODO: Add loading prompt
 
@@ -39,15 +36,17 @@ export default function CommentsList({
       />
 
       <div className="m-2 flow-root h-[calc(100vh-20rem)] w-full flex-col space-y-3 overflow-y-scroll">
-        {commentsQuery.data?.map((comment) => {
-          return (
-            <Comment
-              key={comment.id}
-              comment={comment}
-              userId={session?.user?.id}
-            />
-          );
-        })}
+        {commentsQuery.data
+          ?.filter((c) => c.section === tab)
+          .map((comment) => {
+            return (
+              <Comment
+                key={comment.id}
+                comment={comment}
+                userId={session?.user?.id}
+              />
+            );
+          })}
       </div>
     </div>
   );
diff --git a/apps/portal/src/server/router/resumes-resume-protected-tabs-router.ts b/apps/portal/src/server/router/resumes-resume-protected-tabs-router.ts
index 0f5ebaa9..663c0f80 100644
--- a/apps/portal/src/server/router/resumes-resume-protected-tabs-router.ts
+++ b/apps/portal/src/server/router/resumes-resume-protected-tabs-router.ts
@@ -36,7 +36,7 @@ export const resumesResumeProtectedTabsRouter = createProtectedRouter()
           additionalInfo: rs.resume.additionalInfo,
           createdAt: rs.resume.createdAt,
           experience: rs.resume.experience,
-          id: rs.id,
+          id: rs.resume.id,
           location: rs.resume.location,
           numComments: rs.resume._count.comments,
           numStars: rs.resume._count.stars,
diff --git a/apps/portal/src/server/router/resumes-reviews-router.ts b/apps/portal/src/server/router/resumes-reviews-router.ts
index 8219edce..f908717e 100644
--- a/apps/portal/src/server/router/resumes-reviews-router.ts
+++ b/apps/portal/src/server/router/resumes-reviews-router.ts
@@ -1,5 +1,4 @@
 import { z } from 'zod';
-import { ResumesSection } from '@prisma/client';
 
 import { createRouter } from './context';
 
@@ -8,11 +7,10 @@ import type { ResumeComment } from '~/types/resume-comments';
 export const resumeReviewsRouter = createRouter().query('list', {
   input: z.object({
     resumeId: z.string(),
-    section: z.nativeEnum(ResumesSection),
   }),
   async resolve({ ctx, input }) {
     const userId = ctx.session?.user?.id;
-    const { resumeId, section } = input;
+    const { resumeId } = input;
 
     // For this resume, we retrieve every comment's information, along with:
     // The user's name and image to render
@@ -42,7 +40,6 @@ export const resumeReviewsRouter = createRouter().query('list', {
       },
       where: {
         resumeId,
-        section,
       },
     });