added results page

app/results/[id]/page.tsx

@@ -3,6 +3,11 @@ import {Chart} from "@components/custom/chart";
 
 import Prisma from '@lib/prisma'
 
+interface data {
+    name: string
+    total: number
+}
+
 export default async function Page({ params }: { params: { id: string } }) {
     const grades = await Prisma.grade.findMany({
         where: {
@@ -10,12 +15,27 @@ export default async function Page({ params }: { params: { id: string } }) {
         }
     })
 
+    const allGrades = ['1', '1.5', '2', '2.5', '3', '3.5', '4', '4.5', '5', '5.5', '6']
+    let gradeOccurences = new Array(allGrades.length).fill(0)
+    const gradeList = grades.map((grade) => grade.grade)
+
+    for (let i = 0; i < gradeList.length; i++) {
+        gradeOccurences[allGrades.indexOf(gradeList[i].toString())]++
+    }
+
+    let data: data[] = []
+    for (let i = 0; i < gradeOccurences.length; i++) {
+        data.push({
+            name: allGrades[i],
+            total: gradeOccurences[i]
+        })
+    }
+
     for (let grade in grades) {
         console.log(grade);
     }
 
     return <div>
-        My Post: {params.id}
+        <Chart data={data}/>
-        <Chart />
     </div>
 }

components/custom/chart.tsx

@@ -25,7 +25,8 @@ export function Chart({...props}: ChartProps) {
                     fontSize={12}
                     tickLine={false}
                     axisLine={false}
-                    tickFormatter={(value) => `$${value}`}
+                    allowDecimals={false}
+                    tickFormatter={(value) => `${value}`}
                 />
                 <Bar dataKey="total" fill="#80a256" radius={[4, 4, 0, 0]} />
             </BarChart>

components/custom/dayCard.tsx

@@ -37,7 +37,7 @@ export function DayCard({ className, ...props }: DayCardProps) {
     }
 
     return (
-        <Card className={cn(`w-full ${props.enabled && props.oral ? "hover:bg-slate-100" : null}`, className)} {...props} onClick={() => {route(props.enabled || false, props.day)}}>
+        <Card className={cn(`w-full ${props.enabled && props.oral ? "hover:bg-slate-100 hover:cursor-pointer" : "hover:cursor-not-allowed"}`, className)} {...props} onClick={() => {route(props.enabled || false, props.day)}}>
             <CardContent className="p-4 gap-4 h-full">
                 {props.enabled ?
                 <div className="rounded-md p-4 h-full flex flex-col items-end">