Merge pull request #314 from snake-eaterr/debits-ui

rerender linked apps after ndebit string fetch

src/Pages/LinkedApp/index.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useLayoutEffect, useMemo, useState } from "react";
 import { selectNostrSpends, useDispatch, useSelector } from "../../State/store";
 import { getNostrClient, parseNprofile } from "../../Api/nostr";
 import { DebitAuthorization, DebitRule_rule_type, } from "../../Api/pub/autogenerated/ts/types";
@@ -17,11 +17,14 @@ import { EditSource } from "../../Assets/SvgIconLibrary";
 import { setDebitToEdit } from "../../State/Slices/modalsSlice";
 import Checkbox from "../../Components/Checkbox";
 import { formatNumberWithCommas } from "../../utils/numbers";
+import { useIonRouter } from "@ionic/react";
+import Toast from "../../Components/Toast";
 
 type StateDebitAuth = DebitAuthorization & { source: SpendFrom, domainName?: string, avatarUrl?: string }
 
 export const LinkedApp = () => {
   const dispatch = useDispatch();
+  const router = useIonRouter()
   const [debitAuthorizations, setDebitAuthorizations] = useState<{
     debitAuths: StateDebitAuth[],
     debitAuthsBanned: StateDebitAuth[]
@@ -41,6 +44,15 @@ export const LinkedApp = () => {
 
   const [isShowingBans, setIsShowingBans] = useState(false);
 
+  useLayoutEffect(() => {
+    if (nostrSpends.length === 0) {
+      toast.error(<Toast title="Error" message="You don't have any spend sources." />)
+      router.push("/home");
+    }
+    setSelectedSource(nostrSpends[0]);
+  }, [nostrSpends, router]);
+
+
   const fetchAuths = useCallback(() => {
     const { pubkey, relays } = parseNprofile(selectedSource.pasteField)
     getNostrClient({ pubkey, relays }, selectedSource.keys).then(c => {