From bd312f553fc91c3a06065aa9b720800cef8664b4 Mon Sep 17 00:00:00 2001
From: kieran <kieran@harkin.me>
Date: Fri, 19 Jul 2024 14:48:59 +0100
Subject: [PATCH] feat: balance history

---
 src/element/new-stream.tsx              |  1 +
 src/element/provider/nostr/history.tsx  | 25 +++++++++++++++++++++++++
 src/element/provider/nostr/index.tsx    | 19 +++++++++++++++++++
 src/pages/dashboard/button-settings.tsx |  1 +
 src/pages/settings/stream.tsx           |  1 +
 src/providers/zsz.ts                    | 17 ++++++++++++++++-
 6 files changed, 63 insertions(+), 1 deletion(-)
 create mode 100644 src/element/provider/nostr/history.tsx

diff --git a/src/element/new-stream.tsx b/src/element/new-stream.tsx
index 0488400..7e875bd 100644
--- a/src/element/new-stream.tsx
+++ b/src/element/new-stream.tsx
@@ -56,6 +56,7 @@ export function NewStream({ ev, onFinish }: Omit<StreamEditorProps, "onFinish">
             showEndpoints={false}
             showEditor={true}
             showForwards={false}
+            showBalanceHistory={false}
           />
         );
       }
diff --git a/src/element/provider/nostr/history.tsx b/src/element/provider/nostr/history.tsx
new file mode 100644
index 0000000..ee42520
--- /dev/null
+++ b/src/element/provider/nostr/history.tsx
@@ -0,0 +1,25 @@
+import { BalanceHistoryResult, NostrStreamProvider } from "@/providers/zsz";
+import { useEffect, useState } from "react";
+import { FormattedMessage } from "react-intl";
+
+export default function BalanceHistory({ provider }: { provider?: NostrStreamProvider }) {
+    const [page,] = useState(0);
+    const [rows, setRows] = useState<BalanceHistoryResult>();
+
+    useEffect(() => {
+        if (!provider) return;
+        provider.history(page)
+            .then(setRows);
+    }, []);
+
+    return <div className="grid auto-rows-auto grid-cols-3 gap-1">
+        <div><FormattedMessage defaultMessage="Time" /></div>
+        <div><FormattedMessage defaultMessage="Description" /></div>
+        <div><FormattedMessage defaultMessage="Amount" /></div>
+        {rows?.items.map(a => <>
+            <div>{new Date(a.created * 1000).toLocaleString()}</div>
+            <div>{a.desc}</div>
+            <div>{a.type === 0 ? "+" : "-"}{a.amount}</div>
+        </>)}
+    </div>
+}
\ No newline at end of file
diff --git a/src/element/provider/nostr/index.tsx b/src/element/provider/nostr/index.tsx
index 6e73d5c..e5d2a7c 100644
--- a/src/element/provider/nostr/index.tsx
+++ b/src/element/provider/nostr/index.tsx
@@ -14,18 +14,21 @@ import { AddForwardInputs } from "./fowards";
 import StreamKey from "./stream-key";
 import AccountTopup from "./topup";
 import AccountWithdrawl from "./withdraw";
+import BalanceHistory from "./history";
 
 export default function NostrProviderDialog({
   provider,
   showEndpoints,
   showEditor,
   showForwards,
+  showBalanceHistory,
   ...others
 }: {
   provider: NostrStreamProvider;
   showEndpoints: boolean;
   showEditor: boolean;
   showForwards: boolean;
+  showBalanceHistory: boolean;
 } & StreamEditorProps) {
   const system = useContext(SnortContext);
   const [topup, setTopup] = useState(false);
@@ -257,11 +260,27 @@ export default function NostrProviderDialog({
     );
   }
 
+  function balanceHist() {
+    if (!info || !showBalanceHistory) return;
+
+    return (
+      <div className="flex flex-col gap-4">
+        <h3>
+          <FormattedMessage defaultMessage="Balance History" />
+        </h3>
+        <div className="flex flex-col gap-1">
+          <BalanceHistory provider={provider}/>
+        </div>
+      </div>
+    );
+  }
+
   return (
     <>
       {showEndpoints && streamEndpoints()}
       {streamEditor()}
       {forwardInputs()}
+      {balanceHist()}
     </>
   );
 }
diff --git a/src/pages/dashboard/button-settings.tsx b/src/pages/dashboard/button-settings.tsx
index a492e8f..4da5582 100644
--- a/src/pages/dashboard/button-settings.tsx
+++ b/src/pages/dashboard/button-settings.tsx
@@ -24,6 +24,7 @@ export function DashboardSettingsButton({ ev }: { ev?: TaggedNostrEvent }) {
               showEndpoints={true}
               showForwards={true}
               showEditor={false}
+              showBalanceHistory={false}
             />
           </div>
         </Modal>
diff --git a/src/pages/settings/stream.tsx b/src/pages/settings/stream.tsx
index dda874d..f1856fe 100644
--- a/src/pages/settings/stream.tsx
+++ b/src/pages/settings/stream.tsx
@@ -17,6 +17,7 @@ export function StreamSettingsTab() {
           showEndpoints={true}
           showEditor={false}
           showForwards={true}
+          showBalanceHistory={true}
         />
       </div>
     </>
diff --git a/src/providers/zsz.ts b/src/providers/zsz.ts
index 9b94f7b..4b2e2b1 100644
--- a/src/providers/zsz.ts
+++ b/src/providers/zsz.ts
@@ -92,7 +92,7 @@ export class NostrStreamProvider implements StreamProvider {
   }
 
   async withdraw(invoice: string) {
-    return await this.#getJson<{ fee: number; preimage: string }>("POST", `withdraw?invoice=${invoice}`);
+    return await this.#getJson<{ fee: number; preimage: string, error?: string }>("POST", `withdraw?invoice=${invoice}`);
   }
 
   async acceptTos(): Promise<void> {
@@ -144,6 +144,10 @@ export class NostrStreamProvider implements StreamProvider {
     return `${this.url}clip/${id}/${clipId}`;
   }
 
+  async history(page = 0, pageSize = 100) {
+    return await this.#getJson<BalanceHistoryResult>("GET", `history?page=${page}&pageSize=${pageSize}`);
+  }
+
   async #getJson<T>(method: "GET" | "POST" | "PATCH" | "DELETE", path: string, body?: unknown): Promise<T> {
     const pub = (() => {
       if (this.#publisher) {
@@ -205,3 +209,14 @@ interface IngestEndpoint {
 interface TopUpResponse {
   pr: string;
 }
+
+export interface BalanceHistoryResult {
+  items: Array<{
+    created: number,
+    type: number,
+    amount: number,
+    desc?: string
+  }>
+  page: number,
+  pageSize: number
+}
\ No newline at end of file