Show the impact of an expense on the active user's balance (#139)

* Add devcontainer configuration for codespace support

* Show the impact of an expense on the active user's balance

* Run prettier

* Put the balance on a different line

---------

Co-authored-by: Sebastien Castiel <sebastien@castiel.me>

src/components/money.tsx

@@ -0,0 +1,31 @@
+'use client'
+import { cn, formatCurrency } from '@/lib/utils'
+
+type Props = {
+  currency: string
+  amount: number
+  bold?: boolean
+  colored?: boolean
+}
+
+export function Money({
+  currency,
+  amount,
+  bold = false,
+  colored = false,
+}: Props) {
+  return (
+    <span
+      className={cn(
+        colored && amount <= 1
+          ? 'text-red-600'
+          : colored && amount >= 1
+          ? 'text-green-600'
+          : '',
+        bold && 'font-bold',
+      )}
+    >
+      {formatCurrency(currency, amount)}
+    </span>
+  )
+}