@hfunlabs/hypurr-connect 0.1.14 → 0.1.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -0
- package/dist/index.d.ts +86 -3
- package/dist/index.js +1827 -333
- package/dist/index.js.map +1 -1
- package/package.json +21 -6
- package/src/AddWalletModal.tsx +744 -0
- package/src/AgentExpiryWarning.tsx +129 -0
- package/src/DeleteWalletModal.tsx +2 -1
- package/src/HypurrConnectProvider.tsx +190 -0
- package/src/LoginModal.tsx +11 -11
- package/src/RenameWalletModal.tsx +2 -1
- package/src/RenewAgentModal.tsx +380 -0
- package/src/UserProfileModal.tsx +151 -23
- package/src/WalletSelectorDropdown.tsx +138 -4
- package/src/agent.ts +38 -12
- package/src/agentWallet.ts +86 -0
- package/src/css.d.ts +1 -0
- package/src/icons/lucide.tsx +61 -0
- package/src/index.ts +17 -1
- package/src/profileStyles.ts +58 -0
- package/src/styles.css +1 -0
- package/src/tailwind.css +77 -0
- package/src/types.ts +13 -0
package/dist/index.js
CHANGED
|
@@ -1,3 +1,28 @@
|
|
|
1
|
+
// #style-inject:#style-inject
|
|
2
|
+
function styleInject(css, { insertAt } = {}) {
|
|
3
|
+
if (!css || typeof document === "undefined") return;
|
|
4
|
+
const head = document.head || document.getElementsByTagName("head")[0];
|
|
5
|
+
const style = document.createElement("style");
|
|
6
|
+
style.type = "text/css";
|
|
7
|
+
if (insertAt === "top") {
|
|
8
|
+
if (head.firstChild) {
|
|
9
|
+
head.insertBefore(style, head.firstChild);
|
|
10
|
+
} else {
|
|
11
|
+
head.appendChild(style);
|
|
12
|
+
}
|
|
13
|
+
} else {
|
|
14
|
+
head.appendChild(style);
|
|
15
|
+
}
|
|
16
|
+
if (style.styleSheet) {
|
|
17
|
+
style.styleSheet.cssText = css;
|
|
18
|
+
} else {
|
|
19
|
+
style.appendChild(document.createTextNode(css));
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
// src/styles.css
|
|
24
|
+
styleInject(".hypurr-connect .btn-raised {\n background-color: #0d1219;\n background-image:\n linear-gradient(\n 180deg,\n hsla(0, 0%, 100%, .03),\n transparent);\n box-shadow:\n inset 0 1px 0 hsla(0, 0%, 100%, .1),\n inset 0 -1px 0 rgba(0, 0, 0, .35),\n inset 0 0 0 1px #262a30;\n color: #aab1c1;\n transition:\n background-color .15s,\n color .15s,\n background-image .15s,\n box-shadow .15s;\n}\n.hypurr-connect .btn-raised:hover:not(:disabled) {\n background-color: #15171a;\n background-image:\n linear-gradient(\n 180deg,\n hsla(0, 0%, 100%, .04),\n transparent);\n box-shadow:\n inset 0 1px 0 hsla(0, 0%, 100%, .14),\n inset 0 -1px 0 rgba(0, 0, 0, .4),\n inset 0 0 0 1px #444548;\n color: #d1d5db;\n}\n.hypurr-connect .btn-raised-active {\n background-color: #1e2124;\n background-image:\n linear-gradient(\n 180deg,\n hsla(0, 0%, 100%, .05),\n transparent);\n box-shadow:\n inset 0 1px 0 hsla(0, 0%, 100%, .18),\n inset 0 -1px 0 rgba(0, 0, 0, .45),\n inset 0 0 0 1px #4b4d50,\n 0 1px 2px rgba(0, 0, 0, .5);\n color: #fff;\n}\n.hypurr-connect .btn-raised-active,\n.hypurr-connect .btn-raised-disabled {\n transition:\n background-color .15s,\n color .15s,\n background-image .15s,\n box-shadow .15s;\n}\n.hypurr-connect .btn-raised-disabled {\n background-color: #0d1219;\n background-image:\n linear-gradient(\n 180deg,\n hsla(0, 0%, 100%, .02),\n transparent);\n box-shadow:\n inset 0 1px 0 hsla(0, 0%, 100%, .05),\n inset 0 -1px 0 rgba(0, 0, 0, .25),\n inset 0 0 0 1px #1c2026;\n color: #7d8597;\n cursor: not-allowed;\n}\n.hypurr-connect .\\!visible {\n visibility: visible !important;\n}\n.hypurr-connect .visible {\n visibility: visible;\n}\n.hypurr-connect .fixed {\n position: fixed;\n}\n.hypurr-connect .absolute {\n position: absolute;\n}\n.hypurr-connect .relative {\n position: relative;\n}\n.hypurr-connect .inset-0 {\n inset: 0;\n}\n.hypurr-connect .right-2 {\n right: .5rem;\n}\n.hypurr-connect .right-6 {\n right: 1.5rem;\n}\n.hypurr-connect .top-1\\/2 {\n top: 50%;\n}\n.hypurr-connect .z-\\[100\\] {\n z-index: 100;\n}\n.hypurr-connect .z-\\[101\\] {\n z-index: 101;\n}\n.hypurr-connect .z-\\[110\\] {\n z-index: 110;\n}\n.hypurr-connect .z-\\[111\\] {\n z-index: 111;\n}\n.hypurr-connect .mb-1\\.5 {\n margin-bottom: .375rem;\n}\n.hypurr-connect .mb-2 {\n margin-bottom: .5rem;\n}\n.hypurr-connect .mt-0\\.5 {\n margin-top: .125rem;\n}\n.hypurr-connect .mt-1 {\n margin-top: .25rem;\n}\n.hypurr-connect .mt-1\\.5 {\n margin-top: .375rem;\n}\n.hypurr-connect .block {\n display: block;\n}\n.hypurr-connect .inline-block {\n display: inline-block;\n}\n.hypurr-connect .inline {\n display: inline;\n}\n.hypurr-connect .flex {\n display: flex;\n}\n.hypurr-connect .inline-flex {\n display: inline-flex;\n}\n.hypurr-connect .grid {\n display: grid;\n}\n.hypurr-connect .contents {\n display: contents;\n}\n.hypurr-connect .hidden {\n display: none;\n}\n.hypurr-connect .h-8 {\n height: 2rem;\n}\n.hypurr-connect .w-8 {\n width: 2rem;\n}\n.hypurr-connect .w-full {\n width: 100%;\n}\n.hypurr-connect .min-w-0 {\n min-width: 0;\n}\n.hypurr-connect .max-w-md {\n max-width: 28rem;\n}\n.hypurr-connect .flex-1 {\n flex: 1 1 0%;\n}\n.hypurr-connect .flex-shrink-0 {\n flex-shrink: 0;\n}\n.hypurr-connect .-translate-y-1\\/2 {\n --tw-translate-y:-50%;\n}\n.hypurr-connect .-translate-y-1\\/2,\n.hypurr-connect .transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.hypurr-connect .cursor-not-allowed {\n cursor: not-allowed;\n}\n.hypurr-connect .grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n}\n.hypurr-connect .items-start {\n align-items: flex-start;\n}\n.hypurr-connect .items-center {\n align-items: center;\n}\n.hypurr-connect .justify-center {\n justify-content: center;\n}\n.hypurr-connect .justify-between {\n justify-content: space-between;\n}\n.hypurr-connect .gap-1\\.5 {\n gap: .375rem;\n}\n.hypurr-connect .gap-2 {\n gap: .5rem;\n}\n.hypurr-connect .gap-3 {\n gap: .75rem;\n}\n.hypurr-connect :is(.space-y-2 > :not([hidden]) ~ :not([hidden])) {\n --tw-space-y-reverse:0;\n margin-top: calc(.5rem*(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(.5rem*var(--tw-space-y-reverse));\n}\n.hypurr-connect :is(.space-y-3 > :not([hidden]) ~ :not([hidden])) {\n --tw-space-y-reverse:0;\n margin-top: calc(.75rem*(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(.75rem*var(--tw-space-y-reverse));\n}\n.hypurr-connect :is(.space-y-4 > :not([hidden]) ~ :not([hidden])) {\n --tw-space-y-reverse:0;\n margin-top: calc(1rem*(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem*var(--tw-space-y-reverse));\n}\n.hypurr-connect .overflow-hidden {\n overflow: hidden;\n}\n.hypurr-connect .truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.hypurr-connect .break-all {\n word-break: break-all;\n}\n.hypurr-connect .rounded {\n border-radius: .25rem;\n}\n.hypurr-connect .rounded-lg {\n border-radius: .5rem;\n}\n.hypurr-connect .rounded-md {\n border-radius: .375rem;\n}\n.hypurr-connect .border {\n border-width: 1px;\n}\n.hypurr-connect .border-b {\n border-bottom-width: 1px;\n}\n.hypurr-connect .border-amber-500\\/25 {\n border-color: rgba(245, 158, 11, .25);\n}\n.hypurr-connect .border-gray-700 {\n --tw-border-opacity:1;\n border-color: rgb(55 65 81/var(--tw-border-opacity,1));\n}\n.hypurr-connect .border-purple-500 {\n --tw-border-opacity:1;\n border-color: rgb(185 125 241/var(--tw-border-opacity,1));\n}\n.hypurr-connect .border-surface-bd {\n --tw-border-opacity:1;\n border-color: rgb(38 42 48/var(--tw-border-opacity,1));\n}\n.hypurr-connect .border-trade-down\\/20 {\n border-color: hsla(0, 91%, 71%, .2);\n}\n.hypurr-connect .border-trade-down\\/50 {\n border-color: hsla(0, 91%, 71%, .5);\n}\n.hypurr-connect .border-white\\/\\[0\\.06\\] {\n border-color: hsla(0, 0%, 100%, .06);\n}\n.hypurr-connect .border-white\\/\\[0\\.08\\] {\n border-color: hsla(0, 0%, 100%, .08);\n}\n.hypurr-connect .bg-amber-500\\/\\[0\\.08\\] {\n background-color: rgba(245, 158, 11, .08);\n}\n.hypurr-connect .bg-black\\/70 {\n background-color: rgba(0, 0, 0, .7);\n}\n.hypurr-connect .bg-surface-btn\\/90 {\n background-color: rgba(13, 18, 25, .9);\n}\n.hypurr-connect .bg-surface-modal {\n --tw-bg-opacity:1;\n background-color: rgb(14 18 24/var(--tw-bg-opacity,1));\n}\n.hypurr-connect .bg-trade-down\\/\\[0\\.08\\] {\n background-color: hsla(0, 91%, 71%, .08);\n}\n.hypurr-connect .bg-transparent {\n background-color: transparent;\n}\n.hypurr-connect .bg-white\\/\\[0\\.03\\] {\n background-color: hsla(0, 0%, 100%, .03);\n}\n.hypurr-connect .bg-white\\/\\[0\\.06\\] {\n background-color: hsla(0, 0%, 100%, .06);\n}\n.hypurr-connect .p-1\\.5 {\n padding: .375rem;\n}\n.hypurr-connect .p-3 {\n padding: .75rem;\n}\n.hypurr-connect .p-4 {\n padding: 1rem;\n}\n.hypurr-connect .px-3 {\n padding-left: .75rem;\n padding-right: .75rem;\n}\n.hypurr-connect .px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.hypurr-connect .py-1\\.5 {\n padding-top: .375rem;\n padding-bottom: .375rem;\n}\n.hypurr-connect .py-2 {\n padding-top: .5rem;\n padding-bottom: .5rem;\n}\n.hypurr-connect .py-2\\.5 {\n padding-top: .625rem;\n padding-bottom: .625rem;\n}\n.hypurr-connect .py-5 {\n padding-top: 1.25rem;\n}\n.hypurr-connect .pb-5,\n.hypurr-connect .py-5 {\n padding-bottom: 1.25rem;\n}\n.hypurr-connect .pb-6 {\n padding-bottom: 1.5rem;\n}\n.hypurr-connect .pr-11 {\n padding-right: 2.75rem;\n}\n.hypurr-connect .pt-5 {\n padding-top: 1.25rem;\n}\n.hypurr-connect .pt-6 {\n padding-top: 1.5rem;\n}\n.hypurr-connect .font-mono {\n font-family:\n Google Sans Code,\n Roboto Mono,\n ui-monospace,\n SFMono-Regular,\n Menlo,\n Monaco,\n Consolas,\n monospace;\n}\n.hypurr-connect .font-sans {\n font-family:\n Inter,\n ui-sans-serif,\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n Segoe UI,\n Roboto,\n Helvetica Neue,\n Arial,\n sans-serif;\n}\n.hypurr-connect .text-base {\n font-size: 12.5px;\n line-height: 1rem;\n}\n.hypurr-connect .text-lg {\n font-size: 14px;\n line-height: 1.25rem;\n}\n.hypurr-connect .font-medium {\n font-weight: 500;\n}\n.hypurr-connect .font-semibold {\n font-weight: 600;\n}\n.hypurr-connect .uppercase {\n text-transform: uppercase;\n}\n.hypurr-connect .tabular-nums {\n --tw-numeric-spacing:tabular-nums;\n font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);\n}\n.hypurr-connect .tracking-\\[0\\.1em\\] {\n letter-spacing: .1em;\n}\n.hypurr-connect .text-amber-200 {\n --tw-text-opacity:1;\n color: rgb(253 230 138/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-amber-400 {\n --tw-text-opacity:1;\n color: rgb(251 191 36/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-gray-400 {\n --tw-text-opacity:1;\n color: rgb(170 177 193/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-gray-500 {\n --tw-text-opacity:1;\n color: rgb(107 114 128/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-gray-600 {\n --tw-text-opacity:1;\n color: rgb(125 133 151/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-purple-400 {\n --tw-text-opacity:1;\n color: rgb(216 180 254/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-trade-down {\n --tw-text-opacity:1;\n color: rgb(248 113 113/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-trade-up {\n --tw-text-opacity:1;\n color: rgb(52 211 153/var(--tw-text-opacity,1));\n}\n.hypurr-connect .text-white {\n --tw-text-opacity:1;\n color: rgb(255 255 255/var(--tw-text-opacity,1));\n}\n.hypurr-connect .placeholder-gray-600::-moz-placeholder {\n --tw-placeholder-opacity:1;\n color: rgb(125 133 151/var(--tw-placeholder-opacity,1));\n}\n.hypurr-connect .placeholder-gray-600::placeholder {\n --tw-placeholder-opacity:1;\n color: rgb(125 133 151/var(--tw-placeholder-opacity,1));\n}\n.hypurr-connect .shadow-modal {\n --tw-shadow:0 25px 50px -12px rgba(0,0,0,.6);\n --tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow,0 0 #0000),\n var(--tw-ring-shadow,0 0 #0000),\n var(--tw-shadow);\n}\n.hypurr-connect .outline {\n outline-style: solid;\n}\n.hypurr-connect .blur {\n --tw-blur:blur(8px);\n}\n.hypurr-connect .blur,\n.hypurr-connect .drop-shadow {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.hypurr-connect .drop-shadow {\n --tw-drop-shadow:drop-shadow(0 1px 2px rgba(0,0,0,.1)) drop-shadow(0 1px 1px rgba(0,0,0,.06));\n}\n.hypurr-connect .filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.hypurr-connect .backdrop-blur-sm {\n --tw-backdrop-blur:blur(4px);\n -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n.hypurr-connect .transition {\n transition-property:\n color,\n background-color,\n border-color,\n text-decoration-color,\n fill,\n stroke,\n opacity,\n box-shadow,\n transform,\n filter,\n -webkit-backdrop-filter;\n transition-property:\n color,\n background-color,\n border-color,\n text-decoration-color,\n fill,\n stroke,\n opacity,\n box-shadow,\n transform,\n filter,\n backdrop-filter;\n transition-property:\n color,\n background-color,\n border-color,\n text-decoration-color,\n fill,\n stroke,\n opacity,\n box-shadow,\n transform,\n filter,\n backdrop-filter,\n -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n transition-duration: .15s;\n}\n.hypurr-connect .transition-colors {\n transition-property:\n color,\n background-color,\n border-color,\n text-decoration-color,\n fill,\n stroke;\n transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n transition-duration: .15s;\n}\n.hypurr-connect .hover\\:bg-purple-500\\/10:hover {\n background-color: rgba(185, 125, 241, .1);\n}\n.hypurr-connect .hover\\:text-gray-300:hover {\n --tw-text-opacity:1;\n color: rgb(209 213 219/var(--tw-text-opacity,1));\n}\n.hypurr-connect .hover\\:text-white:hover {\n --tw-text-opacity:1;\n color: rgb(255 255 255/var(--tw-text-opacity,1));\n}\n.hypurr-connect .focus\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.hypurr-connect .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n}\n.hypurr-connect .disabled\\:opacity-40:disabled {\n opacity: .4;\n}\n.hypurr-connect .disabled\\:opacity-50:disabled {\n opacity: .5;\n}\n");
|
|
25
|
+
|
|
1
26
|
// src/HypurrConnectProvider.tsx
|
|
2
27
|
import {
|
|
3
28
|
ExchangeClient,
|
|
@@ -62,22 +87,36 @@ async function generateAgentKey() {
|
|
|
62
87
|
const signer = new PrivateKeySigner(privateKey);
|
|
63
88
|
return { privateKey, address: signer.address };
|
|
64
89
|
}
|
|
65
|
-
|
|
90
|
+
function isNamedAgent(agent) {
|
|
91
|
+
return agent.name.replace(/ valid_until \d+$/, "") === AGENT_NAME;
|
|
92
|
+
}
|
|
93
|
+
async function fetchExtraAgents(userAddress, isTestnet) {
|
|
66
94
|
const url = isTestnet ? "https://api.hyperliquid-testnet.xyz/info" : "https://api.hyperliquid.xyz/info";
|
|
67
95
|
const res = await fetch(url, {
|
|
68
96
|
method: "POST",
|
|
69
97
|
headers: { "Content-Type": "application/json" },
|
|
70
98
|
body: JSON.stringify({ type: "extraAgents", user: userAddress })
|
|
71
99
|
});
|
|
72
|
-
if (!res.ok) return
|
|
100
|
+
if (!res.ok) return [];
|
|
73
101
|
const agents = await res.json();
|
|
74
|
-
if (!Array.isArray(agents)) return
|
|
102
|
+
if (!Array.isArray(agents)) return [];
|
|
103
|
+
return agents.map((agent) => ({
|
|
104
|
+
...agent,
|
|
105
|
+
validUntil: agent.validUntil * 1e3
|
|
106
|
+
}));
|
|
107
|
+
}
|
|
108
|
+
async function fetchActiveAgent(userAddress, isTestnet) {
|
|
75
109
|
const nowMs = Date.now();
|
|
76
|
-
const
|
|
77
|
-
|
|
78
|
-
);
|
|
110
|
+
const agents = await fetchExtraAgents(userAddress, isTestnet);
|
|
111
|
+
const match = agents.find((a) => isNamedAgent(a) && a.validUntil > nowMs);
|
|
79
112
|
if (!match) return null;
|
|
80
|
-
return
|
|
113
|
+
return match;
|
|
114
|
+
}
|
|
115
|
+
async function fetchAgentByAddress(userAddress, agentAddress, isTestnet) {
|
|
116
|
+
const agents = await fetchExtraAgents(userAddress, isTestnet);
|
|
117
|
+
return agents.find(
|
|
118
|
+
(agent) => agent.address.toLowerCase() === agentAddress.toLowerCase()
|
|
119
|
+
) ?? null;
|
|
81
120
|
}
|
|
82
121
|
async function isAgentValid(stored, userAddress, isTestnet) {
|
|
83
122
|
if (stored.validUntil <= Date.now()) return false;
|
|
@@ -197,6 +236,57 @@ var GrpcExchangeTransport = class {
|
|
|
197
236
|
}
|
|
198
237
|
};
|
|
199
238
|
|
|
239
|
+
// src/agentWallet.ts
|
|
240
|
+
var MS_PER_SECOND = 1e3;
|
|
241
|
+
var NS_PER_MS = 1e6;
|
|
242
|
+
var MS_PER_DAY = 24 * 60 * 60 * 1e3;
|
|
243
|
+
var TELEGRAM_AGENT_APPROVAL_NAME = "xyz";
|
|
244
|
+
var DEFAULT_AGENT_APPROVAL_DURATION_MS = MS_PER_DAY;
|
|
245
|
+
var AGENT_APPROVAL_DURATION_OPTIONS = [
|
|
246
|
+
{ label: "1 day", durationMs: MS_PER_DAY },
|
|
247
|
+
{ label: "7 days", durationMs: 7 * MS_PER_DAY },
|
|
248
|
+
{ label: "30 days", durationMs: 30 * MS_PER_DAY },
|
|
249
|
+
{ label: "90 days", durationMs: 90 * MS_PER_DAY }
|
|
250
|
+
];
|
|
251
|
+
function toFiniteNumber(value) {
|
|
252
|
+
if (value === void 0) return 0;
|
|
253
|
+
const numeric = typeof value === "bigint" ? Number(value) : Number(value);
|
|
254
|
+
return Number.isFinite(numeric) ? numeric : 0;
|
|
255
|
+
}
|
|
256
|
+
function normalizeAgentApprovalDurationMs(durationMs) {
|
|
257
|
+
return typeof durationMs === "number" && Number.isFinite(durationMs) && durationMs > 0 ? durationMs : DEFAULT_AGENT_APPROVAL_DURATION_MS;
|
|
258
|
+
}
|
|
259
|
+
function createTelegramAgentApprovalName(durationMs) {
|
|
260
|
+
const expiresAt = Date.now() + normalizeAgentApprovalDurationMs(durationMs);
|
|
261
|
+
return `${TELEGRAM_AGENT_APPROVAL_NAME} valid_until ${expiresAt}`;
|
|
262
|
+
}
|
|
263
|
+
function agentExpiresAtMs(wallet) {
|
|
264
|
+
if (!wallet.isAgent || !wallet.agentExpiresAt) return null;
|
|
265
|
+
const timestamp = wallet.agentExpiresAt;
|
|
266
|
+
if (timestamp instanceof Date) return timestamp.getTime();
|
|
267
|
+
if (typeof timestamp === "number") return timestamp;
|
|
268
|
+
if (typeof timestamp === "string") {
|
|
269
|
+
const parsed = Date.parse(timestamp);
|
|
270
|
+
return Number.isFinite(parsed) ? parsed : null;
|
|
271
|
+
}
|
|
272
|
+
const seconds = toFiniteNumber(timestamp.seconds);
|
|
273
|
+
const nanos = toFiniteNumber(timestamp.nanos);
|
|
274
|
+
const ms = seconds * MS_PER_SECOND + Math.floor(nanos / NS_PER_MS);
|
|
275
|
+
return Number.isFinite(ms) && ms > 0 ? ms : null;
|
|
276
|
+
}
|
|
277
|
+
function formatAgentExpiry(expiresAtMs) {
|
|
278
|
+
return new Intl.DateTimeFormat(void 0, {
|
|
279
|
+
dateStyle: "medium",
|
|
280
|
+
timeStyle: "short"
|
|
281
|
+
}).format(new Date(expiresAtMs));
|
|
282
|
+
}
|
|
283
|
+
function getAgentExpiryTitle(wallet) {
|
|
284
|
+
const expiresAtMs = agentExpiresAtMs(wallet);
|
|
285
|
+
if (!expiresAtMs || expiresAtMs > Date.now()) return null;
|
|
286
|
+
const expiresAt = formatAgentExpiry(expiresAtMs);
|
|
287
|
+
return `Agent approval expired ${expiresAt}. Connect the owner wallet to renew this agent.`;
|
|
288
|
+
}
|
|
289
|
+
|
|
200
290
|
// src/HypurrConnectProvider.tsx
|
|
201
291
|
import { jsx } from "react/jsx-runtime";
|
|
202
292
|
var TELEGRAM_STORAGE_KEY = "hypurr-connect-tg-jwt";
|
|
@@ -205,6 +295,23 @@ var TELEGRAM_AUTH_STATE_KEY = "hypurr-connect-auth-state";
|
|
|
205
295
|
var TELEGRAM_AUTH_MESSAGE = "hypurr-connect:telegram-auth";
|
|
206
296
|
var DEFAULT_AUTH_HUB_URL = "https://auth.hypurr.fun/login";
|
|
207
297
|
var DEFAULT_MEDIA_URL = "https://media.hypurr.fun";
|
|
298
|
+
var USER_SIGNED_DOMAIN_NAME = "HyperliquidSignTransaction";
|
|
299
|
+
var ZERO_ADDRESS = "0x0000000000000000000000000000000000000000";
|
|
300
|
+
var APPROVE_AGENT_PRIMARY_TYPE = "HyperliquidTransaction:ApproveAgent";
|
|
301
|
+
var APPROVE_AGENT_TYPES = {
|
|
302
|
+
[APPROVE_AGENT_PRIMARY_TYPE]: [
|
|
303
|
+
{ name: "hyperliquidChain", type: "string" },
|
|
304
|
+
{ name: "agentAddress", type: "address" },
|
|
305
|
+
{ name: "agentName", type: "string" },
|
|
306
|
+
{ name: "nonce", type: "uint64" }
|
|
307
|
+
]
|
|
308
|
+
};
|
|
309
|
+
var EIP712_DOMAIN_TYPES = [
|
|
310
|
+
{ name: "name", type: "string" },
|
|
311
|
+
{ name: "version", type: "string" },
|
|
312
|
+
{ name: "chainId", type: "uint256" },
|
|
313
|
+
{ name: "verifyingContract", type: "address" }
|
|
314
|
+
];
|
|
208
315
|
var IGNORED_EXTERNAL_SIGNATURE = "0x000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000001b";
|
|
209
316
|
var DEFAULT_TELEGRAM_SCOPES = [
|
|
210
317
|
"telegram:user:read",
|
|
@@ -239,6 +346,46 @@ function normalizeMediaUrl(mediaUrl) {
|
|
|
239
346
|
function isAddress(value) {
|
|
240
347
|
return !!value && /^0x[a-fA-F0-9]{40}$/.test(value);
|
|
241
348
|
}
|
|
349
|
+
function createApproveAgentAction(params) {
|
|
350
|
+
const nonce = Date.now();
|
|
351
|
+
return {
|
|
352
|
+
action: {
|
|
353
|
+
type: "approveAgent",
|
|
354
|
+
signatureChainId: `0x${params.chainId.toString(16)}`,
|
|
355
|
+
hyperliquidChain: params.isTestnet ? "Testnet" : "Mainnet",
|
|
356
|
+
agentAddress: params.agentAddress.toLowerCase(),
|
|
357
|
+
agentName: params.agentName,
|
|
358
|
+
nonce
|
|
359
|
+
},
|
|
360
|
+
nonce
|
|
361
|
+
};
|
|
362
|
+
}
|
|
363
|
+
async function signApproveAgentAction(params) {
|
|
364
|
+
const { action } = createApproveAgentAction(params);
|
|
365
|
+
const signatureHex = await params.signTypedDataAsync({
|
|
366
|
+
domain: {
|
|
367
|
+
name: USER_SIGNED_DOMAIN_NAME,
|
|
368
|
+
version: "1",
|
|
369
|
+
chainId: params.chainId,
|
|
370
|
+
verifyingContract: ZERO_ADDRESS
|
|
371
|
+
},
|
|
372
|
+
types: {
|
|
373
|
+
EIP712Domain: EIP712_DOMAIN_TYPES,
|
|
374
|
+
...APPROVE_AGENT_TYPES
|
|
375
|
+
},
|
|
376
|
+
primaryType: APPROVE_AGENT_PRIMARY_TYPE,
|
|
377
|
+
message: {
|
|
378
|
+
hyperliquidChain: action.hyperliquidChain,
|
|
379
|
+
agentAddress: action.agentAddress,
|
|
380
|
+
agentName: action.agentName,
|
|
381
|
+
nonce: action.nonce
|
|
382
|
+
}
|
|
383
|
+
});
|
|
384
|
+
return {
|
|
385
|
+
action,
|
|
386
|
+
signatureHex
|
|
387
|
+
};
|
|
388
|
+
}
|
|
242
389
|
function getRawSignedTransaction(result) {
|
|
243
390
|
if (typeof result === "string" && result.startsWith("0x")) {
|
|
244
391
|
return result;
|
|
@@ -877,6 +1024,104 @@ function HypurrConnectProvider({
|
|
|
877
1024
|
},
|
|
878
1025
|
[tgClient, telegramRpcOptions, refreshWallets]
|
|
879
1026
|
);
|
|
1027
|
+
const renewAgentWallet = useCallback(
|
|
1028
|
+
async ({
|
|
1029
|
+
walletId,
|
|
1030
|
+
ownerAddress,
|
|
1031
|
+
signTypedDataAsync,
|
|
1032
|
+
chainId,
|
|
1033
|
+
approvalDurationMs,
|
|
1034
|
+
agentName
|
|
1035
|
+
}) => {
|
|
1036
|
+
if (authMethod !== "telegram") {
|
|
1037
|
+
throw new Error(
|
|
1038
|
+
"[HypurrConnect] Agent wallet renewal is only available for Telegram wallets."
|
|
1039
|
+
);
|
|
1040
|
+
}
|
|
1041
|
+
if (!isAddress(ownerAddress)) {
|
|
1042
|
+
throw new Error(
|
|
1043
|
+
"[HypurrConnect] Connect the owner EOA wallet before renewing this agent."
|
|
1044
|
+
);
|
|
1045
|
+
}
|
|
1046
|
+
if (!telegramRpcOptions) {
|
|
1047
|
+
throw new Error("[HypurrConnect] No Telegram RPC session available.");
|
|
1048
|
+
}
|
|
1049
|
+
const wallet = wallets.find((w) => w.id === walletId);
|
|
1050
|
+
if (!wallet) {
|
|
1051
|
+
throw new Error("[HypurrConnect] Agent wallet not found.");
|
|
1052
|
+
}
|
|
1053
|
+
if (!wallet.isAgent) {
|
|
1054
|
+
throw new Error(
|
|
1055
|
+
"[HypurrConnect] Selected wallet is not an agent wallet."
|
|
1056
|
+
);
|
|
1057
|
+
}
|
|
1058
|
+
if (!isAddress(wallet.ethereumAddress)) {
|
|
1059
|
+
throw new Error(
|
|
1060
|
+
"[HypurrConnect] Agent wallet does not have a valid owner EVM address."
|
|
1061
|
+
);
|
|
1062
|
+
}
|
|
1063
|
+
if (ownerAddress.toLowerCase() !== wallet.ethereumAddress.toLowerCase()) {
|
|
1064
|
+
throw new Error(
|
|
1065
|
+
"[HypurrConnect] Connect the owner EOA for this agent wallet before renewing."
|
|
1066
|
+
);
|
|
1067
|
+
}
|
|
1068
|
+
const agentAddress = wallet.agentEthereumAddress?.value;
|
|
1069
|
+
if (!isAddress(agentAddress)) {
|
|
1070
|
+
throw new Error(
|
|
1071
|
+
"[HypurrConnect] Agent wallet does not have a valid agent EVM address."
|
|
1072
|
+
);
|
|
1073
|
+
}
|
|
1074
|
+
const isTestnet = config.isTestnet ?? false;
|
|
1075
|
+
const approvalAgentName = agentName ?? createTelegramAgentApprovalName(approvalDurationMs);
|
|
1076
|
+
setTgError(null);
|
|
1077
|
+
try {
|
|
1078
|
+
const { action, signatureHex } = await signApproveAgentAction({
|
|
1079
|
+
signTypedDataAsync,
|
|
1080
|
+
agentAddress,
|
|
1081
|
+
agentName: approvalAgentName,
|
|
1082
|
+
chainId,
|
|
1083
|
+
isTestnet
|
|
1084
|
+
});
|
|
1085
|
+
await tgClient.hyperliquidAgentWalletRenew(
|
|
1086
|
+
{
|
|
1087
|
+
authData: {},
|
|
1088
|
+
address: { value: wallet.ethereumAddress },
|
|
1089
|
+
signature: {
|
|
1090
|
+
agentAddress: action.agentAddress,
|
|
1091
|
+
agentName: action.agentName,
|
|
1092
|
+
nonce: action.nonce,
|
|
1093
|
+
chainId,
|
|
1094
|
+
signature: signatureHex
|
|
1095
|
+
}
|
|
1096
|
+
},
|
|
1097
|
+
telegramRpcOptions
|
|
1098
|
+
);
|
|
1099
|
+
const remote = await fetchAgentByAddress(
|
|
1100
|
+
ownerAddress,
|
|
1101
|
+
agentAddress,
|
|
1102
|
+
isTestnet
|
|
1103
|
+
);
|
|
1104
|
+
if (remote && remote.validUntil <= Date.now()) {
|
|
1105
|
+
throw new Error(
|
|
1106
|
+
"[HypurrConnect] Agent renewal was submitted, but the agent is still expired."
|
|
1107
|
+
);
|
|
1108
|
+
}
|
|
1109
|
+
refreshWallets();
|
|
1110
|
+
} catch (err) {
|
|
1111
|
+
console.error("[HypurrConnect] Agent wallet renewal failed:", err);
|
|
1112
|
+
setTgError(err instanceof Error ? err.message : String(err));
|
|
1113
|
+
throw err;
|
|
1114
|
+
}
|
|
1115
|
+
},
|
|
1116
|
+
[
|
|
1117
|
+
authMethod,
|
|
1118
|
+
config.isTestnet,
|
|
1119
|
+
refreshWallets,
|
|
1120
|
+
telegramRpcOptions,
|
|
1121
|
+
tgClient,
|
|
1122
|
+
wallets
|
|
1123
|
+
]
|
|
1124
|
+
);
|
|
880
1125
|
const createWalletPack = useCallback(
|
|
881
1126
|
async (name) => {
|
|
882
1127
|
const { response } = await tgClient.telegramChatWalletPackCreate(
|
|
@@ -1221,6 +1466,7 @@ function HypurrConnectProvider({
|
|
|
1221
1466
|
createWallet,
|
|
1222
1467
|
deleteWallet,
|
|
1223
1468
|
renameWallet,
|
|
1469
|
+
renewAgentWallet,
|
|
1224
1470
|
refreshWallets,
|
|
1225
1471
|
packs,
|
|
1226
1472
|
createWalletPack,
|
|
@@ -1263,6 +1509,7 @@ function HypurrConnectProvider({
|
|
|
1263
1509
|
createWallet,
|
|
1264
1510
|
deleteWallet,
|
|
1265
1511
|
renameWallet,
|
|
1512
|
+
renewAgentWallet,
|
|
1266
1513
|
refreshWallets,
|
|
1267
1514
|
packs,
|
|
1268
1515
|
createWalletPack,
|
|
@@ -1444,18 +1691,18 @@ var btnStyle = {
|
|
|
1444
1691
|
alignItems: "center",
|
|
1445
1692
|
gap: 12,
|
|
1446
1693
|
overflow: "hidden",
|
|
1447
|
-
borderRadius:
|
|
1448
|
-
background: "rgba(255,255,255,0.
|
|
1449
|
-
padding: "
|
|
1694
|
+
borderRadius: 4,
|
|
1695
|
+
background: "rgba(255,255,255,0.1)",
|
|
1696
|
+
padding: "4px 24px",
|
|
1450
1697
|
fontSize: 14,
|
|
1451
|
-
fontWeight:
|
|
1452
|
-
letterSpacing: "-0.
|
|
1698
|
+
fontWeight: 500,
|
|
1699
|
+
letterSpacing: "-0.03em",
|
|
1453
1700
|
color: "#fff",
|
|
1454
1701
|
cursor: "pointer",
|
|
1455
1702
|
border: "none",
|
|
1456
1703
|
transition: "background 150ms"
|
|
1457
1704
|
};
|
|
1458
|
-
var btnHoverBg = { background: "rgba(255,255,255,0.
|
|
1705
|
+
var btnHoverBg = { background: "rgba(255,255,255,0.15)" };
|
|
1459
1706
|
var backdropStyle = {
|
|
1460
1707
|
position: "fixed",
|
|
1461
1708
|
inset: 0,
|
|
@@ -1485,9 +1732,9 @@ var modalBoxStyle = {
|
|
|
1485
1732
|
padding: 24
|
|
1486
1733
|
};
|
|
1487
1734
|
var headingStyle = {
|
|
1488
|
-
fontSize:
|
|
1489
|
-
fontWeight:
|
|
1490
|
-
letterSpacing: "-0.
|
|
1735
|
+
fontSize: 20,
|
|
1736
|
+
fontWeight: 500,
|
|
1737
|
+
letterSpacing: "-0.03em",
|
|
1491
1738
|
color: "#fff",
|
|
1492
1739
|
margin: 0
|
|
1493
1740
|
};
|
|
@@ -1496,7 +1743,7 @@ var dividerStyle = {
|
|
|
1496
1743
|
width: "100%",
|
|
1497
1744
|
background: "rgba(255,255,255,0.05)"
|
|
1498
1745
|
};
|
|
1499
|
-
var iconSize = { width:
|
|
1746
|
+
var iconSize = { width: 26, height: 26 };
|
|
1500
1747
|
var mobileQuery = typeof window !== "undefined" ? window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT}px)`) : null;
|
|
1501
1748
|
function subscribeMobile(cb) {
|
|
1502
1749
|
mobileQuery?.addEventListener("change", cb);
|
|
@@ -1653,7 +1900,7 @@ var grabHandleStyle = {
|
|
|
1653
1900
|
margin: "0 auto",
|
|
1654
1901
|
height: 4,
|
|
1655
1902
|
width: 100,
|
|
1656
|
-
borderRadius:
|
|
1903
|
+
borderRadius: 4,
|
|
1657
1904
|
background: "rgba(255,255,255,0.05)"
|
|
1658
1905
|
};
|
|
1659
1906
|
function MobileDrawer({
|
|
@@ -1709,28 +1956,9 @@ function MobileDrawer({
|
|
|
1709
1956
|
] });
|
|
1710
1957
|
}
|
|
1711
1958
|
|
|
1712
|
-
// src/
|
|
1713
|
-
import { AnimatePresence as AnimatePresence5, motion as motion5 } from "framer-motion";
|
|
1714
|
-
import {
|
|
1715
|
-
Fragment as Fragment5,
|
|
1716
|
-
useCallback as useCallback6,
|
|
1717
|
-
useMemo as useMemo2,
|
|
1718
|
-
useState as useState5
|
|
1719
|
-
} from "react";
|
|
1720
|
-
|
|
1721
|
-
// src/UserProfileModal.tsx
|
|
1722
|
-
import { AnimatePresence as AnimatePresence4, motion as motion4 } from "framer-motion";
|
|
1723
|
-
import {
|
|
1724
|
-
useCallback as useCallback5,
|
|
1725
|
-
useState as useState4
|
|
1726
|
-
} from "react";
|
|
1727
|
-
|
|
1728
|
-
// src/DeleteWalletModal.tsx
|
|
1959
|
+
// src/AddWalletModal.tsx
|
|
1729
1960
|
import { AnimatePresence as AnimatePresence2, motion as motion2 } from "framer-motion";
|
|
1730
|
-
import {
|
|
1731
|
-
useCallback as useCallback3,
|
|
1732
|
-
useState as useState2
|
|
1733
|
-
} from "react";
|
|
1961
|
+
import { useCallback as useCallback3, useState as useState2 } from "react";
|
|
1734
1962
|
|
|
1735
1963
|
// src/icons/lucide.tsx
|
|
1736
1964
|
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
@@ -1777,6 +2005,47 @@ function Wallet(props) {
|
|
|
1777
2005
|
/* @__PURE__ */ jsx5("path", { d: "M18 12a2 2 0 0 0-2 2c0 1.1.9 2 2 2h4v-4z" })
|
|
1778
2006
|
] });
|
|
1779
2007
|
}
|
|
2008
|
+
function Bot(props) {
|
|
2009
|
+
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
2010
|
+
/* @__PURE__ */ jsx5("path", { d: "M12 8V4H8" }),
|
|
2011
|
+
/* @__PURE__ */ jsx5("rect", { width: "16", height: "12", x: "4", y: "8", rx: "2" }),
|
|
2012
|
+
/* @__PURE__ */ jsx5("path", { d: "M2 14h2" }),
|
|
2013
|
+
/* @__PURE__ */ jsx5("path", { d: "M20 14h2" }),
|
|
2014
|
+
/* @__PURE__ */ jsx5("path", { d: "M15 13v2" }),
|
|
2015
|
+
/* @__PURE__ */ jsx5("path", { d: "M9 13v2" })
|
|
2016
|
+
] });
|
|
2017
|
+
}
|
|
2018
|
+
function Eye(props) {
|
|
2019
|
+
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
2020
|
+
/* @__PURE__ */ jsx5("path", { d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" }),
|
|
2021
|
+
/* @__PURE__ */ jsx5("circle", { cx: "12", cy: "12", r: "3" })
|
|
2022
|
+
] });
|
|
2023
|
+
}
|
|
2024
|
+
function EyeOff(props) {
|
|
2025
|
+
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
2026
|
+
/* @__PURE__ */ jsx5("path", { d: "M10.733 5.076a10.74 10.74 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.8 10.8 0 0 1-1.444 2.49" }),
|
|
2027
|
+
/* @__PURE__ */ jsx5("path", { d: "M14.084 14.158a3 3 0 0 1-4.242-4.242" }),
|
|
2028
|
+
/* @__PURE__ */ jsx5("path", { d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143" }),
|
|
2029
|
+
/* @__PURE__ */ jsx5("path", { d: "m2 2 20 20" })
|
|
2030
|
+
] });
|
|
2031
|
+
}
|
|
2032
|
+
function Check(props) {
|
|
2033
|
+
return /* @__PURE__ */ jsx5("svg", { ...svgBase(props), children: /* @__PURE__ */ jsx5("path", { d: "M20 6 9 17l-5-5" }) });
|
|
2034
|
+
}
|
|
2035
|
+
function KeyRound(props) {
|
|
2036
|
+
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
2037
|
+
/* @__PURE__ */ jsx5("path", { d: "M2.586 17.414A2 2 0 0 0 2 18.828V21a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h1a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h.172a2 2 0 0 0 1.414-.586l.814-.814a6.5 6.5 0 1 0-4-4z" }),
|
|
2038
|
+
/* @__PURE__ */ jsx5("circle", { cx: "16.5", cy: "7.5", r: ".5", fill: "currentColor" })
|
|
2039
|
+
] });
|
|
2040
|
+
}
|
|
2041
|
+
function RefreshCw(props) {
|
|
2042
|
+
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
2043
|
+
/* @__PURE__ */ jsx5("path", { d: "M3 12a9 9 0 0 1 15.18-6.49" }),
|
|
2044
|
+
/* @__PURE__ */ jsx5("path", { d: "M21 3v6h-6" }),
|
|
2045
|
+
/* @__PURE__ */ jsx5("path", { d: "M21 12a9 9 0 0 1-15.18 6.49" }),
|
|
2046
|
+
/* @__PURE__ */ jsx5("path", { d: "M3 21v-6h6" })
|
|
2047
|
+
] });
|
|
2048
|
+
}
|
|
1780
2049
|
function TrendingUp(props) {
|
|
1781
2050
|
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
1782
2051
|
/* @__PURE__ */ jsx5("polyline", { points: "22 7 13.5 15.5 8.5 10.5 2 17" }),
|
|
@@ -1851,21 +2120,1026 @@ function LogOut(props) {
|
|
|
1851
2120
|
/* @__PURE__ */ jsx5("line", { x1: "21", x2: "9", y1: "12", y2: "12" })
|
|
1852
2121
|
] });
|
|
1853
2122
|
}
|
|
1854
|
-
function Plus(props) {
|
|
1855
|
-
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
1856
|
-
/* @__PURE__ */ jsx5("path", { d: "M5 12h14" }),
|
|
1857
|
-
/* @__PURE__ */ jsx5("path", { d: "M12 5v14" })
|
|
2123
|
+
function Plus(props) {
|
|
2124
|
+
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
2125
|
+
/* @__PURE__ */ jsx5("path", { d: "M5 12h14" }),
|
|
2126
|
+
/* @__PURE__ */ jsx5("path", { d: "M12 5v14" })
|
|
2127
|
+
] });
|
|
2128
|
+
}
|
|
2129
|
+
function X(props) {
|
|
2130
|
+
return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
|
|
2131
|
+
/* @__PURE__ */ jsx5("path", { d: "M18 6 6 18" }),
|
|
2132
|
+
/* @__PURE__ */ jsx5("path", { d: "m6 6 12 12" })
|
|
2133
|
+
] });
|
|
2134
|
+
}
|
|
2135
|
+
function SpinKeyframes() {
|
|
2136
|
+
return /* @__PURE__ */ jsx5("style", { children: `@keyframes hypurr-spin { to { transform: rotate(360deg); } }` });
|
|
2137
|
+
}
|
|
2138
|
+
|
|
2139
|
+
// src/AddWalletModal.tsx
|
|
2140
|
+
import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
2141
|
+
var WALLET_NAME_REGEX = /^[a-zA-Z0-9/]*$/;
|
|
2142
|
+
var PRIVATE_KEY_REGEX = /^(0x)?[a-fA-F0-9]{64}$/;
|
|
2143
|
+
var BASE_TAB_KEYS = ["generate", "import", "api"];
|
|
2144
|
+
function createAuthSignatureRequest(chainId, hyperliquidChain, agentAddress, approvalDurationMs) {
|
|
2145
|
+
const nonce = Date.now();
|
|
2146
|
+
return {
|
|
2147
|
+
domain: {
|
|
2148
|
+
name: "HyperliquidSignTransaction",
|
|
2149
|
+
version: "1",
|
|
2150
|
+
chainId,
|
|
2151
|
+
verifyingContract: "0x0000000000000000000000000000000000000000"
|
|
2152
|
+
},
|
|
2153
|
+
types: {
|
|
2154
|
+
"HyperliquidTransaction:ApproveAgent": [
|
|
2155
|
+
{ name: "hyperliquidChain", type: "string" },
|
|
2156
|
+
{ name: "agentAddress", type: "address" },
|
|
2157
|
+
{ name: "agentName", type: "string" },
|
|
2158
|
+
{ name: "nonce", type: "uint64" }
|
|
2159
|
+
]
|
|
2160
|
+
},
|
|
2161
|
+
primaryType: "HyperliquidTransaction:ApproveAgent",
|
|
2162
|
+
message: {
|
|
2163
|
+
hyperliquidChain,
|
|
2164
|
+
agentAddress: agentAddress.toLowerCase(),
|
|
2165
|
+
agentName: createTelegramAgentApprovalName(approvalDurationMs),
|
|
2166
|
+
nonce
|
|
2167
|
+
}
|
|
2168
|
+
};
|
|
2169
|
+
}
|
|
2170
|
+
var tabClass = (selected) => `flex-1 py-1.5 rounded text-base font-medium flex items-center justify-center gap-1.5 ${selected ? "btn-raised-active" : "btn-raised"}`;
|
|
2171
|
+
var inputClass = (hasError) => `w-full bg-surface-btn/90 border ${hasError ? "border-trade-down/50" : "border-surface-bd"} rounded-lg px-3 py-2.5 text-white placeholder-gray-600 focus:outline-none font-mono text-base`;
|
|
2172
|
+
var formatAddress = (address) => `${address.slice(0, 6)}...${address.slice(-4)}`;
|
|
2173
|
+
function AddWalletModal({
|
|
2174
|
+
isOpen,
|
|
2175
|
+
onClose,
|
|
2176
|
+
ownerAddress,
|
|
2177
|
+
isWalletConnected,
|
|
2178
|
+
chainId,
|
|
2179
|
+
signTypedDataAsync,
|
|
2180
|
+
onConnectWallet,
|
|
2181
|
+
onDisconnectWallet,
|
|
2182
|
+
onWalletAdded,
|
|
2183
|
+
onAddReadOnlyWallet,
|
|
2184
|
+
onNotify,
|
|
2185
|
+
hyperliquidChain = "Mainnet",
|
|
2186
|
+
agentApprovalDurationOptions,
|
|
2187
|
+
defaultAgentApprovalDurationMs = DEFAULT_AGENT_APPROVAL_DURATION_MS
|
|
2188
|
+
}) {
|
|
2189
|
+
const tabKeys = onAddReadOnlyWallet ? [...BASE_TAB_KEYS, "readonly"] : BASE_TAB_KEYS;
|
|
2190
|
+
const [activeTab, setActiveTab] = useState2("generate");
|
|
2191
|
+
const [isLoading, setIsLoading] = useState2(false);
|
|
2192
|
+
const [walletName, setWalletName] = useState2("");
|
|
2193
|
+
const [newWalletName, setNewWalletName] = useState2("");
|
|
2194
|
+
const [importWalletName, setImportWalletName] = useState2("");
|
|
2195
|
+
const [importPrivateKey, setImportPrivateKey] = useState2("");
|
|
2196
|
+
const [showImportPrivateKey, setShowImportPrivateKey] = useState2(false);
|
|
2197
|
+
const [readOnlyAddress, setReadOnlyAddress] = useState2("");
|
|
2198
|
+
const [agentApprovalDurationMs, setAgentApprovalDurationMs] = useState2(
|
|
2199
|
+
defaultAgentApprovalDurationMs
|
|
2200
|
+
);
|
|
2201
|
+
const [error, setError] = useState2(null);
|
|
2202
|
+
const {
|
|
2203
|
+
authMethod,
|
|
2204
|
+
createWallet,
|
|
2205
|
+
isLoading: userLoading,
|
|
2206
|
+
refreshWallets,
|
|
2207
|
+
telegramClient,
|
|
2208
|
+
telegramRpcOptions
|
|
2209
|
+
} = useHypurrConnectInternal();
|
|
2210
|
+
const isValidWalletName = walletName.length > 0 && WALLET_NAME_REGEX.test(walletName);
|
|
2211
|
+
const isValidNewWalletName = newWalletName.length > 0 && WALLET_NAME_REGEX.test(newWalletName);
|
|
2212
|
+
const isValidImportWalletName = importWalletName.length > 0 && WALLET_NAME_REGEX.test(importWalletName);
|
|
2213
|
+
const trimmedImportPrivateKey = importPrivateKey.trim();
|
|
2214
|
+
const isValidImportPrivateKey = PRIVATE_KEY_REGEX.test(
|
|
2215
|
+
trimmedImportPrivateKey
|
|
2216
|
+
);
|
|
2217
|
+
const isProcessing = isLoading || userLoading;
|
|
2218
|
+
const durationOptions = agentApprovalDurationOptions && agentApprovalDurationOptions.length > 0 ? agentApprovalDurationOptions : AGENT_APPROVAL_DURATION_OPTIONS;
|
|
2219
|
+
const handleClose = useCallback3(() => {
|
|
2220
|
+
if (isProcessing) return;
|
|
2221
|
+
setError(null);
|
|
2222
|
+
setImportPrivateKey("");
|
|
2223
|
+
setShowImportPrivateKey(false);
|
|
2224
|
+
onClose();
|
|
2225
|
+
}, [isProcessing, onClose]);
|
|
2226
|
+
const assertTelegramReady = useCallback3(() => {
|
|
2227
|
+
if (authMethod !== "telegram" || !telegramRpcOptions) {
|
|
2228
|
+
throw new Error("Telegram login is required to add wallets");
|
|
2229
|
+
}
|
|
2230
|
+
}, [authMethod, telegramRpcOptions]);
|
|
2231
|
+
const completeWalletAdded = useCallback3(
|
|
2232
|
+
async (wallet) => {
|
|
2233
|
+
refreshWallets();
|
|
2234
|
+
await onWalletAdded?.(wallet);
|
|
2235
|
+
},
|
|
2236
|
+
[onWalletAdded, refreshWallets]
|
|
2237
|
+
);
|
|
2238
|
+
const handleCreateWallet = useCallback3(async () => {
|
|
2239
|
+
if (!isValidNewWalletName) {
|
|
2240
|
+
setError("Wallet name may only contain letters, numbers, and /");
|
|
2241
|
+
return;
|
|
2242
|
+
}
|
|
2243
|
+
setError(null);
|
|
2244
|
+
setIsLoading(true);
|
|
2245
|
+
try {
|
|
2246
|
+
assertTelegramReady();
|
|
2247
|
+
const wallet = await createWallet(newWalletName);
|
|
2248
|
+
await completeWalletAdded(wallet);
|
|
2249
|
+
onNotify?.({ type: "success", message: "Wallet created successfully" });
|
|
2250
|
+
setNewWalletName("");
|
|
2251
|
+
handleClose();
|
|
2252
|
+
} catch (e) {
|
|
2253
|
+
const message = e instanceof Error ? e.message : "Failed to create wallet";
|
|
2254
|
+
setError(message);
|
|
2255
|
+
onNotify?.({ type: "error", message });
|
|
2256
|
+
} finally {
|
|
2257
|
+
setIsLoading(false);
|
|
2258
|
+
}
|
|
2259
|
+
}, [
|
|
2260
|
+
assertTelegramReady,
|
|
2261
|
+
completeWalletAdded,
|
|
2262
|
+
createWallet,
|
|
2263
|
+
handleClose,
|
|
2264
|
+
isValidNewWalletName,
|
|
2265
|
+
newWalletName,
|
|
2266
|
+
onNotify
|
|
2267
|
+
]);
|
|
2268
|
+
const handleImportWallet = useCallback3(async () => {
|
|
2269
|
+
if (!isValidImportWalletName) {
|
|
2270
|
+
setError("Wallet name may only contain letters, numbers, and /");
|
|
2271
|
+
return;
|
|
2272
|
+
}
|
|
2273
|
+
if (!isValidImportPrivateKey) {
|
|
2274
|
+
setError("Please enter a valid 64-character hex private key");
|
|
2275
|
+
return;
|
|
2276
|
+
}
|
|
2277
|
+
setError(null);
|
|
2278
|
+
setIsLoading(true);
|
|
2279
|
+
try {
|
|
2280
|
+
assertTelegramReady();
|
|
2281
|
+
const response = await telegramClient.hyperliquidWalletImport(
|
|
2282
|
+
{
|
|
2283
|
+
authData: {},
|
|
2284
|
+
name: importWalletName,
|
|
2285
|
+
privateKey: trimmedImportPrivateKey
|
|
2286
|
+
},
|
|
2287
|
+
telegramRpcOptions
|
|
2288
|
+
);
|
|
2289
|
+
await completeWalletAdded(response.response.wallet);
|
|
2290
|
+
onNotify?.({ type: "success", message: "Wallet imported successfully" });
|
|
2291
|
+
setImportWalletName("");
|
|
2292
|
+
setImportPrivateKey("");
|
|
2293
|
+
handleClose();
|
|
2294
|
+
} catch (e) {
|
|
2295
|
+
const message = e instanceof Error ? e.message : "Failed to import wallet";
|
|
2296
|
+
setError(message);
|
|
2297
|
+
onNotify?.({ type: "error", message });
|
|
2298
|
+
} finally {
|
|
2299
|
+
setIsLoading(false);
|
|
2300
|
+
}
|
|
2301
|
+
}, [
|
|
2302
|
+
assertTelegramReady,
|
|
2303
|
+
completeWalletAdded,
|
|
2304
|
+
handleClose,
|
|
2305
|
+
importWalletName,
|
|
2306
|
+
isValidImportPrivateKey,
|
|
2307
|
+
isValidImportWalletName,
|
|
2308
|
+
onNotify,
|
|
2309
|
+
telegramClient,
|
|
2310
|
+
telegramRpcOptions,
|
|
2311
|
+
trimmedImportPrivateKey
|
|
2312
|
+
]);
|
|
2313
|
+
const handleSignAndAdd = useCallback3(async () => {
|
|
2314
|
+
if (!ownerAddress) {
|
|
2315
|
+
onConnectWallet?.();
|
|
2316
|
+
return;
|
|
2317
|
+
}
|
|
2318
|
+
if (!signTypedDataAsync || !chainId) {
|
|
2319
|
+
setError("Wallet signing is not ready yet");
|
|
2320
|
+
return;
|
|
2321
|
+
}
|
|
2322
|
+
if (!isValidWalletName) {
|
|
2323
|
+
setError("Wallet name may only contain letters, numbers, and /");
|
|
2324
|
+
return;
|
|
2325
|
+
}
|
|
2326
|
+
setError(null);
|
|
2327
|
+
setIsLoading(true);
|
|
2328
|
+
try {
|
|
2329
|
+
assertTelegramReady();
|
|
2330
|
+
const res = await telegramClient.hyperliquidAgentSignatureCreate(
|
|
2331
|
+
{ authData: {}, address: ownerAddress },
|
|
2332
|
+
telegramRpcOptions
|
|
2333
|
+
);
|
|
2334
|
+
const agentAddress = res.response.agent;
|
|
2335
|
+
const request = createAuthSignatureRequest(
|
|
2336
|
+
chainId,
|
|
2337
|
+
hyperliquidChain,
|
|
2338
|
+
agentAddress,
|
|
2339
|
+
agentApprovalDurationMs
|
|
2340
|
+
);
|
|
2341
|
+
const signature = await signTypedDataAsync(request);
|
|
2342
|
+
await telegramClient.hyperliquidAgentWalletCreate(
|
|
2343
|
+
{
|
|
2344
|
+
authData: {},
|
|
2345
|
+
name: walletName,
|
|
2346
|
+
signature: {
|
|
2347
|
+
agentAddress: request.message.agentAddress,
|
|
2348
|
+
agentName: request.message.agentName,
|
|
2349
|
+
nonce: request.message.nonce,
|
|
2350
|
+
chainId,
|
|
2351
|
+
signature
|
|
2352
|
+
}
|
|
2353
|
+
},
|
|
2354
|
+
telegramRpcOptions
|
|
2355
|
+
);
|
|
2356
|
+
await completeWalletAdded();
|
|
2357
|
+
onNotify?.({ type: "success", message: "Wallet added successfully" });
|
|
2358
|
+
onDisconnectWallet?.();
|
|
2359
|
+
setWalletName("");
|
|
2360
|
+
handleClose();
|
|
2361
|
+
} catch (e) {
|
|
2362
|
+
const message = e instanceof Error ? e.message : "Failed to add wallet";
|
|
2363
|
+
setError(message);
|
|
2364
|
+
onNotify?.({ type: "error", message });
|
|
2365
|
+
} finally {
|
|
2366
|
+
setIsLoading(false);
|
|
2367
|
+
}
|
|
2368
|
+
}, [
|
|
2369
|
+
assertTelegramReady,
|
|
2370
|
+
agentApprovalDurationMs,
|
|
2371
|
+
chainId,
|
|
2372
|
+
completeWalletAdded,
|
|
2373
|
+
handleClose,
|
|
2374
|
+
hyperliquidChain,
|
|
2375
|
+
isValidWalletName,
|
|
2376
|
+
onConnectWallet,
|
|
2377
|
+
onDisconnectWallet,
|
|
2378
|
+
onNotify,
|
|
2379
|
+
ownerAddress,
|
|
2380
|
+
signTypedDataAsync,
|
|
2381
|
+
telegramClient,
|
|
2382
|
+
telegramRpcOptions,
|
|
2383
|
+
walletName
|
|
2384
|
+
]);
|
|
2385
|
+
const handleAddReadOnly = useCallback3(async () => {
|
|
2386
|
+
const trimmed = readOnlyAddress.trim();
|
|
2387
|
+
if (!trimmed) {
|
|
2388
|
+
setError("Please enter a wallet address");
|
|
2389
|
+
return;
|
|
2390
|
+
}
|
|
2391
|
+
if (!/^0x[a-fA-F0-9]{40}$/.test(trimmed)) {
|
|
2392
|
+
setError("Invalid Ethereum address format");
|
|
2393
|
+
return;
|
|
2394
|
+
}
|
|
2395
|
+
setError(null);
|
|
2396
|
+
setIsLoading(true);
|
|
2397
|
+
try {
|
|
2398
|
+
await onAddReadOnlyWallet?.(trimmed);
|
|
2399
|
+
onNotify?.({ type: "success", message: "Read-only wallet added" });
|
|
2400
|
+
setReadOnlyAddress("");
|
|
2401
|
+
handleClose();
|
|
2402
|
+
} catch (e) {
|
|
2403
|
+
const message = e instanceof Error ? e.message : "Failed to add wallet";
|
|
2404
|
+
setError(message);
|
|
2405
|
+
onNotify?.({ type: "error", message });
|
|
2406
|
+
} finally {
|
|
2407
|
+
setIsLoading(false);
|
|
2408
|
+
}
|
|
2409
|
+
}, [handleClose, onAddReadOnlyWallet, onNotify, readOnlyAddress]);
|
|
2410
|
+
return /* @__PURE__ */ jsx6(AnimatePresence2, { children: isOpen && /* @__PURE__ */ jsxs5(motion2.div, { className: "hypurr-connect", style: { display: "contents" }, children: [
|
|
2411
|
+
/* @__PURE__ */ jsx6(SpinKeyframes, {}),
|
|
2412
|
+
/* @__PURE__ */ jsx6(
|
|
2413
|
+
motion2.div,
|
|
2414
|
+
{
|
|
2415
|
+
className: "fixed inset-0 z-[100] bg-black/70 backdrop-blur-sm",
|
|
2416
|
+
initial: { opacity: 0 },
|
|
2417
|
+
animate: { opacity: 1 },
|
|
2418
|
+
exit: { opacity: 0 },
|
|
2419
|
+
transition: { duration: 0.15 },
|
|
2420
|
+
onClick: handleClose
|
|
2421
|
+
}
|
|
2422
|
+
),
|
|
2423
|
+
/* @__PURE__ */ jsx6("div", { className: "fixed inset-0 z-[101] flex items-center justify-center p-4", children: /* @__PURE__ */ jsxs5(
|
|
2424
|
+
motion2.div,
|
|
2425
|
+
{
|
|
2426
|
+
className: "relative w-full max-w-md overflow-hidden rounded-lg border border-surface-bd bg-surface-modal font-sans shadow-modal",
|
|
2427
|
+
initial: { opacity: 0, y: 8 },
|
|
2428
|
+
animate: { opacity: 1, y: 0 },
|
|
2429
|
+
exit: { opacity: 0, y: 8 },
|
|
2430
|
+
transition: { duration: 0.18, ease: "easeOut" },
|
|
2431
|
+
onClick: (event) => event.stopPropagation(),
|
|
2432
|
+
children: [
|
|
2433
|
+
/* @__PURE__ */ jsxs5("div", { className: "relative flex items-center justify-center border-b border-white/[0.06] px-6 pb-5 pt-6", children: [
|
|
2434
|
+
/* @__PURE__ */ jsx6("h3", { className: "text-lg font-semibold text-white", children: "Add Wallet" }),
|
|
2435
|
+
/* @__PURE__ */ jsx6(
|
|
2436
|
+
"button",
|
|
2437
|
+
{
|
|
2438
|
+
onClick: handleClose,
|
|
2439
|
+
disabled: isProcessing,
|
|
2440
|
+
className: "absolute right-6 text-gray-400 transition-colors hover:text-white disabled:cursor-not-allowed disabled:opacity-40",
|
|
2441
|
+
"aria-label": "Close",
|
|
2442
|
+
children: /* @__PURE__ */ jsx6(X, { size: 16 })
|
|
2443
|
+
}
|
|
2444
|
+
)
|
|
2445
|
+
] }),
|
|
2446
|
+
/* @__PURE__ */ jsx6("div", { className: "flex gap-1.5 px-6 pt-5", children: tabKeys.map((tab) => /* @__PURE__ */ jsx6(
|
|
2447
|
+
"button",
|
|
2448
|
+
{
|
|
2449
|
+
type: "button",
|
|
2450
|
+
onClick: () => {
|
|
2451
|
+
setError(null);
|
|
2452
|
+
setActiveTab(tab);
|
|
2453
|
+
},
|
|
2454
|
+
className: tabClass(activeTab === tab),
|
|
2455
|
+
children: tab === "generate" ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2456
|
+
/* @__PURE__ */ jsx6(Plus, { size: 13 }),
|
|
2457
|
+
" New"
|
|
2458
|
+
] }) : tab === "import" ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2459
|
+
/* @__PURE__ */ jsx6(KeyRound, { size: 13 }),
|
|
2460
|
+
" Import"
|
|
2461
|
+
] }) : tab === "api" ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2462
|
+
/* @__PURE__ */ jsx6(Wallet, { size: 13 }),
|
|
2463
|
+
" Link"
|
|
2464
|
+
] }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2465
|
+
/* @__PURE__ */ jsx6(Eye, { size: 13 }),
|
|
2466
|
+
" Watch"
|
|
2467
|
+
] })
|
|
2468
|
+
},
|
|
2469
|
+
tab
|
|
2470
|
+
)) }),
|
|
2471
|
+
/* @__PURE__ */ jsxs5("div", { className: "px-6 pb-6 pt-5", children: [
|
|
2472
|
+
activeTab === "generate" && /* @__PURE__ */ jsxs5("section", { className: "space-y-4", children: [
|
|
2473
|
+
/* @__PURE__ */ jsx6("p", { className: "text-base text-gray-400", children: "Create a new Hyperliquid wallet." }),
|
|
2474
|
+
/* @__PURE__ */ jsx6(
|
|
2475
|
+
WalletNameInput,
|
|
2476
|
+
{
|
|
2477
|
+
value: newWalletName,
|
|
2478
|
+
setValue: setNewWalletName,
|
|
2479
|
+
isValid: isValidNewWalletName,
|
|
2480
|
+
clearError: () => setError(null),
|
|
2481
|
+
placeholder: "MyNewWallet"
|
|
2482
|
+
}
|
|
2483
|
+
),
|
|
2484
|
+
/* @__PURE__ */ jsx6(
|
|
2485
|
+
"button",
|
|
2486
|
+
{
|
|
2487
|
+
onClick: handleCreateWallet,
|
|
2488
|
+
disabled: isProcessing || !isValidNewWalletName,
|
|
2489
|
+
className: `flex w-full items-center justify-center gap-2 rounded-lg py-2 text-base font-medium ${!isProcessing && isValidNewWalletName ? "btn-raised" : "btn-raised-disabled"}`,
|
|
2490
|
+
children: isProcessing ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2491
|
+
/* @__PURE__ */ jsx6(Loader2, { size: 14 }),
|
|
2492
|
+
" Creating..."
|
|
2493
|
+
] }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2494
|
+
/* @__PURE__ */ jsx6(Plus, { size: 14 }),
|
|
2495
|
+
" Create Wallet"
|
|
2496
|
+
] })
|
|
2497
|
+
}
|
|
2498
|
+
),
|
|
2499
|
+
error && /* @__PURE__ */ jsx6(ErrorBox, { message: error })
|
|
2500
|
+
] }),
|
|
2501
|
+
activeTab === "import" && /* @__PURE__ */ jsxs5("section", { className: "space-y-4", children: [
|
|
2502
|
+
/* @__PURE__ */ jsx6("p", { className: "text-base text-gray-400", children: "Import a Hyperliquid wallet with its private key." }),
|
|
2503
|
+
/* @__PURE__ */ jsx6(
|
|
2504
|
+
WalletNameInput,
|
|
2505
|
+
{
|
|
2506
|
+
value: importWalletName,
|
|
2507
|
+
setValue: setImportWalletName,
|
|
2508
|
+
isValid: isValidImportWalletName,
|
|
2509
|
+
clearError: () => setError(null),
|
|
2510
|
+
placeholder: "MyImportedWallet"
|
|
2511
|
+
}
|
|
2512
|
+
),
|
|
2513
|
+
/* @__PURE__ */ jsxs5("div", { children: [
|
|
2514
|
+
/* @__PURE__ */ jsx6("label", { className: "mb-2 block text-base uppercase tracking-[0.1em] text-gray-400", children: "Private Key" }),
|
|
2515
|
+
/* @__PURE__ */ jsxs5("div", { className: "relative", children: [
|
|
2516
|
+
/* @__PURE__ */ jsx6(
|
|
2517
|
+
"input",
|
|
2518
|
+
{
|
|
2519
|
+
type: showImportPrivateKey ? "text" : "password",
|
|
2520
|
+
value: importPrivateKey,
|
|
2521
|
+
onChange: (event) => {
|
|
2522
|
+
setImportPrivateKey(event.target.value);
|
|
2523
|
+
setError(null);
|
|
2524
|
+
},
|
|
2525
|
+
placeholder: "0x...",
|
|
2526
|
+
spellCheck: false,
|
|
2527
|
+
autoComplete: "off",
|
|
2528
|
+
className: `${inputClass(
|
|
2529
|
+
!!importPrivateKey && !isValidImportPrivateKey
|
|
2530
|
+
)} pr-11`
|
|
2531
|
+
}
|
|
2532
|
+
),
|
|
2533
|
+
/* @__PURE__ */ jsx6(
|
|
2534
|
+
"button",
|
|
2535
|
+
{
|
|
2536
|
+
type: "button",
|
|
2537
|
+
onClick: () => setShowImportPrivateKey((visible) => !visible),
|
|
2538
|
+
className: "absolute right-2 top-1/2 -translate-y-1/2 p-1.5 text-gray-500 transition-colors hover:text-gray-300",
|
|
2539
|
+
"aria-label": showImportPrivateKey ? "Hide private key" : "Show private key",
|
|
2540
|
+
children: showImportPrivateKey ? /* @__PURE__ */ jsx6(EyeOff, { size: 15 }) : /* @__PURE__ */ jsx6(Eye, { size: 15 })
|
|
2541
|
+
}
|
|
2542
|
+
)
|
|
2543
|
+
] })
|
|
2544
|
+
] }),
|
|
2545
|
+
/* @__PURE__ */ jsx6(
|
|
2546
|
+
"button",
|
|
2547
|
+
{
|
|
2548
|
+
onClick: handleImportWallet,
|
|
2549
|
+
disabled: isProcessing || !isValidImportWalletName || !isValidImportPrivateKey,
|
|
2550
|
+
className: `flex w-full items-center justify-center gap-2 rounded-lg border bg-transparent py-2 text-base font-medium transition-colors ${!isProcessing && isValidImportWalletName && isValidImportPrivateKey ? "border-purple-500 text-purple-400 hover:bg-purple-500/10" : "cursor-not-allowed border-gray-700 text-gray-600"}`,
|
|
2551
|
+
children: isProcessing ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2552
|
+
/* @__PURE__ */ jsx6(Loader2, { size: 14 }),
|
|
2553
|
+
" Importing..."
|
|
2554
|
+
] }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2555
|
+
/* @__PURE__ */ jsx6(KeyRound, { size: 14 }),
|
|
2556
|
+
" Import Wallet"
|
|
2557
|
+
] })
|
|
2558
|
+
}
|
|
2559
|
+
),
|
|
2560
|
+
error && /* @__PURE__ */ jsx6(ErrorBox, { message: error })
|
|
2561
|
+
] }),
|
|
2562
|
+
activeTab === "api" && /* @__PURE__ */ jsxs5("section", { className: "space-y-4", children: [
|
|
2563
|
+
/* @__PURE__ */ jsx6("p", { className: "text-base text-gray-400", children: "Connect your wallet and sign to link it for trading." }),
|
|
2564
|
+
!isWalletConnected || !ownerAddress ? /* @__PURE__ */ jsxs5(
|
|
2565
|
+
"button",
|
|
2566
|
+
{
|
|
2567
|
+
onClick: onConnectWallet,
|
|
2568
|
+
className: "btn-raised flex w-full items-center justify-center gap-2 rounded-lg py-2 text-base font-medium",
|
|
2569
|
+
children: [
|
|
2570
|
+
/* @__PURE__ */ jsx6(Wallet, { size: 14 }),
|
|
2571
|
+
" Connect Wallet"
|
|
2572
|
+
]
|
|
2573
|
+
}
|
|
2574
|
+
) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2575
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-3 rounded-lg border border-white/[0.06] bg-white/[0.03] px-3 py-2.5", children: [
|
|
2576
|
+
/* @__PURE__ */ jsx6("div", { className: "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-md border border-white/[0.08] bg-white/[0.06]", children: /* @__PURE__ */ jsx6(Wallet, { size: 14, className: "text-gray-400" }) }),
|
|
2577
|
+
/* @__PURE__ */ jsxs5("div", { className: "min-w-0 flex-1", children: [
|
|
2578
|
+
/* @__PURE__ */ jsx6("p", { className: "text-base text-gray-400", children: "Connected" }),
|
|
2579
|
+
/* @__PURE__ */ jsx6("p", { className: "font-mono text-base text-white", children: formatAddress(ownerAddress) })
|
|
2580
|
+
] }),
|
|
2581
|
+
/* @__PURE__ */ jsx6(
|
|
2582
|
+
Check,
|
|
2583
|
+
{
|
|
2584
|
+
size: 16,
|
|
2585
|
+
className: "flex-shrink-0 text-trade-up"
|
|
2586
|
+
}
|
|
2587
|
+
)
|
|
2588
|
+
] }),
|
|
2589
|
+
/* @__PURE__ */ jsx6(
|
|
2590
|
+
WalletNameInput,
|
|
2591
|
+
{
|
|
2592
|
+
value: walletName,
|
|
2593
|
+
setValue: setWalletName,
|
|
2594
|
+
isValid: isValidWalletName,
|
|
2595
|
+
clearError: () => setError(null),
|
|
2596
|
+
placeholder: "MyWallet"
|
|
2597
|
+
}
|
|
2598
|
+
),
|
|
2599
|
+
/* @__PURE__ */ jsx6(
|
|
2600
|
+
ApprovalDurationPicker,
|
|
2601
|
+
{
|
|
2602
|
+
value: agentApprovalDurationMs,
|
|
2603
|
+
onChange: setAgentApprovalDurationMs,
|
|
2604
|
+
options: durationOptions,
|
|
2605
|
+
disabled: isProcessing
|
|
2606
|
+
}
|
|
2607
|
+
),
|
|
2608
|
+
/* @__PURE__ */ jsx6(
|
|
2609
|
+
"button",
|
|
2610
|
+
{
|
|
2611
|
+
onClick: handleSignAndAdd,
|
|
2612
|
+
disabled: isProcessing || !isValidWalletName,
|
|
2613
|
+
className: `flex w-full items-center justify-center gap-2 rounded-lg py-2 text-base font-medium ${!isProcessing && isValidWalletName ? "btn-raised" : "btn-raised-disabled"}`,
|
|
2614
|
+
children: isProcessing ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2615
|
+
/* @__PURE__ */ jsx6(Loader2, { size: 14 }),
|
|
2616
|
+
" Signing..."
|
|
2617
|
+
] }) : "Sign & Add Wallet"
|
|
2618
|
+
}
|
|
2619
|
+
),
|
|
2620
|
+
onDisconnectWallet && /* @__PURE__ */ jsx6(
|
|
2621
|
+
"button",
|
|
2622
|
+
{
|
|
2623
|
+
onClick: onDisconnectWallet,
|
|
2624
|
+
className: "w-full py-1.5 text-base text-gray-400 transition-colors hover:text-gray-300",
|
|
2625
|
+
children: "Disconnect & use different wallet"
|
|
2626
|
+
}
|
|
2627
|
+
)
|
|
2628
|
+
] }),
|
|
2629
|
+
error && /* @__PURE__ */ jsx6(ErrorBox, { message: error })
|
|
2630
|
+
] }),
|
|
2631
|
+
activeTab === "readonly" && onAddReadOnlyWallet && /* @__PURE__ */ jsxs5("section", { className: "space-y-4", children: [
|
|
2632
|
+
/* @__PURE__ */ jsx6("p", { className: "text-base text-gray-400", children: "View positions and balances without trading access." }),
|
|
2633
|
+
/* @__PURE__ */ jsxs5("div", { children: [
|
|
2634
|
+
/* @__PURE__ */ jsx6("label", { className: "mb-2 block text-base uppercase tracking-[0.1em] text-gray-400", children: "Wallet Address" }),
|
|
2635
|
+
/* @__PURE__ */ jsx6(
|
|
2636
|
+
"input",
|
|
2637
|
+
{
|
|
2638
|
+
type: "text",
|
|
2639
|
+
value: readOnlyAddress,
|
|
2640
|
+
onChange: (event) => setReadOnlyAddress(event.target.value),
|
|
2641
|
+
placeholder: "0x...",
|
|
2642
|
+
className: inputClass()
|
|
2643
|
+
}
|
|
2644
|
+
)
|
|
2645
|
+
] }),
|
|
2646
|
+
/* @__PURE__ */ jsx6(
|
|
2647
|
+
"button",
|
|
2648
|
+
{
|
|
2649
|
+
onClick: handleAddReadOnly,
|
|
2650
|
+
disabled: isProcessing || !readOnlyAddress.trim(),
|
|
2651
|
+
className: `flex w-full items-center justify-center gap-2 rounded-lg py-2 text-base font-medium ${!isProcessing && readOnlyAddress.trim() ? "btn-raised" : "btn-raised-disabled"}`,
|
|
2652
|
+
children: isProcessing ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2653
|
+
/* @__PURE__ */ jsx6(Loader2, { size: 14 }),
|
|
2654
|
+
" Adding..."
|
|
2655
|
+
] }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
2656
|
+
/* @__PURE__ */ jsx6(Eye, { size: 14 }),
|
|
2657
|
+
" Add Watch Wallet"
|
|
2658
|
+
] })
|
|
2659
|
+
}
|
|
2660
|
+
),
|
|
2661
|
+
error && /* @__PURE__ */ jsx6(ErrorBox, { message: error })
|
|
2662
|
+
] })
|
|
2663
|
+
] })
|
|
2664
|
+
]
|
|
2665
|
+
}
|
|
2666
|
+
) })
|
|
2667
|
+
] }) });
|
|
2668
|
+
}
|
|
2669
|
+
function WalletNameInput({
|
|
2670
|
+
value,
|
|
2671
|
+
setValue,
|
|
2672
|
+
isValid,
|
|
2673
|
+
clearError,
|
|
2674
|
+
placeholder
|
|
2675
|
+
}) {
|
|
2676
|
+
return /* @__PURE__ */ jsxs5("div", { children: [
|
|
2677
|
+
/* @__PURE__ */ jsx6("label", { className: "mb-2 block text-base uppercase tracking-[0.1em] text-gray-400", children: "Wallet Name" }),
|
|
2678
|
+
/* @__PURE__ */ jsx6(
|
|
2679
|
+
"input",
|
|
2680
|
+
{
|
|
2681
|
+
type: "text",
|
|
2682
|
+
value,
|
|
2683
|
+
onChange: (event) => {
|
|
2684
|
+
const nextValue = event.target.value;
|
|
2685
|
+
if (WALLET_NAME_REGEX.test(nextValue) || nextValue === "") {
|
|
2686
|
+
setValue(nextValue);
|
|
2687
|
+
clearError();
|
|
2688
|
+
}
|
|
2689
|
+
},
|
|
2690
|
+
placeholder,
|
|
2691
|
+
className: inputClass(!!value && !isValid)
|
|
2692
|
+
}
|
|
2693
|
+
),
|
|
2694
|
+
/* @__PURE__ */ jsx6("p", { className: "mt-1.5 text-base text-gray-600", children: "Letters, numbers, and / only" })
|
|
2695
|
+
] });
|
|
2696
|
+
}
|
|
2697
|
+
function ApprovalDurationPicker({
|
|
2698
|
+
value,
|
|
2699
|
+
onChange,
|
|
2700
|
+
options,
|
|
2701
|
+
disabled
|
|
2702
|
+
}) {
|
|
2703
|
+
return /* @__PURE__ */ jsxs5("div", { children: [
|
|
2704
|
+
/* @__PURE__ */ jsx6("label", { className: "mb-2 block text-base uppercase tracking-[0.1em] text-gray-400", children: "Approval Duration" }),
|
|
2705
|
+
/* @__PURE__ */ jsx6("div", { className: "grid grid-cols-4 gap-1.5", children: options.map((option) => /* @__PURE__ */ jsx6(
|
|
2706
|
+
"button",
|
|
2707
|
+
{
|
|
2708
|
+
type: "button",
|
|
2709
|
+
onClick: () => onChange(option.durationMs),
|
|
2710
|
+
disabled,
|
|
2711
|
+
className: `rounded py-1.5 text-base font-medium disabled:cursor-not-allowed disabled:opacity-50 ${value === option.durationMs ? "btn-raised-active" : "btn-raised"}`,
|
|
2712
|
+
children: option.label
|
|
2713
|
+
},
|
|
2714
|
+
`${option.label}-${option.durationMs}`
|
|
2715
|
+
)) })
|
|
2716
|
+
] });
|
|
2717
|
+
}
|
|
2718
|
+
function ErrorBox({ message }) {
|
|
2719
|
+
return /* @__PURE__ */ jsxs5("div", { className: "flex items-start gap-2 rounded-lg border border-trade-down/20 bg-trade-down/[0.08] p-3", children: [
|
|
2720
|
+
/* @__PURE__ */ jsx6(
|
|
2721
|
+
AlertTriangle,
|
|
2722
|
+
{
|
|
2723
|
+
size: 14,
|
|
2724
|
+
className: "mt-0.5 flex-shrink-0 text-trade-down"
|
|
2725
|
+
}
|
|
2726
|
+
),
|
|
2727
|
+
/* @__PURE__ */ jsx6("p", { className: "text-base text-trade-down", children: message })
|
|
2728
|
+
] });
|
|
2729
|
+
}
|
|
2730
|
+
|
|
2731
|
+
// src/RenewAgentModal.tsx
|
|
2732
|
+
import { AnimatePresence as AnimatePresence3, motion as motion3 } from "framer-motion";
|
|
2733
|
+
import { useCallback as useCallback4, useMemo as useMemo2, useState as useState3 } from "react";
|
|
2734
|
+
import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
2735
|
+
var isHexAddress = (address) => !!address && /^0x[a-fA-F0-9]{40}$/.test(address);
|
|
2736
|
+
var formatAddress2 = (address) => address ? `${address.slice(0, 6)}...${address.slice(-4)}` : "";
|
|
2737
|
+
var isSameAddress = (a, b) => isHexAddress(a) && isHexAddress(b) && a.toLowerCase() === b.toLowerCase();
|
|
2738
|
+
function RenewAgentModal({
|
|
2739
|
+
isOpen,
|
|
2740
|
+
onClose,
|
|
2741
|
+
wallet,
|
|
2742
|
+
ownerAddress,
|
|
2743
|
+
isWalletConnected,
|
|
2744
|
+
chainId,
|
|
2745
|
+
signTypedDataAsync,
|
|
2746
|
+
onConnectWallet,
|
|
2747
|
+
onDisconnectWallet,
|
|
2748
|
+
onRenewed,
|
|
2749
|
+
onNotify,
|
|
2750
|
+
approvalDurationOptions,
|
|
2751
|
+
defaultApprovalDurationMs = DEFAULT_AGENT_APPROVAL_DURATION_MS
|
|
2752
|
+
}) {
|
|
2753
|
+
const { renewAgentWallet } = useHypurrConnectInternal();
|
|
2754
|
+
const [isRenewing, setIsRenewing] = useState3(false);
|
|
2755
|
+
const [approvalDurationMs, setApprovalDurationMs] = useState3(
|
|
2756
|
+
defaultApprovalDurationMs
|
|
2757
|
+
);
|
|
2758
|
+
const [error, setError] = useState3(null);
|
|
2759
|
+
const expiryMessage = useMemo2(
|
|
2760
|
+
() => wallet ? getAgentExpiryTitle(wallet) : null,
|
|
2761
|
+
[wallet]
|
|
2762
|
+
);
|
|
2763
|
+
const currentExpiryMs = useMemo2(
|
|
2764
|
+
() => wallet ? agentExpiresAtMs(wallet) : null,
|
|
2765
|
+
[wallet]
|
|
2766
|
+
);
|
|
2767
|
+
const durationOptions = approvalDurationOptions && approvalDurationOptions.length > 0 ? approvalDurationOptions : AGENT_APPROVAL_DURATION_OPTIONS;
|
|
2768
|
+
const expectedOwnerAddress = wallet?.ethereumAddress ?? null;
|
|
2769
|
+
const agentAddress = wallet?.agentEthereumAddress?.value ?? null;
|
|
2770
|
+
const hasExpectedOwner = isHexAddress(expectedOwnerAddress);
|
|
2771
|
+
const hasAgentAddress = isHexAddress(agentAddress);
|
|
2772
|
+
const hasConnectedOwner = isWalletConnected && isHexAddress(ownerAddress);
|
|
2773
|
+
const ownerMatches = isSameAddress(ownerAddress, expectedOwnerAddress);
|
|
2774
|
+
const ownerReady = ownerMatches && !!chainId;
|
|
2775
|
+
const canRenew = !!wallet && hasAgentAddress && ownerReady && !!signTypedDataAsync && !isRenewing;
|
|
2776
|
+
const handleClose = useCallback4(() => {
|
|
2777
|
+
if (isRenewing) return;
|
|
2778
|
+
setError(null);
|
|
2779
|
+
onClose();
|
|
2780
|
+
}, [isRenewing, onClose]);
|
|
2781
|
+
const handleRenew = useCallback4(async () => {
|
|
2782
|
+
if (!wallet) return;
|
|
2783
|
+
if (!isHexAddress(agentAddress)) {
|
|
2784
|
+
setError("This wallet is missing its agent address.");
|
|
2785
|
+
return;
|
|
2786
|
+
}
|
|
2787
|
+
if (!isHexAddress(expectedOwnerAddress)) {
|
|
2788
|
+
setError("This wallet is missing its owner address.");
|
|
2789
|
+
return;
|
|
2790
|
+
}
|
|
2791
|
+
if (!isHexAddress(ownerAddress)) {
|
|
2792
|
+
onConnectWallet?.();
|
|
2793
|
+
return;
|
|
2794
|
+
}
|
|
2795
|
+
if (!isSameAddress(ownerAddress, expectedOwnerAddress)) {
|
|
2796
|
+
setError(
|
|
2797
|
+
`Connect the owner wallet ${formatAddress2(expectedOwnerAddress)} to renew this agent.`
|
|
2798
|
+
);
|
|
2799
|
+
return;
|
|
2800
|
+
}
|
|
2801
|
+
if (!chainId || !signTypedDataAsync) {
|
|
2802
|
+
setError("Wallet signing is not ready yet");
|
|
2803
|
+
return;
|
|
2804
|
+
}
|
|
2805
|
+
setError(null);
|
|
2806
|
+
setIsRenewing(true);
|
|
2807
|
+
try {
|
|
2808
|
+
await renewAgentWallet({
|
|
2809
|
+
walletId: wallet.id,
|
|
2810
|
+
ownerAddress,
|
|
2811
|
+
signTypedDataAsync,
|
|
2812
|
+
chainId,
|
|
2813
|
+
approvalDurationMs
|
|
2814
|
+
});
|
|
2815
|
+
await onRenewed?.(wallet);
|
|
2816
|
+
onNotify?.({ type: "success", message: "Agent wallet renewed" });
|
|
2817
|
+
onClose();
|
|
2818
|
+
} catch (e) {
|
|
2819
|
+
const message = e instanceof Error ? e.message : "Failed to renew agent wallet";
|
|
2820
|
+
setError(message);
|
|
2821
|
+
onNotify?.({ type: "error", message });
|
|
2822
|
+
} finally {
|
|
2823
|
+
setIsRenewing(false);
|
|
2824
|
+
}
|
|
2825
|
+
}, [
|
|
2826
|
+
agentAddress,
|
|
2827
|
+
approvalDurationMs,
|
|
2828
|
+
chainId,
|
|
2829
|
+
expectedOwnerAddress,
|
|
2830
|
+
onClose,
|
|
2831
|
+
onConnectWallet,
|
|
2832
|
+
onNotify,
|
|
2833
|
+
onRenewed,
|
|
2834
|
+
ownerAddress,
|
|
2835
|
+
renewAgentWallet,
|
|
2836
|
+
signTypedDataAsync,
|
|
2837
|
+
wallet
|
|
2838
|
+
]);
|
|
2839
|
+
return /* @__PURE__ */ jsx7(AnimatePresence3, { children: isOpen && wallet && /* @__PURE__ */ jsxs6(motion3.div, { className: "hypurr-connect", style: { display: "contents" }, children: [
|
|
2840
|
+
/* @__PURE__ */ jsx7(SpinKeyframes, {}),
|
|
2841
|
+
/* @__PURE__ */ jsx7(
|
|
2842
|
+
motion3.div,
|
|
2843
|
+
{
|
|
2844
|
+
className: "fixed inset-0 z-[110] bg-black/70 backdrop-blur-sm",
|
|
2845
|
+
initial: { opacity: 0 },
|
|
2846
|
+
animate: { opacity: 1 },
|
|
2847
|
+
exit: { opacity: 0 },
|
|
2848
|
+
transition: { duration: 0.15 },
|
|
2849
|
+
onClick: handleClose
|
|
2850
|
+
}
|
|
2851
|
+
),
|
|
2852
|
+
/* @__PURE__ */ jsx7("div", { className: "fixed inset-0 z-[111] flex items-center justify-center p-4", children: /* @__PURE__ */ jsxs6(
|
|
2853
|
+
motion3.div,
|
|
2854
|
+
{
|
|
2855
|
+
className: "relative w-full max-w-md overflow-hidden rounded-lg border border-surface-bd bg-surface-modal font-sans shadow-modal",
|
|
2856
|
+
initial: { opacity: 0, y: 8 },
|
|
2857
|
+
animate: { opacity: 1, y: 0 },
|
|
2858
|
+
exit: { opacity: 0, y: 8 },
|
|
2859
|
+
transition: { duration: 0.18, ease: "easeOut" },
|
|
2860
|
+
onClick: (event) => event.stopPropagation(),
|
|
2861
|
+
children: [
|
|
2862
|
+
/* @__PURE__ */ jsxs6("div", { className: "relative flex items-center justify-center border-b border-white/[0.06] px-6 pb-5 pt-6", children: [
|
|
2863
|
+
/* @__PURE__ */ jsx7("h3", { className: "text-lg font-semibold text-white", children: "Renew Agent Wallet" }),
|
|
2864
|
+
/* @__PURE__ */ jsx7(
|
|
2865
|
+
"button",
|
|
2866
|
+
{
|
|
2867
|
+
onClick: handleClose,
|
|
2868
|
+
disabled: isRenewing,
|
|
2869
|
+
className: "absolute right-6 text-gray-400 transition-colors hover:text-white disabled:cursor-not-allowed disabled:opacity-40",
|
|
2870
|
+
"aria-label": "Close",
|
|
2871
|
+
children: /* @__PURE__ */ jsx7(X, { size: 16 })
|
|
2872
|
+
}
|
|
2873
|
+
)
|
|
2874
|
+
] }),
|
|
2875
|
+
/* @__PURE__ */ jsxs6("div", { className: "space-y-4 px-6 py-5", children: [
|
|
2876
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-start gap-2 rounded-lg border border-amber-500/25 bg-amber-500/[0.08] p-3", children: [
|
|
2877
|
+
/* @__PURE__ */ jsx7(
|
|
2878
|
+
AlertTriangle,
|
|
2879
|
+
{
|
|
2880
|
+
size: 14,
|
|
2881
|
+
className: "mt-0.5 flex-shrink-0 text-amber-400"
|
|
2882
|
+
}
|
|
2883
|
+
),
|
|
2884
|
+
/* @__PURE__ */ jsx7("p", { className: "text-base text-amber-200", children: expiryMessage ?? (currentExpiryMs ? `Current approval expires ${formatAgentExpiry(
|
|
2885
|
+
currentExpiryMs
|
|
2886
|
+
)}. Renew to extend this agent wallet.` : "Renew this agent wallet with a fresh owner approval.") })
|
|
2887
|
+
] }),
|
|
2888
|
+
/* @__PURE__ */ jsxs6("div", { className: "rounded-lg border border-white/[0.06] bg-white/[0.03] p-3", children: [
|
|
2889
|
+
/* @__PURE__ */ jsx7("p", { className: "mb-1.5 text-base uppercase tracking-[0.1em] text-gray-400", children: "Agent address" }),
|
|
2890
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between gap-3", children: [
|
|
2891
|
+
/* @__PURE__ */ jsxs6("div", { className: "min-w-0", children: [
|
|
2892
|
+
/* @__PURE__ */ jsx7("p", { className: "truncate text-base font-medium text-white", children: wallet.name || "Unnamed Wallet" }),
|
|
2893
|
+
/* @__PURE__ */ jsx7("p", { className: "font-mono text-base text-gray-400", children: hasAgentAddress ? formatAddress2(agentAddress) : "Missing agent address" })
|
|
2894
|
+
] }),
|
|
2895
|
+
/* @__PURE__ */ jsx7(
|
|
2896
|
+
AlertTriangle,
|
|
2897
|
+
{
|
|
2898
|
+
size: 16,
|
|
2899
|
+
className: "flex-shrink-0 text-amber-400"
|
|
2900
|
+
}
|
|
2901
|
+
)
|
|
2902
|
+
] })
|
|
2903
|
+
] }),
|
|
2904
|
+
ownerReady ? /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-3 rounded-lg border border-white/[0.06] bg-white/[0.03] px-3 py-2.5", children: [
|
|
2905
|
+
/* @__PURE__ */ jsx7("div", { className: "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-md border border-white/[0.08] bg-white/[0.06]", children: /* @__PURE__ */ jsx7(Wallet, { size: 14, className: "text-gray-400" }) }),
|
|
2906
|
+
/* @__PURE__ */ jsxs6("div", { className: "min-w-0 flex-1", children: [
|
|
2907
|
+
/* @__PURE__ */ jsx7("p", { className: "text-base text-gray-400", children: "Owner wallet connected" }),
|
|
2908
|
+
/* @__PURE__ */ jsx7("p", { className: "font-mono text-base text-white", children: formatAddress2(ownerAddress) })
|
|
2909
|
+
] }),
|
|
2910
|
+
/* @__PURE__ */ jsx7(Check, { size: 16, className: "flex-shrink-0 text-trade-up" })
|
|
2911
|
+
] }) : hasConnectedOwner && !ownerMatches ? /* @__PURE__ */ jsxs6("div", { className: "space-y-3 rounded-lg border border-trade-down/20 bg-trade-down/[0.08] p-3", children: [
|
|
2912
|
+
/* @__PURE__ */ jsxs6("div", { className: "flex items-start gap-2", children: [
|
|
2913
|
+
/* @__PURE__ */ jsx7(
|
|
2914
|
+
AlertTriangle,
|
|
2915
|
+
{
|
|
2916
|
+
size: 14,
|
|
2917
|
+
className: "mt-0.5 flex-shrink-0 text-trade-down"
|
|
2918
|
+
}
|
|
2919
|
+
),
|
|
2920
|
+
/* @__PURE__ */ jsxs6("div", { className: "min-w-0", children: [
|
|
2921
|
+
/* @__PURE__ */ jsx7("p", { className: "text-base text-trade-down", children: "Wrong owner wallet connected" }),
|
|
2922
|
+
/* @__PURE__ */ jsxs6("p", { className: "mt-1 font-mono text-base text-gray-400", children: [
|
|
2923
|
+
"Connected ",
|
|
2924
|
+
formatAddress2(ownerAddress)
|
|
2925
|
+
] }),
|
|
2926
|
+
/* @__PURE__ */ jsxs6("p", { className: "font-mono text-base text-gray-400", children: [
|
|
2927
|
+
"Required ",
|
|
2928
|
+
formatAddress2(expectedOwnerAddress)
|
|
2929
|
+
] })
|
|
2930
|
+
] })
|
|
2931
|
+
] }),
|
|
2932
|
+
onDisconnectWallet && /* @__PURE__ */ jsx7(
|
|
2933
|
+
"button",
|
|
2934
|
+
{
|
|
2935
|
+
onClick: onDisconnectWallet,
|
|
2936
|
+
disabled: isRenewing,
|
|
2937
|
+
className: "btn-raised flex w-full items-center justify-center gap-2 rounded-lg py-2 text-base font-medium disabled:cursor-not-allowed disabled:opacity-40",
|
|
2938
|
+
children: "Disconnect Wallet"
|
|
2939
|
+
}
|
|
2940
|
+
)
|
|
2941
|
+
] }) : /* @__PURE__ */ jsxs6(
|
|
2942
|
+
"button",
|
|
2943
|
+
{
|
|
2944
|
+
onClick: onConnectWallet,
|
|
2945
|
+
className: "btn-raised flex w-full items-center justify-center gap-2 rounded-lg py-2 text-base font-medium",
|
|
2946
|
+
children: [
|
|
2947
|
+
/* @__PURE__ */ jsx7(Wallet, { size: 14 }),
|
|
2948
|
+
" Connect Owner Wallet",
|
|
2949
|
+
hasExpectedOwner ? ` ${formatAddress2(expectedOwnerAddress)}` : ""
|
|
2950
|
+
]
|
|
2951
|
+
}
|
|
2952
|
+
),
|
|
2953
|
+
/* @__PURE__ */ jsx7(
|
|
2954
|
+
ApprovalDurationPicker2,
|
|
2955
|
+
{
|
|
2956
|
+
value: approvalDurationMs,
|
|
2957
|
+
onChange: setApprovalDurationMs,
|
|
2958
|
+
options: durationOptions,
|
|
2959
|
+
disabled: isRenewing
|
|
2960
|
+
}
|
|
2961
|
+
),
|
|
2962
|
+
error && /* @__PURE__ */ jsxs6("div", { className: "flex items-start gap-2 rounded-lg border border-trade-down/20 bg-trade-down/[0.08] p-3", children: [
|
|
2963
|
+
/* @__PURE__ */ jsx7(
|
|
2964
|
+
AlertTriangle,
|
|
2965
|
+
{
|
|
2966
|
+
size: 14,
|
|
2967
|
+
className: "mt-0.5 flex-shrink-0 text-trade-down"
|
|
2968
|
+
}
|
|
2969
|
+
),
|
|
2970
|
+
/* @__PURE__ */ jsx7("p", { className: "text-base text-trade-down", children: error })
|
|
2971
|
+
] })
|
|
2972
|
+
] }),
|
|
2973
|
+
/* @__PURE__ */ jsxs6("div", { className: "space-y-2 px-6 pb-6", children: [
|
|
2974
|
+
/* @__PURE__ */ jsx7(
|
|
2975
|
+
"button",
|
|
2976
|
+
{
|
|
2977
|
+
onClick: handleRenew,
|
|
2978
|
+
disabled: !canRenew,
|
|
2979
|
+
className: `flex w-full items-center justify-center gap-2 rounded-lg py-2 text-base font-medium ${canRenew ? "btn-raised" : "btn-raised-disabled"}`,
|
|
2980
|
+
children: isRenewing ? /* @__PURE__ */ jsxs6(Fragment3, { children: [
|
|
2981
|
+
/* @__PURE__ */ jsx7(Loader2, { size: 14 }),
|
|
2982
|
+
" Renewing..."
|
|
2983
|
+
] }) : "Renew Agent Wallet"
|
|
2984
|
+
}
|
|
2985
|
+
),
|
|
2986
|
+
ownerReady && onDisconnectWallet && /* @__PURE__ */ jsx7(
|
|
2987
|
+
"button",
|
|
2988
|
+
{
|
|
2989
|
+
onClick: onDisconnectWallet,
|
|
2990
|
+
disabled: isRenewing,
|
|
2991
|
+
className: "w-full py-1.5 text-base text-gray-400 transition-colors hover:text-gray-300 disabled:cursor-not-allowed disabled:opacity-40",
|
|
2992
|
+
children: "Disconnect & use different owner"
|
|
2993
|
+
}
|
|
2994
|
+
)
|
|
2995
|
+
] })
|
|
2996
|
+
]
|
|
2997
|
+
}
|
|
2998
|
+
) })
|
|
2999
|
+
] }) });
|
|
3000
|
+
}
|
|
3001
|
+
function ApprovalDurationPicker2({
|
|
3002
|
+
value,
|
|
3003
|
+
onChange,
|
|
3004
|
+
options,
|
|
3005
|
+
disabled
|
|
3006
|
+
}) {
|
|
3007
|
+
return /* @__PURE__ */ jsxs6("div", { children: [
|
|
3008
|
+
/* @__PURE__ */ jsx7("label", { className: "mb-2 block text-base uppercase tracking-[0.1em] text-gray-400", children: "Approval Duration" }),
|
|
3009
|
+
/* @__PURE__ */ jsx7("div", { className: "grid grid-cols-4 gap-1.5", children: options.map((option) => /* @__PURE__ */ jsx7(
|
|
3010
|
+
"button",
|
|
3011
|
+
{
|
|
3012
|
+
type: "button",
|
|
3013
|
+
onClick: () => onChange(option.durationMs),
|
|
3014
|
+
disabled,
|
|
3015
|
+
className: `rounded py-1.5 text-base font-medium disabled:cursor-not-allowed disabled:opacity-50 ${value === option.durationMs ? "btn-raised-active" : "btn-raised"}`,
|
|
3016
|
+
children: option.label
|
|
3017
|
+
},
|
|
3018
|
+
`${option.label}-${option.durationMs}`
|
|
3019
|
+
)) })
|
|
1858
3020
|
] });
|
|
1859
3021
|
}
|
|
1860
|
-
|
|
1861
|
-
|
|
1862
|
-
|
|
1863
|
-
|
|
3022
|
+
|
|
3023
|
+
// src/WalletSelectorDropdown.tsx
|
|
3024
|
+
import { AnimatePresence as AnimatePresence7, motion as motion7 } from "framer-motion";
|
|
3025
|
+
import {
|
|
3026
|
+
Fragment as Fragment8,
|
|
3027
|
+
useCallback as useCallback9,
|
|
3028
|
+
useMemo as useMemo3,
|
|
3029
|
+
useState as useState8
|
|
3030
|
+
} from "react";
|
|
3031
|
+
|
|
3032
|
+
// src/AgentExpiryWarning.tsx
|
|
3033
|
+
import {
|
|
3034
|
+
useCallback as useCallback5,
|
|
3035
|
+
useRef as useRef2,
|
|
3036
|
+
useState as useState4
|
|
3037
|
+
} from "react";
|
|
3038
|
+
import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
3039
|
+
var EXPIRED_AGENT_COLOR = "#f59e0b";
|
|
3040
|
+
function AgentExpiryWarningIcon({
|
|
3041
|
+
message,
|
|
3042
|
+
onClick,
|
|
3043
|
+
size = 13
|
|
3044
|
+
}) {
|
|
3045
|
+
const triggerRef = useRef2(null);
|
|
3046
|
+
const [tooltipPosition, setTooltipPosition] = useState4(null);
|
|
3047
|
+
const setTriggerRef = useCallback5((node) => {
|
|
3048
|
+
triggerRef.current = node;
|
|
3049
|
+
}, []);
|
|
3050
|
+
const showTooltip = useCallback5(() => {
|
|
3051
|
+
const rect = triggerRef.current?.getBoundingClientRect();
|
|
3052
|
+
if (!rect) return;
|
|
3053
|
+
const tooltipWidth = 260;
|
|
3054
|
+
const left = Math.min(
|
|
3055
|
+
Math.max(rect.left + rect.width / 2, tooltipWidth / 2 + 8),
|
|
3056
|
+
window.innerWidth - tooltipWidth / 2 - 8
|
|
3057
|
+
);
|
|
3058
|
+
const top = rect.bottom + 8 < window.innerHeight - 48 ? rect.bottom + 8 : Math.max(8, rect.top - 44);
|
|
3059
|
+
setTooltipPosition({ left, top });
|
|
3060
|
+
}, []);
|
|
3061
|
+
const hideTooltip = useCallback5(() => {
|
|
3062
|
+
setTooltipPosition(null);
|
|
3063
|
+
}, []);
|
|
3064
|
+
const triggerStyle = {
|
|
3065
|
+
width: size + 5,
|
|
3066
|
+
height: size + 5,
|
|
3067
|
+
padding: 0,
|
|
3068
|
+
border: "none",
|
|
3069
|
+
borderRadius: 4,
|
|
3070
|
+
background: "transparent",
|
|
3071
|
+
color: EXPIRED_AGENT_COLOR,
|
|
3072
|
+
display: "inline-flex",
|
|
3073
|
+
alignItems: "center",
|
|
3074
|
+
justifyContent: "center",
|
|
3075
|
+
flexShrink: 0,
|
|
3076
|
+
cursor: onClick ? "pointer" : "help"
|
|
3077
|
+
};
|
|
3078
|
+
const sharedProps = {
|
|
3079
|
+
ref: setTriggerRef,
|
|
3080
|
+
"aria-label": "Agent approval expired",
|
|
3081
|
+
onMouseEnter: showTooltip,
|
|
3082
|
+
onMouseLeave: hideTooltip,
|
|
3083
|
+
onFocus: showTooltip,
|
|
3084
|
+
onBlur: hideTooltip,
|
|
3085
|
+
style: triggerStyle
|
|
3086
|
+
};
|
|
3087
|
+
return /* @__PURE__ */ jsxs7(Fragment4, { children: [
|
|
3088
|
+
onClick ? /* @__PURE__ */ jsx8(
|
|
3089
|
+
"button",
|
|
3090
|
+
{
|
|
3091
|
+
type: "button",
|
|
3092
|
+
...sharedProps,
|
|
3093
|
+
onClick: (event) => {
|
|
3094
|
+
event.stopPropagation();
|
|
3095
|
+
onClick();
|
|
3096
|
+
},
|
|
3097
|
+
children: /* @__PURE__ */ jsx8(AlertTriangle, { size, color: EXPIRED_AGENT_COLOR })
|
|
3098
|
+
}
|
|
3099
|
+
) : /* @__PURE__ */ jsx8("span", { ...sharedProps, children: /* @__PURE__ */ jsx8(AlertTriangle, { size, color: EXPIRED_AGENT_COLOR }) }),
|
|
3100
|
+
tooltipPosition && /* @__PURE__ */ jsx8(
|
|
3101
|
+
"div",
|
|
3102
|
+
{
|
|
3103
|
+
role: "tooltip",
|
|
3104
|
+
style: {
|
|
3105
|
+
position: "fixed",
|
|
3106
|
+
left: tooltipPosition.left,
|
|
3107
|
+
top: tooltipPosition.top,
|
|
3108
|
+
transform: "translateX(-50%)",
|
|
3109
|
+
zIndex: 1e4,
|
|
3110
|
+
width: 260,
|
|
3111
|
+
maxWidth: "calc(100vw - 16px)",
|
|
3112
|
+
padding: "7px 9px",
|
|
3113
|
+
borderRadius: 6,
|
|
3114
|
+
border: "1px solid rgba(255,255,255,0.12)",
|
|
3115
|
+
background: "#111827",
|
|
3116
|
+
boxShadow: "0 10px 28px rgba(0,0,0,0.45)",
|
|
3117
|
+
color: "#e5e7eb",
|
|
3118
|
+
fontSize: 12,
|
|
3119
|
+
lineHeight: "1rem",
|
|
3120
|
+
fontWeight: 500,
|
|
3121
|
+
pointerEvents: "none",
|
|
3122
|
+
whiteSpace: "normal"
|
|
3123
|
+
},
|
|
3124
|
+
children: message
|
|
3125
|
+
}
|
|
3126
|
+
)
|
|
1864
3127
|
] });
|
|
1865
3128
|
}
|
|
1866
|
-
|
|
1867
|
-
|
|
1868
|
-
}
|
|
3129
|
+
|
|
3130
|
+
// src/UserProfileModal.tsx
|
|
3131
|
+
import { AnimatePresence as AnimatePresence6, motion as motion6 } from "framer-motion";
|
|
3132
|
+
import {
|
|
3133
|
+
useCallback as useCallback8,
|
|
3134
|
+
useState as useState7
|
|
3135
|
+
} from "react";
|
|
3136
|
+
|
|
3137
|
+
// src/DeleteWalletModal.tsx
|
|
3138
|
+
import { AnimatePresence as AnimatePresence4, motion as motion4 } from "framer-motion";
|
|
3139
|
+
import {
|
|
3140
|
+
useCallback as useCallback6,
|
|
3141
|
+
useState as useState5
|
|
3142
|
+
} from "react";
|
|
1869
3143
|
|
|
1870
3144
|
// src/profileStyles.ts
|
|
1871
3145
|
var profileColors = {
|
|
@@ -1893,6 +3167,44 @@ var fontFamily = {
|
|
|
1893
3167
|
sans: "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif",
|
|
1894
3168
|
mono: "Google Sans Code, Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"
|
|
1895
3169
|
};
|
|
3170
|
+
var parseSrgb = (color) => {
|
|
3171
|
+
const value = color.trim();
|
|
3172
|
+
const shortHex = /^#([0-9a-f]{3})$/i.exec(value);
|
|
3173
|
+
if (shortHex) {
|
|
3174
|
+
const [r, g, b] = shortHex[1].split("").map((c) => parseInt(c + c, 16));
|
|
3175
|
+
return [r, g, b];
|
|
3176
|
+
}
|
|
3177
|
+
const longHex = /^#([0-9a-f]{6})$/i.exec(value);
|
|
3178
|
+
if (longHex) {
|
|
3179
|
+
const v = longHex[1];
|
|
3180
|
+
return [
|
|
3181
|
+
parseInt(v.slice(0, 2), 16),
|
|
3182
|
+
parseInt(v.slice(2, 4), 16),
|
|
3183
|
+
parseInt(v.slice(4, 6), 16)
|
|
3184
|
+
];
|
|
3185
|
+
}
|
|
3186
|
+
const rgb = /^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*(?:,\s*[\d.]+\s*)?\)$/i.exec(
|
|
3187
|
+
value
|
|
3188
|
+
);
|
|
3189
|
+
if (rgb) {
|
|
3190
|
+
return [parseInt(rgb[1], 10), parseInt(rgb[2], 10), parseInt(rgb[3], 10)];
|
|
3191
|
+
}
|
|
3192
|
+
return null;
|
|
3193
|
+
};
|
|
3194
|
+
var relativeLuminance = (color) => {
|
|
3195
|
+
const rgb = parseSrgb(color);
|
|
3196
|
+
if (!rgb) return null;
|
|
3197
|
+
const [r, g, b] = rgb.map((c) => {
|
|
3198
|
+
const v = c / 255;
|
|
3199
|
+
return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
|
|
3200
|
+
});
|
|
3201
|
+
return 0.2126 * r + 0.7152 * g + 0.0722 * b;
|
|
3202
|
+
};
|
|
3203
|
+
var pickContrastColor = (background, lightFg = profileColors.text, darkFg = "#0a0a0a") => {
|
|
3204
|
+
const lum = relativeLuminance(background);
|
|
3205
|
+
if (lum === null) return lightFg;
|
|
3206
|
+
return lum > 0.5 ? darkFg : lightFg;
|
|
3207
|
+
};
|
|
1896
3208
|
var colorWithAlpha = (color, alpha) => {
|
|
1897
3209
|
const hex = color.trim();
|
|
1898
3210
|
const shortHex = /^#([0-9a-f]{3})$/i.exec(hex);
|
|
@@ -2031,7 +3343,7 @@ var dangerOutlineButtonStyle = (enabled, hovered = false) => ({
|
|
|
2031
3343
|
});
|
|
2032
3344
|
|
|
2033
3345
|
// src/DeleteWalletModal.tsx
|
|
2034
|
-
import { Fragment as
|
|
3346
|
+
import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
2035
3347
|
var DANGER_BG = "rgba(248,113,113,0.07)";
|
|
2036
3348
|
var DANGER_BORDER = "rgba(248,113,113,0.2)";
|
|
2037
3349
|
var backdropStyle2 = modalBackdropStyle(110);
|
|
@@ -2111,20 +3423,21 @@ function DeleteWalletModal({
|
|
|
2111
3423
|
onConfirm,
|
|
2112
3424
|
onNotify
|
|
2113
3425
|
}) {
|
|
2114
|
-
const [confirmName, setConfirmName] =
|
|
2115
|
-
const [isDeleting, setIsDeleting] =
|
|
2116
|
-
const [error, setError] =
|
|
2117
|
-
const [deleteHovered, setDeleteHovered] =
|
|
3426
|
+
const [confirmName, setConfirmName] = useState5("");
|
|
3427
|
+
const [isDeleting, setIsDeleting] = useState5(false);
|
|
3428
|
+
const [error, setError] = useState5(null);
|
|
3429
|
+
const [deleteHovered, setDeleteHovered] = useState5(false);
|
|
2118
3430
|
const walletName = wallet?.name || "Unnamed Wallet";
|
|
3431
|
+
const displayAddress = wallet?.ethereumAddress;
|
|
2119
3432
|
const isNameMatch = confirmName === walletName;
|
|
2120
3433
|
const canDelete = isNameMatch && !isDeleting;
|
|
2121
|
-
const handleClose =
|
|
3434
|
+
const handleClose = useCallback6(() => {
|
|
2122
3435
|
if (isDeleting) return;
|
|
2123
3436
|
setConfirmName("");
|
|
2124
3437
|
setError(null);
|
|
2125
3438
|
onClose();
|
|
2126
3439
|
}, [isDeleting, onClose]);
|
|
2127
|
-
const handleDelete =
|
|
3440
|
+
const handleDelete = useCallback6(async () => {
|
|
2128
3441
|
if (!wallet || !isNameMatch) return;
|
|
2129
3442
|
setError(null);
|
|
2130
3443
|
setIsDeleting(true);
|
|
@@ -2139,10 +3452,10 @@ function DeleteWalletModal({
|
|
|
2139
3452
|
setIsDeleting(false);
|
|
2140
3453
|
}
|
|
2141
3454
|
}, [wallet, isNameMatch, onConfirm, onClose, onNotify]);
|
|
2142
|
-
return /* @__PURE__ */
|
|
2143
|
-
/* @__PURE__ */
|
|
2144
|
-
/* @__PURE__ */
|
|
2145
|
-
|
|
3455
|
+
return /* @__PURE__ */ jsx9(AnimatePresence4, { children: isOpen && wallet && /* @__PURE__ */ jsxs8(Fragment5, { children: [
|
|
3456
|
+
/* @__PURE__ */ jsx9(SpinKeyframes, {}),
|
|
3457
|
+
/* @__PURE__ */ jsx9(
|
|
3458
|
+
motion4.div,
|
|
2146
3459
|
{
|
|
2147
3460
|
style: backdropStyle2,
|
|
2148
3461
|
initial: { opacity: 0 },
|
|
@@ -2153,8 +3466,8 @@ function DeleteWalletModal({
|
|
|
2153
3466
|
},
|
|
2154
3467
|
"backdrop"
|
|
2155
3468
|
),
|
|
2156
|
-
/* @__PURE__ */
|
|
2157
|
-
|
|
3469
|
+
/* @__PURE__ */ jsx9("div", { style: wrapperStyle, children: /* @__PURE__ */ jsxs8(
|
|
3470
|
+
motion4.div,
|
|
2158
3471
|
{
|
|
2159
3472
|
style: panelStyle,
|
|
2160
3473
|
initial: { opacity: 0, y: 8 },
|
|
@@ -2163,22 +3476,22 @@ function DeleteWalletModal({
|
|
|
2163
3476
|
transition: { duration: 0.18, ease: "easeOut" },
|
|
2164
3477
|
onClick: (e) => e.stopPropagation(),
|
|
2165
3478
|
children: [
|
|
2166
|
-
/* @__PURE__ */
|
|
2167
|
-
/* @__PURE__ */
|
|
2168
|
-
/* @__PURE__ */
|
|
3479
|
+
/* @__PURE__ */ jsxs8("div", { style: headerStyle, children: [
|
|
3480
|
+
/* @__PURE__ */ jsx9("h3", { style: titleStyle, children: "Delete Wallet" }),
|
|
3481
|
+
/* @__PURE__ */ jsx9(
|
|
2169
3482
|
"button",
|
|
2170
3483
|
{
|
|
2171
3484
|
onClick: handleClose,
|
|
2172
3485
|
disabled: isDeleting,
|
|
2173
3486
|
style: closeBtnStyle(isDeleting),
|
|
2174
3487
|
"aria-label": "Close",
|
|
2175
|
-
children: /* @__PURE__ */
|
|
3488
|
+
children: /* @__PURE__ */ jsx9(X, { size: 16 })
|
|
2176
3489
|
}
|
|
2177
3490
|
)
|
|
2178
3491
|
] }),
|
|
2179
|
-
/* @__PURE__ */
|
|
2180
|
-
/* @__PURE__ */
|
|
2181
|
-
/* @__PURE__ */
|
|
3492
|
+
/* @__PURE__ */ jsxs8("div", { style: bodyStyle, children: [
|
|
3493
|
+
/* @__PURE__ */ jsxs8("div", { style: warningBoxStyle, children: [
|
|
3494
|
+
/* @__PURE__ */ jsx9(
|
|
2182
3495
|
AlertTriangle,
|
|
2183
3496
|
{
|
|
2184
3497
|
size: 15,
|
|
@@ -2186,8 +3499,8 @@ function DeleteWalletModal({
|
|
|
2186
3499
|
style: { flexShrink: 0, marginTop: 2 }
|
|
2187
3500
|
}
|
|
2188
3501
|
),
|
|
2189
|
-
/* @__PURE__ */
|
|
2190
|
-
/* @__PURE__ */
|
|
3502
|
+
/* @__PURE__ */ jsxs8("div", { children: [
|
|
3503
|
+
/* @__PURE__ */ jsx9(
|
|
2191
3504
|
"p",
|
|
2192
3505
|
{
|
|
2193
3506
|
style: {
|
|
@@ -2200,7 +3513,7 @@ function DeleteWalletModal({
|
|
|
2200
3513
|
children: "This action cannot be undone"
|
|
2201
3514
|
}
|
|
2202
3515
|
),
|
|
2203
|
-
/* @__PURE__ */
|
|
3516
|
+
/* @__PURE__ */ jsx9(
|
|
2204
3517
|
"p",
|
|
2205
3518
|
{
|
|
2206
3519
|
style: {
|
|
@@ -2214,8 +3527,8 @@ function DeleteWalletModal({
|
|
|
2214
3527
|
)
|
|
2215
3528
|
] })
|
|
2216
3529
|
] }),
|
|
2217
|
-
/* @__PURE__ */
|
|
2218
|
-
/* @__PURE__ */
|
|
3530
|
+
/* @__PURE__ */ jsxs8("div", { style: infoBoxStyle, children: [
|
|
3531
|
+
/* @__PURE__ */ jsx9(
|
|
2219
3532
|
"p",
|
|
2220
3533
|
{
|
|
2221
3534
|
style: {
|
|
@@ -2226,7 +3539,7 @@ function DeleteWalletModal({
|
|
|
2226
3539
|
children: "Wallet to delete"
|
|
2227
3540
|
}
|
|
2228
3541
|
),
|
|
2229
|
-
/* @__PURE__ */
|
|
3542
|
+
/* @__PURE__ */ jsx9(
|
|
2230
3543
|
"p",
|
|
2231
3544
|
{
|
|
2232
3545
|
style: {
|
|
@@ -2239,7 +3552,7 @@ function DeleteWalletModal({
|
|
|
2239
3552
|
children: walletName
|
|
2240
3553
|
}
|
|
2241
3554
|
),
|
|
2242
|
-
/* @__PURE__ */
|
|
3555
|
+
/* @__PURE__ */ jsx9(
|
|
2243
3556
|
"p",
|
|
2244
3557
|
{
|
|
2245
3558
|
style: {
|
|
@@ -2250,15 +3563,15 @@ function DeleteWalletModal({
|
|
|
2250
3563
|
fontFamily: fontFamily.mono,
|
|
2251
3564
|
wordBreak: "break-all"
|
|
2252
3565
|
},
|
|
2253
|
-
children:
|
|
3566
|
+
children: displayAddress
|
|
2254
3567
|
}
|
|
2255
3568
|
)
|
|
2256
3569
|
] }),
|
|
2257
|
-
/* @__PURE__ */
|
|
2258
|
-
/* @__PURE__ */
|
|
3570
|
+
/* @__PURE__ */ jsxs8("div", { children: [
|
|
3571
|
+
/* @__PURE__ */ jsxs8("label", { style: labelStyle, children: [
|
|
2259
3572
|
"Type",
|
|
2260
3573
|
" ",
|
|
2261
|
-
/* @__PURE__ */
|
|
3574
|
+
/* @__PURE__ */ jsxs8(
|
|
2262
3575
|
"span",
|
|
2263
3576
|
{
|
|
2264
3577
|
style: {
|
|
@@ -2275,7 +3588,7 @@ function DeleteWalletModal({
|
|
|
2275
3588
|
" ",
|
|
2276
3589
|
"to confirm"
|
|
2277
3590
|
] }),
|
|
2278
|
-
/* @__PURE__ */
|
|
3591
|
+
/* @__PURE__ */ jsx9(
|
|
2279
3592
|
"input",
|
|
2280
3593
|
{
|
|
2281
3594
|
type: "text",
|
|
@@ -2287,7 +3600,7 @@ function DeleteWalletModal({
|
|
|
2287
3600
|
}
|
|
2288
3601
|
)
|
|
2289
3602
|
] }),
|
|
2290
|
-
error && /* @__PURE__ */
|
|
3603
|
+
error && /* @__PURE__ */ jsxs8(
|
|
2291
3604
|
"div",
|
|
2292
3605
|
{
|
|
2293
3606
|
style: {
|
|
@@ -2300,7 +3613,7 @@ function DeleteWalletModal({
|
|
|
2300
3613
|
borderRadius: 8
|
|
2301
3614
|
},
|
|
2302
3615
|
children: [
|
|
2303
|
-
/* @__PURE__ */
|
|
3616
|
+
/* @__PURE__ */ jsx9(
|
|
2304
3617
|
AlertTriangle,
|
|
2305
3618
|
{
|
|
2306
3619
|
size: 14,
|
|
@@ -2308,7 +3621,7 @@ function DeleteWalletModal({
|
|
|
2308
3621
|
style: { flexShrink: 0, marginTop: 2 }
|
|
2309
3622
|
}
|
|
2310
3623
|
),
|
|
2311
|
-
/* @__PURE__ */
|
|
3624
|
+
/* @__PURE__ */ jsx9(
|
|
2312
3625
|
"p",
|
|
2313
3626
|
{
|
|
2314
3627
|
style: {
|
|
@@ -2324,7 +3637,7 @@ function DeleteWalletModal({
|
|
|
2324
3637
|
}
|
|
2325
3638
|
)
|
|
2326
3639
|
] }),
|
|
2327
|
-
/* @__PURE__ */
|
|
3640
|
+
/* @__PURE__ */ jsx9("div", { style: footerStyle, children: /* @__PURE__ */ jsx9(
|
|
2328
3641
|
"button",
|
|
2329
3642
|
{
|
|
2330
3643
|
onClick: handleDelete,
|
|
@@ -2332,11 +3645,11 @@ function DeleteWalletModal({
|
|
|
2332
3645
|
onMouseEnter: () => setDeleteHovered(true),
|
|
2333
3646
|
onMouseLeave: () => setDeleteHovered(false),
|
|
2334
3647
|
style: deleteButtonStyle(canDelete, deleteHovered),
|
|
2335
|
-
children: isDeleting ? /* @__PURE__ */
|
|
2336
|
-
/* @__PURE__ */
|
|
3648
|
+
children: isDeleting ? /* @__PURE__ */ jsxs8(Fragment5, { children: [
|
|
3649
|
+
/* @__PURE__ */ jsx9(Loader2, { size: 14 }),
|
|
2337
3650
|
" Deleting..."
|
|
2338
|
-
] }) : /* @__PURE__ */
|
|
2339
|
-
/* @__PURE__ */
|
|
3651
|
+
] }) : /* @__PURE__ */ jsxs8(Fragment5, { children: [
|
|
3652
|
+
/* @__PURE__ */ jsx9(Trash2, { size: 14 }),
|
|
2340
3653
|
" Delete Wallet"
|
|
2341
3654
|
] })
|
|
2342
3655
|
}
|
|
@@ -2349,15 +3662,15 @@ function DeleteWalletModal({
|
|
|
2349
3662
|
}
|
|
2350
3663
|
|
|
2351
3664
|
// src/RenameWalletModal.tsx
|
|
2352
|
-
import { AnimatePresence as
|
|
3665
|
+
import { AnimatePresence as AnimatePresence5, motion as motion5 } from "framer-motion";
|
|
2353
3666
|
import {
|
|
2354
|
-
useCallback as
|
|
3667
|
+
useCallback as useCallback7,
|
|
2355
3668
|
useEffect as useEffect2,
|
|
2356
|
-
useState as
|
|
3669
|
+
useState as useState6
|
|
2357
3670
|
} from "react";
|
|
2358
|
-
import { Fragment as
|
|
3671
|
+
import { Fragment as Fragment6, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
2359
3672
|
var DANGER_BORDER2 = "rgba(248,113,113,0.2)";
|
|
2360
|
-
var
|
|
3673
|
+
var WALLET_NAME_REGEX2 = /^[a-zA-Z0-9/]+$/;
|
|
2361
3674
|
var backdropStyle3 = modalBackdropStyle(110);
|
|
2362
3675
|
var wrapperStyle2 = modalWrapperStyle2(111, 16);
|
|
2363
3676
|
var panelStyle2 = {
|
|
@@ -2425,26 +3738,27 @@ function RenameWalletModal({
|
|
|
2425
3738
|
onConfirm,
|
|
2426
3739
|
onNotify
|
|
2427
3740
|
}) {
|
|
2428
|
-
const [name, setName] =
|
|
2429
|
-
const [isRenaming, setIsRenaming] =
|
|
2430
|
-
const [error, setError] =
|
|
2431
|
-
const [saveHovered, setSaveHovered] =
|
|
3741
|
+
const [name, setName] = useState6("");
|
|
3742
|
+
const [isRenaming, setIsRenaming] = useState6(false);
|
|
3743
|
+
const [error, setError] = useState6(null);
|
|
3744
|
+
const [saveHovered, setSaveHovered] = useState6(false);
|
|
2432
3745
|
const currentName = wallet?.name || "Unnamed";
|
|
3746
|
+
const displayAddress = wallet?.ethereumAddress;
|
|
2433
3747
|
const trimmedName = name.trim();
|
|
2434
3748
|
const isNameChanged = trimmedName !== currentName;
|
|
2435
|
-
const isNameValid =
|
|
3749
|
+
const isNameValid = WALLET_NAME_REGEX2.test(trimmedName);
|
|
2436
3750
|
const canSubmit = isNameValid && isNameChanged && !isRenaming;
|
|
2437
3751
|
useEffect2(() => {
|
|
2438
3752
|
if (!wallet) return;
|
|
2439
3753
|
setName(wallet.name || "");
|
|
2440
3754
|
setError(null);
|
|
2441
3755
|
}, [wallet]);
|
|
2442
|
-
const handleClose =
|
|
3756
|
+
const handleClose = useCallback7(() => {
|
|
2443
3757
|
if (isRenaming) return;
|
|
2444
3758
|
setError(null);
|
|
2445
3759
|
onClose();
|
|
2446
3760
|
}, [isRenaming, onClose]);
|
|
2447
|
-
const handleRename =
|
|
3761
|
+
const handleRename = useCallback7(async () => {
|
|
2448
3762
|
if (!wallet || !isNameValid || !isNameChanged) return;
|
|
2449
3763
|
setError(null);
|
|
2450
3764
|
setIsRenaming(true);
|
|
@@ -2466,10 +3780,10 @@ function RenameWalletModal({
|
|
|
2466
3780
|
onClose,
|
|
2467
3781
|
onNotify
|
|
2468
3782
|
]);
|
|
2469
|
-
return /* @__PURE__ */
|
|
2470
|
-
/* @__PURE__ */
|
|
2471
|
-
/* @__PURE__ */
|
|
2472
|
-
|
|
3783
|
+
return /* @__PURE__ */ jsx10(AnimatePresence5, { children: isOpen && wallet && /* @__PURE__ */ jsxs9(Fragment6, { children: [
|
|
3784
|
+
/* @__PURE__ */ jsx10(SpinKeyframes, {}),
|
|
3785
|
+
/* @__PURE__ */ jsx10(
|
|
3786
|
+
motion5.div,
|
|
2473
3787
|
{
|
|
2474
3788
|
style: backdropStyle3,
|
|
2475
3789
|
initial: { opacity: 0 },
|
|
@@ -2480,8 +3794,8 @@ function RenameWalletModal({
|
|
|
2480
3794
|
},
|
|
2481
3795
|
"backdrop"
|
|
2482
3796
|
),
|
|
2483
|
-
/* @__PURE__ */
|
|
2484
|
-
|
|
3797
|
+
/* @__PURE__ */ jsx10("div", { style: wrapperStyle2, children: /* @__PURE__ */ jsxs9(
|
|
3798
|
+
motion5.div,
|
|
2485
3799
|
{
|
|
2486
3800
|
style: panelStyle2,
|
|
2487
3801
|
initial: { opacity: 0, y: 8 },
|
|
@@ -2490,22 +3804,22 @@ function RenameWalletModal({
|
|
|
2490
3804
|
transition: { duration: 0.18, ease: "easeOut" },
|
|
2491
3805
|
onClick: (e) => e.stopPropagation(),
|
|
2492
3806
|
children: [
|
|
2493
|
-
/* @__PURE__ */
|
|
2494
|
-
/* @__PURE__ */
|
|
2495
|
-
/* @__PURE__ */
|
|
3807
|
+
/* @__PURE__ */ jsxs9("div", { style: headerStyle2, children: [
|
|
3808
|
+
/* @__PURE__ */ jsx10("h3", { style: titleStyle, children: "Rename Wallet" }),
|
|
3809
|
+
/* @__PURE__ */ jsx10(
|
|
2496
3810
|
"button",
|
|
2497
3811
|
{
|
|
2498
3812
|
onClick: handleClose,
|
|
2499
3813
|
disabled: isRenaming,
|
|
2500
3814
|
style: closeBtnStyle(isRenaming),
|
|
2501
3815
|
"aria-label": "Close",
|
|
2502
|
-
children: /* @__PURE__ */
|
|
3816
|
+
children: /* @__PURE__ */ jsx10(X, { size: 16 })
|
|
2503
3817
|
}
|
|
2504
3818
|
)
|
|
2505
3819
|
] }),
|
|
2506
|
-
/* @__PURE__ */
|
|
2507
|
-
/* @__PURE__ */
|
|
2508
|
-
/* @__PURE__ */
|
|
3820
|
+
/* @__PURE__ */ jsxs9("div", { style: bodyStyle2, children: [
|
|
3821
|
+
/* @__PURE__ */ jsxs9("div", { style: infoBoxStyle2, children: [
|
|
3822
|
+
/* @__PURE__ */ jsx10(
|
|
2509
3823
|
"p",
|
|
2510
3824
|
{
|
|
2511
3825
|
style: {
|
|
@@ -2516,7 +3830,7 @@ function RenameWalletModal({
|
|
|
2516
3830
|
children: "Wallet"
|
|
2517
3831
|
}
|
|
2518
3832
|
),
|
|
2519
|
-
/* @__PURE__ */
|
|
3833
|
+
/* @__PURE__ */ jsx10(
|
|
2520
3834
|
"p",
|
|
2521
3835
|
{
|
|
2522
3836
|
style: {
|
|
@@ -2529,7 +3843,7 @@ function RenameWalletModal({
|
|
|
2529
3843
|
children: currentName
|
|
2530
3844
|
}
|
|
2531
3845
|
),
|
|
2532
|
-
/* @__PURE__ */
|
|
3846
|
+
/* @__PURE__ */ jsx10(
|
|
2533
3847
|
"p",
|
|
2534
3848
|
{
|
|
2535
3849
|
style: {
|
|
@@ -2540,13 +3854,13 @@ function RenameWalletModal({
|
|
|
2540
3854
|
fontFamily: fontFamily.mono,
|
|
2541
3855
|
wordBreak: "break-all"
|
|
2542
3856
|
},
|
|
2543
|
-
children:
|
|
3857
|
+
children: displayAddress
|
|
2544
3858
|
}
|
|
2545
3859
|
)
|
|
2546
3860
|
] }),
|
|
2547
|
-
/* @__PURE__ */
|
|
2548
|
-
/* @__PURE__ */
|
|
2549
|
-
/* @__PURE__ */
|
|
3861
|
+
/* @__PURE__ */ jsxs9("div", { children: [
|
|
3862
|
+
/* @__PURE__ */ jsx10("label", { style: labelStyle2, children: "Wallet name" }),
|
|
3863
|
+
/* @__PURE__ */ jsx10(
|
|
2550
3864
|
"input",
|
|
2551
3865
|
{
|
|
2552
3866
|
type: "text",
|
|
@@ -2564,7 +3878,7 @@ function RenameWalletModal({
|
|
|
2564
3878
|
style: inputStyle2(!!error, isRenaming)
|
|
2565
3879
|
}
|
|
2566
3880
|
),
|
|
2567
|
-
/* @__PURE__ */
|
|
3881
|
+
/* @__PURE__ */ jsx10(
|
|
2568
3882
|
"p",
|
|
2569
3883
|
{
|
|
2570
3884
|
style: {
|
|
@@ -2577,7 +3891,7 @@ function RenameWalletModal({
|
|
|
2577
3891
|
}
|
|
2578
3892
|
)
|
|
2579
3893
|
] }),
|
|
2580
|
-
error && /* @__PURE__ */
|
|
3894
|
+
error && /* @__PURE__ */ jsxs9(
|
|
2581
3895
|
"div",
|
|
2582
3896
|
{
|
|
2583
3897
|
style: {
|
|
@@ -2590,7 +3904,7 @@ function RenameWalletModal({
|
|
|
2590
3904
|
borderRadius: 8
|
|
2591
3905
|
},
|
|
2592
3906
|
children: [
|
|
2593
|
-
/* @__PURE__ */
|
|
3907
|
+
/* @__PURE__ */ jsx10(
|
|
2594
3908
|
AlertTriangle,
|
|
2595
3909
|
{
|
|
2596
3910
|
size: 14,
|
|
@@ -2598,7 +3912,7 @@ function RenameWalletModal({
|
|
|
2598
3912
|
style: { flexShrink: 0, marginTop: 2 }
|
|
2599
3913
|
}
|
|
2600
3914
|
),
|
|
2601
|
-
/* @__PURE__ */
|
|
3915
|
+
/* @__PURE__ */ jsx10(
|
|
2602
3916
|
"p",
|
|
2603
3917
|
{
|
|
2604
3918
|
style: {
|
|
@@ -2614,7 +3928,7 @@ function RenameWalletModal({
|
|
|
2614
3928
|
}
|
|
2615
3929
|
)
|
|
2616
3930
|
] }),
|
|
2617
|
-
/* @__PURE__ */
|
|
3931
|
+
/* @__PURE__ */ jsx10("div", { style: footerStyle2, children: /* @__PURE__ */ jsx10(
|
|
2618
3932
|
"button",
|
|
2619
3933
|
{
|
|
2620
3934
|
onClick: handleRename,
|
|
@@ -2622,11 +3936,11 @@ function RenameWalletModal({
|
|
|
2622
3936
|
onMouseEnter: () => setSaveHovered(true),
|
|
2623
3937
|
onMouseLeave: () => setSaveHovered(false),
|
|
2624
3938
|
style: saveButtonStyle(canSubmit, saveHovered),
|
|
2625
|
-
children: isRenaming ? /* @__PURE__ */
|
|
2626
|
-
/* @__PURE__ */
|
|
3939
|
+
children: isRenaming ? /* @__PURE__ */ jsxs9(Fragment6, { children: [
|
|
3940
|
+
/* @__PURE__ */ jsx10(Loader2, { size: 14 }),
|
|
2627
3941
|
" Saving..."
|
|
2628
|
-
] }) : /* @__PURE__ */
|
|
2629
|
-
/* @__PURE__ */
|
|
3942
|
+
] }) : /* @__PURE__ */ jsxs9(Fragment6, { children: [
|
|
3943
|
+
/* @__PURE__ */ jsx10(Pencil, { size: 14 }),
|
|
2630
3944
|
" Save Name"
|
|
2631
3945
|
] })
|
|
2632
3946
|
}
|
|
@@ -2639,7 +3953,7 @@ function RenameWalletModal({
|
|
|
2639
3953
|
}
|
|
2640
3954
|
|
|
2641
3955
|
// src/UserProfileModal.tsx
|
|
2642
|
-
import { Fragment as
|
|
3956
|
+
import { Fragment as Fragment7, jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
2643
3957
|
var DEFAULT_SLIPPAGE_OPTIONS = [
|
|
2644
3958
|
{ label: "0.5%", value: 5e-3 },
|
|
2645
3959
|
{ label: "1%", value: 0.01 },
|
|
@@ -2704,12 +4018,39 @@ var walletRowStyle = {
|
|
|
2704
4018
|
border: `1px solid ${profileColors.surfaceBd}`,
|
|
2705
4019
|
transition: "background-color 150ms, border-color 150ms"
|
|
2706
4020
|
};
|
|
4021
|
+
function getWalletTypeMeta(wallet) {
|
|
4022
|
+
if (wallet.isAgent) {
|
|
4023
|
+
return {
|
|
4024
|
+
label: "Agent wallet",
|
|
4025
|
+
color: "#38bdf8",
|
|
4026
|
+
background: "rgba(56,189,248,0.16)",
|
|
4027
|
+
border: "rgba(56,189,248,0.34)",
|
|
4028
|
+
icon: /* @__PURE__ */ jsx11(Bot, { size: 10 })
|
|
4029
|
+
};
|
|
4030
|
+
}
|
|
4031
|
+
if (wallet.isReadOnly) {
|
|
4032
|
+
return {
|
|
4033
|
+
label: "Read-only wallet",
|
|
4034
|
+
color: "#a78bfa",
|
|
4035
|
+
background: "rgba(167,139,250,0.16)",
|
|
4036
|
+
border: "rgba(167,139,250,0.34)",
|
|
4037
|
+
icon: /* @__PURE__ */ jsx11(Eye, { size: 10 })
|
|
4038
|
+
};
|
|
4039
|
+
}
|
|
4040
|
+
return {
|
|
4041
|
+
label: "Private-key wallet",
|
|
4042
|
+
color: "#34d399",
|
|
4043
|
+
background: "rgba(52,211,153,0.16)",
|
|
4044
|
+
border: "rgba(52,211,153,0.34)",
|
|
4045
|
+
icon: /* @__PURE__ */ jsx11(KeyRound, { size: 10 })
|
|
4046
|
+
};
|
|
4047
|
+
}
|
|
2707
4048
|
function ToggleSwitch({
|
|
2708
4049
|
checked,
|
|
2709
4050
|
onChange,
|
|
2710
4051
|
accentColor
|
|
2711
4052
|
}) {
|
|
2712
|
-
return /* @__PURE__ */
|
|
4053
|
+
return /* @__PURE__ */ jsx11(
|
|
2713
4054
|
"button",
|
|
2714
4055
|
{
|
|
2715
4056
|
onClick: onChange,
|
|
@@ -2728,7 +4069,7 @@ function ToggleSwitch({
|
|
|
2728
4069
|
padding: 0,
|
|
2729
4070
|
transition: "background 150ms"
|
|
2730
4071
|
},
|
|
2731
|
-
children: /* @__PURE__ */
|
|
4072
|
+
children: /* @__PURE__ */ jsx11(
|
|
2732
4073
|
"span",
|
|
2733
4074
|
{
|
|
2734
4075
|
style: {
|
|
@@ -2736,9 +4077,9 @@ function ToggleSwitch({
|
|
|
2736
4077
|
height: 12,
|
|
2737
4078
|
width: 12,
|
|
2738
4079
|
borderRadius: "50%",
|
|
2739
|
-
background: profileColors.text,
|
|
4080
|
+
background: checked ? pickContrastColor(accentColor) : profileColors.text,
|
|
2740
4081
|
transform: checked ? "translateX(20px)" : "translateX(4px)",
|
|
2741
|
-
transition: "transform 150ms"
|
|
4082
|
+
transition: "transform 150ms, background 150ms"
|
|
2742
4083
|
}
|
|
2743
4084
|
}
|
|
2744
4085
|
)
|
|
@@ -2751,8 +4092,8 @@ function RaisedButton({
|
|
|
2751
4092
|
children,
|
|
2752
4093
|
style
|
|
2753
4094
|
}) {
|
|
2754
|
-
const [hovered, setHovered] =
|
|
2755
|
-
return /* @__PURE__ */
|
|
4095
|
+
const [hovered, setHovered] = useState7(false);
|
|
4096
|
+
return /* @__PURE__ */ jsx11(
|
|
2756
4097
|
"button",
|
|
2757
4098
|
{
|
|
2758
4099
|
type: "button",
|
|
@@ -2775,8 +4116,8 @@ function SlippageButton({
|
|
|
2775
4116
|
onClick,
|
|
2776
4117
|
children
|
|
2777
4118
|
}) {
|
|
2778
|
-
const [hovered, setHovered] =
|
|
2779
|
-
return /* @__PURE__ */
|
|
4119
|
+
const [hovered, setHovered] = useState7(false);
|
|
4120
|
+
return /* @__PURE__ */ jsx11(
|
|
2780
4121
|
"button",
|
|
2781
4122
|
{
|
|
2782
4123
|
type: "button",
|
|
@@ -2804,6 +4145,7 @@ function UserProfileModal({
|
|
|
2804
4145
|
onWalletDeleted,
|
|
2805
4146
|
onWalletRenamed,
|
|
2806
4147
|
onShowPortfolio,
|
|
4148
|
+
onRenewAgentWallet,
|
|
2807
4149
|
onNotify,
|
|
2808
4150
|
accentColor,
|
|
2809
4151
|
principalColors
|
|
@@ -2815,9 +4157,9 @@ function UserProfileModal({
|
|
|
2815
4157
|
renameWallet,
|
|
2816
4158
|
authMethod
|
|
2817
4159
|
} = useHypurrConnectInternal();
|
|
2818
|
-
const [settingsTab, setSettingsTab] =
|
|
2819
|
-
const [walletToDelete, setWalletToDelete] =
|
|
2820
|
-
const [walletToRename, setWalletToRename] =
|
|
4160
|
+
const [settingsTab, setSettingsTab] = useState7("ui");
|
|
4161
|
+
const [walletToDelete, setWalletToDelete] = useState7(null);
|
|
4162
|
+
const [walletToRename, setWalletToRename] = useState7(null);
|
|
2821
4163
|
const profilePic = user?.photoUrl || "";
|
|
2822
4164
|
const displayName = user?.displayName || "";
|
|
2823
4165
|
const hfunScore = user?.hfunScore ?? null;
|
|
@@ -2825,30 +4167,30 @@ function UserProfileModal({
|
|
|
2825
4167
|
const telegramId = user?.telegramId;
|
|
2826
4168
|
const wallets = userWallets ?? [];
|
|
2827
4169
|
const colors = resolvePrincipalColors(accentColor, principalColors);
|
|
2828
|
-
const handleDeleteWallet =
|
|
4170
|
+
const handleDeleteWallet = useCallback8(
|
|
2829
4171
|
async (walletId) => {
|
|
2830
4172
|
await deleteWallet(walletId);
|
|
2831
4173
|
onWalletDeleted?.(walletId);
|
|
2832
4174
|
},
|
|
2833
4175
|
[deleteWallet, onWalletDeleted]
|
|
2834
4176
|
);
|
|
2835
|
-
const handleRenameWallet =
|
|
4177
|
+
const handleRenameWallet = useCallback8(
|
|
2836
4178
|
async (walletId, name) => {
|
|
2837
4179
|
await renameWallet(walletId, name);
|
|
2838
4180
|
onWalletRenamed?.(walletId, name);
|
|
2839
4181
|
},
|
|
2840
4182
|
[renameWallet, onWalletRenamed]
|
|
2841
4183
|
);
|
|
2842
|
-
const handleCopyAddress =
|
|
4184
|
+
const handleCopyAddress = useCallback8(() => {
|
|
2843
4185
|
if (!displayName) return;
|
|
2844
4186
|
navigator.clipboard.writeText(displayName);
|
|
2845
4187
|
onNotify?.({ type: "success", message: "Address copied" });
|
|
2846
4188
|
}, [displayName, onNotify]);
|
|
2847
|
-
return /* @__PURE__ */
|
|
2848
|
-
/* @__PURE__ */
|
|
2849
|
-
/* @__PURE__ */
|
|
2850
|
-
/* @__PURE__ */
|
|
2851
|
-
|
|
4189
|
+
return /* @__PURE__ */ jsxs10(Fragment7, { children: [
|
|
4190
|
+
/* @__PURE__ */ jsx11(AnimatePresence6, { children: isOpen && /* @__PURE__ */ jsxs10(Fragment7, { children: [
|
|
4191
|
+
/* @__PURE__ */ jsx11(SpinKeyframes, {}),
|
|
4192
|
+
/* @__PURE__ */ jsx11(
|
|
4193
|
+
motion6.div,
|
|
2852
4194
|
{
|
|
2853
4195
|
style: backdropStyle4,
|
|
2854
4196
|
initial: { opacity: 0 },
|
|
@@ -2859,8 +4201,8 @@ function UserProfileModal({
|
|
|
2859
4201
|
},
|
|
2860
4202
|
"backdrop"
|
|
2861
4203
|
),
|
|
2862
|
-
/* @__PURE__ */
|
|
2863
|
-
|
|
4204
|
+
/* @__PURE__ */ jsx11("div", { style: wrapperStyle3, onClick: onClose, children: /* @__PURE__ */ jsxs10(
|
|
4205
|
+
motion6.div,
|
|
2864
4206
|
{
|
|
2865
4207
|
style: panelStyle3,
|
|
2866
4208
|
initial: { opacity: 0, y: 8 },
|
|
@@ -2869,20 +4211,20 @@ function UserProfileModal({
|
|
|
2869
4211
|
transition: { duration: 0.18, ease: "easeOut" },
|
|
2870
4212
|
onClick: (e) => e.stopPropagation(),
|
|
2871
4213
|
children: [
|
|
2872
|
-
/* @__PURE__ */
|
|
2873
|
-
/* @__PURE__ */
|
|
2874
|
-
/* @__PURE__ */
|
|
4214
|
+
/* @__PURE__ */ jsxs10("div", { style: headerStyle3, children: [
|
|
4215
|
+
/* @__PURE__ */ jsx11("h3", { style: titleStyle, children: "Profile & Settings" }),
|
|
4216
|
+
/* @__PURE__ */ jsx11(
|
|
2875
4217
|
"button",
|
|
2876
4218
|
{
|
|
2877
4219
|
onClick: onClose,
|
|
2878
4220
|
style: closeBtnStyle(),
|
|
2879
4221
|
"aria-label": "Close",
|
|
2880
|
-
children: /* @__PURE__ */
|
|
4222
|
+
children: /* @__PURE__ */ jsx11(X, { size: 16 })
|
|
2881
4223
|
}
|
|
2882
4224
|
)
|
|
2883
4225
|
] }),
|
|
2884
|
-
/* @__PURE__ */
|
|
2885
|
-
authMethod === "eoa" && !profilePic ? /* @__PURE__ */
|
|
4226
|
+
/* @__PURE__ */ jsxs10("div", { style: profileSectionStyle, children: [
|
|
4227
|
+
authMethod === "eoa" && !profilePic ? /* @__PURE__ */ jsxs10(
|
|
2886
4228
|
"div",
|
|
2887
4229
|
{
|
|
2888
4230
|
style: {
|
|
@@ -2892,7 +4234,7 @@ function UserProfileModal({
|
|
|
2892
4234
|
borderRadius: 8
|
|
2893
4235
|
},
|
|
2894
4236
|
children: [
|
|
2895
|
-
/* @__PURE__ */
|
|
4237
|
+
/* @__PURE__ */ jsx11(
|
|
2896
4238
|
"p",
|
|
2897
4239
|
{
|
|
2898
4240
|
style: {
|
|
@@ -2903,7 +4245,7 @@ function UserProfileModal({
|
|
|
2903
4245
|
children: "Wallet"
|
|
2904
4246
|
}
|
|
2905
4247
|
),
|
|
2906
|
-
/* @__PURE__ */
|
|
4248
|
+
/* @__PURE__ */ jsxs10(
|
|
2907
4249
|
"div",
|
|
2908
4250
|
{
|
|
2909
4251
|
style: {
|
|
@@ -2913,7 +4255,7 @@ function UserProfileModal({
|
|
|
2913
4255
|
gap: 8
|
|
2914
4256
|
},
|
|
2915
4257
|
children: [
|
|
2916
|
-
/* @__PURE__ */
|
|
4258
|
+
/* @__PURE__ */ jsx11(
|
|
2917
4259
|
"p",
|
|
2918
4260
|
{
|
|
2919
4261
|
style: {
|
|
@@ -2927,7 +4269,7 @@ function UserProfileModal({
|
|
|
2927
4269
|
children: displayName
|
|
2928
4270
|
}
|
|
2929
4271
|
),
|
|
2930
|
-
/* @__PURE__ */
|
|
4272
|
+
/* @__PURE__ */ jsx11(
|
|
2931
4273
|
"button",
|
|
2932
4274
|
{
|
|
2933
4275
|
onClick: handleCopyAddress,
|
|
@@ -2940,7 +4282,7 @@ function UserProfileModal({
|
|
|
2940
4282
|
display: "flex"
|
|
2941
4283
|
},
|
|
2942
4284
|
"aria-label": "Copy address",
|
|
2943
|
-
children: /* @__PURE__ */
|
|
4285
|
+
children: /* @__PURE__ */ jsx11(Copy, { size: 13 })
|
|
2944
4286
|
}
|
|
2945
4287
|
)
|
|
2946
4288
|
]
|
|
@@ -2948,7 +4290,7 @@ function UserProfileModal({
|
|
|
2948
4290
|
)
|
|
2949
4291
|
]
|
|
2950
4292
|
}
|
|
2951
|
-
) : /* @__PURE__ */
|
|
4293
|
+
) : /* @__PURE__ */ jsxs10(
|
|
2952
4294
|
"div",
|
|
2953
4295
|
{
|
|
2954
4296
|
style: {
|
|
@@ -2957,7 +4299,7 @@ function UserProfileModal({
|
|
|
2957
4299
|
gap: 16
|
|
2958
4300
|
},
|
|
2959
4301
|
children: [
|
|
2960
|
-
profilePic ? /* @__PURE__ */
|
|
4302
|
+
profilePic ? /* @__PURE__ */ jsx11(
|
|
2961
4303
|
"img",
|
|
2962
4304
|
{
|
|
2963
4305
|
src: profilePic,
|
|
@@ -2969,7 +4311,7 @@ function UserProfileModal({
|
|
|
2969
4311
|
border: `1px solid ${profileColors.surfaceBd}`
|
|
2970
4312
|
}
|
|
2971
4313
|
}
|
|
2972
|
-
) : /* @__PURE__ */
|
|
4314
|
+
) : /* @__PURE__ */ jsx11(
|
|
2973
4315
|
"div",
|
|
2974
4316
|
{
|
|
2975
4317
|
style: {
|
|
@@ -2989,8 +4331,8 @@ function UserProfileModal({
|
|
|
2989
4331
|
children: displayName?.charAt(0)
|
|
2990
4332
|
}
|
|
2991
4333
|
),
|
|
2992
|
-
/* @__PURE__ */
|
|
2993
|
-
/* @__PURE__ */
|
|
4334
|
+
/* @__PURE__ */ jsxs10("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
4335
|
+
/* @__PURE__ */ jsx11(
|
|
2994
4336
|
"h4",
|
|
2995
4337
|
{
|
|
2996
4338
|
style: {
|
|
@@ -3006,7 +4348,7 @@ function UserProfileModal({
|
|
|
3006
4348
|
children: displayName
|
|
3007
4349
|
}
|
|
3008
4350
|
),
|
|
3009
|
-
telegramId && /* @__PURE__ */
|
|
4351
|
+
telegramId && /* @__PURE__ */ jsxs10(
|
|
3010
4352
|
"p",
|
|
3011
4353
|
{
|
|
3012
4354
|
style: {
|
|
@@ -3025,7 +4367,7 @@ function UserProfileModal({
|
|
|
3025
4367
|
]
|
|
3026
4368
|
}
|
|
3027
4369
|
),
|
|
3028
|
-
user && /* @__PURE__ */
|
|
4370
|
+
user && /* @__PURE__ */ jsxs10(
|
|
3029
4371
|
"div",
|
|
3030
4372
|
{
|
|
3031
4373
|
style: {
|
|
@@ -3035,8 +4377,8 @@ function UserProfileModal({
|
|
|
3035
4377
|
gap: 10
|
|
3036
4378
|
},
|
|
3037
4379
|
children: [
|
|
3038
|
-
/* @__PURE__ */
|
|
3039
|
-
/* @__PURE__ */
|
|
4380
|
+
/* @__PURE__ */ jsxs10("div", { style: statBoxStyle, children: [
|
|
4381
|
+
/* @__PURE__ */ jsxs10(
|
|
3040
4382
|
"div",
|
|
3041
4383
|
{
|
|
3042
4384
|
style: {
|
|
@@ -3047,12 +4389,12 @@ function UserProfileModal({
|
|
|
3047
4389
|
marginBottom: 6
|
|
3048
4390
|
},
|
|
3049
4391
|
children: [
|
|
3050
|
-
/* @__PURE__ */
|
|
3051
|
-
/* @__PURE__ */
|
|
4392
|
+
/* @__PURE__ */ jsx11(Star, { size: 13, color: "#eab308", fill: "#eab308" }),
|
|
4393
|
+
/* @__PURE__ */ jsx11("span", { style: upperLabelStyle, children: "Hfun Score" })
|
|
3052
4394
|
]
|
|
3053
4395
|
}
|
|
3054
4396
|
),
|
|
3055
|
-
/* @__PURE__ */
|
|
4397
|
+
/* @__PURE__ */ jsx11(
|
|
3056
4398
|
"p",
|
|
3057
4399
|
{
|
|
3058
4400
|
style: {
|
|
@@ -3067,8 +4409,8 @@ function UserProfileModal({
|
|
|
3067
4409
|
}
|
|
3068
4410
|
)
|
|
3069
4411
|
] }),
|
|
3070
|
-
/* @__PURE__ */
|
|
3071
|
-
/* @__PURE__ */
|
|
4412
|
+
/* @__PURE__ */ jsxs10("div", { style: statBoxStyle, children: [
|
|
4413
|
+
/* @__PURE__ */ jsxs10(
|
|
3072
4414
|
"div",
|
|
3073
4415
|
{
|
|
3074
4416
|
style: {
|
|
@@ -3079,12 +4421,12 @@ function UserProfileModal({
|
|
|
3079
4421
|
marginBottom: 6
|
|
3080
4422
|
},
|
|
3081
4423
|
children: [
|
|
3082
|
-
/* @__PURE__ */
|
|
3083
|
-
/* @__PURE__ */
|
|
4424
|
+
/* @__PURE__ */ jsx11(User, { size: 13 }),
|
|
4425
|
+
/* @__PURE__ */ jsx11("span", { style: upperLabelStyle, children: "Reputation" })
|
|
3084
4426
|
]
|
|
3085
4427
|
}
|
|
3086
4428
|
),
|
|
3087
|
-
/* @__PURE__ */
|
|
4429
|
+
/* @__PURE__ */ jsx11(
|
|
3088
4430
|
"p",
|
|
3089
4431
|
{
|
|
3090
4432
|
style: {
|
|
@@ -3103,43 +4445,43 @@ function UserProfileModal({
|
|
|
3103
4445
|
}
|
|
3104
4446
|
)
|
|
3105
4447
|
] }),
|
|
3106
|
-
/* @__PURE__ */
|
|
3107
|
-
/* @__PURE__ */
|
|
3108
|
-
/* @__PURE__ */
|
|
4448
|
+
/* @__PURE__ */ jsxs10("div", { style: settingsSectionStyle, children: [
|
|
4449
|
+
/* @__PURE__ */ jsxs10("div", { style: tabRowStyle, children: [
|
|
4450
|
+
/* @__PURE__ */ jsxs10(
|
|
3109
4451
|
RaisedButton,
|
|
3110
4452
|
{
|
|
3111
4453
|
selected: settingsTab === "ui",
|
|
3112
4454
|
onClick: () => setSettingsTab("ui"),
|
|
3113
4455
|
children: [
|
|
3114
|
-
/* @__PURE__ */
|
|
4456
|
+
/* @__PURE__ */ jsx11(Zap, { size: 13 }),
|
|
3115
4457
|
" UI"
|
|
3116
4458
|
]
|
|
3117
4459
|
}
|
|
3118
4460
|
),
|
|
3119
|
-
/* @__PURE__ */
|
|
4461
|
+
/* @__PURE__ */ jsxs10(
|
|
3120
4462
|
RaisedButton,
|
|
3121
4463
|
{
|
|
3122
4464
|
selected: settingsTab === "trading",
|
|
3123
4465
|
onClick: () => setSettingsTab("trading"),
|
|
3124
4466
|
children: [
|
|
3125
|
-
/* @__PURE__ */
|
|
4467
|
+
/* @__PURE__ */ jsx11(TrendingUp, { size: 13 }),
|
|
3126
4468
|
" Trading"
|
|
3127
4469
|
]
|
|
3128
4470
|
}
|
|
3129
4471
|
),
|
|
3130
|
-
/* @__PURE__ */
|
|
4472
|
+
/* @__PURE__ */ jsxs10(
|
|
3131
4473
|
RaisedButton,
|
|
3132
4474
|
{
|
|
3133
4475
|
selected: settingsTab === "wallets",
|
|
3134
4476
|
onClick: () => setSettingsTab("wallets"),
|
|
3135
4477
|
children: [
|
|
3136
|
-
/* @__PURE__ */
|
|
4478
|
+
/* @__PURE__ */ jsx11(Wallet, { size: 13 }),
|
|
3137
4479
|
" Wallets"
|
|
3138
4480
|
]
|
|
3139
4481
|
}
|
|
3140
4482
|
)
|
|
3141
4483
|
] }),
|
|
3142
|
-
settingsTab === "ui" && /* @__PURE__ */
|
|
4484
|
+
settingsTab === "ui" && /* @__PURE__ */ jsx11(
|
|
3143
4485
|
"div",
|
|
3144
4486
|
{
|
|
3145
4487
|
style: {
|
|
@@ -3147,7 +4489,7 @@ function UserProfileModal({
|
|
|
3147
4489
|
flexDirection: "column",
|
|
3148
4490
|
gap: 12
|
|
3149
4491
|
},
|
|
3150
|
-
children: /* @__PURE__ */
|
|
4492
|
+
children: /* @__PURE__ */ jsxs10(
|
|
3151
4493
|
"div",
|
|
3152
4494
|
{
|
|
3153
4495
|
style: {
|
|
@@ -3157,7 +4499,7 @@ function UserProfileModal({
|
|
|
3157
4499
|
padding: "8px 0"
|
|
3158
4500
|
},
|
|
3159
4501
|
children: [
|
|
3160
|
-
/* @__PURE__ */
|
|
4502
|
+
/* @__PURE__ */ jsxs10(
|
|
3161
4503
|
"div",
|
|
3162
4504
|
{
|
|
3163
4505
|
style: {
|
|
@@ -3166,9 +4508,9 @@ function UserProfileModal({
|
|
|
3166
4508
|
gap: 12
|
|
3167
4509
|
},
|
|
3168
4510
|
children: [
|
|
3169
|
-
/* @__PURE__ */
|
|
3170
|
-
/* @__PURE__ */
|
|
3171
|
-
/* @__PURE__ */
|
|
4511
|
+
/* @__PURE__ */ jsx11(Zap, { size: 16, color: profileColors.muted }),
|
|
4512
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
4513
|
+
/* @__PURE__ */ jsx11(
|
|
3172
4514
|
"p",
|
|
3173
4515
|
{
|
|
3174
4516
|
style: {
|
|
@@ -3181,7 +4523,7 @@ function UserProfileModal({
|
|
|
3181
4523
|
children: "Animations"
|
|
3182
4524
|
}
|
|
3183
4525
|
),
|
|
3184
|
-
/* @__PURE__ */
|
|
4526
|
+
/* @__PURE__ */ jsx11(
|
|
3185
4527
|
"p",
|
|
3186
4528
|
{
|
|
3187
4529
|
style: {
|
|
@@ -3197,7 +4539,7 @@ function UserProfileModal({
|
|
|
3197
4539
|
]
|
|
3198
4540
|
}
|
|
3199
4541
|
),
|
|
3200
|
-
/* @__PURE__ */
|
|
4542
|
+
/* @__PURE__ */ jsx11(
|
|
3201
4543
|
ToggleSwitch,
|
|
3202
4544
|
{
|
|
3203
4545
|
checked: animationsEnabled,
|
|
@@ -3210,8 +4552,8 @@ function UserProfileModal({
|
|
|
3210
4552
|
)
|
|
3211
4553
|
}
|
|
3212
4554
|
),
|
|
3213
|
-
settingsTab === "trading" && /* @__PURE__ */
|
|
3214
|
-
/* @__PURE__ */
|
|
4555
|
+
settingsTab === "trading" && /* @__PURE__ */ jsxs10("div", { style: { padding: "8px 0" }, children: [
|
|
4556
|
+
/* @__PURE__ */ jsxs10(
|
|
3215
4557
|
"div",
|
|
3216
4558
|
{
|
|
3217
4559
|
style: {
|
|
@@ -3221,9 +4563,9 @@ function UserProfileModal({
|
|
|
3221
4563
|
marginBottom: 12
|
|
3222
4564
|
},
|
|
3223
4565
|
children: [
|
|
3224
|
-
/* @__PURE__ */
|
|
3225
|
-
/* @__PURE__ */
|
|
3226
|
-
/* @__PURE__ */
|
|
4566
|
+
/* @__PURE__ */ jsx11(TrendingUp, { size: 16, color: profileColors.muted }),
|
|
4567
|
+
/* @__PURE__ */ jsxs10("div", { children: [
|
|
4568
|
+
/* @__PURE__ */ jsx11(
|
|
3227
4569
|
"p",
|
|
3228
4570
|
{
|
|
3229
4571
|
style: {
|
|
@@ -3236,7 +4578,7 @@ function UserProfileModal({
|
|
|
3236
4578
|
children: "Default Slippage"
|
|
3237
4579
|
}
|
|
3238
4580
|
),
|
|
3239
|
-
/* @__PURE__ */
|
|
4581
|
+
/* @__PURE__ */ jsx11(
|
|
3240
4582
|
"p",
|
|
3241
4583
|
{
|
|
3242
4584
|
style: {
|
|
@@ -3252,7 +4594,7 @@ function UserProfileModal({
|
|
|
3252
4594
|
]
|
|
3253
4595
|
}
|
|
3254
4596
|
),
|
|
3255
|
-
/* @__PURE__ */
|
|
4597
|
+
/* @__PURE__ */ jsx11("div", { style: { display: "flex", gap: 6 }, children: slippageOptions.map((option) => /* @__PURE__ */ jsx11(
|
|
3256
4598
|
SlippageButton,
|
|
3257
4599
|
{
|
|
3258
4600
|
onClick: () => onSlippageChange(option.value),
|
|
@@ -3262,7 +4604,7 @@ function UserProfileModal({
|
|
|
3262
4604
|
option.value
|
|
3263
4605
|
)) })
|
|
3264
4606
|
] }),
|
|
3265
|
-
settingsTab === "wallets" && /* @__PURE__ */
|
|
4607
|
+
settingsTab === "wallets" && /* @__PURE__ */ jsxs10(
|
|
3266
4608
|
"div",
|
|
3267
4609
|
{
|
|
3268
4610
|
style: {
|
|
@@ -3271,7 +4613,7 @@ function UserProfileModal({
|
|
|
3271
4613
|
gap: 8
|
|
3272
4614
|
},
|
|
3273
4615
|
children: [
|
|
3274
|
-
wallets.length === 0 ? /* @__PURE__ */
|
|
4616
|
+
wallets.length === 0 ? /* @__PURE__ */ jsxs10(
|
|
3275
4617
|
"div",
|
|
3276
4618
|
{
|
|
3277
4619
|
style: {
|
|
@@ -3279,7 +4621,7 @@ function UserProfileModal({
|
|
|
3279
4621
|
padding: "32px 0"
|
|
3280
4622
|
},
|
|
3281
4623
|
children: [
|
|
3282
|
-
/* @__PURE__ */
|
|
4624
|
+
/* @__PURE__ */ jsx11(
|
|
3283
4625
|
"div",
|
|
3284
4626
|
{
|
|
3285
4627
|
style: {
|
|
@@ -3292,10 +4634,10 @@ function UserProfileModal({
|
|
|
3292
4634
|
justifyContent: "center",
|
|
3293
4635
|
margin: "0 auto 12px"
|
|
3294
4636
|
},
|
|
3295
|
-
children: /* @__PURE__ */
|
|
4637
|
+
children: /* @__PURE__ */ jsx11(Wallet, { size: 18, color: profileColors.muted })
|
|
3296
4638
|
}
|
|
3297
4639
|
),
|
|
3298
|
-
/* @__PURE__ */
|
|
4640
|
+
/* @__PURE__ */ jsx11(
|
|
3299
4641
|
"p",
|
|
3300
4642
|
{
|
|
3301
4643
|
style: {
|
|
@@ -3309,7 +4651,7 @@ function UserProfileModal({
|
|
|
3309
4651
|
)
|
|
3310
4652
|
]
|
|
3311
4653
|
}
|
|
3312
|
-
) : /* @__PURE__ */
|
|
4654
|
+
) : /* @__PURE__ */ jsx11(
|
|
3313
4655
|
"div",
|
|
3314
4656
|
{
|
|
3315
4657
|
style: {
|
|
@@ -3319,20 +4661,21 @@ function UserProfileModal({
|
|
|
3319
4661
|
flexDirection: "column",
|
|
3320
4662
|
gap: 6
|
|
3321
4663
|
},
|
|
3322
|
-
children: wallets.map((wallet) => /* @__PURE__ */
|
|
4664
|
+
children: wallets.map((wallet) => /* @__PURE__ */ jsx11(
|
|
3323
4665
|
WalletRow,
|
|
3324
4666
|
{
|
|
3325
4667
|
wallet,
|
|
3326
4668
|
colors,
|
|
3327
4669
|
onRename: () => setWalletToRename(wallet),
|
|
3328
4670
|
onDelete: () => setWalletToDelete(wallet),
|
|
4671
|
+
onRenewAgentWallet: wallet.isAgent && onRenewAgentWallet ? () => onRenewAgentWallet(wallet) : void 0,
|
|
3329
4672
|
onShowPortfolio: onShowPortfolio ? () => onShowPortfolio(wallet) : void 0
|
|
3330
4673
|
},
|
|
3331
4674
|
wallet.id
|
|
3332
4675
|
))
|
|
3333
4676
|
}
|
|
3334
4677
|
),
|
|
3335
|
-
/* @__PURE__ */
|
|
4678
|
+
/* @__PURE__ */ jsxs10(
|
|
3336
4679
|
"p",
|
|
3337
4680
|
{
|
|
3338
4681
|
style: {
|
|
@@ -3354,7 +4697,7 @@ function UserProfileModal({
|
|
|
3354
4697
|
}
|
|
3355
4698
|
)
|
|
3356
4699
|
] }),
|
|
3357
|
-
/* @__PURE__ */
|
|
4700
|
+
/* @__PURE__ */ jsx11("div", { style: { padding: "0 24px 24px" }, children: /* @__PURE__ */ jsx11(
|
|
3358
4701
|
"button",
|
|
3359
4702
|
{
|
|
3360
4703
|
onClick: onClose,
|
|
@@ -3376,7 +4719,7 @@ function UserProfileModal({
|
|
|
3376
4719
|
"panel"
|
|
3377
4720
|
) })
|
|
3378
4721
|
] }) }),
|
|
3379
|
-
/* @__PURE__ */
|
|
4722
|
+
/* @__PURE__ */ jsx11(
|
|
3380
4723
|
DeleteWalletModal,
|
|
3381
4724
|
{
|
|
3382
4725
|
isOpen: !!walletToDelete,
|
|
@@ -3386,7 +4729,7 @@ function UserProfileModal({
|
|
|
3386
4729
|
onNotify
|
|
3387
4730
|
}
|
|
3388
4731
|
),
|
|
3389
|
-
/* @__PURE__ */
|
|
4732
|
+
/* @__PURE__ */ jsx11(
|
|
3390
4733
|
RenameWalletModal,
|
|
3391
4734
|
{
|
|
3392
4735
|
isOpen: !!walletToRename,
|
|
@@ -3404,73 +4747,115 @@ function WalletRow({
|
|
|
3404
4747
|
colors,
|
|
3405
4748
|
onRename,
|
|
3406
4749
|
onDelete,
|
|
4750
|
+
onRenewAgentWallet,
|
|
3407
4751
|
onShowPortfolio
|
|
3408
4752
|
}) {
|
|
3409
|
-
const [hovered, setHovered] =
|
|
3410
|
-
|
|
4753
|
+
const [hovered, setHovered] = useState7(false);
|
|
4754
|
+
const agentExpiryTitle = getAgentExpiryTitle(wallet);
|
|
4755
|
+
const isAgentExpired = !!agentExpiryTitle;
|
|
4756
|
+
const typeMeta = getWalletTypeMeta(wallet);
|
|
4757
|
+
return /* @__PURE__ */ jsxs10(
|
|
3411
4758
|
"div",
|
|
3412
4759
|
{
|
|
3413
4760
|
style: {
|
|
3414
4761
|
...walletRowStyle,
|
|
3415
|
-
background: hovered ? profileColors.surfaceBtnHover : profileColors.surfaceBtn,
|
|
3416
|
-
borderColor: hovered ? profileColors.surfaceBdHover : profileColors.surfaceBd
|
|
4762
|
+
background: isAgentExpired ? hovered ? "rgba(245,158,11,0.12)" : "rgba(245,158,11,0.07)" : hovered ? profileColors.surfaceBtnHover : profileColors.surfaceBtn,
|
|
4763
|
+
borderColor: isAgentExpired ? "rgba(245,158,11,0.34)" : hovered ? profileColors.surfaceBdHover : profileColors.surfaceBd
|
|
3417
4764
|
},
|
|
3418
4765
|
onMouseEnter: () => setHovered(true),
|
|
3419
4766
|
onMouseLeave: () => setHovered(false),
|
|
3420
4767
|
children: [
|
|
3421
|
-
/* @__PURE__ */
|
|
4768
|
+
/* @__PURE__ */ jsxs10(
|
|
3422
4769
|
"div",
|
|
3423
4770
|
{
|
|
3424
4771
|
style: {
|
|
4772
|
+
position: "relative",
|
|
3425
4773
|
width: 32,
|
|
3426
4774
|
height: 32,
|
|
3427
4775
|
borderRadius: 6,
|
|
3428
|
-
background: colors.accentBackground,
|
|
3429
|
-
border: `1px solid ${colors.accentBorder}`,
|
|
4776
|
+
background: isAgentExpired ? "rgba(245,158,11,0.12)" : colors.accentBackground,
|
|
4777
|
+
border: `1px solid ${isAgentExpired ? "rgba(245,158,11,0.34)" : colors.accentBorder}`,
|
|
3430
4778
|
display: "flex",
|
|
3431
4779
|
alignItems: "center",
|
|
3432
4780
|
justifyContent: "center",
|
|
3433
4781
|
flexShrink: 0
|
|
3434
4782
|
},
|
|
3435
|
-
children:
|
|
3436
|
-
|
|
3437
|
-
|
|
3438
|
-
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
|
|
3445
|
-
|
|
3446
|
-
|
|
4783
|
+
children: [
|
|
4784
|
+
/* @__PURE__ */ jsx11(
|
|
4785
|
+
"span",
|
|
4786
|
+
{
|
|
4787
|
+
style: {
|
|
4788
|
+
fontSize: 12.5,
|
|
4789
|
+
lineHeight: "1rem",
|
|
4790
|
+
fontWeight: 600,
|
|
4791
|
+
color: isAgentExpired ? EXPIRED_AGENT_COLOR : colors.accentText
|
|
4792
|
+
},
|
|
4793
|
+
children: (wallet.name || "W")[0].toUpperCase()
|
|
4794
|
+
}
|
|
4795
|
+
),
|
|
4796
|
+
/* @__PURE__ */ jsx11(
|
|
4797
|
+
"span",
|
|
4798
|
+
{
|
|
4799
|
+
role: "img",
|
|
4800
|
+
"aria-label": typeMeta.label,
|
|
4801
|
+
title: typeMeta.label,
|
|
4802
|
+
style: {
|
|
4803
|
+
position: "absolute",
|
|
4804
|
+
right: -5,
|
|
4805
|
+
bottom: -5,
|
|
4806
|
+
width: 16,
|
|
4807
|
+
height: 16,
|
|
4808
|
+
borderRadius: "50%",
|
|
4809
|
+
display: "flex",
|
|
4810
|
+
alignItems: "center",
|
|
4811
|
+
justifyContent: "center",
|
|
4812
|
+
color: typeMeta.color,
|
|
4813
|
+
background: typeMeta.background,
|
|
4814
|
+
border: `1px solid ${typeMeta.border}`,
|
|
4815
|
+
boxShadow: "0 1px 4px rgba(0,0,0,0.35)"
|
|
4816
|
+
},
|
|
4817
|
+
children: typeMeta.icon
|
|
4818
|
+
}
|
|
4819
|
+
)
|
|
4820
|
+
]
|
|
3447
4821
|
}
|
|
3448
4822
|
),
|
|
3449
|
-
/* @__PURE__ */
|
|
3450
|
-
/* @__PURE__ */
|
|
3451
|
-
"
|
|
4823
|
+
/* @__PURE__ */ jsxs10("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
4824
|
+
/* @__PURE__ */ jsx11(
|
|
4825
|
+
"div",
|
|
3452
4826
|
{
|
|
3453
4827
|
style: {
|
|
3454
|
-
|
|
3455
|
-
|
|
3456
|
-
|
|
3457
|
-
|
|
3458
|
-
color: profileColors.text,
|
|
3459
|
-
overflow: "hidden",
|
|
3460
|
-
textOverflow: "ellipsis",
|
|
3461
|
-
whiteSpace: "nowrap"
|
|
4828
|
+
display: "flex",
|
|
4829
|
+
alignItems: "center",
|
|
4830
|
+
gap: 5,
|
|
4831
|
+
minWidth: 0
|
|
3462
4832
|
},
|
|
3463
|
-
children:
|
|
4833
|
+
children: /* @__PURE__ */ jsx11(
|
|
4834
|
+
"p",
|
|
4835
|
+
{
|
|
4836
|
+
style: {
|
|
4837
|
+
margin: 0,
|
|
4838
|
+
fontSize: 12.5,
|
|
4839
|
+
lineHeight: "1rem",
|
|
4840
|
+
fontWeight: 500,
|
|
4841
|
+
color: isAgentExpired ? EXPIRED_AGENT_COLOR : profileColors.text,
|
|
4842
|
+
overflow: "hidden",
|
|
4843
|
+
textOverflow: "ellipsis",
|
|
4844
|
+
whiteSpace: "nowrap"
|
|
4845
|
+
},
|
|
4846
|
+
children: wallet.name || "Unnamed"
|
|
4847
|
+
}
|
|
4848
|
+
)
|
|
3464
4849
|
}
|
|
3465
4850
|
),
|
|
3466
|
-
/* @__PURE__ */
|
|
4851
|
+
/* @__PURE__ */ jsxs10(
|
|
3467
4852
|
"p",
|
|
3468
4853
|
{
|
|
3469
4854
|
style: {
|
|
3470
4855
|
margin: 0,
|
|
3471
4856
|
fontSize: 12.5,
|
|
3472
4857
|
lineHeight: "1rem",
|
|
3473
|
-
color: profileColors.muted,
|
|
4858
|
+
color: isAgentExpired ? "rgba(245,158,11,0.76)" : profileColors.muted,
|
|
3474
4859
|
fontFamily: fontFamily.mono
|
|
3475
4860
|
},
|
|
3476
4861
|
children: [
|
|
@@ -3481,7 +4866,14 @@ function WalletRow({
|
|
|
3481
4866
|
}
|
|
3482
4867
|
)
|
|
3483
4868
|
] }),
|
|
3484
|
-
/* @__PURE__ */
|
|
4869
|
+
agentExpiryTitle && /* @__PURE__ */ jsx11(
|
|
4870
|
+
AgentExpiryWarningIcon,
|
|
4871
|
+
{
|
|
4872
|
+
message: agentExpiryTitle,
|
|
4873
|
+
onClick: onRenewAgentWallet
|
|
4874
|
+
}
|
|
4875
|
+
),
|
|
4876
|
+
/* @__PURE__ */ jsxs10(
|
|
3485
4877
|
"div",
|
|
3486
4878
|
{
|
|
3487
4879
|
style: {
|
|
@@ -3493,7 +4885,18 @@ function WalletRow({
|
|
|
3493
4885
|
transition: "opacity 120ms"
|
|
3494
4886
|
},
|
|
3495
4887
|
children: [
|
|
3496
|
-
|
|
4888
|
+
wallet.isAgent && onRenewAgentWallet && /* @__PURE__ */ jsx11(
|
|
4889
|
+
IconBtn,
|
|
4890
|
+
{
|
|
4891
|
+
color: isAgentExpired ? EXPIRED_AGENT_COLOR : colors.accent,
|
|
4892
|
+
hoverBackgroundColor: isAgentExpired ? "rgba(245,158,11,0.12)" : colors.accentHoverBackground,
|
|
4893
|
+
title: "Renew agent wallet",
|
|
4894
|
+
ariaLabel: `Renew agent wallet for ${wallet.name || "wallet"}`,
|
|
4895
|
+
onClick: onRenewAgentWallet,
|
|
4896
|
+
children: /* @__PURE__ */ jsx11(RefreshCw, { size: 13 })
|
|
4897
|
+
}
|
|
4898
|
+
),
|
|
4899
|
+
onShowPortfolio && /* @__PURE__ */ jsx11(
|
|
3497
4900
|
IconBtn,
|
|
3498
4901
|
{
|
|
3499
4902
|
color: colors.accent,
|
|
@@ -3501,10 +4904,10 @@ function WalletRow({
|
|
|
3501
4904
|
title: "View portfolio",
|
|
3502
4905
|
ariaLabel: `View portfolio for ${wallet.name || "wallet"}`,
|
|
3503
4906
|
onClick: onShowPortfolio,
|
|
3504
|
-
children: /* @__PURE__ */
|
|
4907
|
+
children: /* @__PURE__ */ jsx11(LayoutDashboard, { size: 13 })
|
|
3505
4908
|
}
|
|
3506
4909
|
),
|
|
3507
|
-
/* @__PURE__ */
|
|
4910
|
+
/* @__PURE__ */ jsx11(
|
|
3508
4911
|
IconBtn,
|
|
3509
4912
|
{
|
|
3510
4913
|
color: colors.accent,
|
|
@@ -3512,10 +4915,10 @@ function WalletRow({
|
|
|
3512
4915
|
title: "Rename wallet",
|
|
3513
4916
|
ariaLabel: `Rename ${wallet.name || "wallet"}`,
|
|
3514
4917
|
onClick: onRename,
|
|
3515
|
-
children: /* @__PURE__ */
|
|
4918
|
+
children: /* @__PURE__ */ jsx11(Pencil, { size: 13 })
|
|
3516
4919
|
}
|
|
3517
4920
|
),
|
|
3518
|
-
/* @__PURE__ */
|
|
4921
|
+
/* @__PURE__ */ jsx11(
|
|
3519
4922
|
IconBtn,
|
|
3520
4923
|
{
|
|
3521
4924
|
color: "#ef4444",
|
|
@@ -3523,7 +4926,7 @@ function WalletRow({
|
|
|
3523
4926
|
title: "Delete wallet",
|
|
3524
4927
|
ariaLabel: `Delete ${wallet.name || "wallet"}`,
|
|
3525
4928
|
onClick: onDelete,
|
|
3526
|
-
children: /* @__PURE__ */
|
|
4929
|
+
children: /* @__PURE__ */ jsx11(Trash2, { size: 13 })
|
|
3527
4930
|
}
|
|
3528
4931
|
)
|
|
3529
4932
|
]
|
|
@@ -3541,8 +4944,8 @@ function IconBtn({
|
|
|
3541
4944
|
ariaLabel,
|
|
3542
4945
|
onClick
|
|
3543
4946
|
}) {
|
|
3544
|
-
const [hovered, setHovered] =
|
|
3545
|
-
return /* @__PURE__ */
|
|
4947
|
+
const [hovered, setHovered] = useState7(false);
|
|
4948
|
+
return /* @__PURE__ */ jsx11(
|
|
3546
4949
|
"button",
|
|
3547
4950
|
{
|
|
3548
4951
|
onMouseEnter: () => setHovered(true),
|
|
@@ -3568,7 +4971,7 @@ function IconBtn({
|
|
|
3568
4971
|
}
|
|
3569
4972
|
|
|
3570
4973
|
// src/WalletSelectorDropdown.tsx
|
|
3571
|
-
import { Fragment as
|
|
4974
|
+
import { Fragment as Fragment9, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
3572
4975
|
var DEFAULT_BACKGROUND_COLOR2 = "rgba(20,20,20,0.95)";
|
|
3573
4976
|
var getWalletNameParts = (name) => (name ?? "").split("/").map((part) => part.trim()).filter(Boolean);
|
|
3574
4977
|
var buildWalletListEntries = (wallets) => {
|
|
@@ -3638,6 +5041,27 @@ var formatCompactAddress = (addr) => {
|
|
|
3638
5041
|
if (!addr) return "";
|
|
3639
5042
|
return `${addr.slice(0, 4)}...${addr.slice(-2)}`;
|
|
3640
5043
|
};
|
|
5044
|
+
function getWalletTypeMeta2(wallet) {
|
|
5045
|
+
if (wallet.isAgent) {
|
|
5046
|
+
return {
|
|
5047
|
+
label: "Agent wallet",
|
|
5048
|
+
color: "#38bdf8",
|
|
5049
|
+
icon: /* @__PURE__ */ jsx12(Bot, { size: 12 })
|
|
5050
|
+
};
|
|
5051
|
+
}
|
|
5052
|
+
if (wallet.isReadOnly) {
|
|
5053
|
+
return {
|
|
5054
|
+
label: "Read-only wallet",
|
|
5055
|
+
color: "#a78bfa",
|
|
5056
|
+
icon: /* @__PURE__ */ jsx12(Eye, { size: 12 })
|
|
5057
|
+
};
|
|
5058
|
+
}
|
|
5059
|
+
return {
|
|
5060
|
+
label: "Private-key wallet",
|
|
5061
|
+
color: "#34d399",
|
|
5062
|
+
icon: /* @__PURE__ */ jsx12(KeyRound, { size: 12 })
|
|
5063
|
+
};
|
|
5064
|
+
}
|
|
3641
5065
|
var rootStyle = {
|
|
3642
5066
|
position: "absolute",
|
|
3643
5067
|
right: 0,
|
|
@@ -3680,6 +5104,7 @@ function WalletSelectorDropdown({
|
|
|
3680
5104
|
onClose,
|
|
3681
5105
|
onAddWallet,
|
|
3682
5106
|
onShowPortfolio,
|
|
5107
|
+
onRenewAgentWallet,
|
|
3683
5108
|
onLogout,
|
|
3684
5109
|
onNotify,
|
|
3685
5110
|
vipThreshold = 10,
|
|
@@ -3692,19 +5117,20 @@ function WalletSelectorDropdown({
|
|
|
3692
5117
|
onWalletRenamed,
|
|
3693
5118
|
accentColor,
|
|
3694
5119
|
principalColors,
|
|
3695
|
-
backgroundColor = DEFAULT_BACKGROUND_COLOR2
|
|
5120
|
+
backgroundColor = DEFAULT_BACKGROUND_COLOR2,
|
|
5121
|
+
extraFooterItems
|
|
3696
5122
|
}) {
|
|
3697
5123
|
const { user, wallets, selectedWalletId, selectWallet, logout, authMethod } = useHypurrConnectInternal();
|
|
3698
|
-
const [profileOpen, setProfileOpen] =
|
|
3699
|
-
const openProfile =
|
|
5124
|
+
const [profileOpen, setProfileOpen] = useState8(false);
|
|
5125
|
+
const openProfile = useCallback9(() => {
|
|
3700
5126
|
setProfileOpen(true);
|
|
3701
5127
|
onClose();
|
|
3702
5128
|
}, [onClose]);
|
|
3703
|
-
const walletListEntries =
|
|
5129
|
+
const walletListEntries = useMemo3(
|
|
3704
5130
|
() => buildWalletListEntries(Array.isArray(wallets) ? wallets : void 0),
|
|
3705
5131
|
[wallets]
|
|
3706
5132
|
);
|
|
3707
|
-
const handleCopyAddress =
|
|
5133
|
+
const handleCopyAddress = useCallback9(
|
|
3708
5134
|
(address) => {
|
|
3709
5135
|
if (!address) return;
|
|
3710
5136
|
navigator.clipboard.writeText(address);
|
|
@@ -3712,7 +5138,7 @@ function WalletSelectorDropdown({
|
|
|
3712
5138
|
},
|
|
3713
5139
|
[onNotify]
|
|
3714
5140
|
);
|
|
3715
|
-
const handleLogout =
|
|
5141
|
+
const handleLogout = useCallback9(() => {
|
|
3716
5142
|
onLogout?.();
|
|
3717
5143
|
logout();
|
|
3718
5144
|
onClose();
|
|
@@ -3726,12 +5152,17 @@ function WalletSelectorDropdown({
|
|
|
3726
5152
|
const { wallet, label } = item;
|
|
3727
5153
|
const isSelected = wallet.id === selectedWalletId;
|
|
3728
5154
|
const compactAddress = formatCompactAddress(wallet.ethereumAddress);
|
|
3729
|
-
|
|
5155
|
+
const agentExpiryTitle = getAgentExpiryTitle({
|
|
5156
|
+
isAgent: !!wallet.isAgent,
|
|
5157
|
+
agentExpiresAt: wallet.agentExpiresAt
|
|
5158
|
+
});
|
|
5159
|
+
return /* @__PURE__ */ jsx12(
|
|
3730
5160
|
WalletRow2,
|
|
3731
5161
|
{
|
|
3732
5162
|
depth,
|
|
3733
5163
|
isSelected,
|
|
3734
5164
|
label,
|
|
5165
|
+
walletType: getWalletTypeMeta2(wallet),
|
|
3735
5166
|
compactAddress,
|
|
3736
5167
|
onSelect: () => {
|
|
3737
5168
|
selectWallet(wallet.id);
|
|
@@ -3742,14 +5173,19 @@ function WalletSelectorDropdown({
|
|
|
3742
5173
|
onClose();
|
|
3743
5174
|
} : void 0,
|
|
3744
5175
|
onCopy: () => handleCopyAddress(wallet.ethereumAddress),
|
|
5176
|
+
agentExpiryTitle,
|
|
5177
|
+
onRenewAgentWallet: wallet.isAgent && onRenewAgentWallet ? () => {
|
|
5178
|
+
onRenewAgentWallet(wallet);
|
|
5179
|
+
onClose();
|
|
5180
|
+
} : void 0,
|
|
3745
5181
|
colors
|
|
3746
5182
|
},
|
|
3747
5183
|
wallet.id
|
|
3748
5184
|
);
|
|
3749
5185
|
};
|
|
3750
|
-
return /* @__PURE__ */
|
|
3751
|
-
/* @__PURE__ */
|
|
3752
|
-
|
|
5186
|
+
return /* @__PURE__ */ jsxs11(Fragment9, { children: [
|
|
5187
|
+
/* @__PURE__ */ jsx12(AnimatePresence7, { children: isOpen && /* @__PURE__ */ jsxs11(
|
|
5188
|
+
motion7.div,
|
|
3753
5189
|
{
|
|
3754
5190
|
style: { ...rootStyle, background: backgroundColor },
|
|
3755
5191
|
initial: { opacity: 0, scale: 0.95 },
|
|
@@ -3757,7 +5193,7 @@ function WalletSelectorDropdown({
|
|
|
3757
5193
|
exit: { opacity: 0, scale: 0.95 },
|
|
3758
5194
|
transition: { duration: 0.15, ease: "easeOut" },
|
|
3759
5195
|
children: [
|
|
3760
|
-
/* @__PURE__ */
|
|
5196
|
+
/* @__PURE__ */ jsxs11(
|
|
3761
5197
|
"button",
|
|
3762
5198
|
{
|
|
3763
5199
|
onClick: openProfile,
|
|
@@ -3780,7 +5216,7 @@ function WalletSelectorDropdown({
|
|
|
3780
5216
|
onMouseEnter: (e) => e.currentTarget.style.background = "rgba(255,255,255,0.06)",
|
|
3781
5217
|
onMouseLeave: (e) => e.currentTarget.style.background = "transparent",
|
|
3782
5218
|
children: [
|
|
3783
|
-
profilePic ? /* @__PURE__ */
|
|
5219
|
+
profilePic ? /* @__PURE__ */ jsxs11(
|
|
3784
5220
|
"div",
|
|
3785
5221
|
{
|
|
3786
5222
|
style: {
|
|
@@ -3790,7 +5226,7 @@ function WalletSelectorDropdown({
|
|
|
3790
5226
|
background: isVip ? "linear-gradient(to right, #fde047, #eab308, #ca8a04)" : "transparent"
|
|
3791
5227
|
},
|
|
3792
5228
|
children: [
|
|
3793
|
-
/* @__PURE__ */
|
|
5229
|
+
/* @__PURE__ */ jsx12(
|
|
3794
5230
|
"img",
|
|
3795
5231
|
{
|
|
3796
5232
|
src: profilePic,
|
|
@@ -3803,7 +5239,7 @@ function WalletSelectorDropdown({
|
|
|
3803
5239
|
}
|
|
3804
5240
|
}
|
|
3805
5241
|
),
|
|
3806
|
-
isVip && /* @__PURE__ */
|
|
5242
|
+
isVip && /* @__PURE__ */ jsx12(
|
|
3807
5243
|
Crown,
|
|
3808
5244
|
{
|
|
3809
5245
|
size: 12,
|
|
@@ -3819,7 +5255,7 @@ function WalletSelectorDropdown({
|
|
|
3819
5255
|
)
|
|
3820
5256
|
]
|
|
3821
5257
|
}
|
|
3822
|
-
) : authMethod === "eoa" ? /* @__PURE__ */
|
|
5258
|
+
) : authMethod === "eoa" ? /* @__PURE__ */ jsx12(
|
|
3823
5259
|
"div",
|
|
3824
5260
|
{
|
|
3825
5261
|
style: {
|
|
@@ -3833,9 +5269,9 @@ function WalletSelectorDropdown({
|
|
|
3833
5269
|
justifyContent: "center",
|
|
3834
5270
|
flexShrink: 0
|
|
3835
5271
|
},
|
|
3836
|
-
children: /* @__PURE__ */
|
|
5272
|
+
children: /* @__PURE__ */ jsx12(Wallet, { size: 14, color: colors.accentText })
|
|
3837
5273
|
}
|
|
3838
|
-
) : /* @__PURE__ */
|
|
5274
|
+
) : /* @__PURE__ */ jsxs11(
|
|
3839
5275
|
"div",
|
|
3840
5276
|
{
|
|
3841
5277
|
style: {
|
|
@@ -3854,7 +5290,7 @@ function WalletSelectorDropdown({
|
|
|
3854
5290
|
},
|
|
3855
5291
|
children: [
|
|
3856
5292
|
displayName.charAt(0),
|
|
3857
|
-
isVip && /* @__PURE__ */
|
|
5293
|
+
isVip && /* @__PURE__ */ jsx12(
|
|
3858
5294
|
Crown,
|
|
3859
5295
|
{
|
|
3860
5296
|
size: 12,
|
|
@@ -3871,8 +5307,8 @@ function WalletSelectorDropdown({
|
|
|
3871
5307
|
]
|
|
3872
5308
|
}
|
|
3873
5309
|
),
|
|
3874
|
-
/* @__PURE__ */
|
|
3875
|
-
/* @__PURE__ */
|
|
5310
|
+
/* @__PURE__ */ jsx12("div", { style: { overflow: "hidden", flex: 1 }, children: /* @__PURE__ */ jsxs11("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
5311
|
+
/* @__PURE__ */ jsx12(
|
|
3876
5312
|
"p",
|
|
3877
5313
|
{
|
|
3878
5314
|
style: {
|
|
@@ -3887,7 +5323,7 @@ function WalletSelectorDropdown({
|
|
|
3887
5323
|
children: displayName
|
|
3888
5324
|
}
|
|
3889
5325
|
),
|
|
3890
|
-
hfunScore > 0 && /* @__PURE__ */
|
|
5326
|
+
hfunScore > 0 && /* @__PURE__ */ jsxs11(
|
|
3891
5327
|
"span",
|
|
3892
5328
|
{
|
|
3893
5329
|
style: {
|
|
@@ -3902,7 +5338,7 @@ function WalletSelectorDropdown({
|
|
|
3902
5338
|
borderRadius: 4
|
|
3903
5339
|
},
|
|
3904
5340
|
children: [
|
|
3905
|
-
/* @__PURE__ */
|
|
5341
|
+
/* @__PURE__ */ jsx12(Star, { size: 10, color: "#eab308", fill: "#eab308" }),
|
|
3906
5342
|
hfunScore.toFixed(0)
|
|
3907
5343
|
]
|
|
3908
5344
|
}
|
|
@@ -3911,9 +5347,9 @@ function WalletSelectorDropdown({
|
|
|
3911
5347
|
]
|
|
3912
5348
|
}
|
|
3913
5349
|
),
|
|
3914
|
-
/* @__PURE__ */
|
|
3915
|
-
/* @__PURE__ */
|
|
3916
|
-
/* @__PURE__ */
|
|
5350
|
+
/* @__PURE__ */ jsxs11("div", { style: { borderBottom: sectionBorder }, children: [
|
|
5351
|
+
/* @__PURE__ */ jsx12("div", { style: sectionHeaderStyle, children: "Wallets" }),
|
|
5352
|
+
/* @__PURE__ */ jsx12(
|
|
3917
5353
|
"div",
|
|
3918
5354
|
{
|
|
3919
5355
|
style: {
|
|
@@ -3928,8 +5364,8 @@ function WalletSelectorDropdown({
|
|
|
3928
5364
|
const isSelectedGroup = entry.items.some(
|
|
3929
5365
|
(item) => item.wallet.id === selectedWalletId
|
|
3930
5366
|
);
|
|
3931
|
-
return /* @__PURE__ */
|
|
3932
|
-
/* @__PURE__ */
|
|
5367
|
+
return /* @__PURE__ */ jsxs11(Fragment8, { children: [
|
|
5368
|
+
/* @__PURE__ */ jsxs11(
|
|
3933
5369
|
"div",
|
|
3934
5370
|
{
|
|
3935
5371
|
style: {
|
|
@@ -3944,8 +5380,8 @@ function WalletSelectorDropdown({
|
|
|
3944
5380
|
color: isSelectedGroup ? "#e5e7eb" : "#6b7280"
|
|
3945
5381
|
},
|
|
3946
5382
|
children: [
|
|
3947
|
-
/* @__PURE__ */
|
|
3948
|
-
/* @__PURE__ */
|
|
5383
|
+
/* @__PURE__ */ jsx12(Folder, { size: 12, style: { flexShrink: 0 } }),
|
|
5384
|
+
/* @__PURE__ */ jsx12(
|
|
3949
5385
|
"span",
|
|
3950
5386
|
{
|
|
3951
5387
|
style: {
|
|
@@ -3958,7 +5394,7 @@ function WalletSelectorDropdown({
|
|
|
3958
5394
|
children: entry.path
|
|
3959
5395
|
}
|
|
3960
5396
|
),
|
|
3961
|
-
/* @__PURE__ */
|
|
5397
|
+
/* @__PURE__ */ jsx12(
|
|
3962
5398
|
"span",
|
|
3963
5399
|
{
|
|
3964
5400
|
style: {
|
|
@@ -3977,7 +5413,7 @@ function WalletSelectorDropdown({
|
|
|
3977
5413
|
})
|
|
3978
5414
|
}
|
|
3979
5415
|
),
|
|
3980
|
-
authMethod !== "eoa" && onAddWallet && /* @__PURE__ */
|
|
5416
|
+
authMethod !== "eoa" && onAddWallet && /* @__PURE__ */ jsxs11(
|
|
3981
5417
|
"button",
|
|
3982
5418
|
{
|
|
3983
5419
|
onClick: () => {
|
|
@@ -4001,26 +5437,36 @@ function WalletSelectorDropdown({
|
|
|
4001
5437
|
onMouseEnter: (e) => e.currentTarget.style.background = "rgba(255,255,255,0.06)",
|
|
4002
5438
|
onMouseLeave: (e) => e.currentTarget.style.background = "transparent",
|
|
4003
5439
|
children: [
|
|
4004
|
-
/* @__PURE__ */
|
|
5440
|
+
/* @__PURE__ */ jsx12(Plus, { size: 14 }),
|
|
4005
5441
|
"Add Wallet"
|
|
4006
5442
|
]
|
|
4007
5443
|
}
|
|
4008
5444
|
)
|
|
4009
5445
|
] }),
|
|
4010
|
-
/* @__PURE__ */
|
|
4011
|
-
/* @__PURE__ */
|
|
5446
|
+
/* @__PURE__ */ jsxs11("div", { children: [
|
|
5447
|
+
/* @__PURE__ */ jsx12(
|
|
4012
5448
|
FooterBtn,
|
|
4013
5449
|
{
|
|
4014
5450
|
onClick: openProfile,
|
|
4015
|
-
icon: /* @__PURE__ */
|
|
5451
|
+
icon: /* @__PURE__ */ jsx12(User, { size: 14 }),
|
|
4016
5452
|
label: "Profile & Settings"
|
|
4017
5453
|
}
|
|
4018
5454
|
),
|
|
4019
|
-
/* @__PURE__ */
|
|
5455
|
+
extraFooterItems?.map((item) => /* @__PURE__ */ jsx12(
|
|
5456
|
+
FooterBtn,
|
|
5457
|
+
{
|
|
5458
|
+
onClick: item.onClick,
|
|
5459
|
+
icon: item.icon,
|
|
5460
|
+
label: item.label,
|
|
5461
|
+
hoverColor: item.hoverColor
|
|
5462
|
+
},
|
|
5463
|
+
item.key
|
|
5464
|
+
)),
|
|
5465
|
+
/* @__PURE__ */ jsx12(
|
|
4020
5466
|
FooterBtn,
|
|
4021
5467
|
{
|
|
4022
5468
|
onClick: handleLogout,
|
|
4023
|
-
icon: /* @__PURE__ */
|
|
5469
|
+
icon: /* @__PURE__ */ jsx12(LogOut, { size: 14 }),
|
|
4024
5470
|
label: "Logout",
|
|
4025
5471
|
hoverColor: "#ef4444"
|
|
4026
5472
|
}
|
|
@@ -4029,7 +5475,7 @@ function WalletSelectorDropdown({
|
|
|
4029
5475
|
]
|
|
4030
5476
|
}
|
|
4031
5477
|
) }),
|
|
4032
|
-
/* @__PURE__ */
|
|
5478
|
+
/* @__PURE__ */ jsx12(
|
|
4033
5479
|
UserProfileModal,
|
|
4034
5480
|
{
|
|
4035
5481
|
isOpen: profileOpen,
|
|
@@ -4043,6 +5489,7 @@ function WalletSelectorDropdown({
|
|
|
4043
5489
|
principalColors,
|
|
4044
5490
|
onWalletDeleted,
|
|
4045
5491
|
onWalletRenamed,
|
|
5492
|
+
onRenewAgentWallet,
|
|
4046
5493
|
onShowPortfolio: onShowPortfolio ? (wallet) => {
|
|
4047
5494
|
onShowPortfolio(wallet);
|
|
4048
5495
|
setProfileOpen(false);
|
|
@@ -4058,7 +5505,7 @@ function FooterBtn({
|
|
|
4058
5505
|
label,
|
|
4059
5506
|
hoverColor = "#fff"
|
|
4060
5507
|
}) {
|
|
4061
|
-
return /* @__PURE__ */
|
|
5508
|
+
return /* @__PURE__ */ jsxs11(
|
|
4062
5509
|
"button",
|
|
4063
5510
|
{
|
|
4064
5511
|
onClick,
|
|
@@ -4082,13 +5529,19 @@ function WalletRow2({
|
|
|
4082
5529
|
depth,
|
|
4083
5530
|
isSelected,
|
|
4084
5531
|
label,
|
|
5532
|
+
walletType,
|
|
4085
5533
|
compactAddress,
|
|
4086
5534
|
onSelect,
|
|
4087
5535
|
onShowPortfolio,
|
|
4088
5536
|
onCopy,
|
|
5537
|
+
agentExpiryTitle,
|
|
5538
|
+
onRenewAgentWallet,
|
|
4089
5539
|
colors
|
|
4090
5540
|
}) {
|
|
4091
|
-
|
|
5541
|
+
const isAgentExpired = !!agentExpiryTitle;
|
|
5542
|
+
const walletTextColor = isAgentExpired ? EXPIRED_AGENT_COLOR : "#d1d5db";
|
|
5543
|
+
const mutedTextColor = isAgentExpired ? "rgba(245,158,11,0.78)" : "#6b7280";
|
|
5544
|
+
return /* @__PURE__ */ jsxs11(
|
|
4092
5545
|
"div",
|
|
4093
5546
|
{
|
|
4094
5547
|
style: {
|
|
@@ -4098,7 +5551,7 @@ function WalletRow2({
|
|
|
4098
5551
|
paddingTop: 6,
|
|
4099
5552
|
paddingBottom: 6,
|
|
4100
5553
|
fontSize: 14,
|
|
4101
|
-
color:
|
|
5554
|
+
color: walletTextColor,
|
|
4102
5555
|
display: "flex",
|
|
4103
5556
|
alignItems: "center",
|
|
4104
5557
|
background: isSelected ? "rgba(255,255,255,0.06)" : "transparent",
|
|
@@ -4115,7 +5568,7 @@ function WalletRow2({
|
|
|
4115
5568
|
if (actions) actions.style.opacity = "0";
|
|
4116
5569
|
},
|
|
4117
5570
|
children: [
|
|
4118
|
-
/* @__PURE__ */
|
|
5571
|
+
/* @__PURE__ */ jsxs11(
|
|
4119
5572
|
"button",
|
|
4120
5573
|
{
|
|
4121
5574
|
onClick: onSelect,
|
|
@@ -4132,50 +5585,74 @@ function WalletRow2({
|
|
|
4132
5585
|
cursor: "pointer",
|
|
4133
5586
|
padding: 0
|
|
4134
5587
|
},
|
|
4135
|
-
children:
|
|
4136
|
-
/* @__PURE__ */
|
|
5588
|
+
children: [
|
|
5589
|
+
/* @__PURE__ */ jsx12(
|
|
4137
5590
|
"span",
|
|
4138
5591
|
{
|
|
5592
|
+
title: walletType.label,
|
|
5593
|
+
"aria-label": walletType.label,
|
|
4139
5594
|
style: {
|
|
4140
|
-
|
|
4141
|
-
|
|
4142
|
-
|
|
4143
|
-
|
|
4144
|
-
|
|
5595
|
+
display: "inline-flex",
|
|
5596
|
+
alignItems: "center",
|
|
5597
|
+
justifyContent: "center",
|
|
5598
|
+
flexShrink: 0,
|
|
5599
|
+
color: isAgentExpired ? walletTextColor : walletType.color
|
|
4145
5600
|
},
|
|
4146
|
-
children:
|
|
5601
|
+
children: walletType.icon
|
|
4147
5602
|
}
|
|
4148
5603
|
),
|
|
4149
|
-
/* @__PURE__ */
|
|
5604
|
+
label ? /* @__PURE__ */ jsxs11(Fragment9, { children: [
|
|
5605
|
+
/* @__PURE__ */ jsx12(
|
|
5606
|
+
"span",
|
|
5607
|
+
{
|
|
5608
|
+
style: {
|
|
5609
|
+
overflow: "hidden",
|
|
5610
|
+
textOverflow: "ellipsis",
|
|
5611
|
+
whiteSpace: "nowrap",
|
|
5612
|
+
color: isAgentExpired ? walletTextColor : isSelected ? "#fff" : void 0,
|
|
5613
|
+
fontWeight: isSelected ? 500 : void 0
|
|
5614
|
+
},
|
|
5615
|
+
children: label
|
|
5616
|
+
}
|
|
5617
|
+
),
|
|
5618
|
+
/* @__PURE__ */ jsxs11(
|
|
5619
|
+
"span",
|
|
5620
|
+
{
|
|
5621
|
+
style: {
|
|
5622
|
+
fontSize: 12,
|
|
5623
|
+
fontWeight: 400,
|
|
5624
|
+
flexShrink: 0,
|
|
5625
|
+
color: mutedTextColor
|
|
5626
|
+
},
|
|
5627
|
+
children: [
|
|
5628
|
+
"(",
|
|
5629
|
+
compactAddress,
|
|
5630
|
+
")"
|
|
5631
|
+
]
|
|
5632
|
+
}
|
|
5633
|
+
)
|
|
5634
|
+
] }) : /* @__PURE__ */ jsx12(
|
|
4150
5635
|
"span",
|
|
4151
5636
|
{
|
|
4152
5637
|
style: {
|
|
4153
5638
|
fontSize: 12,
|
|
4154
|
-
|
|
4155
|
-
|
|
4156
|
-
color: "#6b7280"
|
|
5639
|
+
color: isAgentExpired ? walletTextColor : isSelected ? "#fff" : "#9ca3af",
|
|
5640
|
+
fontWeight: isSelected ? 500 : void 0
|
|
4157
5641
|
},
|
|
4158
|
-
children:
|
|
4159
|
-
"(",
|
|
4160
|
-
compactAddress,
|
|
4161
|
-
")"
|
|
4162
|
-
]
|
|
5642
|
+
children: compactAddress
|
|
4163
5643
|
}
|
|
4164
5644
|
)
|
|
4165
|
-
]
|
|
4166
|
-
|
|
4167
|
-
|
|
4168
|
-
|
|
4169
|
-
|
|
4170
|
-
|
|
4171
|
-
|
|
4172
|
-
|
|
4173
|
-
children: compactAddress
|
|
4174
|
-
}
|
|
4175
|
-
)
|
|
5645
|
+
]
|
|
5646
|
+
}
|
|
5647
|
+
),
|
|
5648
|
+
agentExpiryTitle && /* @__PURE__ */ jsx12(
|
|
5649
|
+
AgentExpiryWarningIcon,
|
|
5650
|
+
{
|
|
5651
|
+
message: agentExpiryTitle,
|
|
5652
|
+
onClick: onRenewAgentWallet
|
|
4176
5653
|
}
|
|
4177
5654
|
),
|
|
4178
|
-
/* @__PURE__ */
|
|
5655
|
+
/* @__PURE__ */ jsxs11(
|
|
4179
5656
|
"div",
|
|
4180
5657
|
{
|
|
4181
5658
|
"data-row-actions": true,
|
|
@@ -4186,7 +5663,19 @@ function WalletRow2({
|
|
|
4186
5663
|
transition: "opacity 120ms"
|
|
4187
5664
|
},
|
|
4188
5665
|
children: [
|
|
4189
|
-
|
|
5666
|
+
onRenewAgentWallet && /* @__PURE__ */ jsx12(
|
|
5667
|
+
RowIconBtn,
|
|
5668
|
+
{
|
|
5669
|
+
title: "Renew agent wallet",
|
|
5670
|
+
hoverColor: isAgentExpired ? EXPIRED_AGENT_COLOR : colors.accent,
|
|
5671
|
+
onClick: (e) => {
|
|
5672
|
+
e.stopPropagation();
|
|
5673
|
+
onRenewAgentWallet();
|
|
5674
|
+
},
|
|
5675
|
+
children: /* @__PURE__ */ jsx12(RefreshCw, { size: 12 })
|
|
5676
|
+
}
|
|
5677
|
+
),
|
|
5678
|
+
onShowPortfolio && /* @__PURE__ */ jsx12(
|
|
4190
5679
|
RowIconBtn,
|
|
4191
5680
|
{
|
|
4192
5681
|
title: "View portfolio",
|
|
@@ -4195,10 +5684,10 @@ function WalletRow2({
|
|
|
4195
5684
|
e.stopPropagation();
|
|
4196
5685
|
onShowPortfolio();
|
|
4197
5686
|
},
|
|
4198
|
-
children: /* @__PURE__ */
|
|
5687
|
+
children: /* @__PURE__ */ jsx12(LayoutDashboard, { size: 12 })
|
|
4199
5688
|
}
|
|
4200
5689
|
),
|
|
4201
|
-
/* @__PURE__ */
|
|
5690
|
+
/* @__PURE__ */ jsx12(
|
|
4202
5691
|
RowIconBtn,
|
|
4203
5692
|
{
|
|
4204
5693
|
title: "Copy address",
|
|
@@ -4207,7 +5696,7 @@ function WalletRow2({
|
|
|
4207
5696
|
e.stopPropagation();
|
|
4208
5697
|
onCopy();
|
|
4209
5698
|
},
|
|
4210
|
-
children: /* @__PURE__ */
|
|
5699
|
+
children: /* @__PURE__ */ jsx12(Copy, { size: 12 })
|
|
4211
5700
|
}
|
|
4212
5701
|
)
|
|
4213
5702
|
]
|
|
@@ -4223,7 +5712,7 @@ function RowIconBtn({
|
|
|
4223
5712
|
onClick,
|
|
4224
5713
|
hoverColor = profileColors.text
|
|
4225
5714
|
}) {
|
|
4226
|
-
return /* @__PURE__ */
|
|
5715
|
+
return /* @__PURE__ */ jsx12(
|
|
4227
5716
|
"button",
|
|
4228
5717
|
{
|
|
4229
5718
|
onClick,
|
|
@@ -4258,16 +5747,21 @@ function createEoaSigner(signTypedDataAsync, chainId, options = {}) {
|
|
|
4258
5747
|
};
|
|
4259
5748
|
}
|
|
4260
5749
|
export {
|
|
5750
|
+
AGENT_APPROVAL_DURATION_OPTIONS,
|
|
5751
|
+
AddWalletModal,
|
|
5752
|
+
DEFAULT_AGENT_APPROVAL_DURATION_MS,
|
|
4261
5753
|
DeleteWalletModal,
|
|
4262
5754
|
GrpcExchangeTransport,
|
|
4263
5755
|
HypurrConnectProvider,
|
|
4264
5756
|
LoginModal,
|
|
4265
5757
|
PrivateKeySigner,
|
|
4266
5758
|
RenameWalletModal,
|
|
5759
|
+
RenewAgentModal,
|
|
4267
5760
|
UserProfileModal,
|
|
4268
5761
|
WalletSelectorDropdown,
|
|
4269
5762
|
createEoaSigner,
|
|
4270
5763
|
createStaticClient,
|
|
5764
|
+
createTelegramAgentApprovalName,
|
|
4271
5765
|
createTelegramClient,
|
|
4272
5766
|
useHypurrConnect
|
|
4273
5767
|
};
|