From c4db8149d4efa4bc81323fac452d9fc0e02e5723 Mon Sep 17 00:00:00 2001
From: Jacob Sommer <js0mmer@users.noreply.github.com>
Date: Wed, 18 Dec 2024 10:01:05 -0800
Subject: [PATCH] refactor: use review slice on verify reviews page (#542)

fix: vote color updates on verify reviews page
---
 site/src/component/Verify/Verify.tsx | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/site/src/component/Verify/Verify.tsx b/site/src/component/Verify/Verify.tsx
index 7a25ba46..ae6ed455 100644
--- a/site/src/component/Verify/Verify.tsx
+++ b/site/src/component/Verify/Verify.tsx
@@ -1,34 +1,36 @@
-import { FC, useEffect, useState } from 'react';
+import { FC, useCallback, useEffect, useState } from 'react';
 import SubReview from '../../component/Review/SubReview';
 import Button from 'react-bootstrap/Button';
 import { Divider } from 'semantic-ui-react';
 import './Verify.scss';
 import trpc from '../../trpc';
-import { ReviewData } from '@peterportal/types';
+import { selectReviews, setReviews } from '../../store/slices/reviewSlice';
+import { useAppDispatch, useAppSelector } from '../../store/hooks';
 
 const Verify: FC = () => {
-  const [reviews, setReviews] = useState<ReviewData[]>([]);
+  const reviews = useAppSelector(selectReviews);
   const [loaded, setLoaded] = useState<boolean>(false);
+  const dispatch = useAppDispatch();
 
-  const getUnverifiedReviews = async () => {
+  const getUnverifiedReviews = useCallback(async () => {
     const res = await trpc.reviews.get.query({ verified: false });
-    setReviews(res);
+    dispatch(setReviews(res));
     setLoaded(true);
-  };
+  }, [dispatch]);
 
   useEffect(() => {
     getUnverifiedReviews();
     document.title = 'Verify Reviews | PeterPortal';
-  }, []);
+  }, [getUnverifiedReviews]);
 
   const verifyReview = async (reviewId: number) => {
     await trpc.reviews.verify.mutate({ id: reviewId });
-    setReviews(reviews.filter((review) => review.id !== reviewId));
+    dispatch(setReviews(reviews.filter((review) => review.id !== reviewId)));
   };
 
   const deleteReview = async (reviewId: number) => {
     await trpc.reviews.delete.mutate({ id: reviewId });
-    setReviews(reviews.filter((review) => review.id !== reviewId));
+    dispatch(setReviews(reviews.filter((review) => review.id !== reviewId)));
   };
 
   if (!loaded) {