diff --git a/apps/desktop2/package.json b/apps/desktop2/package.json index 763359f7..fb531acf 100644 --- a/apps/desktop2/package.json +++ b/apps/desktop2/package.json @@ -26,6 +26,7 @@ "i18next-resources-to-backend": "^1.2.0", "nostr-tools": "^2.3.1", "react": "^18.2.0", + "react-currency-input-field": "^3.8.0", "react-dom": "^18.2.0", "react-i18next": "^14.0.5", "slate": "^0.101.5", diff --git a/apps/desktop2/src/components/balance.tsx b/apps/desktop2/src/components/balance.tsx new file mode 100644 index 00000000..5be1f4ec --- /dev/null +++ b/apps/desktop2/src/components/balance.tsx @@ -0,0 +1,51 @@ +import { useArk } from "@lume/ark"; +import { User } from "@lume/ui"; +import { getBitcoinDisplayValues } from "@lume/utils"; +import { useEffect, useMemo, useState } from "react"; +import { useTranslation } from "react-i18next"; + +export function Balance({ + recipient, + account, +}: { + recipient: string; + account: string; +}) { + const [t] = useTranslation(); + const [balance, setBalance] = useState(0); + + const ark = useArk(); + const value = useMemo(() => getBitcoinDisplayValues(balance), [balance]); + + useEffect(() => { + async function getBalance() { + const val = await ark.get_balance(); + setBalance(val); + } + + getBalance(); + }, []); + + return ( +
+
+
+
+ Your balance +
+
+ ₿ {value.bitcoinFormatted} +
+
+ + + + + +
+
+ ); +} diff --git a/apps/desktop2/src/routes/nwc.lazy.tsx b/apps/desktop2/src/routes/nwc.lazy.tsx index ade7af10..97c952ab 100644 --- a/apps/desktop2/src/routes/nwc.lazy.tsx +++ b/apps/desktop2/src/routes/nwc.lazy.tsx @@ -25,37 +25,43 @@ function Screen() { return (
-
-
- -
-
-

- Connect bitcoin wallet to - start zapping to your favorite content and creator. -

-
-
-
-
- -