Sort voted submissions by avg score desc

packages/nextjs/app/admin/_components/SubmissionCard.tsx

@@ -8,11 +8,11 @@ import { useMutation } from "@tanstack/react-query";
 import clsx from "clsx";
 import { useAccount } from "wagmi";
 import { Address } from "~~/components/scaffold-eth";
-import { Submission } from "~~/services/database/repositories/submissions";
+import { SubmissionWithAvg } from "~~/services/database/repositories/submissions";
 import { postMutationFetcher } from "~~/utils/react-query";
 import { notification } from "~~/utils/scaffold-eth";
 
-export const SubmissionCard = ({ submission }: { submission: Submission }) => {
+export const SubmissionCard = ({ submission }: { submission: SubmissionWithAvg }) => {
   const { address: connectedAddress } = useAccount();
 
   const { mutateAsync: postNewVote, isPending: isVotePending } = useMutation({
@@ -41,10 +41,8 @@ export const SubmissionCard = ({ submission }: { submission: Submission }) => {
     }
   };
 
-  const scoreAvg =
-    submission.votes.length > 0
-      ? (submission.votes.map(vote => vote.score).reduce((a, b) => a + b, 0) / submission.votes.length).toFixed(2)
-      : "-";
+  const scoreAvg = submission.avgScore === 0 ? "-" : submission.avgScore.toFixed(2);
+
   const currentVote = submission.votes.find(vote => vote.builder === connectedAddress);
   const score = currentVote ? currentVote.score : 0;
 

packages/nextjs/app/admin/_components/SubmissionTabs.tsx

@@ -2,7 +2,7 @@
 
 import { SubmissionCard } from "./SubmissionCard";
 import { useAccount } from "wagmi";
-import { Submission } from "~~/services/database/repositories/submissions";
+import { Submission, SubmissionWithAvg } from "~~/services/database/repositories/submissions";
 
 const skeletonClasses = "animate-pulse bg-gray-200 rounded-none w-full h-96";
 
@@ -14,17 +14,24 @@ export const SubmissionTabs = ({ submissions }: { submissions: Submission[] }) =
       // Connected address has voted
       const currentVote = submission.votes.find(vote => vote.builder === connectedAddress);
 
+      const avgScore =
+        submission.votes.length > 0
+          ? submission.votes.map(vote => vote.score).reduce((a, b) => a + b, 0) / submission.votes.length
+          : 0;
+
+      const submissionWithAvg = { ...submission, avgScore };
+
       if (currentVote) {
-        acc.voted.push(submission);
+        acc.voted.push(submissionWithAvg);
       } else {
-        acc.notVoted.push(submission);
+        acc.notVoted.push(submissionWithAvg);
       }
 
       return acc;
     },
     {
-      voted: [] as Submission[],
-      notVoted: [] as Submission[],
+      voted: [] as SubmissionWithAvg[],
+      notVoted: [] as SubmissionWithAvg[],
     },
   );
 
@@ -77,9 +84,11 @@ export const SubmissionTabs = ({ submissions }: { submissions: Submission[] }) =
                 <span>You have not voted on any submissions yet.</span>
               </div>
             )}
-            {voted.map(submission => {
-              return <SubmissionCard key={submission.id} submission={submission} />;
-            })}
+            {voted
+              .sort((a, b) => b.avgScore - a.avgScore)
+              .map(submission => {
+                return <SubmissionCard key={submission.id} submission={submission} />;
+              })}
           </div>
         </div>
       </div>

packages/nextjs/services/database/repositories/submissions.ts

@@ -6,6 +6,9 @@ export type SubmissionInsert = InferInsertModel<typeof submissions>;
 type Comment = InferInsertModel<typeof comments>;
 type Vote = InferInsertModel<typeof votes>;
 export type Submission = InferSelectModel<typeof submissions> & { comments: Comment[]; votes: Vote[] };
+export type SubmissionWithAvg = Submission & {
+  avgScore: number;
+};
 
 export async function getAllSubmissions() {
   return await db.query.submissions.findMany({