make total functional

src/lib/calculator/Calculator.svelte

@@ -2,8 +2,8 @@
     import Button from "$lib/header/Button.svelte";
     import { onMount } from "svelte";
     import words from "$lib/en-lang.json";
-import { base } from "$app/paths";
 
+    let total = 0;
     let lang = words["calculator"];
     let types = lang["types"];
 
@@ -115,6 +115,11 @@ import { base } from "$app/paths";
                 }
             });
         }
+
+        total = 0;
+        commissions.forEach(value => {
+            total += value.price;
+        })
     }
 
     async function load() {
@@ -164,7 +169,7 @@ import { base } from "$app/paths";
                 <div class="flex flex-col gap-2">
                     <div class="flex gap-3">
                         <h4 class="text-xl font-bold">Total</h4>
-                        <p class="bg-green-500 py-1 text-sm px-5 rounded-lg">$20</p>
+                        <p class="bg-green-500 py-1 text-sm px-5 rounded-lg">{total}</p>
                     </div>
                     <p class="italic text-gray-200 text-sm">This figure is an estimate, the final price may differ.<br/>All commissions are strictly SFW only.</p>
                 </div>