@b3dotfun/sdk 0.0.44-alpha.1 → 0.0.44-alpha.2

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.
Files changed (24) hide show
  1. package/dist/cjs/anyspend/react/components/AnySpend.js +12 -13
  2. package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +13 -14
  3. package/dist/cjs/anyspend/react/components/common/OrderHistory.js +2 -2
  4. package/dist/cjs/anyspend/react/components/common/OrderHistoryItem.js +6 -3
  5. package/dist/cjs/anyspend/types/api.d.ts +176 -0
  6. package/dist/esm/anyspend/react/components/AnySpend.js +13 -14
  7. package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +14 -15
  8. package/dist/esm/anyspend/react/components/common/OrderHistory.js +2 -2
  9. package/dist/esm/anyspend/react/components/common/OrderHistoryItem.js +8 -5
  10. package/dist/esm/anyspend/types/api.d.ts +176 -0
  11. package/dist/styles/index.css +1 -1
  12. package/dist/types/anyspend/types/api.d.ts +176 -0
  13. package/package.json +2 -1
  14. package/src/anyspend/react/components/AnySpend.tsx +20 -18
  15. package/src/anyspend/react/components/AnyspendDepositHype.tsx +21 -20
  16. package/src/anyspend/react/components/common/OrderHistory.tsx +11 -11
  17. package/src/anyspend/react/components/common/OrderHistoryItem.tsx +104 -130
  18. package/src/anyspend/types/api.ts +176 -0
  19. package/dist/cjs/anyspend/react/components/common/ErrorSection.d.ts +0 -6
  20. package/dist/cjs/anyspend/react/components/common/ErrorSection.js +0 -12
  21. package/dist/esm/anyspend/react/components/common/ErrorSection.d.ts +0 -6
  22. package/dist/esm/anyspend/react/components/common/ErrorSection.js +0 -9
  23. package/dist/types/anyspend/react/components/common/ErrorSection.d.ts +0 -6
  24. package/src/anyspend/react/components/common/ErrorSection.tsx +0 -21
@@ -4,6 +4,12 @@
4
4
  */
5
5
  export interface paths {
6
6
  "/chains/{chainId}/tokens": {
7
+ parameters: {
8
+ query?: never;
9
+ header?: never;
10
+ path?: never;
11
+ cookie?: never;
12
+ };
7
13
  /**
8
14
  * Get tokens for a chain
9
15
  * @description Retrieves available tokens for a specific blockchain
@@ -19,6 +25,7 @@ export interface paths {
19
25
  /** @description Maximum number of tokens to return */
20
26
  limit?: number;
21
27
  };
28
+ header?: never;
22
29
  path: {
23
30
  /**
24
31
  * @description Blockchain chain ID
@@ -26,10 +33,15 @@ export interface paths {
26
33
  */
27
34
  chainId: number;
28
35
  };
36
+ cookie?: never;
29
37
  };
