@pollar/react 0.10.1-rc.10 → 0.10.1-rc.12

package/dist/index.mjs

@@ -1033,7 +1033,7 @@ var PollarModalFooter = () => {
       /* @__PURE__ */ jsx("span", { className: "pollar-footer-name", children: "Pollar" }),
       /* @__PURE__ */ jsxs("span", { className: "pollar-footer-version", children: [
         "v",
-        "0.10.1-rc.10"
+        "0.10.1-rc.12"
       ] })
     ] })
   ] });
@@ -2798,7 +2798,7 @@ function RampWidgetTemplate({
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-field", children: [
         /* @__PURE__ */ jsx("label", { className: "pollar-ramp-label", children: "Country" }),
-        countriesLoading ? /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-input pollar-ramp-input-loading", children: [
+        countriesLoading ? /* @__PURE__ */ jsxs("div", { className: "pollar-ramp-input pollar-select-loading", children: [
           /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
           /* @__PURE__ */ jsx("span", { children: "Loading countries\u2026" })
         ] }) : countries.length === 0 ? /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: "No ramp providers available on this network yet." }) : /* @__PURE__ */ jsx("select", { className: "pollar-ramp-input", value: country, onChange: (e) => onCountryChange(e.target.value), children: countries.map((c) => /* @__PURE__ */ jsxs("option", { value: c.code, children: [
@@ -3427,6 +3427,7 @@ function AssetSelect({
   options,
   onChange,
   loading = false,
+  loadingLabel,
   disabled = false,
   appGroupLabel = "App assets",
   otherGroupLabel = "Other assets",
@@ -3436,7 +3437,10 @@ function AssetSelect({
   const otherAssets = options.filter((o) => !o.enabledInApp);
   return /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
     /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: label }),
-    loading ? /* @__PURE__ */ jsx("div", { className: "pollar-send-skeleton" }) : /* @__PURE__ */ jsxs(
+    loading ? loadingLabel ? /* @__PURE__ */ jsxs("div", { className: "pollar-input pollar-select-loading", children: [
+      /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+      /* @__PURE__ */ jsx("span", { children: loadingLabel })
+    ] }) : /* @__PURE__ */ jsx("div", { className: "pollar-send-skeleton" }) : /* @__PURE__ */ jsxs(
       "select",
       {
         className: "pollar-input pollar-send-select",
@@ -3765,6 +3769,7 @@ function SendModalTemplate({
               label: "Asset",
               value: selectedKey,
               loading: isLoadingBalance,
+              loadingLabel: "Loading assets\u2026",
               options: assets.map((a) => ({
                 key: assetKey3(a),
                 code: a.code,
@@ -4109,10 +4114,6 @@ function SwapModalTemplate({
             /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-modal-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": true, children: /* @__PURE__ */ jsx("path", { d: "M2 2l12 12M14 2L2 14", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) }) })
           ] })
         ] }),
-        step === "form" && configLoading && /* @__PURE__ */ jsxs("div", { className: "pollar-loading-block", children: [
-          /* @__PURE__ */ jsx("div", { className: "pollar-spinner" }),
-          /* @__PURE__ */ jsx("span", { children: "Loading swap options\u2026" })
-        ] }),
         step === "form" && !configLoading && swapUnavailable && /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: "Swap is not available for this app." }),
         step === "form" && !swapUnavailable && /* @__PURE__ */ jsxs(Fragment, { children: [
           smartUnsupported && /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: "Swaps are not yet available for smart (passkey) wallets." }),
@@ -4121,7 +4122,8 @@ function SwapModalTemplate({
             {
               label: "You pay",
               value: sellKey,
-              loading: isLoadingData,
+              loading: isLoadingData || configLoading,
+              loadingLabel: "Loading assets\u2026",
               disabled: configLoading,
               options: sellOptions.map((o) => ({
                 key: assetOptionKey(o),
@@ -4163,7 +4165,8 @@ function SwapModalTemplate({
             {
               label: "You receive",
               value: buyKey,
-              loading: isLoadingData,
+              loading: isLoadingData || configLoading,
+              loadingLabel: "Loading assets\u2026",
               disabled: configLoading,
               options: buyOptions.map((o) => ({
                 key: assetOptionKey(o),
@@ -4225,14 +4228,17 @@ function SwapModalTemplate({
           ),
           /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
             /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: "Route" }),
-            /* @__PURE__ */ jsx(
+            configLoading ? /* @__PURE__ */ jsxs("div", { className: "pollar-input pollar-select-loading", children: [
+              /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+              /* @__PURE__ */ jsx("span", { children: "Loading routes\u2026" })
+            ] }) : /* @__PURE__ */ jsx(
               "select",
               {
                 className: "pollar-input pollar-send-select",
                 value: provider,
-                disabled: configLoading || providers.length === 0,
+                disabled: providers.length === 0,
                 onChange: (e) => onProviderChange(e.target.value),
-                children: providers.length === 0 ? /* @__PURE__ */ jsx("option", { value: provider, children: configLoading ? "Loading\u2026" : PROVIDER_LABELS[provider] }) : providers.map((p) => /* @__PURE__ */ jsx("option", { value: p, children: PROVIDER_LABELS[p] }, p))
+                children: providers.length === 0 ? /* @__PURE__ */ jsx("option", { value: provider, children: PROVIDER_LABELS[provider] }) : providers.map((p) => /* @__PURE__ */ jsx("option", { value: p, children: PROVIDER_LABELS[p] }, p))
               }
             )
           ] }),
@@ -4594,6 +4600,11 @@ function EarnModal({ onClose }) {
     earnWithdraw,
     tx: transaction,
     wallet,
+    walletBalance,
+    refreshWalletBalance,
+    enabledAssets,
+    refreshAssets,
+    setTrustline,
     network,
     styles
   } = usePollar();
@@ -4625,6 +4636,10 @@ function EarnModal({ onClose }) {
   useEffect(() => {
     void loadProviders();
   }, [loadProviders]);
+  useEffect(() => {
+    void refreshWalletBalance();
+    void refreshAssets();
+  }, [refreshWalletBalance, refreshAssets]);
   useEffect(() => {
     if (!provider) return;
     let cancelled = false;
@@ -4668,6 +4683,22 @@ function EarnModal({ onClose }) {
   const withdrawUnit = position?.withdrawUnit ?? "asset";
   const assetCode = selectedOpportunity?.asset.code ?? "";
   const amountUnitLabel = tab === "deposit" ? assetCode : withdrawUnit === "shares" ? "shares" : assetCode;
+  const walletAvailable = (() => {
+    if (!selectedOpportunity) return null;
+    const balances = walletBalance.step === "loaded" ? walletBalance.data.balances : [];
+    const issuer = selectedOpportunity.asset.issuer;
+    const rec = balances.find(
+      (b) => issuer === null ? b.type === "native" : b.code === assetCode && b.issuer === issuer
+    );
+    return rec ? rec.available : null;
+  })();
+  const depositAssetRecord = (() => {
+    if (!selectedOpportunity?.asset.issuer || enabledAssets.step !== "loaded") return void 0;
+    return enabledAssets.data.assets.find(
+      (a) => a.code === assetCode && a.issuer === selectedOpportunity.asset.issuer
+    );
+  })();
+  const depositNeedsTrustline = tab === "deposit" && !smartUnsupported && !!selectedOpportunity?.asset.issuer && !depositAssetRecord?.trustlineEstablished;
   const hash = transaction.step === "success" ? transaction.hash : null;
   const buildData = "buildData" in transaction ? transaction.buildData : null;
   const explorerNetwork = buildData?.summary.network?.toLowerCase().includes("testnet") ? "testnet" : buildData ? "public" : network === "testnet" ? "testnet" : "public";
@@ -4675,7 +4706,9 @@ function EarnModal({ onClose }) {
   const isInProgress = IN_FLIGHT_STEPS2.includes(transaction.step);
   const showBack = step === "tx" && (transaction.step === "error" || transaction.step === "success") && !isInProgress;
   const txTitle = isInProgress ? tab === "deposit" ? "Depositing\u2026" : "Withdrawing\u2026" : transaction.step === "success" ? "Done!" : transaction.step === "error" ? tab === "deposit" ? "Deposit failed" : "Withdraw failed" : "Confirm";
-  const canSubmit = !smartUnsupported && !!provider && !!opportunityId && !!amount && parseFloat(amount) > 0 && !providersLoading && !loadingOpps;
+  const parsedAmount = parseFloat(amount);
+  const exceedsAvailable = tab === "deposit" ? walletAvailable != null && parsedAmount > parseFloat(walletAvailable) : position != null && parsedAmount > parseFloat(position.withdrawable);
+  const canSubmit = !smartUnsupported && !!provider && !!opportunityId && !!amount && parsedAmount > 0 && !exceedsAvailable && !providersLoading && !loadingOpps;
   const cssVars = {
     "--pollar-accent": accentColor,
     "--pollar-bg": isDark ? "#1a1a1a" : "#ffffff",
@@ -4708,11 +4741,27 @@ function EarnModal({ onClose }) {
       setFormError("Enter a valid amount");
       return;
     }
+    if (tab === "deposit" && walletAvailable != null && parsed > parseFloat(walletAvailable)) {
+      setFormError("Amount exceeds your wallet balance");
+      return;
+    }
     if (tab === "withdraw" && position && parsed > parseFloat(position.withdrawable)) {
       setFormError("Amount exceeds your position");
       return;
     }
     setStep("tx");
+    if (tab === "deposit" && depositNeedsTrustline && selectedOpportunity?.asset.issuer) {
+      const tl = await setTrustline(
+        { code: assetCode, issuer: selectedOpportunity.asset.issuer },
+        depositAssetRecord?.sponsored ? { sponsored: true } : void 0
+      );
+      if (tl.status === "error") {
+        setFormError(`Trustline for ${assetCode} failed: ${tl.details ?? "unknown error"}`);
+        setStep("form");
+        return;
+      }
+      await refreshAssets();
+    }
     const params = { provider, opportunity: opportunityId, amount };
     const outcome = tab === "deposit" ? await earnDeposit(params) : await earnWithdraw(params);
     if (outcome.status === "success" || outcome.status === "pending") {
@@ -4747,6 +4796,7 @@ function EarnModal({ onClose }) {
     if (refreshing || !provider) return;
     setRefreshing(true);
     try {
+      void refreshWalletBalance();
       const opps = await getEarnOpportunities(provider);
       setOpportunities(opps);
       setOpportunityId((cur) => opps.some((o) => o.id === cur) ? cur : opps[0]?.id ?? "");
@@ -4805,10 +4855,6 @@ function EarnModal({ onClose }) {
             !isInProgress && /* @__PURE__ */ jsx("button", { type: "button", className: "pollar-modal-close", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": true, children: /* @__PURE__ */ jsx("path", { d: "M2 2l12 12M14 2L2 14", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) }) })
           ] })
         ] }),
-        step === "form" && providersLoading && /* @__PURE__ */ jsxs("div", { className: "pollar-loading-block", children: [
-          /* @__PURE__ */ jsx("div", { className: "pollar-spinner" }),
-          /* @__PURE__ */ jsx("span", { children: "Loading Earn options\u2026" })
-        ] }),
         step === "form" && earnUnavailable && /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: "Earn is not available for this app." }),
         step === "form" && !earnUnavailable && /* @__PURE__ */ jsxs(Fragment, { children: [
           smartUnsupported && /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: "Earn is not yet available for smart (passkey) wallets." }),
@@ -4853,18 +4899,18 @@ function EarnModal({ onClose }) {
             )
           ] }),
           /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
-            /* @__PURE__ */ jsxs("div", { className: "pollar-send-label-row", children: [
-              /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: provider === "defindex" ? "Vault" : "Pool" }),
-              loadingOpps && /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm", "aria-label": "Loading options" })
-            ] }),
-            /* @__PURE__ */ jsx(
+            /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: provider === "defindex" ? "Vault" : "Pool" }),
+            loadingOpps || providersLoading ? /* @__PURE__ */ jsxs("div", { className: "pollar-input pollar-select-loading", children: [
+              /* @__PURE__ */ jsx("span", { className: "pollar-spinner pollar-spinner-sm" }),
+              /* @__PURE__ */ jsx("span", { children: "Loading options\u2026" })
+            ] }) : /* @__PURE__ */ jsx(
               "select",
               {
                 className: "pollar-input pollar-send-select",
                 value: opportunityId,
-                disabled: loadingOpps || opportunities.length === 0,
+                disabled: opportunities.length === 0,
                 onChange: (e) => setOpportunityId(e.target.value),
-                children: opportunities.length === 0 ? /* @__PURE__ */ jsx("option", { value: "", children: loadingOpps ? "Loading\u2026" : "None available" }) : opportunities.map((o) => /* @__PURE__ */ jsxs("option", { value: o.id, children: [
+                children: opportunities.length === 0 ? /* @__PURE__ */ jsx("option", { value: "", children: "None available" }) : opportunities.map((o) => /* @__PURE__ */ jsxs("option", { value: o.id, children: [
                   o.name,
                   " \xB7 ",
                   o.apy.toFixed(2),
@@ -4874,6 +4920,14 @@ function EarnModal({ onClose }) {
             )
           ] }),
           selectedOpportunity && /* @__PURE__ */ jsxs("div", { className: "pollar-swap-quote", children: [
+            tab === "deposit" && /* @__PURE__ */ jsxs("div", { className: "pollar-swap-quote-row", children: [
+              /* @__PURE__ */ jsx("span", { className: "pollar-send-hint", children: "In your wallet" }),
+              /* @__PURE__ */ jsxs("span", { children: [
+                walletAvailable != null ? formatAmount4(walletAvailable) : "\u2026",
+                " ",
+                assetCode
+              ] })
+            ] }),
             /* @__PURE__ */ jsxs("div", { className: "pollar-swap-quote-row", children: [
               /* @__PURE__ */ jsx("span", { className: "pollar-send-hint", children: "Your position" }),
               /* @__PURE__ */ jsxs("span", { children: [
@@ -4893,6 +4947,12 @@ function EarnModal({ onClose }) {
           /* @__PURE__ */ jsxs("div", { className: "pollar-send-field", children: [
             /* @__PURE__ */ jsxs("div", { className: "pollar-send-label-row", children: [
               /* @__PURE__ */ jsx("label", { className: "pollar-send-label", children: tab === "deposit" ? "Amount" : "Withdraw amount" }),
+              tab === "deposit" && walletAvailable != null && /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-swap-custom-toggle", onClick: () => setAmount(walletAvailable), children: [
+                "Max: ",
+                formatAmount4(walletAvailable),
+                " ",
+                amountUnitLabel
+              ] }),
               tab === "withdraw" && position && /* @__PURE__ */ jsxs("button", { type: "button", className: "pollar-swap-custom-toggle", onClick: () => setAmount(position.withdrawable), children: [
                 "Max: ",
                 formatAmount4(position.withdrawable),
@@ -4916,7 +4976,12 @@ function EarnModal({ onClose }) {
             ] })
           ] }),
           formError && /* @__PURE__ */ jsx("div", { className: "pollar-modal-error", children: formError }),
-          /* @__PURE__ */ jsx("div", { className: "pollar-modal-actions", children: /* @__PURE__ */ jsx("button", { className: "pollar-btn-primary", onClick: () => void handleSubmit(), disabled: !canSubmit, children: tab === "deposit" ? "Deposit" : "Withdraw" }) })
+          depositNeedsTrustline && selectedOpportunity && /* @__PURE__ */ jsxs("div", { className: "pollar-swap-trustline-notice", children: [
+            "To deposit ",
+            assetCode,
+            " your wallet needs a trustline. This will create it first (~0.5 XLM reserve, refundable if you later remove it), then deposit \u2014 two signatures."
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "pollar-modal-actions", children: /* @__PURE__ */ jsx("button", { className: "pollar-btn-primary", onClick: () => void handleSubmit(), disabled: !canSubmit, children: tab === "deposit" ? depositNeedsTrustline ? "Enable trustline & deposit" : "Deposit" : "Withdraw" }) })
         ] }),
         step === "tx" && /* @__PURE__ */ jsx(
           TxStatusView,
@@ -5868,6 +5933,9 @@ function PollarProvider({
   const [sendModalOpen, setSendModalOpen] = useState(false);
   const [swapModalOpen, setSwapModalOpen] = useState(false);
   const [earnModalOpen, setEarnModalOpen] = useState(false);
+  const [sendModalKey, setSendModalKey] = useState(0);
+  const [swapModalKey, setSwapModalKey] = useState(0);
+  const [earnModalKey, setEarnModalKey] = useState(0);
   const [receiveModalOpen, setReceiveModalOpen] = useState(false);
   const [sessionsModalOpen, setSessionsModalOpen] = useState(false);
   const [distributionRulesModalOpen, setDistributionRulesModalOpen] = useState(false);
@@ -5910,21 +5978,33 @@ function PollarProvider({
       setTrustline: (asset, opts) => pollarClient.setTrustline(asset, opts),
       openEnabledAssetsModal: () => setEnabledAssetsModalOpen(true),
       // send / receive
-      openSendModal: () => setSendModalOpen(true),
+      openSendModal: () => {
+        pollarClient.resetTransactionState();
+        setSendModalKey((k) => k + 1);
+        setSendModalOpen(true);
+      },
       openReceiveModal: () => setReceiveModalOpen(true),
       // swap
       getSwapConfig: () => pollarClient.getSwapConfig(),
       getSwapTokens: () => pollarClient.getSwapTokens(),
       getSwapQuote: (params) => pollarClient.getSwapQuote(params),
       swap: (quote, opts) => pollarClient.swap(quote, opts),
-      openSwapModal: () => setSwapModalOpen(true),
+      openSwapModal: () => {
+        pollarClient.resetTransactionState();
+        setSwapModalKey((k) => k + 1);
+        setSwapModalOpen(true);
+      },
       // earn
       getEarnProviders: () => pollarClient.getEarnProviders(),
       getEarnOpportunities: (provider) => pollarClient.getEarnOpportunities(provider),
       getEarnPosition: (params) => pollarClient.getEarnPosition(params),
       earnDeposit: (params) => pollarClient.earnDeposit(params),
       earnWithdraw: (params) => pollarClient.earnWithdraw(params),
-      openEarnModal: () => setEarnModalOpen(true),
+      openEarnModal: () => {
+        pollarClient.resetTransactionState();
+        setEarnModalKey((k) => k + 1);
+        setEarnModalOpen(true);
+      },
       // sessions
       sessions,
       openSessionsModal: () => setSessionsModalOpen(true),
@@ -5978,9 +6058,9 @@ function PollarProvider({
     txHistoryModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setTxHistoryModalOpen(false), children: /* @__PURE__ */ jsx(TxHistoryModal, { onClose: () => setTxHistoryModalOpen(false) }) }),
     walletBalanceModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setWalletBalanceModalOpen(false), children: /* @__PURE__ */ jsx(WalletBalanceModal, { onClose: () => setWalletBalanceModalOpen(false) }) }),
     enabledAssetsModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setEnabledAssetsModalOpen(false), children: /* @__PURE__ */ jsx(EnabledAssetsModal, { onClose: () => setEnabledAssetsModalOpen(false) }) }),
-    sendModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setSendModalOpen(false), children: /* @__PURE__ */ jsx(SendModal, { onClose: () => setSendModalOpen(false) }) }),
-    swapModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setSwapModalOpen(false), children: /* @__PURE__ */ jsx(SwapModal, { onClose: () => setSwapModalOpen(false) }) }),
-    earnModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setEarnModalOpen(false), children: /* @__PURE__ */ jsx(EarnModal, { onClose: () => setEarnModalOpen(false) }) }),
+    sendModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setSendModalOpen(false), children: /* @__PURE__ */ jsx(SendModal, { onClose: () => setSendModalOpen(false) }) }, sendModalKey),
+    swapModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setSwapModalOpen(false), children: /* @__PURE__ */ jsx(SwapModal, { onClose: () => setSwapModalOpen(false) }) }, swapModalKey),
+    earnModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setEarnModalOpen(false), children: /* @__PURE__ */ jsx(EarnModal, { onClose: () => setEarnModalOpen(false) }) }, earnModalKey),
     receiveModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setReceiveModalOpen(false), children: /* @__PURE__ */ jsx(ReceiveModal, { onClose: () => setReceiveModalOpen(false) }) }),
     sessionsModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setSessionsModalOpen(false), children: /* @__PURE__ */ jsx(SessionsModal, { onClose: () => setSessionsModalOpen(false) }) }),
     distributionRulesModalOpen && /* @__PURE__ */ jsx(ModalErrorBoundary, { onClose: () => setDistributionRulesModalOpen(false), children: /* @__PURE__ */ jsx(DistributionRulesModal, { onClose: () => setDistributionRulesModalOpen(false) }) })