From 2257fcb5d2d4fd767486120d3abae1427d910129 Mon Sep 17 00:00:00 2001
From: trueberryless <trueberryless+github@gmail.com>
Date: Fri, 5 Jul 2024 23:45:49 +0200
Subject: [PATCH] begin project

version-patch
---
 src/pages/project/[id].tsx      | 28 ++++++++++++----
 src/pages/project/[id]/edit.tsx |  5 ++-
 src/utils/projectUtils.ts       | 59 +++++++++++++++++++++++++++++++++
 3 files changed, 85 insertions(+), 7 deletions(-)
 create mode 100644 src/utils/projectUtils.ts

diff --git a/src/pages/project/[id].tsx b/src/pages/project/[id].tsx
index 8eed267..6910979 100644
--- a/src/pages/project/[id].tsx
+++ b/src/pages/project/[id].tsx
@@ -39,6 +39,7 @@ import {
 } from "@/components/ui/table";
 import StatusIconLabel from "@/components/projects/status";
 import PriorityIconLabel from "@/components/projects/priority";
+import { calcPriorityComparison, calcStatusComparison } from "@/utils/projectUtils";
 
 export default function Project() {
     const { user, setUser } = useUser();
@@ -47,6 +48,10 @@ export default function Project() {
 
     const project = user?.projects.find((project) => project.id === router.query.id);
 
+    if (!project) {
+        return <div>Project not found</div>;
+    }
+
     return (
         <div className="flex w-full flex-col">
             <main className="flex min-h-[calc(100vh-_theme(spacing.16))] flex-1 flex-col gap-4 bg-muted/40 p-4 md:gap-8 md:p-10">
@@ -63,6 +68,9 @@ export default function Project() {
                     <Badge variant="outline" className="ml-auto sm:ml-0 py-2">
                         <PriorityIconLabel priorityValue={project.priority} />
                     </Badge>
+                    <Badge variant="outline" className="hidden ml-auto sm:ml-0 py-2 sm:block">
+                        <StatusIconLabel statusValue={project.status} />
+                    </Badge>
                     <div className="flex items-center gap-2 ml-auto">
                         <Link href={`/project/${project.id}/edit`}>
                             <Button size="sm">Edit Project</Button>
@@ -92,22 +100,30 @@ export default function Project() {
                     </Card>
                     <Card x-chunk="dashboard-01-chunk-2">
                         <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-                            <CardTitle className="text-sm font-medium">Sales</CardTitle>
+                            <CardTitle className="text-sm font-medium">Status</CardTitle>
                             <CreditCard className="h-4 w-4 text-muted-foreground" />
                         </CardHeader>
                         <CardContent>
-                            <div className="text-2xl font-bold">+12,234</div>
-                            <p className="text-xs text-muted-foreground">+19% from last month</p>
+                            <div className="text-2xl font-bold">
+                                <StatusIconLabel statusValue={project.status} />
+                            </div>
+                            <p className="text-xs text-muted-foreground">
+                                {calcStatusComparison(user, project.status)}
+                            </p>
                         </CardContent>
                     </Card>
                     <Card x-chunk="dashboard-01-chunk-3">
                         <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-                            <CardTitle className="text-sm font-medium">Active Now</CardTitle>
+                            <CardTitle className="text-sm font-medium">Priority</CardTitle>
                             <Activity className="h-4 w-4 text-muted-foreground" />
                         </CardHeader>
                         <CardContent>
-                            <div className="text-2xl font-bold">+573</div>
-                            <p className="text-xs text-muted-foreground">+201 since last hour</p>
+                            <div className="text-2xl font-bold">
+                                <PriorityIconLabel priorityValue={project.priority} />
+                            </div>
+                            <p className="text-xs text-muted-foreground">
+                                {calcPriorityComparison(user, project.priority)}
+                            </p>
                         </CardContent>
                     </Card>
                 </div>
diff --git a/src/pages/project/[id]/edit.tsx b/src/pages/project/[id]/edit.tsx
index 40393ab..f168807 100644
--- a/src/pages/project/[id]/edit.tsx
+++ b/src/pages/project/[id]/edit.tsx
@@ -76,6 +76,9 @@ export default function EditProduct() {
                         <Badge variant="outline" className="ml-auto sm:ml-0 py-2">
                             <PriorityIconLabel priorityValue={project.priority} />
                         </Badge>
+                        <Badge variant="outline" className="ml-auto sm:ml-0 py-2">
+                            <StatusIconLabel statusValue={project.status} />
+                        </Badge>
                         <div className="hidden items-center gap-2 md:ml-auto md:flex">
                             <Link href={`/project/${project.id}`} className="text-muted-foreground">
                                 <Button variant="outline" size="sm">
@@ -204,7 +207,7 @@ export default function EditProduct() {
                             </Card>
                         </div>
                     </div>
-                    <div className="flex items-center justify-center gap-2 md:hidden">
+                    <div className="flex items-center justify-end gap-2 md:hidden">
                         <Button variant="outline" size="sm">
                             Discard
                         </Button>
diff --git a/src/utils/projectUtils.ts b/src/utils/projectUtils.ts
new file mode 100644
index 0000000..01b0fb1
--- /dev/null
+++ b/src/utils/projectUtils.ts
@@ -0,0 +1,59 @@
+import { User } from "@/models";
+
+export function calcPriorityComparison(user: User | null | undefined, priority: string): string {
+    if (!user || !priority) {
+        return "";
+    }
+
+    const projects = user.projects || [];
+    const currentProject = projects.find((proj) => proj.priority === priority);
+
+    if (!currentProject) {
+        return "";
+    }
+
+    const higherPriorityCount = projects.filter((proj) => {
+        return proj.priority === "high";
+    }).length;
+
+    const mediumPriorityCount = projects.filter((proj) => {
+        return proj.priority === "medium";
+    }).length;
+
+    const lowerPriorityCount = projects.filter((proj) => {
+        return proj.priority === "low";
+    }).length;
+
+    if (priority === "high") {
+        return `Higher priority than ${lowerPriorityCount + mediumPriorityCount} other projects`;
+    } else if (priority === "medium") {
+        return `Higher priority than ${lowerPriorityCount} other projects`;
+    } else {
+        return `Lower priority than ${higherPriorityCount + mediumPriorityCount} other projects`;
+    }
+}
+
+export function calcStatusComparison(user: User | null | undefined, status: string): string {
+    if (!user || !status) {
+        return "";
+    }
+
+    const projects = user.projects || [];
+    const currentProject = projects.find((proj) => proj.status === status);
+
+    if (!currentProject) {
+        return "";
+    }
+
+    const sameStatusCount = projects.filter(
+        (proj) => proj.status === status && proj.id !== currentProject.id
+    ).length;
+
+    if (sameStatusCount === 0) {
+        return `No other projects have the same status`;
+    } else if (sameStatusCount === 1) {
+        return `1 other project has the same status`;
+    } else {
+        return `${sameStatusCount} other projects have the same status`;
+    }
+}