38
+ requestBody?: never;
30
39
  responses: {
31
40
  /** @description Tokens retrieved successfully */
32
41
  200: {
42
+ headers: {
43
+ [name: string]: unknown;
44
+ };
33
45
  content: {
34
46
  "application/json": {
35
47
  /** @example true */
@@ -60,6 +72,9 @@ export interface paths {
60
72
  };
61
73
  /** @description Bad request */
62
74
  400: {
75
+ headers: {
76
+ [name: string]: unknown;
77
+ };
63
78
  content: {
64
79
  "application/json": {
65
80
  /** @example false */
@@ -73,8 +88,21 @@ export interface paths {
73
88
  };
74
89
  };
75
90
  };
91
+ put?: never;
92
+ post?: never;
93
+ delete?: never;
94
+ options?: never;
95
+ head?: never;
96
+ patch?: never;
97
+ trace?: never;
76
98
  };
77
99
  "/onramp/coinbase/options": {
100
+ parameters: {
101
+ query?: never;
102
+ header?: never;
103
+ path?: never;
104
+ cookie?: never;
105
+ };
78
106
  /**
79
107
  * Get Coinbase onramp options
80
108
  * @description Retrieves available Coinbase onramp configuration options.
@@ -107,10 +135,17 @@ export interface paths {
107
135
  */
108
136
  chainIds?: string[];
109
137
  };
138
+ header?: never;
139
+ path?: never;
140
+ cookie?: never;
110
141
  };
142
+ requestBody?: never;
111
143
  responses: {
112
144
  /** @description Coinbase options retrieved successfully */
113
145
  200: {
146
+ headers: {
147
+ [name: string]: unknown;
148
+ };
114
149
  content: {
115
150
  "application/json": {
116
151
  /** @example true */
@@ -213,6 +248,9 @@ export interface paths {
213
248
  };
214
249
  /** @description Bad request */
215
250
  400: {
251
+ headers: {
252
+ [name: string]: unknown;
253
+ };
216
254
  content: {
217
255
  "application/json": {
218
256
  /** @example false */
@@ -226,8 +264,21 @@ export interface paths {
226
264
  };
227
265
  };
228
266
  };
267
+ put?: never;
268
+ post?: never;
269
+ delete?: never;
270
+ options?: never;
271
+ head?: never;
272
+ patch?: never;
273
+ trace?: never;
229
274
  };
230
275
  "/onramp/stripe/supported": {
276
+ parameters: {
277
+ query?: never;
278
+ header?: never;
279
+ path?: never;
280
+ cookie?: never;
281
+ };
231
282
  /**
232
283
  * Check Stripe support
233
284
  * @description Checks if Stripe onramp and Stripe Web2 are supported based on IP address location and optional transaction amount
@@ -241,10 +292,17 @@ export interface paths {
241
292
  */
242
293
  usdAmount?: string;
243
294
  };
295
+ header?: never;
296
+ path?: never;
297
+ cookie?: never;
244
298
  };
299
+ requestBody?: never;
245
300
  responses: {
246
301
  /** @description Stripe support status retrieved successfully */
247
302
  200: {
303
+ headers: {
304
+ [name: string]: unknown;
305
+ };
248
306
  content: {
249
307
  "application/json": {
250
308
  /** @example true */
@@ -267,6 +325,9 @@ export interface paths {
267
325
  };
268
326
  /** @description Bad request */
269
327
  400: {
328
+ headers: {
329
+ [name: string]: unknown;
330
+ };
270
331
  content: {
271
332
  "application/json": {
272
333
  /** @example false */
@@ -280,8 +341,21 @@ export interface paths {
280
341
  };
281
342
  };
282
343
  };
344
+ put?: never;
345
+ post?: never;
346
+ delete?: never;
347
+ options?: never;
348
+ head?: never;
349
+ patch?: never;
350
+ trace?: never;
283
351
  };
284
352
  "/orders": {
353
+ parameters: {
354
+ query?: never;
355
+ header?: never;
356
+ path?: never;
357
+ cookie?: never;
358
+ };
285
359
  /**
286
360
  * Get orders by creator
287
361
  * @description Retrieves all orders created by a specific address
@@ -305,10 +379,17 @@ export interface paths {
305
379
  */
306
380
  offset?: string;
307
381
  };
382
+ header?: never;
383
+ path?: never;
384
+ cookie?: never;
308
385
  };
386
+ requestBody?: never;
309
387
  responses: {
310
388
  /** @description Orders retrieved successfully */
311
389
  200: {
390
+ headers: {
391
+ [name: string]: unknown;
392
+ };
312
393
  content: {
313
394
  "application/json": {
314
395
  /** @example true */
@@ -324,6 +405,9 @@ export interface paths {
324
405
  };
325
406
  /** @description Bad request */
326
407
  400: {
408
+ headers: {
409
+ [name: string]: unknown;
410
+ };
327
411
  content: {
328
412
  "application/json": {
329
413
  /** @example false */
@@ -337,11 +421,18 @@ export interface paths {
337
421
  };
338
422
  };
339
423
  };
424
+ put?: never;
340
425
  /**
341
426
  * Create a new order
342
427
  * @description Creates a new order for token transactions across chains
343
428
  */
344
429
  post: {
430
+ parameters: {
431
+ query?: never;
432
+ header?: never;
433
+ path?: never;
434
+ cookie?: never;
435
+ };
345
436
  requestBody: {
346
437
  content: {
347
438
  "application/json": components["schemas"]["OrderRequest"];
@@ -350,6 +441,9 @@ export interface paths {
350
441
  responses: {
351
442
  /** @description Order created successfully */
352
443
  200: {
444
+ headers: {
445
+ [name: string]: unknown;
446
+ };
353
447
  content: {
354
448
  "application/json": {
355
449
  /** @example true */
@@ -364,6 +458,9 @@ export interface paths {
364
458
  };
365
459
  /** @description Bad request */
366
460
  400: {
461
+ headers: {
462
+ [name: string]: unknown;
463
+ };
367
464
  content: {
368
465
  "application/json": {
369
466
  /** @example false */
@@ -377,14 +474,27 @@ export interface paths {
377
474
  };
378
475
  };
379
476
  };
477
+ delete?: never;
478
+ options?: never;
479
+ head?: never;
480
+ patch?: never;
481
+ trace?: never;
380
482
  };
381
483
  "/orders/{orderId}": {
484
+ parameters: {
485
+ query?: never;
486
+ header?: never;
487
+ path?: never;
488
+ cookie?: never;
489
+ };
382
490
  /**
383
491
  * Get order and transactions
384
492
  * @description Retrieves order details along with associated transactions
385
493
  */
386
494
  get: {
387
495
  parameters: {
496
+ query?: never;
497
+ header?: never;
388
498
  path: {
389
499
  /**
390
500
  * @description Unique order identifier
@@ -392,10 +502,15 @@ export interface paths {
392
502
  */
393
503
  orderId: string;
394
504
  };
505
+ cookie?: never;
395
506
  };
507
+ requestBody?: never;
396
508
  responses: {
397
509
  /** @description Order and transactions retrieved successfully */
398
510
  200: {
511
+ headers: {
512
+ [name: string]: unknown;
513
+ };
399
514
  content: {
400
515
  "application/json": {
401
516
  /** @example true */
@@ -447,6 +562,9 @@ export interface paths {
447
562
  };
448
563
  /** @description Bad request */
449
564
  400: {
565
+ headers: {
566
+ [name: string]: unknown;
567
+ };
450
568
  content: {
451
569
  "application/json": {
452
570
  /** @example false */
@@ -460,6 +578,9 @@ export interface paths {
460
578
  };
461
579
  /** @description Order not found */
462
580
  404: {
581
+ headers: {
582
+ [name: string]: unknown;
583
+ };
463
584
  content: {
464
585
  "application/json": {
465
586
  /** @example false */
@@ -473,13 +594,34 @@ export interface paths {
473
594
  };
474
595
  };
475
596
  };
597
+ put?: never;
598
+ post?: never;
599
+ delete?: never;
600
+ options?: never;
601
+ head?: never;
602
+ patch?: never;
603
+ trace?: never;
476
604
  };
477
605
  "/orders/quote": {
606
+ parameters: {
607
+ query?: never;
608
+ header?: never;
609
+ path?: never;
610
+ cookie?: never;
611
+ };
612
+ get?: never;
613
+ put?: never;
478
614
  /**
479
615
  * Get anyspend quote
480
616
  * @description Retrieves a quote to swap, execute contract, or participate in HypeDuel
481
617
  */
482
618
  post: {
619
+ parameters: {
620
+ query?: never;
621
+ header?: never;
622
+ path?: never;
623
+ cookie?: never;
624
+ };
483
625
  requestBody: {
484
626
  content: {
485
627
  "application/json": {
@@ -673,6 +815,9 @@ export interface paths {
673
815
  responses: {
674
816
  /** @description Quote retrieved successfully */
675
817
  200: {
818
+ headers: {
819
+ [name: string]: unknown;
820
+ };
676
821
  content: {
677
822
  "application/json": {
678
823
  /** @example true */
@@ -851,6 +996,9 @@ export interface paths {
851
996
  };
852
997
  /** @description Bad request */
853
998
  400: {
999
+ headers: {
1000
+ [name: string]: unknown;
1001
+ };
854
1002
  content: {
855
1003
  "application/json": {
856
1004
  /** @example false */
@@ -864,8 +1012,19 @@ export interface paths {
864
1012
  };
865
1013
  };
866
1014
  };
1015
+ delete?: never;
1016
+ options?: never;
1017
+ head?: never;
1018
+ patch?: never;
1019
+ trace?: never;
867
1020
  };
868
1021
  "/stripe/clientSecret": {
1022
+ parameters: {
1023
+ query?: never;
1024
+ header?: never;
1025
+ path?: never;
1026
+ cookie?: never;
1027
+ };
869
1028
  /**
870
1029
  * Get Stripe client secret
871
1030
  * @description Retrieves a Stripe client secret for payment processing using a payment intent ID
@@ -879,10 +1038,17 @@ export interface paths {
879
1038
  */
880
1039
  paymentIntentId: string;
881
1040
  };
1041
+ header?: never;
1042
+ path?: never;
1043
+ cookie?: never;
882
1044
  };
1045
+ requestBody?: never;
883
1046
  responses: {
884
1047
  /** @description Client secret retrieved successfully */
885
1048
  200: {
1049
+ headers: {
1050
+ [name: string]: unknown;
1051
+ };
886
1052
  content: {
887
1053
  "application/json": {
888
1054
  /** @example true */
@@ -901,6 +1067,9 @@ export interface paths {
901
1067
  };
902
1068
  /** @description Bad request - PaymentIntentId is required or invalid */
903
1069
  400: {
1070
+ headers: {
1071
+ [name: string]: unknown;
1072
+ };
904
1073
  content: {
905
1074
  "application/json": {
906
1075
  /** @example false */
@@ -914,6 +1083,13 @@ export interface paths {
914
1083
  };
915
1084
  };
916
1085
  };
1086
+ put?: never;
1087
+ post?: never;
1088
+ delete?: never;
1089
+ options?: never;
1090
+ head?: never;
1091
+ patch?: never;
1092
+ trace?: never;
917
1093
  };
918
1094
  }
919
1095
  export type webhooks = Record<string, never>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@b3dotfun/sdk",
3
- "version": "0.0.44-alpha.1",
3
+ "version": "0.0.44-alpha.2",
4
4
  "source": "src/index.ts",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "react-native": "./dist/cjs/index.native.js",
@@ -390,6 +390,7 @@
390
390
  "release:alpha": "pnpm version prerelease --preid alpha && git push --follow-tags && pnpm publish --tag alpha --no-git-checks",
391
391
  "typecheck": "tsc --noEmit",
392
392
  "generate:thirdweb": "npx @hey-api/openapi-ts --file src/thirdweb/openapi-ts.config.ts --input src/thirdweb/insight-service.json",
393
+ "generate:anyspend": "npx openapi-typescript https://mainnet.anyspend.com/openapi.json -o src/anyspend/types/api.ts",
393
394
  "lint": "eslint 'src/**/*.{ts,tsx}'",
394
395
  "lint:fix": "eslint 'src/**/*.{ts,tsx}' --fix",
395
396
  "test": "vitest run",
@@ -23,7 +23,7 @@ import {
23
23
  import { cn } from "@b3dotfun/sdk/shared/utils/cn";
24
24
  import { formatTokenAmount } from "@b3dotfun/sdk/shared/utils/number";
25
25
  import invariant from "invariant";
26
- import { ArrowDown, HistoryIcon } from "lucide-react";
26
+ import { ArrowDown, HistoryIcon, Loader2 } from "lucide-react";
27
27
  import { motion } from "motion/react";
28
28
  import { useCallback, useEffect, useMemo, useRef, useState } from "react";
29
29
  import { toast } from "sonner";
@@ -34,7 +34,6 @@ import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFing
34
34
  import { CryptoPaymentMethod, CryptoPaymentMethodType } from "./common/CryptoPaymentMethod";
35
35
  import { CryptoPaySection } from "./common/CryptoPaySection";
36
36
  import { CryptoReceiveSection } from "./common/CryptoReceiveSection";
37
- import { ErrorSection } from "./common/ErrorSection";
38
37
  import { FiatPaymentMethod, FiatPaymentMethodComponent } from "./common/FiatPaymentMethod";
39
38
  import { OrderDetails, OrderDetailsLoadingView } from "./common/OrderDetails";
40
39
  import { OrderHistory } from "./common/OrderHistory";
@@ -609,40 +608,42 @@ function AnySpendInner({
609
608
  });
610
609
 
611
610
  // Determine button state and text
612
- const btnInfo: { text: string; disable: boolean; error: boolean } = useMemo(() => {
613
- if (activeInputAmountInWei === "0") return { text: "Enter an amount", disable: true, error: false };
614
- if (isLoadingAnyspendQuote) return { text: "Loading...", disable: true, error: false };
615
- if (!recipientAddress) return { text: "Select recipient", disable: false, error: false };
616
- if (isCreatingOrder || isCreatingOnrampOrder) return { text: "Creating order...", disable: true, error: false };
617
- if (!anyspendQuote || !anyspendQuote.success) return { text: "Get rate error", disable: true, error: true };
611
+ const btnInfo: { text: string; disable: boolean; error: boolean; loading: boolean } = useMemo(() => {
612
+ if (activeInputAmountInWei === "0") return { text: "Enter an amount", disable: true, error: false, loading: false };
613
+ if (isLoadingAnyspendQuote) return { text: "Loading quote...", disable: true, error: false, loading: true };
614
+ if (!recipientAddress) return { text: "Select recipient", disable: false, error: false, loading: false };
615
+ if (isCreatingOrder || isCreatingOnrampOrder)
616
+ return { text: "Creating order...", disable: true, error: false, loading: true };
617
+ if (!anyspendQuote || !anyspendQuote.success)
618
+ return { text: "No quote found", disable: true, error: false, loading: false };
618
619
 
619
620
  if (activeTab === "crypto") {
620
621
  // If no payment method selected, show "Choose payment method"
621
622
  if (selectedCryptoPaymentMethod === CryptoPaymentMethodType.NONE) {
622
- return { text: "Choose payment method", disable: false, error: false };
623
+ return { text: "Choose payment method", disable: false, error: false, loading: false };
623
624
  }
624
625
  // If payment method selected, show appropriate action
625
626
  if (
626
627
  selectedCryptoPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET ||
627
628
  selectedCryptoPaymentMethod === CryptoPaymentMethodType.GLOBAL_WALLET
628
629
  ) {
629
- return { text: "Swap", disable: false, error: false };
630
+ return { text: "Swap", disable: false, error: false, loading: false };
630
631
  }
631
632
  if (selectedCryptoPaymentMethod === CryptoPaymentMethodType.TRANSFER_CRYPTO) {
632
- return { text: "Continue to payment", disable: false, error: false };
633
+ return { text: "Continue to payment", disable: false, error: false, loading: false };
633
634
  }
634
635
  }
635
636
 
636
637
  if (activeTab === "fiat") {
637
638
  // If no fiat payment method selected, show "Select payment method"
638
639
  if (selectedFiatPaymentMethod === FiatPaymentMethod.NONE) {
639
- return { text: "Select payment method", disable: false, error: false };
640
+ return { text: "Select payment method", disable: false, error: false, loading: false };
640
641
  }
641
642
  // If payment method is selected, show "Buy"
642
- return { text: "Buy", disable: false, error: false };
643
+ return { text: "Buy", disable: false, error: false, loading: false };
643
644
  }
644
645
 
645
- return { text: "Buy", disable: false, error: false };
646
+ return { text: "Buy", disable: false, error: false, loading: false };
646
647
  }, [
647
648
  activeInputAmountInWei,
648
649
  isLoadingAnyspendQuote,
@@ -1052,15 +1053,13 @@ function AnySpendInner({
1052
1053
  />
1053
1054
  )}
1054
1055
  </div>
1055
- {/* Error message section */}
1056
- <ErrorSection error={getAnyspendQuoteError} />
1057
1056
 
1058
1057
  {/* Main button section */}
1059
1058
  <motion.div
1060
1059
  initial={{ opacity: 0, y: 20, filter: "blur(10px)" }}
1061
1060
  animate={{ opacity: 1, y: 0, filter: "blur(0px)" }}
1062
1061
  transition={{ duration: 0.3, delay: 0.2, ease: "easeInOut" }}
1063
- className={cn("mt-4 flex w-full max-w-[460px] flex-col gap-2", getAnyspendQuoteError && "mt-0")}
1062
+ className={cn("mt-4 flex w-full max-w-[460px] flex-col gap-2")}
1064
1063
  >
1065
1064
  <ShinyButton
1066
1065
  accentColor={"hsl(var(--as-brand))"}
@@ -1072,7 +1071,10 @@ function AnySpendInner({
1072
1071
  )}
1073
1072
  textClassName={cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white")}
1074
1073
  >
1075
- {btnInfo.text}
1074
+ <div className="flex items-center justify-center gap-2">
1075
+ {btnInfo.loading && <Loader2 className="h-4 w-4 animate-spin" />}
1076
+ {btnInfo.text}
1077
+ </div>
1076
1078
  </ShinyButton>
1077
1079
 
1078
1080
  {!hideTransactionHistoryButton && (globalAddress || recipientAddress) ? (
@@ -12,13 +12,12 @@ import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFing
12
12
  import { CryptoPaySection } from "./common/CryptoPaySection";
13
13
  import { CryptoPaymentMethod, CryptoPaymentMethodType } from "./common/CryptoPaymentMethod";
14
14
  import { CryptoReceiveSection } from "./common/CryptoReceiveSection";
15
- import { ErrorSection } from "./common/ErrorSection";
16
15
  import { FiatPaymentMethod, FiatPaymentMethodComponent } from "./common/FiatPaymentMethod";
17
16
  import { OrderDetails } from "./common/OrderDetails";
18
17
  import { PointsDetailPanel } from "./common/PointsDetailPanel";
19
18
  import { RecipientSelection } from "./common/RecipientSelection";
20
19
 
21
- import { ArrowDown } from "lucide-react";
20
+ import { ArrowDown, Loader2 } from "lucide-react";
22
21
  import { PanelOnramp } from "./common/PanelOnramp";
23
22
 
24
23
  const SLIPPAGE_PERCENT = 3;
@@ -114,13 +113,15 @@ function AnySpendDepositHypeInner({
114
113
  });
115
114
 
116
115
  // Button state logic
117
- const btnInfo: { text: string; disable: boolean; error: boolean } = useMemo(() => {
118
- if (activeInputAmountInWei === "0") return { text: "Enter an amount", disable: true, error: false };
119
- if (isLoadingAnyspendQuote) return { text: "Loading quote...", disable: true, error: false };
120
- if (isCreatingOrder || isCreatingOnrampOrder) return { text: "Creating order...", disable: true, error: false };
121
- if (!selectedRecipientAddress) return { text: "Select recipient", disable: false, error: false };
122
- if (!anyspendQuote || !anyspendQuote.success) return { text: "Get quote error", disable: true, error: true };
123
- if (!dstAmount) return { text: "No quote available", disable: true, error: true };
116
+ const btnInfo: { text: string; disable: boolean; error: boolean; loading: boolean } = useMemo(() => {
117
+ if (activeInputAmountInWei === "0") return { text: "Enter an amount", disable: true, error: false, loading: false };
118
+ if (isLoadingAnyspendQuote) return { text: "Loading quote...", disable: true, error: false, loading: true };
119
+ if (isCreatingOrder || isCreatingOnrampOrder)
120
+ return { text: "Creating order...", disable: true, error: false, loading: true };
121
+ if (!selectedRecipientAddress) return { text: "Select recipient", disable: false, error: false, loading: false };
122
+ if (!anyspendQuote || !anyspendQuote.success)
123
+ return { text: "Get quote error", disable: true, error: true, loading: false };
124
+ if (!dstAmount) return { text: "No quote available", disable: true, error: true, loading: false };
124
125
 
125
126
  // Check minimum deposit amount (10 HYPE)
126
127
  // Use the raw amount from the quote instead of the formatted display string
@@ -130,25 +131,25 @@ function AnySpendDepositHypeInner({
130
131
  const actualAmount = parseFloat(rawAmountInWei) / Math.pow(10, decimals);
131
132
 
132
133
  if (actualAmount < 10) {
133
- return { text: "Minimum 10 HYPE deposit", disable: true, error: true };
134
+ return { text: "Minimum 10 HYPE deposit", disable: true, error: true, loading: false };
134
135
  }
135
136
  }
136
137
 
137
138
  if (paymentType === "crypto") {
138
139
  if (selectedCryptoPaymentMethod === CryptoPaymentMethodType.NONE) {
139
- return { text: "Choose payment method", disable: false, error: false };
140
+ return { text: "Choose payment method", disable: false, error: false, loading: false };
140
141
  }
141
- return { text: "Continue to deposit", disable: false, error: false };
142
+ return { text: "Continue to deposit", disable: false, error: false, loading: false };
142
143
  }
143
144
 
144
145
  if (paymentType === "fiat") {
145
146
  if (selectedFiatPaymentMethod === FiatPaymentMethod.NONE) {
146
- return { text: "Select payment method", disable: false, error: false };
147
+ return { text: "Select payment method", disable: false, error: false, loading: false };
147
148
  }
148
- return { text: "Buy", disable: false, error: false };
149
+ return { text: "Buy", disable: false, error: false, loading: false };
149
150
  }
150
151
 
151
- return { text: "Continue to deposit", disable: false, error: false };
152
+ return { text: "Continue to deposit", disable: false, error: false, loading: false };
152
153
  }, [
153
154
  activeInputAmountInWei,
154
155
  isLoadingAnyspendQuote,
@@ -283,15 +284,12 @@ function AnySpendDepositHypeInner({
283
284
  </div>
284
285
  </div>
285
286
 
286
- {/* Error message section */}
287
- <ErrorSection error={getAnyspendQuoteError} />
288
-
289
287
  {/* Main button section */}
290
288
  <motion.div
291
289
  initial={{ opacity: 0, y: 20, filter: "blur(10px)" }}
292
290
  animate={{ opacity: 1, y: 0, filter: "blur(0px)" }}
293
291
  transition={{ duration: 0.3, delay: 0.2, ease: "easeInOut" }}
294
- className={cn("mt-4 flex w-full max-w-[460px] flex-col gap-2", getAnyspendQuoteError && "mt-0")}
292
+ className={cn("mt-4 flex w-full max-w-[460px] flex-col gap-2")}
295
293
  >
296
294
  <ShinyButton
297
295
  accentColor={"hsl(var(--as-brand))"}
@@ -303,7 +301,10 @@ function AnySpendDepositHypeInner({
303
301
  )}
304
302
  textClassName={cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white")}
305
303
  >
306
- {btnInfo.text}
304
+ <div className="flex items-center justify-center gap-2">
305
+ {btnInfo.loading && <Loader2 className="h-4 w-4 animate-spin" />}
306
+ {btnInfo.text}
307
+ </div>
307
308
  </ShinyButton>
308
309
  </motion.div>
309
310
 
@@ -17,37 +17,37 @@ export function OrderHistory({ mode, onBack, onSelectOrder }: OrderHistoryProps)
17
17
 
18
18
  return (
19
19
  <>
20
- <div className="mb-6 flex w-full items-center gap-4">
21
- <Button onClick={onBack} variant="ghost" size="icon">
22
- <ArrowLeft className="h-4 w-4" />
20
+ <div className="mb-8 flex w-full items-center gap-3">
21
+ <Button onClick={onBack} variant="ghost" size="icon" className="hover:bg-as-surface-secondary">
22
+ <ArrowLeft className="h-5 w-5" />
23
23
  </Button>
24
24
  <div className="flex-1">
25
- <h3 className="text-xl font-semibold">Order History</h3>
26
- <p className="text-as-primary/30 text-sm">View your past transactions</p>
25
+ <h3 className="text-as-primary text-2xl font-bold">Order History</h3>
27
26
  </div>
28
27
  <Button
29
28
  variant="ghost"
30
29
  size="icon"
30
+ className="hover:bg-as-surface-secondary"
31
31
  onClick={() => {
32
32
  refetchOrderHistory();
33
33
  }}
34
34
  >
35
- <RefreshCcw className="text-as-primary/30 hover:text-as-primary h-4 w-4 cursor-pointer transition-all hover:rotate-180" />
35
+ <RefreshCcw className="text-as-secondary hover:text-as-primary h-5 w-5 cursor-pointer transition-all hover:rotate-180" />
36
36
  </Button>
37
37
  </div>
38
38
 
39
39
  {isLoadingOrderHistory ? (
40
- <div className="w-full space-y-4">
40
+ <div className="w-full space-y-3">
41
41
  {[1, 2, 3].map(i => (
42
- <Skeleton key={i} className="h-[160px] w-full rounded-lg" />
42
+ <Skeleton key={i} className="h-[180px] w-full rounded-2xl" />
43
43
  ))}
44
44
  </div>
45
45
  ) : !orderHistory?.length ? (
46
- <div className="bg-as-light-brand w-full rounded-lg border p-8 text-center">
47
- <p className="text-b3-react-muted-foreground">No order history found</p>
46
+ <div className="bg-as-surface-secondary w-full rounded-2xl p-12 text-center">
47
+ <p className="text-as-secondary text-sm">No order history found</p>
48
48
  </div>
49
49
  ) : (
50
- <div className="mb-12 w-full space-y-4">
50
+ <div className="mb-12 w-full space-y-3">
51
51
  {[...orderHistory]
52
52
  .sort((a, b) => b.createdAt - a.createdAt)
53
53
  .map(order => (