fix chart data

components/balances/Chart.vue

@@ -9,7 +9,7 @@ import {
   Title,
   Tooltip,
 } from "chart.js";
-import { isNegative, toSnapshot, type Dinero } from "dinero.js";
+import { isNegative, type Dinero } from "dinero.js";
 import { Bar } from "vue-chartjs";
 
 ChartJS.register(
@@ -32,7 +32,7 @@ const chartData = computed(() => ({
   labels: props.members.map((m) => m.name),
   datasets: [
     {
-      data: props.balances.map((v) => toSnapshot(v).amount),
+      data: props.balances.map(toFloat),
       backgroundColor: props.balances.map((v) =>
         isNegative(v) ? "rgba(255, 99, 132, 0.2)" : "rgba(75, 192, 192, 0.2)"
       ),

components/new-expense/Infos.vue

@@ -18,7 +18,7 @@ const amountCurrency = ref(
 
 watchEffect(() => {
   if (amount.value) {
-    amountValue.value = parseFloat(toDecimal(amount.value));
+    amountValue.value = toFloat(amount.value);
     amountCurrency.value = toSnapshot(amount.value).currency;
   }
 });

components/new-expense/Participants.vue

@@ -29,7 +29,7 @@ const updateSharesAmount = () => {
   for (let i = 0; i < mIds.length; i++) {
     const amount = shares[i];
     model.value[mIds[i]].amount = amount;
-    floatSharesAmount.value.set(mIds[i], parseFloat(toDecimal(amount)));
+    floatSharesAmount.value.set(mIds[i], toFloat(amount));
   }
 };
 updateSharesAmount();

pages/[id].vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import {
+  ArrowPathIcon,
   ArrowsRightLeftIcon,
   CreditCardIcon,
-  ArrowPathIcon,
 } from "@heroicons/vue/24/solid";
 
 const route = useRoute();

utils/dinero.ts

@@ -14,6 +14,10 @@ export function fromFloat(
   return dinero({ amount, currency });
 }
 
+export function toFloat(amount: Dinero<number>): number {
+  return parseFloat(toDecimal(amount));
+}
+
 export function toString(amount: Dinero<number>): string {
   return toDecimal(
     amount,