fix: network selection

advanced/dapps/chain-abstraction-demo/components/gift-donut-modal-views/CheckoutReceipentAddressView.tsx

@@ -10,6 +10,7 @@ import { ArrowLeft, ChevronLeft, Copy, UserRound, X } from "lucide-react";
 import { Input } from "../ui/input";
 import GiftSvg from "../assets/GiftSVG";
 import useGiftDonut from "@/app/hooks/useGiftDonut";
+import { toast } from "sonner";
 
 function CheckoutReceipentAddressView({
   onViewChange,
@@ -45,13 +46,23 @@ function GiftDonutForm({
   };
 
   const handleCheckout = () => {
-    const to = recipientAddress as `0x${string}`;
-    const token = giftDonutModalManager.getToken();
-    const network = giftDonutModalManager.getNetwork();
-    onClose()
-    giftDonutAsync(to, donutCount, token, network);
-
+    try{
+      const to = recipientAddress as `0x${string}`;
+      const token = giftDonutModalManager.getToken();
+      const network = giftDonutModalManager.getNetwork();
+      if(!network) {
+        throw new Error("Network not selected");
+      }
+      onClose()
+      giftDonutAsync(to, donutCount, token, network);
+    }catch(e){
+      console.error(e)
+      if(e instanceof Error){
+        toast.error(e.message)
+      }
+    }
   };
+
   return (
     <div
       className={cn("flex flex-col items-start gap-4 text-primary", className)}

advanced/dapps/chain-abstraction-demo/controllers/GiftDonutModalManager.ts

@@ -22,7 +22,7 @@ export type GiftDonutModalViewProps = {
 
 export type GiftDonutState = {
   donutCount: number;
-  network: Network;
+  network?: Network;
   token: Token;
   recipient?: string;
 };
@@ -44,7 +44,6 @@ class GiftDonutModalManager {
       views: {},
       state: {
         token: supportedTokens[0],
-        network: supportedNetworks[0],
         donutCount: 1,
       },
     });
@@ -114,7 +113,7 @@ class GiftDonutModalManager {
     return this.state.state.token;
   }
 
-  getNetwork(): Network {
+  getNetwork(): Network | undefined {
     return this.state.state.network;
   }