diff --git a/src/app/components/plan/PartModal.tsx b/src/app/components/plan/PartModal.tsx
index ace394ff..9c1448d7 100644
--- a/src/app/components/plan/PartModal.tsx
+++ b/src/app/components/plan/PartModal.tsx
@@ -15,7 +15,7 @@ type PartModalProps = {
   parts: Part[];
   setParts: Dispatch<SetStateAction<Part[]>>;
   partIndex: number;
-  setTotalCost: Dispatch<SetStateAction<string>>;
+  setTotalCost: Dispatch<SetStateAction<number>>;
   setWorkHours: Dispatch<SetStateAction<number>>;
   setCo2Reduction: Dispatch<SetStateAction<number>>;
 };
@@ -39,7 +39,7 @@ export default function PartModal({
     setSelectedOption(optionInput);
     // recalculate total cost
     parts[partIndex].cost = costInput;
-    setTotalCost(formatNumber(parts.reduce((sum, part) => sum + part.cost, 0)));
+    setTotalCost(parts.reduce((sum, part) => sum + part.cost, 0));
 
     // recalculate total hours
     parts[partIndex].workHours = hoursInput;
diff --git a/src/app/components/plan/PlanPart.tsx b/src/app/components/plan/PlanPart.tsx
index 9878d281..8b3432fc 100644
--- a/src/app/components/plan/PlanPart.tsx
+++ b/src/app/components/plan/PlanPart.tsx
@@ -12,7 +12,7 @@ type PlanPartProps = {
   workHours: number;
   parts: Part[];
   setParts: Dispatch<SetStateAction<Part[]>>;
-  setTotalCost: Dispatch<SetStateAction<string>>;
+  setTotalCost: Dispatch<SetStateAction<number>>;
   setWorkHours: Dispatch<SetStateAction<number>>;
   setCo2Reduction: Dispatch<SetStateAction<number>>;
 };
diff --git a/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx b/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx
index 66922ff0..897ef985 100644
--- a/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx
+++ b/src/app/portfolio/[slug]/property/[lmkKey]/plan/page.tsx
@@ -125,8 +125,8 @@ export default function Plan({
   const [parts, setParts] = useState<Part[]>(partsConfig);
 
   const [budget, setBudget] = useState<number | "Not set">("Not set");
-  const [totalCost, setTotalCost] = useState<string>(
-    formatNumber(parts.reduce((sum, part) => sum + part.cost, 0))
+  const [totalCost, setTotalCost] = useState<number>(
+    parts.reduce((sum, part) => sum + part.cost, 0)
   );
   const [workHours, setWorkHours] = useState(
     parts.reduce((sum, part) => sum + part.workHours, 0)
@@ -219,7 +219,9 @@ export default function Plan({
                     <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">
+                  Total cost: £{formatNumber(totalCost)}
+                </li>
                 <li className="px-2 mb-2">
                   Installation Time: {roundToDecimalPlaces(workHours, 0)} hours
                 </li>