From c3c07e1691de29e4120b654dbb5ab69130f95839 Mon Sep 17 00:00:00 2001
From: Khalim Conn-Kowlessar <kconnkowlessar@gmail.com>
Date: Wed, 31 May 2023 10:03:03 +0100
Subject: [PATCH] added additional styling to plan page

---
 .../[slug]/property/[lmkKey]/plan/page.tsx    | 28 ++++++++++++++-----
 1 file changed, 21 insertions(+), 7 deletions(-)

diff --git a/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx b/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx
index 89eb3865..ac161ad6 100644
--- a/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx
+++ b/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx
@@ -8,6 +8,7 @@ import { useState } from "react";
 import { PencilSquareIcon } from "@heroicons/react/24/outline";
 import PlanPart from "@/app/components/plan/PlanPart";
 import EditEpctargetModal from "@/app/components/property/EditEpcTargetModal";
+import Link from "next/link";
 
 export default function Plan({
   params,
@@ -59,8 +60,10 @@ export default function Plan({
     0
   );
 
+  const partsTotalCost = partsConfig.reduce((sum, part) => sum + part.cost, 0);
+
   const [budget, setBudget] = useState("Not set");
-  const [totalCost, setTotalCost] = useState("Not set");
+  const [totalCost, setTotalCost] = useState(partsTotalCost);
   const [installTime, setInstallTime] = useState(totalWorkHours);
   const [isEditModalOpen, setIsEditModalOpen] = useState(false);
   const [targetEpcRating, setTargetEpcRating] = useState<EpcRating | "">(
@@ -118,15 +121,26 @@ export default function Plan({
                   Target EPC: {targetEpcRating}
                   <PencilSquareIcon className="h-6 w-6 ml-2" />
                 </li>
-                <li className="px-2 mb-2">Total cost: {totalCost}</li>
-                <li className="px-2 mb-2">Budget: {budget}</li>
+                <li
+                  onClick={() => console.log("clicked")}
+                  className="px-2 mb-2 flex items-center cursor-pointer hover:bg-brandblue hover:rounded-md transition-colors duration-200"
+                >
+                  Budget: {budget}
+                  <PencilSquareIcon className="h-6 w-6 ml-2" />
+                </li>
+                <Link
+                  href={`/portfolio/${portfolioId}/property/${lmkKey}?postcode=${postcode}`}
+                >
+                  <li className="px-2 mb-2 flex items-center cursor-pointer hover:bg-brandblue hover:rounded-md transition-colors duration-200">
+                    Edit Property Details
+                    <PencilSquareIcon className="h-6 w-6 ml-2" />
+                  </li>
+                </Link>
+                <li className="px-2 mb-2">Total cost: £{totalCost}</li>
+
                 <li className="px-2 mb-2">
                   Installation Time: {installTime} hours
                 </li>
-                <li className="px-2 mb-2 flex items-center cursor-pointer hover:bg-brandblue hover:rounded-md transition-colors duration-200">
-                  Edit Property Details
-                  <PencilSquareIcon className="h-6 w-6 ml-2" />
-                </li>
               </ul>
             </div>
           </div>