Winners tag

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

@@ -1,10 +1,15 @@
 import { Address } from "~~/components/scaffold-eth";
-import { Submission } from "~~/services/database/repositories/submissions";
+import { SubmissionWithWinnerTag } from "~~/services/database/repositories/submissions";
 
-export const SubmissionCard = ({ submission }: { submission: Submission }) => {
+export const SubmissionCard = ({ submission }: { submission: SubmissionWithWinnerTag }) => {
   return (
     <div key={submission.id} className="card bg-base-200 text-secondary-content border border-gray-300 rounded-none">
       <div className="card-body p-4 pt-6">
+        {submission.winnerTag && (
+          <div className={`badge p-4 ${submission.winnerTag === "Winner" ? "badge-success" : "badge-warning"}`}>
+            {submission.winnerTag}
+          </div>
+        )}
         <h2 className="card-title mb-3 xl:text-2xl">{submission.title}</h2>
         <div className="flex flex-wrap justify-between items-center gap-4">
           <div className="mt-1 flex shrink-0 gap-3">

packages/nextjs/app/submissions/page.tsx

@@ -1,6 +1,7 @@
 import { SubmissionCard } from "./_components/SubmissionCard";
 import type { NextPage } from "next";
-import { getAllSubmissions } from "~~/services/database/repositories/submissions";
+import scaffoldConfig from "~~/scaffold.config";
+import { SubmissionWithWinnerTag, getAllSubmissions } from "~~/services/database/repositories/submissions";
 import { getMetadata } from "~~/utils/scaffold-eth/getMetadata";
 
 export const metadata = getMetadata({
@@ -10,16 +11,30 @@ export const metadata = getMetadata({
 
 const Submissions: NextPage = async () => {
   const submissions = await getAllSubmissions();
+  const { winnersThreshold, runnersUpThreshold } = scaffoldConfig;
+
+  const submissionsWithAvgScore: SubmissionWithWinnerTag[] = submissions
+    .map(submission => {
+      const avgScore =
+        submission.votes.length > 0
+          ? submission.votes.map(vote => vote.score).reduce((a, b) => a + b, 0) / submission.votes.length
+          : 0;
+
+      const winnerTag = avgScore >= winnersThreshold ? "Winner" : avgScore >= runnersUpThreshold ? "Runner Up" : null;
+
+      return { ...submission, avgScore, winnerTag };
+    })
+    .sort((a, b) => b.avgScore - a.avgScore);
 
   return (
     <div className="max-w-7xl container mx-auto px-6">
-      <div className="grid gap-6 md:grid-cols-2 xl:grid-cols-3">
+      <div className="grid gap-6 md:grid-cols-2 xl:grid-cols-3 mt-6">
         {submissions.length === 0 && (
           <div role="alert" className="alert col-span-2">
             <span>No submissions yet.</span>
           </div>
         )}
-        {submissions.map(submission => {
+        {submissionsWithAvgScore.map((submission: SubmissionWithWinnerTag) => {
           return <SubmissionCard key={submission.id} submission={submission} />;
         })}
       </div>

packages/nextjs/scaffold.config.ts

@@ -7,6 +7,8 @@ export type ScaffoldConfig = {
   walletConnectProjectId: string;
   onlyLocalBurnerWallet: boolean;
   votingEnabled: boolean;
+  winnersThreshold: number;
+  runnersUpThreshold: number;
 };
 
 const scaffoldConfig = {
@@ -34,6 +36,10 @@ const scaffoldConfig = {
 
   // Enable voting on submissions
   votingEnabled: false,
+
+  // Score threshold for winners and runners up
+  winnersThreshold: 7,
+  runnersUpThreshold: 6,
 } as const satisfies ScaffoldConfig;
 
 export default scaffoldConfig;

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

@@ -9,6 +9,9 @@ export type Submission = InferSelectModel<typeof submissions> & { comments: Comm
 export type SubmissionWithAvg = Submission & {
   avgScore: number;
 };
+export type SubmissionWithWinnerTag = Submission & {
+  winnerTag: string | null;
+};
 
 export async function getAllSubmissions() {
   return await db.query.submissions.findMany({