@bze/bze-ui-kit 1.0.9 → 1.0.11
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 +73 -61
- package/dist/index.d.mts +18 -1
- package/dist/index.d.ts +18 -1
- package/dist/index.js +355 -319
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +62 -27
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -324,6 +324,7 @@ __export(index_exports, {
|
|
|
324
324
|
useSigningClient: () => useSigningClient,
|
|
325
325
|
useToast: () => useToast,
|
|
326
326
|
useValidatorLogos: () => useValidatorLogos,
|
|
327
|
+
useWalletHealthCheck: () => useWalletHealthCheck,
|
|
327
328
|
validateBZEBech32Address: () => validateBZEBech32Address,
|
|
328
329
|
validateBech32Address: () => validateBech32Address,
|
|
329
330
|
validateEndpoints: () => validateEndpoints,
|
|
@@ -3618,21 +3619,27 @@ var useSigningClient = ({ chainName }) => {
|
|
|
3618
3619
|
const { getSigningClient, signingClientError, wallet, chain } = (0, import_react4.useChain)(chainName != null ? chainName : getChainName());
|
|
3619
3620
|
const [signingClient, setSigningClient] = (0, import_react3.useState)(null);
|
|
3620
3621
|
const [isSigningClientReady, setIsSigningClientReady] = (0, import_react3.useState)(false);
|
|
3621
|
-
const
|
|
3622
|
+
const initializedForWallet = (0, import_react3.useRef)(null);
|
|
3622
3623
|
const createSigningClient = (0, import_react3.useCallback)(async () => {
|
|
3623
3624
|
return getSigningClient();
|
|
3624
3625
|
}, [getSigningClient]);
|
|
3625
3626
|
(0, import_react3.useEffect)(() => {
|
|
3626
|
-
if (!wallet || !chain
|
|
3627
|
+
if (!wallet || !chain) {
|
|
3628
|
+
if (initializedForWallet.current !== null) {
|
|
3629
|
+
setSigningClient(null);
|
|
3630
|
+
setIsSigningClientReady(false);
|
|
3631
|
+
initializedForWallet.current = null;
|
|
3632
|
+
}
|
|
3627
3633
|
return;
|
|
3628
3634
|
}
|
|
3635
|
+
if (initializedForWallet.current === wallet) return;
|
|
3629
3636
|
const load = async () => {
|
|
3630
3637
|
const client = await createSigningClient();
|
|
3631
3638
|
if (client) {
|
|
3632
3639
|
registerBzeEncoders(client);
|
|
3633
3640
|
setSigningClient(client);
|
|
3634
3641
|
setIsSigningClientReady(true);
|
|
3635
|
-
|
|
3642
|
+
initializedForWallet.current = wallet;
|
|
3636
3643
|
}
|
|
3637
3644
|
};
|
|
3638
3645
|
load();
|
|
@@ -3644,13 +3651,41 @@ var useSigningClient = ({ chainName }) => {
|
|
|
3644
3651
|
};
|
|
3645
3652
|
};
|
|
3646
3653
|
|
|
3647
|
-
// src/hooks/
|
|
3654
|
+
// src/hooks/useWalletHealthCheck.ts
|
|
3648
3655
|
var import_react5 = require("react");
|
|
3656
|
+
var import_react6 = require("@interchain-kit/react");
|
|
3657
|
+
var import_core = require("@interchain-kit/core");
|
|
3658
|
+
var SIGNING_CLIENT_TIMEOUT_MS = 5e3;
|
|
3659
|
+
var useWalletHealthCheck = (chainName) => {
|
|
3660
|
+
const { status, getSigningClient, disconnect } = (0, import_react6.useChain)(chainName != null ? chainName : getChainName());
|
|
3661
|
+
(0, import_react5.useEffect)(() => {
|
|
3662
|
+
if (status !== import_core.WalletState.Connected) return;
|
|
3663
|
+
const validate = async () => {
|
|
3664
|
+
try {
|
|
3665
|
+
const client = await Promise.race([
|
|
3666
|
+
getSigningClient(),
|
|
3667
|
+
new Promise(
|
|
3668
|
+
(resolve) => setTimeout(() => resolve(null), SIGNING_CLIENT_TIMEOUT_MS)
|
|
3669
|
+
)
|
|
3670
|
+
]);
|
|
3671
|
+
if (!client) {
|
|
3672
|
+
disconnect();
|
|
3673
|
+
}
|
|
3674
|
+
} catch (e) {
|
|
3675
|
+
disconnect();
|
|
3676
|
+
}
|
|
3677
|
+
};
|
|
3678
|
+
validate();
|
|
3679
|
+
}, []);
|
|
3680
|
+
};
|
|
3681
|
+
|
|
3682
|
+
// src/hooks/usePrices.ts
|
|
3683
|
+
var import_react7 = require("react");
|
|
3649
3684
|
function useAssetPrice(denom) {
|
|
3650
3685
|
const { usdPricesMap, marketsDataMap, isLoadingPrices } = useAssetsContext();
|
|
3651
|
-
const usdDenom = (0,
|
|
3652
|
-
const bzeDenom = (0,
|
|
3653
|
-
const change = (0,
|
|
3686
|
+
const usdDenom = (0, import_react7.useMemo)(() => getUSDCDenom(), []);
|
|
3687
|
+
const bzeDenom = (0, import_react7.useMemo)(() => getChainNativeAssetDenom(), []);
|
|
3688
|
+
const change = (0, import_react7.useMemo)(() => {
|
|
3654
3689
|
const marketData = marketsDataMap.get(createMarketId(denom, usdDenom));
|
|
3655
3690
|
if (marketData) {
|
|
3656
3691
|
return marketData.change;
|
|
@@ -3661,20 +3696,20 @@ function useAssetPrice(denom) {
|
|
|
3661
3696
|
}
|
|
3662
3697
|
return 0;
|
|
3663
3698
|
}, [marketsDataMap, denom, usdDenom, bzeDenom]);
|
|
3664
|
-
const price = (0,
|
|
3699
|
+
const price = (0, import_react7.useMemo)(() => {
|
|
3665
3700
|
const zeroBN = toBigNumber(0);
|
|
3666
3701
|
if (denom === "") return zeroBN;
|
|
3667
3702
|
if (denom === usdDenom) return toBigNumber(1);
|
|
3668
3703
|
return usdPricesMap.get(denom) || zeroBN;
|
|
3669
3704
|
}, [usdPricesMap, denom, usdDenom]);
|
|
3670
|
-
const totalUsdValue = (0,
|
|
3705
|
+
const totalUsdValue = (0, import_react7.useCallback)((amount) => {
|
|
3671
3706
|
return price.multipliedBy(amount);
|
|
3672
3707
|
}, [price]);
|
|
3673
|
-
const uAmountUsdValue = (0,
|
|
3708
|
+
const uAmountUsdValue = (0, import_react7.useCallback)((amount, decimals) => {
|
|
3674
3709
|
return totalUsdValue(uAmountToBigNumberAmount(amount, decimals));
|
|
3675
3710
|
}, [totalUsdValue]);
|
|
3676
|
-
const isUSDC = (0,
|
|
3677
|
-
const hasPrice = (0,
|
|
3711
|
+
const isUSDC = (0, import_react7.useMemo)(() => denom === usdDenom, [denom, usdDenom]);
|
|
3712
|
+
const hasPrice = (0, import_react7.useMemo)(() => price.gt(0), [price]);
|
|
3678
3713
|
return {
|
|
3679
3714
|
price,
|
|
3680
3715
|
change,
|
|
@@ -3687,36 +3722,36 @@ function useAssetPrice(denom) {
|
|
|
3687
3722
|
}
|
|
3688
3723
|
|
|
3689
3724
|
// src/hooks/useSettings.ts
|
|
3690
|
-
var
|
|
3725
|
+
var import_react8 = require("react");
|
|
3691
3726
|
function useSettings() {
|
|
3692
|
-
const [settings, setSettingsState] = (0,
|
|
3693
|
-
const [isLoaded, setIsLoaded] = (0,
|
|
3694
|
-
(0,
|
|
3727
|
+
const [settings, setSettingsState] = (0, import_react8.useState)(DEFAULT_SETTINGS);
|
|
3728
|
+
const [isLoaded, setIsLoaded] = (0, import_react8.useState)(false);
|
|
3729
|
+
(0, import_react8.useEffect)(() => {
|
|
3695
3730
|
setSettingsState(getSettings());
|
|
3696
3731
|
setIsLoaded(true);
|
|
3697
3732
|
}, []);
|
|
3698
|
-
const saveSettings = (0,
|
|
3733
|
+
const saveSettings = (0, import_react8.useCallback)((newSettings) => {
|
|
3699
3734
|
setSettings(newSettings);
|
|
3700
3735
|
setSettingsState(newSettings);
|
|
3701
3736
|
return true;
|
|
3702
3737
|
}, []);
|
|
3703
|
-
const updateEndpoints = (0,
|
|
3738
|
+
const updateEndpoints = (0, import_react8.useCallback)((endpoints) => {
|
|
3704
3739
|
const newSettings = __spreadProps(__spreadValues({}, settings), { endpoints });
|
|
3705
3740
|
return saveSettings(newSettings);
|
|
3706
3741
|
}, [settings, saveSettings]);
|
|
3707
|
-
const updatePreferredFeeDenom = (0,
|
|
3742
|
+
const updatePreferredFeeDenom = (0, import_react8.useCallback)((preferredFeeDenom) => {
|
|
3708
3743
|
const newSettings = __spreadProps(__spreadValues({}, settings), { preferredFeeDenom });
|
|
3709
3744
|
return saveSettings(newSettings);
|
|
3710
3745
|
}, [settings, saveSettings]);
|
|
3711
|
-
const resetToDefaults = (0,
|
|
3746
|
+
const resetToDefaults = (0, import_react8.useCallback)(() => {
|
|
3712
3747
|
saveSettings(DEFAULT_SETTINGS);
|
|
3713
3748
|
return true;
|
|
3714
3749
|
}, [saveSettings]);
|
|
3715
|
-
const getEndpoints = (0,
|
|
3750
|
+
const getEndpoints = (0, import_react8.useCallback)(() => {
|
|
3716
3751
|
return settings.endpoints;
|
|
3717
3752
|
}, [settings.endpoints]);
|
|
3718
|
-
const defaultSettings = (0,
|
|
3719
|
-
const feeDenom = (0,
|
|
3753
|
+
const defaultSettings = (0, import_react8.useMemo)(() => DEFAULT_SETTINGS, []);
|
|
3754
|
+
const feeDenom = (0, import_react8.useMemo)(() => settings.preferredFeeDenom || getChainNativeAssetDenom(), [settings.preferredFeeDenom]);
|
|
3720
3755
|
return {
|
|
3721
3756
|
settings,
|
|
3722
3757
|
isLoaded,
|
|
@@ -3732,14 +3767,14 @@ function useSettings() {
|
|
|
3732
3767
|
|
|
3733
3768
|
// src/hooks/useBalances.ts
|
|
3734
3769
|
var import_bignumber8 = __toESM(require("bignumber.js"));
|
|
3735
|
-
var
|
|
3770
|
+
var import_react9 = require("react");
|
|
3736
3771
|
function useBalances() {
|
|
3737
3772
|
const { balancesMap, isLoading, assetsMap, usdPricesMap } = useAssetsContext();
|
|
3738
|
-
const balances = (0,
|
|
3739
|
-
const getBalanceByDenom = (0,
|
|
3773
|
+
const balances = (0, import_react9.useMemo)(() => Array.from(balancesMap.values()), [balancesMap]);
|
|
3774
|
+
const getBalanceByDenom = (0, import_react9.useCallback)((denom) => {
|
|
3740
3775
|
return balancesMap.get(denom) || { denom, amount: (0, import_bignumber8.default)(0) };
|
|
3741
3776
|
}, [balancesMap]);
|
|
3742
|
-
const assetsBalances = (0,
|
|
3777
|
+
const assetsBalances = (0, import_react9.useMemo)(() => {
|
|
3743
3778
|
const result = [];
|
|
3744
3779
|
balances.map((bal) => {
|
|
3745
3780
|
const asset = assetsMap.get(bal.denom);
|
|
@@ -3769,14 +3804,14 @@ function useBalances() {
|
|
|
3769
3804
|
}
|
|
3770
3805
|
function useBalance(denom) {
|
|
3771
3806
|
const { balancesMap, isLoading } = useAssetsContext();
|
|
3772
|
-
const balance = (0,
|
|
3807
|
+
const balance = (0, import_react9.useMemo)(
|
|
3773
3808
|
() => balancesMap.get(denom) || {
|
|
3774
3809
|
denom,
|
|
3775
3810
|
amount: (0, import_bignumber8.default)(0)
|
|
3776
3811
|
},
|
|
3777
3812
|
[balancesMap, denom]
|
|
3778
3813
|
);
|
|
3779
|
-
const hasAmount = (0,
|
|
3814
|
+
const hasAmount = (0, import_react9.useCallback)((amount) => {
|
|
3780
3815
|
return balance.amount.gte(amount);
|
|
3781
3816
|
}, [balance]);
|
|
3782
3817
|
return {
|
|
@@ -3787,7 +3822,7 @@ function useBalance(denom) {
|
|
|
3787
3822
|
}
|
|
3788
3823
|
|
|
3789
3824
|
// src/hooks/useEpochs.ts
|
|
3790
|
-
var
|
|
3825
|
+
var import_react10 = require("react");
|
|
3791
3826
|
var import_bignumber9 = __toESM(require("bignumber.js"));
|
|
3792
3827
|
var EPOCH_HOUR2 = "hour";
|
|
3793
3828
|
var EPOCH_DAY2 = "day";
|
|
@@ -3807,28 +3842,28 @@ function getEpochDurationByIdentifier2(identifier) {
|
|
|
3807
3842
|
}
|
|
3808
3843
|
function useEpochs() {
|
|
3809
3844
|
const { epochs, isLoading, updateEpochs } = useAssetsContext();
|
|
3810
|
-
const getCurrentEpoch2 = (0,
|
|
3845
|
+
const getCurrentEpoch2 = (0, import_react10.useCallback)((identifier) => {
|
|
3811
3846
|
return epochs.get(identifier);
|
|
3812
3847
|
}, [epochs]);
|
|
3813
|
-
const hourEpochInfo = (0,
|
|
3848
|
+
const hourEpochInfo = (0, import_react10.useMemo)(() => {
|
|
3814
3849
|
return epochs.get(EPOCH_HOUR2);
|
|
3815
3850
|
}, [epochs]);
|
|
3816
|
-
const dayEpochInfo = (0,
|
|
3851
|
+
const dayEpochInfo = (0, import_react10.useMemo)(() => {
|
|
3817
3852
|
return epochs.get(EPOCH_DAY2);
|
|
3818
3853
|
}, [epochs]);
|
|
3819
|
-
const weekEpochInfo = (0,
|
|
3854
|
+
const weekEpochInfo = (0, import_react10.useMemo)(() => {
|
|
3820
3855
|
return epochs.get(EPOCH_WEEK2);
|
|
3821
3856
|
}, [epochs]);
|
|
3822
|
-
const getHourEpochInfo2 = (0,
|
|
3857
|
+
const getHourEpochInfo2 = (0, import_react10.useCallback)(() => {
|
|
3823
3858
|
return epochs.get(EPOCH_HOUR2);
|
|
3824
3859
|
}, [epochs]);
|
|
3825
|
-
const getDayEpochInfo = (0,
|
|
3860
|
+
const getDayEpochInfo = (0, import_react10.useCallback)(() => {
|
|
3826
3861
|
return epochs.get(EPOCH_DAY2);
|
|
3827
3862
|
}, [epochs]);
|
|
3828
|
-
const getWeekEpochInfo2 = (0,
|
|
3863
|
+
const getWeekEpochInfo2 = (0, import_react10.useCallback)(() => {
|
|
3829
3864
|
return epochs.get(EPOCH_WEEK2);
|
|
3830
3865
|
}, [epochs]);
|
|
3831
|
-
const getPeriodicEpochEndTime2 = (0,
|
|
3866
|
+
const getPeriodicEpochEndTime2 = (0, import_react10.useCallback)((identifier, modWeek = 1) => {
|
|
3832
3867
|
const epoch = epochs.get(identifier);
|
|
3833
3868
|
if (!epoch || !epoch.current_epoch_start_time) {
|
|
3834
3869
|
return void 0;
|
|
@@ -3843,13 +3878,13 @@ function useEpochs() {
|
|
|
3843
3878
|
startAt.setTime(startAt.getTime() + duration + duration * remainingEpochs);
|
|
3844
3879
|
return startAt;
|
|
3845
3880
|
}, [epochs]);
|
|
3846
|
-
const getCurrentWeekEpochEndTime2 = (0,
|
|
3881
|
+
const getCurrentWeekEpochEndTime2 = (0, import_react10.useCallback)(() => {
|
|
3847
3882
|
return getPeriodicEpochEndTime2(EPOCH_WEEK2);
|
|
3848
3883
|
}, [getPeriodicEpochEndTime2]);
|
|
3849
|
-
const getPeriodicWeekEpochEndTime2 = (0,
|
|
3884
|
+
const getPeriodicWeekEpochEndTime2 = (0, import_react10.useCallback)((modWeek = 1) => {
|
|
3850
3885
|
return getPeriodicEpochEndTime2(EPOCH_WEEK2, modWeek);
|
|
3851
3886
|
}, [getPeriodicEpochEndTime2]);
|
|
3852
|
-
const epochsList = (0,
|
|
3887
|
+
const epochsList = (0, import_react10.useMemo)(() => Array.from(epochs.values()), [epochs]);
|
|
3853
3888
|
return {
|
|
3854
3889
|
epochs: epochsList,
|
|
3855
3890
|
epochsMap: epochs,
|
|
@@ -3876,22 +3911,22 @@ function useEpochsManager() {
|
|
|
3876
3911
|
}
|
|
3877
3912
|
|
|
3878
3913
|
// src/hooks/useLiquidityPools.ts
|
|
3879
|
-
var
|
|
3914
|
+
var import_react11 = require("react");
|
|
3880
3915
|
var import_bignumber10 = __toESM(require("bignumber.js"));
|
|
3881
3916
|
function useLiquidityPools() {
|
|
3882
3917
|
const { poolsMap, poolsDataMap, updateLiquidityPools, isLoading, assetsMap } = useAssetsContext();
|
|
3883
|
-
const pools = (0,
|
|
3918
|
+
const pools = (0, import_react11.useMemo)(() => {
|
|
3884
3919
|
return Array.from(poolsMap.values());
|
|
3885
3920
|
}, [poolsMap]);
|
|
3886
3921
|
const getPoolByLpDenom = (lpDenom) => {
|
|
3887
3922
|
const poolId = poolIdFromPoolDenom(lpDenom);
|
|
3888
3923
|
return poolsMap.get(poolId);
|
|
3889
3924
|
};
|
|
3890
|
-
const getDenomsPool = (0,
|
|
3925
|
+
const getDenomsPool = (0, import_react11.useCallback)((denomA, denomB) => {
|
|
3891
3926
|
const poolId = createPoolId(denomA, denomB);
|
|
3892
3927
|
return poolsMap.get(poolId);
|
|
3893
3928
|
}, [poolsMap]);
|
|
3894
|
-
const liquidAssets = (0,
|
|
3929
|
+
const liquidAssets = (0, import_react11.useMemo)(() => {
|
|
3895
3930
|
if (!assetsMap || assetsMap.size === 0) return [];
|
|
3896
3931
|
const result = /* @__PURE__ */ new Map();
|
|
3897
3932
|
pools.forEach((pool) => {
|
|
@@ -3914,12 +3949,12 @@ function useLiquidityPools() {
|
|
|
3914
3949
|
}
|
|
3915
3950
|
function useAssetLiquidityPools(denom) {
|
|
3916
3951
|
const { poolsMap, poolsDataMap, isLoading } = useAssetsContext();
|
|
3917
|
-
const assetPools = (0,
|
|
3952
|
+
const assetPools = (0, import_react11.useMemo)(() => {
|
|
3918
3953
|
return Array.from(poolsMap.values()).filter(
|
|
3919
3954
|
(pool) => pool.base === denom || pool.quote === denom
|
|
3920
3955
|
);
|
|
3921
3956
|
}, [poolsMap, denom]);
|
|
3922
|
-
const assetPoolsData = (0,
|
|
3957
|
+
const assetPoolsData = (0, import_react11.useMemo)(() => {
|
|
3923
3958
|
const newMap = /* @__PURE__ */ new Map();
|
|
3924
3959
|
if (isLoading || denom === "") return newMap;
|
|
3925
3960
|
assetPools.forEach((pool) => {
|
|
@@ -3930,7 +3965,7 @@ function useAssetLiquidityPools(denom) {
|
|
|
3930
3965
|
});
|
|
3931
3966
|
return newMap;
|
|
3932
3967
|
}, [assetPools, poolsDataMap, isLoading, denom]);
|
|
3933
|
-
const asset24HoursVolume = (0,
|
|
3968
|
+
const asset24HoursVolume = (0, import_react11.useMemo)(() => {
|
|
3934
3969
|
let volume = (0, import_bignumber10.default)(0);
|
|
3935
3970
|
if (isLoading || denom === "") return volume;
|
|
3936
3971
|
assetPoolsData.forEach((poolData) => {
|
|
@@ -3952,47 +3987,47 @@ function useAssetLiquidityPools(denom) {
|
|
|
3952
3987
|
}
|
|
3953
3988
|
function useLiquidityPool(poolId) {
|
|
3954
3989
|
const { balancesMap, assetsMap, poolsMap, poolsDataMap, isLoading } = useAssetsContext();
|
|
3955
|
-
const pool = (0,
|
|
3956
|
-
const poolData = (0,
|
|
3957
|
-
const userShares = (0,
|
|
3990
|
+
const pool = (0, import_react11.useMemo)(() => poolsMap.get(poolId), [poolsMap, poolId]);
|
|
3991
|
+
const poolData = (0, import_react11.useMemo)(() => poolsDataMap.get(poolId), [poolsDataMap, poolId]);
|
|
3992
|
+
const userShares = (0, import_react11.useMemo)(() => {
|
|
3958
3993
|
if (!pool) return toBigNumber(0);
|
|
3959
3994
|
const balance = balancesMap.get(pool.lp_denom);
|
|
3960
3995
|
if (!balance) return toBigNumber(0);
|
|
3961
3996
|
return toBigNumber(balance.amount);
|
|
3962
3997
|
}, [balancesMap, pool]);
|
|
3963
|
-
const totalShares = (0,
|
|
3998
|
+
const totalShares = (0, import_react11.useMemo)(() => {
|
|
3964
3999
|
if (!assetsMap || !pool) return toBigNumber(0);
|
|
3965
4000
|
const sharesAsset = assetsMap.get(pool.lp_denom);
|
|
3966
4001
|
if (!sharesAsset) return toBigNumber(0);
|
|
3967
4002
|
return toBigNumber((sharesAsset == null ? void 0 : sharesAsset.supply) || 0);
|
|
3968
4003
|
}, [assetsMap, pool]);
|
|
3969
|
-
const userSharesPercentage = (0,
|
|
4004
|
+
const userSharesPercentage = (0, import_react11.useMemo)(() => {
|
|
3970
4005
|
if (!userShares || !totalShares || totalShares.isZero()) {
|
|
3971
4006
|
return toBigNumber(0);
|
|
3972
4007
|
}
|
|
3973
4008
|
return userShares.dividedBy(totalShares).multipliedBy(100).toFixed(2);
|
|
3974
4009
|
}, [userShares, totalShares]);
|
|
3975
|
-
const userReserveBase = (0,
|
|
4010
|
+
const userReserveBase = (0, import_react11.useMemo)(() => {
|
|
3976
4011
|
if (!pool || !userShares || !totalShares || totalShares.isZero()) {
|
|
3977
4012
|
return toBigNumber(0);
|
|
3978
4013
|
}
|
|
3979
4014
|
const reserveBase = toBigNumber(pool.reserve_base);
|
|
3980
4015
|
return userShares.dividedBy(totalShares).multipliedBy(reserveBase);
|
|
3981
4016
|
}, [pool, userShares, totalShares]);
|
|
3982
|
-
const userReserveQuote = (0,
|
|
4017
|
+
const userReserveQuote = (0, import_react11.useMemo)(() => {
|
|
3983
4018
|
if (!pool || !userShares || !totalShares || totalShares.isZero()) {
|
|
3984
4019
|
return toBigNumber(0);
|
|
3985
4020
|
}
|
|
3986
4021
|
const reserveQuote = toBigNumber(pool.reserve_quote);
|
|
3987
4022
|
return userShares.dividedBy(totalShares).multipliedBy(reserveQuote);
|
|
3988
4023
|
}, [pool, userShares, totalShares]);
|
|
3989
|
-
const calculateOppositeAmount = (0,
|
|
4024
|
+
const calculateOppositeAmount = (0, import_react11.useCallback)((amount, isBase) => {
|
|
3990
4025
|
if (!pool) {
|
|
3991
4026
|
return toBigNumber(0);
|
|
3992
4027
|
}
|
|
3993
4028
|
return calculatePoolOppositeAmount(pool, amount, isBase);
|
|
3994
4029
|
}, [pool]);
|
|
3995
|
-
const calculateSharesFromAmounts = (0,
|
|
4030
|
+
const calculateSharesFromAmounts = (0, import_react11.useCallback)((baseAmount, quoteAmount) => {
|
|
3996
4031
|
if (!pool || !totalShares) {
|
|
3997
4032
|
return toBigNumber(0);
|
|
3998
4033
|
}
|
|
@@ -4027,11 +4062,11 @@ function useLiquidityPool(poolId) {
|
|
|
4027
4062
|
}
|
|
4028
4063
|
|
|
4029
4064
|
// src/hooks/useAssetsValue.ts
|
|
4030
|
-
var
|
|
4065
|
+
var import_react12 = require("react");
|
|
4031
4066
|
var import_bignumber11 = __toESM(require("bignumber.js"));
|
|
4032
4067
|
function useAssetsValue() {
|
|
4033
4068
|
const { assetsMap, usdPricesMap, balancesMap, isLoading: isLoadingPrices } = useAssetsContext();
|
|
4034
|
-
const totalUsdValue = (0,
|
|
4069
|
+
const totalUsdValue = (0, import_react12.useCallback)((prettyBalances) => {
|
|
4035
4070
|
let usdValue = (0, import_bignumber11.default)(0);
|
|
4036
4071
|
prettyBalances.map((denomBalance) => {
|
|
4037
4072
|
const assetPrice = usdPricesMap.get(denomBalance.denom);
|
|
@@ -4041,7 +4076,7 @@ function useAssetsValue() {
|
|
|
4041
4076
|
});
|
|
4042
4077
|
return usdValue;
|
|
4043
4078
|
}, [usdPricesMap]);
|
|
4044
|
-
const walletTotalUsdValue = (0,
|
|
4079
|
+
const walletTotalUsdValue = (0, import_react12.useMemo)(() => {
|
|
4045
4080
|
let total = toBigNumber(0);
|
|
4046
4081
|
balancesMap.forEach((balance, denom) => {
|
|
4047
4082
|
const price = usdPricesMap.get(denom);
|
|
@@ -4052,14 +4087,14 @@ function useAssetsValue() {
|
|
|
4052
4087
|
});
|
|
4053
4088
|
return total;
|
|
4054
4089
|
}, [balancesMap, usdPricesMap, assetsMap]);
|
|
4055
|
-
const denomUsdValue = (0,
|
|
4090
|
+
const denomUsdValue = (0, import_react12.useCallback)((denom, uAmount) => {
|
|
4056
4091
|
const price = usdPricesMap.get(denom);
|
|
4057
4092
|
if (!price || !price.gt(0)) return toBigNumber(0);
|
|
4058
4093
|
const asset = assetsMap.get(denom);
|
|
4059
4094
|
if (!asset) return toBigNumber(0);
|
|
4060
4095
|
return price.multipliedBy(uAmountToBigNumberAmount(uAmount, asset.decimals));
|
|
4061
4096
|
}, [usdPricesMap, assetsMap]);
|
|
4062
|
-
const compareValues = (0,
|
|
4097
|
+
const compareValues = (0, import_react12.useCallback)((a, b) => {
|
|
4063
4098
|
var _a2;
|
|
4064
4099
|
let aValue = (0, import_bignumber11.default)(0);
|
|
4065
4100
|
const aPrice = usdPricesMap.get(a.denom);
|
|
@@ -4083,13 +4118,13 @@ function useAssetsValue() {
|
|
|
4083
4118
|
}
|
|
4084
4119
|
|
|
4085
4120
|
// src/hooks/useFeeTokens.ts
|
|
4086
|
-
var
|
|
4121
|
+
var import_react13 = require("react");
|
|
4087
4122
|
var MIN_LIQUIDITY_FOR_FEE_TOKEN = 5e10;
|
|
4088
4123
|
function useFeeTokens() {
|
|
4089
4124
|
const { pools, isLoading: poolsLoading } = useLiquidityPools();
|
|
4090
4125
|
const { assetsMap, isLoading: assetsLoading } = useAssetsContext();
|
|
4091
4126
|
const nativeDenom = getChainNativeAssetDenom();
|
|
4092
|
-
const feeTokens = (0,
|
|
4127
|
+
const feeTokens = (0, import_react13.useMemo)(() => {
|
|
4093
4128
|
if (poolsLoading || assetsLoading) {
|
|
4094
4129
|
return [];
|
|
4095
4130
|
}
|
|
@@ -4119,17 +4154,17 @@ function useFeeTokens() {
|
|
|
4119
4154
|
}
|
|
4120
4155
|
|
|
4121
4156
|
// src/hooks/useMarkets.ts
|
|
4122
|
-
var
|
|
4157
|
+
var import_react14 = require("react");
|
|
4123
4158
|
var import_bignumber12 = __toESM(require("bignumber.js"));
|
|
4124
4159
|
function useMarkets() {
|
|
4125
4160
|
const { marketsMap, marketsDataMap, updateMarkets, isLoading } = useAssetsContext();
|
|
4126
|
-
const markets = (0,
|
|
4161
|
+
const markets = (0, import_react14.useMemo)(() => {
|
|
4127
4162
|
return Array.from(marketsMap.values());
|
|
4128
4163
|
}, [marketsMap]);
|
|
4129
|
-
const marketsData = (0,
|
|
4130
|
-
const marketExists = (0,
|
|
4131
|
-
const getMarketData = (0,
|
|
4132
|
-
const getMarket = (0,
|
|
4164
|
+
const marketsData = (0, import_react14.useMemo)(() => Array.from(marketsDataMap.values()), [marketsDataMap]);
|
|
4165
|
+
const marketExists = (0, import_react14.useCallback)((marketId) => marketsMap.has(marketId), [marketsMap]);
|
|
4166
|
+
const getMarketData = (0, import_react14.useCallback)((marketId) => marketsDataMap.get(marketId), [marketsDataMap]);
|
|
4167
|
+
const getMarket = (0, import_react14.useCallback)((marketId) => marketsMap.get(marketId), [marketsMap]);
|
|
4133
4168
|
return {
|
|
4134
4169
|
markets,
|
|
4135
4170
|
marketsData,
|
|
@@ -4144,9 +4179,9 @@ function useMarkets() {
|
|
|
4144
4179
|
}
|
|
4145
4180
|
function useAssetMarkets(denom) {
|
|
4146
4181
|
const { isLoading, marketsMap, marketsDataMap } = useAssetsContext();
|
|
4147
|
-
const markets = (0,
|
|
4148
|
-
const marketsData = (0,
|
|
4149
|
-
const assetMarkets = (0,
|
|
4182
|
+
const markets = (0, import_react14.useMemo)(() => Array.from(marketsMap.values()), [marketsMap]);
|
|
4183
|
+
const marketsData = (0, import_react14.useMemo)(() => Array.from(marketsDataMap.values()), [marketsDataMap]);
|
|
4184
|
+
const assetMarkets = (0, import_react14.useMemo)(() => {
|
|
4150
4185
|
const baseMatches = [];
|
|
4151
4186
|
const quoteMatches = [];
|
|
4152
4187
|
for (const market of markets) {
|
|
@@ -4155,7 +4190,7 @@ function useAssetMarkets(denom) {
|
|
|
4155
4190
|
}
|
|
4156
4191
|
return [...baseMatches, ...quoteMatches];
|
|
4157
4192
|
}, [markets, denom]);
|
|
4158
|
-
const assetMarketsData = (0,
|
|
4193
|
+
const assetMarketsData = (0, import_react14.useMemo)(() => {
|
|
4159
4194
|
const baseMatches = [];
|
|
4160
4195
|
const quoteMatches = [];
|
|
4161
4196
|
for (const market of marketsData) {
|
|
@@ -4164,7 +4199,7 @@ function useAssetMarkets(denom) {
|
|
|
4164
4199
|
}
|
|
4165
4200
|
return [...baseMatches, ...quoteMatches];
|
|
4166
4201
|
}, [marketsData, denom]);
|
|
4167
|
-
const asset24hTradedVolume = (0,
|
|
4202
|
+
const asset24hTradedVolume = (0, import_react14.useMemo)(() => {
|
|
4168
4203
|
return assetMarketsData.reduce((acc, market) => {
|
|
4169
4204
|
if (denom === market.base) {
|
|
4170
4205
|
return acc.plus(market.base_volume || 0);
|
|
@@ -4183,8 +4218,8 @@ function useAssetMarkets(denom) {
|
|
|
4183
4218
|
}
|
|
4184
4219
|
function useMarket(marketId) {
|
|
4185
4220
|
const { marketsMap, marketsDataMap, isLoading, assetsMap } = useAssetsContext();
|
|
4186
|
-
const market = (0,
|
|
4187
|
-
const marketSymbol = (0,
|
|
4221
|
+
const market = (0, import_react14.useMemo)(() => marketsMap.get(marketId), [marketsMap, marketId]);
|
|
4222
|
+
const marketSymbol = (0, import_react14.useMemo)(() => {
|
|
4188
4223
|
var _a2, _b2;
|
|
4189
4224
|
if (isLoading) return "";
|
|
4190
4225
|
if (!market) return "";
|
|
@@ -4198,9 +4233,9 @@ function useMarket(marketId) {
|
|
|
4198
4233
|
}
|
|
4199
4234
|
return `${base}/${quote}`;
|
|
4200
4235
|
}, [market, isLoading, assetsMap]);
|
|
4201
|
-
const marketData = (0,
|
|
4202
|
-
const marketExists = (0,
|
|
4203
|
-
const volume24h = (0,
|
|
4236
|
+
const marketData = (0, import_react14.useMemo)(() => marketsDataMap.get(marketId), [marketsDataMap, marketId]);
|
|
4237
|
+
const marketExists = (0, import_react14.useMemo)(() => !!market, [market]);
|
|
4238
|
+
const volume24h = (0, import_react14.useMemo)(() => {
|
|
4204
4239
|
if (!marketData || !market) return toBigNumber(0);
|
|
4205
4240
|
const quoteAsset = assetsMap.get(market.quote);
|
|
4206
4241
|
if (!quoteAsset) return toBigNumber(0);
|
|
@@ -4225,30 +4260,30 @@ function useMarketsManager() {
|
|
|
4225
4260
|
}
|
|
4226
4261
|
|
|
4227
4262
|
// src/hooks/useToast.tsx
|
|
4228
|
-
var
|
|
4263
|
+
var import_react16 = require("react");
|
|
4229
4264
|
|
|
4230
4265
|
// src/components/toaster.tsx
|
|
4231
|
-
var
|
|
4266
|
+
var import_react15 = require("@chakra-ui/react");
|
|
4232
4267
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
4233
|
-
var toaster = (0,
|
|
4268
|
+
var toaster = (0, import_react15.createToaster)({
|
|
4234
4269
|
placement: "top-end",
|
|
4235
4270
|
pauseOnPageIdle: true
|
|
4236
4271
|
});
|
|
4237
4272
|
var Toaster = () => {
|
|
4238
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
4239
|
-
toast.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
4240
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
4241
|
-
toast.title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
4242
|
-
toast.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
4273
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Toaster, { toaster, insetInline: { mdDown: "4" }, children: (toast) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react15.Toast.Root, { width: { md: "sm" }, children: [
|
|
4274
|
+
toast.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Spinner, { size: "sm", color: "blue.solid" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Toast.Indicator, {}),
|
|
4275
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react15.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
|
|
4276
|
+
toast.title && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Toast.Title, { children: toast.title }),
|
|
4277
|
+
toast.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Toast.Description, { children: toast.description })
|
|
4243
4278
|
] }),
|
|
4244
|
-
toast.action && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
4245
|
-
toast.closable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
4279
|
+
toast.action && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Toast.ActionTrigger, { children: toast.action.label }),
|
|
4280
|
+
toast.closable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react15.Toast.CloseTrigger, {})
|
|
4246
4281
|
] }) }) });
|
|
4247
4282
|
};
|
|
4248
4283
|
|
|
4249
4284
|
// src/hooks/useToast.tsx
|
|
4250
4285
|
var useToast = () => {
|
|
4251
|
-
const clickableSuccess = (0,
|
|
4286
|
+
const clickableSuccess = (0, import_react16.useCallback)((title, actionFn, actionLabel, description, duration = 5e3) => {
|
|
4252
4287
|
toaster.create({
|
|
4253
4288
|
title,
|
|
4254
4289
|
description,
|
|
@@ -4261,7 +4296,7 @@ var useToast = () => {
|
|
|
4261
4296
|
}
|
|
4262
4297
|
});
|
|
4263
4298
|
}, []);
|
|
4264
|
-
const success = (0,
|
|
4299
|
+
const success = (0, import_react16.useCallback)((title, description, duration = 5e3) => {
|
|
4265
4300
|
toaster.create({
|
|
4266
4301
|
title,
|
|
4267
4302
|
description,
|
|
@@ -4270,7 +4305,7 @@ var useToast = () => {
|
|
|
4270
4305
|
closable: true
|
|
4271
4306
|
});
|
|
4272
4307
|
}, []);
|
|
4273
|
-
const error = (0,
|
|
4308
|
+
const error = (0, import_react16.useCallback)((title, description, duration = 8e3) => {
|
|
4274
4309
|
toaster.create({
|
|
4275
4310
|
title,
|
|
4276
4311
|
description,
|
|
@@ -4279,7 +4314,7 @@ var useToast = () => {
|
|
|
4279
4314
|
closable: true
|
|
4280
4315
|
});
|
|
4281
4316
|
}, []);
|
|
4282
|
-
const warning = (0,
|
|
4317
|
+
const warning = (0, import_react16.useCallback)((title, description, duration = 6e3) => {
|
|
4283
4318
|
toaster.create({
|
|
4284
4319
|
title,
|
|
4285
4320
|
description,
|
|
@@ -4288,7 +4323,7 @@ var useToast = () => {
|
|
|
4288
4323
|
closable: true
|
|
4289
4324
|
});
|
|
4290
4325
|
}, []);
|
|
4291
|
-
const info = (0,
|
|
4326
|
+
const info = (0, import_react16.useCallback)((title, description, duration = 5e3) => {
|
|
4292
4327
|
toaster.create({
|
|
4293
4328
|
title,
|
|
4294
4329
|
description,
|
|
@@ -4297,7 +4332,7 @@ var useToast = () => {
|
|
|
4297
4332
|
closable: true
|
|
4298
4333
|
});
|
|
4299
4334
|
}, []);
|
|
4300
|
-
const loading = (0,
|
|
4335
|
+
const loading = (0, import_react16.useCallback)((title, description) => {
|
|
4301
4336
|
return toaster.create({
|
|
4302
4337
|
title,
|
|
4303
4338
|
description,
|
|
@@ -4305,10 +4340,10 @@ var useToast = () => {
|
|
|
4305
4340
|
closable: false
|
|
4306
4341
|
});
|
|
4307
4342
|
}, []);
|
|
4308
|
-
const dismiss = (0,
|
|
4343
|
+
const dismiss = (0, import_react16.useCallback)((id) => {
|
|
4309
4344
|
toaster.dismiss(id);
|
|
4310
4345
|
}, []);
|
|
4311
|
-
const toast = (0,
|
|
4346
|
+
const toast = (0, import_react16.useMemo)(() => ({
|
|
4312
4347
|
clickableSuccess,
|
|
4313
4348
|
success,
|
|
4314
4349
|
error,
|
|
@@ -4322,9 +4357,9 @@ var useToast = () => {
|
|
|
4322
4357
|
|
|
4323
4358
|
// src/hooks/useTx.tsx
|
|
4324
4359
|
var import_tx13 = require("@bze/bzejs/cosmos/tx/v1beta1/tx");
|
|
4325
|
-
var
|
|
4360
|
+
var import_react17 = require("@interchain-kit/react");
|
|
4326
4361
|
var import_bignumber13 = __toESM(require("bignumber.js"));
|
|
4327
|
-
var
|
|
4362
|
+
var import_react18 = require("react");
|
|
4328
4363
|
var TxStatus = /* @__PURE__ */ ((TxStatus2) => {
|
|
4329
4364
|
TxStatus2["Failed"] = "Transaction Failed";
|
|
4330
4365
|
TxStatus2["Successful"] = "Transaction Successful";
|
|
@@ -4357,21 +4392,21 @@ var useIBCTx = (chainName) => {
|
|
|
4357
4392
|
};
|
|
4358
4393
|
};
|
|
4359
4394
|
var useTx = (chainName) => {
|
|
4360
|
-
const { address, disconnect } = (0,
|
|
4395
|
+
const { address, disconnect } = (0, import_react17.useChain)(chainName);
|
|
4361
4396
|
const { toast } = useToast();
|
|
4362
4397
|
const { signingClient, isSigningClientReady, signingClientError } = useSigningClient({ chainName });
|
|
4363
|
-
const [progressTrack, setProgressTrack] = (0,
|
|
4398
|
+
const [progressTrack, setProgressTrack] = (0, import_react18.useState)("");
|
|
4364
4399
|
const { getDenomsPool } = useLiquidityPools();
|
|
4365
4400
|
const { feeDenom } = useSettings();
|
|
4366
|
-
const defaultChainName = (0,
|
|
4367
|
-
const canUseClient = (0,
|
|
4401
|
+
const defaultChainName = (0, import_react18.useMemo)(() => getChainName(), []);
|
|
4402
|
+
const canUseClient = (0, import_react18.useCallback)(async () => {
|
|
4368
4403
|
if (!isSigningClientReady) {
|
|
4369
4404
|
console.error("waiting for signing client to be ready", signingClientError);
|
|
4370
4405
|
await sleep(1e3);
|
|
4371
4406
|
}
|
|
4372
4407
|
return isSigningClientReady;
|
|
4373
4408
|
}, [isSigningClientReady, signingClientError]);
|
|
4374
|
-
const simulateFee = (0,
|
|
4409
|
+
const simulateFee = (0, import_react18.useCallback)(async (messages, memo) => {
|
|
4375
4410
|
var _a2;
|
|
4376
4411
|
const gasPrice = 0.02;
|
|
4377
4412
|
const nativeDenom = getChainNativeAssetDenom();
|
|
@@ -4416,7 +4451,7 @@ var useTx = (chainName) => {
|
|
|
4416
4451
|
gas: gasAmount.multipliedBy(1.5).toFixed(0)
|
|
4417
4452
|
};
|
|
4418
4453
|
}, [signingClient, address, feeDenom, getDenomsPool]);
|
|
4419
|
-
const getFee = (0,
|
|
4454
|
+
const getFee = (0, import_react18.useCallback)(async (messages, options) => {
|
|
4420
4455
|
try {
|
|
4421
4456
|
if (options == null ? void 0 : options.fee) {
|
|
4422
4457
|
return options.fee;
|
|
@@ -4429,7 +4464,7 @@ var useTx = (chainName) => {
|
|
|
4429
4464
|
return defaultFee;
|
|
4430
4465
|
}
|
|
4431
4466
|
}, [simulateFee]);
|
|
4432
|
-
const tx = (0,
|
|
4467
|
+
const tx = (0, import_react18.useCallback)(async (msgs, options) => {
|
|
4433
4468
|
var _a2;
|
|
4434
4469
|
if (!address) {
|
|
4435
4470
|
toast.error("Transaction Failed" /* Failed */, "Please connect the wallet");
|
|
@@ -4488,16 +4523,16 @@ var useTx = (chainName) => {
|
|
|
4488
4523
|
};
|
|
4489
4524
|
|
|
4490
4525
|
// src/hooks/useValidatorLogos.ts
|
|
4491
|
-
var
|
|
4526
|
+
var import_react19 = require("react");
|
|
4492
4527
|
var KEYBASE_API_URL = "https://keybase.io/_/api/1.0/user/lookup.json";
|
|
4493
4528
|
var LOGOS_STORAGE_KEY = "validator_logos";
|
|
4494
4529
|
var LOGOS_TTL = 24 * 60 * 60 * 1e3;
|
|
4495
4530
|
var useValidatorLogos = (validators) => {
|
|
4496
|
-
const [logos, setLogos] = (0,
|
|
4497
|
-
const [isLoading, setIsLoading] = (0,
|
|
4498
|
-
const fetchedRef = (0,
|
|
4499
|
-
const validatorCountRef = (0,
|
|
4500
|
-
const fetchLogos = (0,
|
|
4531
|
+
const [logos, setLogos] = (0, import_react19.useState)({});
|
|
4532
|
+
const [isLoading, setIsLoading] = (0, import_react19.useState)(false);
|
|
4533
|
+
const fetchedRef = (0, import_react19.useRef)(false);
|
|
4534
|
+
const validatorCountRef = (0, import_react19.useRef)(0);
|
|
4535
|
+
const fetchLogos = (0, import_react19.useCallback)(async (identities) => {
|
|
4501
4536
|
if (identities.length === 0) return {};
|
|
4502
4537
|
let cached = null;
|
|
4503
4538
|
try {
|
|
@@ -4560,7 +4595,7 @@ var useValidatorLogos = (validators) => {
|
|
|
4560
4595
|
}
|
|
4561
4596
|
return result;
|
|
4562
4597
|
}, []);
|
|
4563
|
-
(0,
|
|
4598
|
+
(0, import_react19.useEffect)(() => {
|
|
4564
4599
|
if (!validators || validators.length === 0) return;
|
|
4565
4600
|
if (fetchedRef.current && validatorCountRef.current === validators.length) return;
|
|
4566
4601
|
const identities = validators.map((v) => {
|
|
@@ -4583,8 +4618,8 @@ var useValidatorLogos = (validators) => {
|
|
|
4583
4618
|
};
|
|
4584
4619
|
|
|
4585
4620
|
// src/components/highlight.tsx
|
|
4586
|
-
var
|
|
4587
|
-
var
|
|
4621
|
+
var import_react20 = require("@chakra-ui/react");
|
|
4622
|
+
var import_react21 = require("react");
|
|
4588
4623
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
4589
4624
|
var HighlightText = (_a2) => {
|
|
4590
4625
|
var _b2 = _a2, {
|
|
@@ -4600,14 +4635,14 @@ var HighlightText = (_a2) => {
|
|
|
4600
4635
|
"highlightIntensity",
|
|
4601
4636
|
"children"
|
|
4602
4637
|
]);
|
|
4603
|
-
const [isHighlighted, setIsHighlighted] = (0,
|
|
4604
|
-
const isMountedRef = (0,
|
|
4605
|
-
const timeoutRef = (0,
|
|
4638
|
+
const [isHighlighted, setIsHighlighted] = (0, import_react21.useState)(false);
|
|
4639
|
+
const isMountedRef = (0, import_react21.useRef)(false);
|
|
4640
|
+
const timeoutRef = (0, import_react21.useRef)(void 0);
|
|
4606
4641
|
const childrenString = String(children);
|
|
4607
|
-
const previousValueRef = (0,
|
|
4642
|
+
const previousValueRef = (0, import_react21.useRef)(childrenString);
|
|
4608
4643
|
const highlightOpacity = highlightIntensity === "subtle" ? "15" : "50";
|
|
4609
4644
|
const boxShadowStrength = highlightIntensity === "subtle" ? "10" : "25";
|
|
4610
|
-
(0,
|
|
4645
|
+
(0, import_react21.useEffect)(() => {
|
|
4611
4646
|
if (!isMountedRef.current) {
|
|
4612
4647
|
isMountedRef.current = true;
|
|
4613
4648
|
if (highlightOnMount) {
|
|
@@ -4636,7 +4671,7 @@ var HighlightText = (_a2) => {
|
|
|
4636
4671
|
};
|
|
4637
4672
|
}, [childrenString, duration, highlightOnMount]);
|
|
4638
4673
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
4639
|
-
|
|
4674
|
+
import_react20.Text,
|
|
4640
4675
|
__spreadProps(__spreadValues({}, textProps), {
|
|
4641
4676
|
transition: `all ${duration}ms ease-out`,
|
|
4642
4677
|
bg: isHighlighted ? `${highlightColor}/${highlightOpacity}` : "transparent",
|
|
@@ -4651,12 +4686,12 @@ var HighlightText = (_a2) => {
|
|
|
4651
4686
|
};
|
|
4652
4687
|
|
|
4653
4688
|
// src/components/sidebar/sidebar.tsx
|
|
4654
|
-
var
|
|
4689
|
+
var import_react22 = require("@chakra-ui/react");
|
|
4655
4690
|
var import_lu2 = require("react-icons/lu");
|
|
4656
|
-
var
|
|
4691
|
+
var import_react23 = require("react");
|
|
4657
4692
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
4658
4693
|
var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
4659
|
-
const [isOpen, setIsOpen] = (0,
|
|
4694
|
+
const [isOpen, setIsOpen] = (0, import_react23.useState)(false);
|
|
4660
4695
|
const handleTriggerClick = () => {
|
|
4661
4696
|
setIsOpen(true);
|
|
4662
4697
|
};
|
|
@@ -4665,7 +4700,7 @@ var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
|
4665
4700
|
};
|
|
4666
4701
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
|
|
4667
4702
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { onClick: handleTriggerClick, style: { cursor: "pointer" }, children: trigger }),
|
|
4668
|
-
isOpen && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
4703
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react22.Portal, { children: [
|
|
4669
4704
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
4670
4705
|
"div",
|
|
4671
4706
|
{
|
|
@@ -4733,13 +4768,13 @@ var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
|
4733
4768
|
}
|
|
4734
4769
|
),
|
|
4735
4770
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
4736
|
-
|
|
4771
|
+
import_react22.IconButton,
|
|
4737
4772
|
{
|
|
4738
4773
|
"aria-label": "Close sidebar",
|
|
4739
4774
|
variant: "ghost",
|
|
4740
4775
|
size: "sm",
|
|
4741
4776
|
onClick: handleClose,
|
|
4742
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
4777
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react22.Icon, { size: "md", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lu2.LuX, {}) })
|
|
4743
4778
|
}
|
|
4744
4779
|
)
|
|
4745
4780
|
]
|
|
@@ -4766,10 +4801,10 @@ var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
|
4766
4801
|
};
|
|
4767
4802
|
|
|
4768
4803
|
// src/components/sidebar/settings-sidebar.tsx
|
|
4769
|
-
var
|
|
4770
|
-
var
|
|
4804
|
+
var import_react24 = require("@chakra-ui/react");
|
|
4805
|
+
var import_react25 = require("@chakra-ui/react");
|
|
4771
4806
|
var import_next_themes = require("next-themes");
|
|
4772
|
-
var
|
|
4807
|
+
var import_react26 = require("react");
|
|
4773
4808
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
4774
4809
|
var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
4775
4810
|
const { setTheme, resolvedTheme } = (0, import_next_themes.useTheme)();
|
|
@@ -4777,19 +4812,19 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4777
4812
|
const { settings, isLoaded, updateEndpoints, updatePreferredFeeDenom, defaultSettings } = useSettings();
|
|
4778
4813
|
const { connectionType } = useConnectionType();
|
|
4779
4814
|
const { feeTokens, isLoading: feeTokensLoading } = useFeeTokens();
|
|
4780
|
-
const [restEndpoint, setRestEndpoint] = (0,
|
|
4781
|
-
const [rpcEndpoint, setRpcEndpoint] = (0,
|
|
4782
|
-
const [isValidating, setIsValidating] = (0,
|
|
4783
|
-
const [validationResults, setValidationResults] = (0,
|
|
4784
|
-
const [preferredFeeDenom, setPreferredFeeDenom] = (0,
|
|
4785
|
-
(0,
|
|
4815
|
+
const [restEndpoint, setRestEndpoint] = (0, import_react26.useState)("");
|
|
4816
|
+
const [rpcEndpoint, setRpcEndpoint] = (0, import_react26.useState)("");
|
|
4817
|
+
const [isValidating, setIsValidating] = (0, import_react26.useState)(false);
|
|
4818
|
+
const [validationResults, setValidationResults] = (0, import_react26.useState)({});
|
|
4819
|
+
const [preferredFeeDenom, setPreferredFeeDenom] = (0, import_react26.useState)(void 0);
|
|
4820
|
+
(0, import_react26.useEffect)(() => {
|
|
4786
4821
|
if (isLoaded) {
|
|
4787
4822
|
setRestEndpoint(settings.endpoints.restEndpoint);
|
|
4788
4823
|
setRpcEndpoint(settings.endpoints.rpcEndpoint);
|
|
4789
4824
|
setPreferredFeeDenom(settings.preferredFeeDenom || getChainNativeAssetDenom());
|
|
4790
4825
|
}
|
|
4791
4826
|
}, [isLoaded, settings]);
|
|
4792
|
-
const handleValidateEndpoints = (0,
|
|
4827
|
+
const handleValidateEndpoints = (0, import_react26.useCallback)(async (rest, rpc) => {
|
|
4793
4828
|
setIsValidating(true);
|
|
4794
4829
|
setValidationResults({});
|
|
4795
4830
|
try {
|
|
@@ -4809,7 +4844,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4809
4844
|
setTimeout(() => setValidationResults({}), 1e4);
|
|
4810
4845
|
}
|
|
4811
4846
|
}, []);
|
|
4812
|
-
const handleSaveSettings = (0,
|
|
4847
|
+
const handleSaveSettings = (0, import_react26.useCallback)(async (rest, rpc, feeDenom) => {
|
|
4813
4848
|
setValidationResults({});
|
|
4814
4849
|
const results = await validateEndpoints(rest, rpc);
|
|
4815
4850
|
if (!results.isValid) {
|
|
@@ -4829,13 +4864,13 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4829
4864
|
toast.success("Success!", "Settings have been saved.");
|
|
4830
4865
|
}
|
|
4831
4866
|
}, []);
|
|
4832
|
-
const handleResetToDefaults = (0,
|
|
4867
|
+
const handleResetToDefaults = (0, import_react26.useCallback)(() => {
|
|
4833
4868
|
setRestEndpoint(defaultSettings.endpoints.restEndpoint);
|
|
4834
4869
|
setRpcEndpoint(defaultSettings.endpoints.rpcEndpoint);
|
|
4835
4870
|
setPreferredFeeDenom(defaultSettings.preferredFeeDenom);
|
|
4836
4871
|
setValidationResults({});
|
|
4837
4872
|
}, []);
|
|
4838
|
-
const connectionStatusText = (0,
|
|
4873
|
+
const connectionStatusText = (0, import_react26.useMemo)(() => {
|
|
4839
4874
|
switch (connectionType) {
|
|
4840
4875
|
case CONNECTION_TYPE_NONE:
|
|
4841
4876
|
return "Failed";
|
|
@@ -4845,7 +4880,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4845
4880
|
return "Connected";
|
|
4846
4881
|
}
|
|
4847
4882
|
}, [connectionType]);
|
|
4848
|
-
const connectionStatusBadgeColor = (0,
|
|
4883
|
+
const connectionStatusBadgeColor = (0, import_react26.useMemo)(() => {
|
|
4849
4884
|
switch (connectionType) {
|
|
4850
4885
|
case CONNECTION_TYPE_NONE:
|
|
4851
4886
|
return "red";
|
|
@@ -4855,24 +4890,24 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4855
4890
|
return "green";
|
|
4856
4891
|
}
|
|
4857
4892
|
}, [connectionType]);
|
|
4858
|
-
const feeTokensCollection = (0,
|
|
4893
|
+
const feeTokensCollection = (0, import_react26.useMemo)(() => (0, import_react24.createListCollection)({
|
|
4859
4894
|
items: feeTokens.map((token) => ({
|
|
4860
4895
|
label: token.ticker || token.name,
|
|
4861
4896
|
value: token.denom,
|
|
4862
4897
|
name: token.ticker || token.name
|
|
4863
4898
|
}))
|
|
4864
4899
|
}), [feeTokens]);
|
|
4865
|
-
const handleFeeTokenChange = (0,
|
|
4900
|
+
const handleFeeTokenChange = (0, import_react26.useCallback)((denom) => {
|
|
4866
4901
|
setPreferredFeeDenom(denom || void 0);
|
|
4867
4902
|
}, []);
|
|
4868
4903
|
const hasUnsavedChanges = restEndpoint !== settings.endpoints.restEndpoint || rpcEndpoint !== settings.endpoints.rpcEndpoint || preferredFeeDenom !== settings.preferredFeeDenom;
|
|
4869
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4870
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4871
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4872
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4873
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4904
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.VStack, { gap: "6", align: "stretch", children: [
|
|
4905
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.Box, { children: [
|
|
4906
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Appearance" }),
|
|
4907
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.VStack, { gap: "3", align: "stretch", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.HStack, { justify: "space-between", children: [
|
|
4908
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", children: "Dark Mode" }),
|
|
4874
4909
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4875
|
-
|
|
4910
|
+
import_react24.Switch.Root,
|
|
4876
4911
|
{
|
|
4877
4912
|
checked: resolvedTheme === "dark",
|
|
4878
4913
|
onCheckedChange: (details) => {
|
|
@@ -4880,19 +4915,19 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4880
4915
|
setTheme(newTheme);
|
|
4881
4916
|
},
|
|
4882
4917
|
children: [
|
|
4883
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4884
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4918
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Switch.HiddenInput, {}),
|
|
4919
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Switch.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Switch.Thumb, {}) })
|
|
4885
4920
|
]
|
|
4886
4921
|
}
|
|
4887
4922
|
)
|
|
4888
4923
|
] }) })
|
|
4889
4924
|
] }),
|
|
4890
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4891
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4892
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4893
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4925
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Separator, {}),
|
|
4926
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.Box, { children: [
|
|
4927
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Fee Token Preference" }),
|
|
4928
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.VStack, { gap: "3", align: "stretch", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.Box, { children: [
|
|
4894
4929
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4895
|
-
|
|
4930
|
+
import_react25.Select.Root,
|
|
4896
4931
|
{
|
|
4897
4932
|
collection: feeTokensCollection,
|
|
4898
4933
|
size: "sm",
|
|
@@ -4900,35 +4935,35 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4900
4935
|
onValueChange: (details) => handleFeeTokenChange(details.value[0] || ""),
|
|
4901
4936
|
disabled: feeTokensLoading,
|
|
4902
4937
|
children: [
|
|
4903
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4904
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4905
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4906
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4907
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4938
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.Label, { children: "Preferred Fee Token" }),
|
|
4939
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.HiddenSelect, {}),
|
|
4940
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react25.Select.Control, { children: [
|
|
4941
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.ValueText, { placeholder: "Native Token (default)" }) }),
|
|
4942
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.IndicatorGroup, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.Indicator, {}) })
|
|
4908
4943
|
] }),
|
|
4909
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4910
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4911
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4944
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.Content, { children: feeTokensCollection.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react25.Select.Item, { item, children: [
|
|
4945
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { children: item.label }),
|
|
4946
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react25.Select.ItemIndicator, {})
|
|
4912
4947
|
] }, item.value)) }) }) })
|
|
4913
4948
|
]
|
|
4914
4949
|
}
|
|
4915
4950
|
),
|
|
4916
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4951
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "xs", color: "fg.muted", mt: "2", children: "Select your preferred token for paying transaction fees. Only tokens with liquidity pools paired with the native token are available." })
|
|
4917
4952
|
] }) })
|
|
4918
4953
|
] }),
|
|
4919
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4920
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4921
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4922
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4923
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4924
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4925
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4954
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Separator, {}),
|
|
4955
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.Box, { children: [
|
|
4956
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "BeeZee Endpoints" }),
|
|
4957
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.VStack, { gap: "4", align: "stretch", children: [
|
|
4958
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.HStack, { gap: "2", align: "center", justify: "space-between", children: [
|
|
4959
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", mb: "1", children: "Status: " }),
|
|
4960
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Badge, { colorPalette: connectionStatusBadgeColor, children: connectionStatusText })
|
|
4926
4961
|
] }) }),
|
|
4927
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4928
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4929
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4962
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.Box, { children: [
|
|
4963
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", mb: "1", children: "REST Endpoint" }),
|
|
4964
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "xs", color: "fg.muted", mb: "2", children: "Note: Endpoint must have CORS enabled to work in browser" }),
|
|
4930
4965
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4931
|
-
|
|
4966
|
+
import_react24.Input,
|
|
4932
4967
|
{
|
|
4933
4968
|
size: "sm",
|
|
4934
4969
|
placeholder: "https://rest.getbze.com",
|
|
@@ -4937,7 +4972,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4937
4972
|
}
|
|
4938
4973
|
),
|
|
4939
4974
|
validationResults.rest && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4940
|
-
|
|
4975
|
+
import_react24.Box,
|
|
4941
4976
|
{
|
|
4942
4977
|
mt: "2",
|
|
4943
4978
|
p: "3",
|
|
@@ -4947,15 +4982,15 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4947
4982
|
borderWidth: "1px",
|
|
4948
4983
|
borderColor: validationResults.rest.isValid ? "green.500/30" : "red.500/30",
|
|
4949
4984
|
borderRadius: "md",
|
|
4950
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4985
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", color: validationResults.rest.isValid ? "green.700" : "red.700", _dark: { color: validationResults.rest.isValid ? "green.300" : "red.300" }, children: validationResults.rest.error || "REST endpoint is valid" })
|
|
4951
4986
|
}
|
|
4952
4987
|
)
|
|
4953
4988
|
] }),
|
|
4954
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4955
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4956
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4989
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.Box, { children: [
|
|
4990
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", mb: "1", children: "RPC Endpoint" }),
|
|
4991
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "xs", color: "fg.muted", mb: "2", children: "Note: Must support WebSocket (WS/WSS) connections" }),
|
|
4957
4992
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4958
|
-
|
|
4993
|
+
import_react24.Input,
|
|
4959
4994
|
{
|
|
4960
4995
|
size: "sm",
|
|
4961
4996
|
placeholder: "wss://rpc.getbze.com",
|
|
@@ -4964,7 +4999,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4964
4999
|
}
|
|
4965
5000
|
),
|
|
4966
5001
|
validationResults.rpc && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4967
|
-
|
|
5002
|
+
import_react24.Box,
|
|
4968
5003
|
{
|
|
4969
5004
|
mt: "2",
|
|
4970
5005
|
p: "3",
|
|
@@ -4974,12 +5009,12 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4974
5009
|
borderWidth: "1px",
|
|
4975
5010
|
borderColor: validationResults.rpc.isValid ? "green.500/30" : "red.500/30",
|
|
4976
5011
|
borderRadius: "md",
|
|
4977
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
5012
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Text, { fontSize: "sm", color: validationResults.rpc.isValid ? "green.700" : "red.700", _dark: { color: validationResults.rpc.isValid ? "green.300" : "red.300" }, children: validationResults.rpc.error || "RPC endpoint is valid" })
|
|
4978
5013
|
}
|
|
4979
5014
|
)
|
|
4980
5015
|
] }),
|
|
4981
5016
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4982
|
-
|
|
5017
|
+
import_react24.Button,
|
|
4983
5018
|
{
|
|
4984
5019
|
size: "sm",
|
|
4985
5020
|
variant: "outline",
|
|
@@ -4991,9 +5026,9 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4991
5026
|
)
|
|
4992
5027
|
] })
|
|
4993
5028
|
] }),
|
|
4994
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
5029
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react24.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react24.VStack, { gap: "3", children: [
|
|
4995
5030
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4996
|
-
|
|
5031
|
+
import_react24.Button,
|
|
4997
5032
|
{
|
|
4998
5033
|
size: "sm",
|
|
4999
5034
|
width: "full",
|
|
@@ -5004,7 +5039,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5004
5039
|
}
|
|
5005
5040
|
),
|
|
5006
5041
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
5007
|
-
|
|
5042
|
+
import_react24.Button,
|
|
5008
5043
|
{
|
|
5009
5044
|
size: "sm",
|
|
5010
5045
|
width: "full",
|
|
@@ -5019,11 +5054,11 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5019
5054
|
|
|
5020
5055
|
// src/components/sidebar/wallet-sidebar.tsx
|
|
5021
5056
|
var import_styles = require("@interchain-kit/react/styles.css");
|
|
5022
|
-
var
|
|
5023
|
-
var
|
|
5057
|
+
var import_react27 = require("@interchain-kit/react");
|
|
5058
|
+
var import_react28 = require("@chakra-ui/react");
|
|
5024
5059
|
var import_lu3 = require("react-icons/lu");
|
|
5025
|
-
var
|
|
5026
|
-
var
|
|
5060
|
+
var import_react29 = require("react");
|
|
5061
|
+
var import_core2 = require("@interchain-kit/core");
|
|
5027
5062
|
var import_bignumber14 = __toESM(require("bignumber.js"));
|
|
5028
5063
|
var import_bzejs4 = require("@bze/bzejs");
|
|
5029
5064
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
@@ -5043,16 +5078,16 @@ var validateAmount = (amount, coin2, onError) => {
|
|
|
5043
5078
|
}
|
|
5044
5079
|
};
|
|
5045
5080
|
var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
5046
|
-
const [showSendButton, setShowSendButton] = (0,
|
|
5047
|
-
const formattedBalanceAmount = (0,
|
|
5081
|
+
const [showSendButton, setShowSendButton] = (0, import_react29.useState)(false);
|
|
5082
|
+
const formattedBalanceAmount = (0, import_react29.useMemo)(() => {
|
|
5048
5083
|
var _a2;
|
|
5049
5084
|
return prettyAmount(uAmountToBigNumberAmount(asset.amount, (_a2 = asset.decimals) != null ? _a2 : 0));
|
|
5050
5085
|
}, [asset.amount, asset.decimals]);
|
|
5051
|
-
const formattedBalanceUSDValue = (0,
|
|
5086
|
+
const formattedBalanceUSDValue = (0, import_react29.useMemo)(() => {
|
|
5052
5087
|
return shortNumberFormat(asset.USDValue);
|
|
5053
5088
|
}, [asset.USDValue]);
|
|
5054
5089
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5055
|
-
|
|
5090
|
+
import_react28.Box,
|
|
5056
5091
|
{
|
|
5057
5092
|
p: "3",
|
|
5058
5093
|
bgGradient: "to-br",
|
|
@@ -5070,10 +5105,10 @@ var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
|
5070
5105
|
onMouseLeave: () => setShowSendButton(false),
|
|
5071
5106
|
onMouseEnter: () => setShowSendButton(true),
|
|
5072
5107
|
children: [
|
|
5073
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5074
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5108
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { justify: "space-between", mb: "2", children: [
|
|
5109
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { children: [
|
|
5075
5110
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5076
|
-
|
|
5111
|
+
import_react28.Image,
|
|
5077
5112
|
{
|
|
5078
5113
|
src: asset.logo,
|
|
5079
5114
|
alt: asset.ticker,
|
|
@@ -5082,13 +5117,13 @@ var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
|
5082
5117
|
borderRadius: "full"
|
|
5083
5118
|
}
|
|
5084
5119
|
),
|
|
5085
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5086
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5087
|
-
isIbcDenom(asset.denom) && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5120
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "sm", fontWeight: "medium", children: asset.ticker }),
|
|
5121
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "xs", color: "fg.muted", children: asset.name }),
|
|
5122
|
+
isIbcDenom(asset.denom) && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Badge, { size: "xs", colorPalette: accentColor, children: "IBC" })
|
|
5088
5123
|
] }),
|
|
5089
|
-
showSendButton && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5124
|
+
showSendButton && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.HStack, { justify: "end", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Button, { size: "2xs", variant: "outline", onClick, children: "Send" }) })
|
|
5090
5125
|
] }),
|
|
5091
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5126
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { justify: "space-between", children: [
|
|
5092
5127
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(HighlightText, { fontSize: "sm", fontFamily: "mono", children: formattedBalanceAmount }),
|
|
5093
5128
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(HighlightText, { fontSize: "sm", color: "fg.muted", children: [
|
|
5094
5129
|
"$",
|
|
@@ -5100,18 +5135,18 @@ var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
|
5100
5135
|
);
|
|
5101
5136
|
};
|
|
5102
5137
|
var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
5103
|
-
const [isLoading, setIsLoading] = (0,
|
|
5104
|
-
const [selectedCoin, setSelectedCoin] = (0,
|
|
5105
|
-
const [sendAmount, setSendAmount] = (0,
|
|
5106
|
-
const [sendAmountError, setSendAmountError] = (0,
|
|
5107
|
-
const [recipient, setRecipient] = (0,
|
|
5108
|
-
const [recipientError, setRecipientError] = (0,
|
|
5109
|
-
const [memo, setMemo] = (0,
|
|
5110
|
-
const [memoError, setMemoError] = (0,
|
|
5138
|
+
const [isLoading, setIsLoading] = (0, import_react29.useState)(false);
|
|
5139
|
+
const [selectedCoin, setSelectedCoin] = (0, import_react29.useState)();
|
|
5140
|
+
const [sendAmount, setSendAmount] = (0, import_react29.useState)("");
|
|
5141
|
+
const [sendAmountError, setSendAmountError] = (0, import_react29.useState)("");
|
|
5142
|
+
const [recipient, setRecipient] = (0, import_react29.useState)("");
|
|
5143
|
+
const [recipientError, setRecipientError] = (0, import_react29.useState)("");
|
|
5144
|
+
const [memo, setMemo] = (0, import_react29.useState)("");
|
|
5145
|
+
const [memoError, setMemoError] = (0, import_react29.useState)("");
|
|
5111
5146
|
const { toast } = useToast();
|
|
5112
|
-
const { status, address } = (0,
|
|
5147
|
+
const { status, address } = (0, import_react27.useChain)(getChainName());
|
|
5113
5148
|
const { tx } = useSDKTx(getChainName());
|
|
5114
|
-
const coinsCollection = (0,
|
|
5149
|
+
const coinsCollection = (0, import_react28.createListCollection)({
|
|
5115
5150
|
items: balances.map((item) => {
|
|
5116
5151
|
var _a2;
|
|
5117
5152
|
return {
|
|
@@ -5121,22 +5156,22 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5121
5156
|
};
|
|
5122
5157
|
})
|
|
5123
5158
|
});
|
|
5124
|
-
const isValidForm = (0,
|
|
5159
|
+
const isValidForm = (0, import_react29.useMemo)(() => {
|
|
5125
5160
|
return selectedCoin && memoError === "" && recipientError === "" && sendAmountError === "" && sendAmount !== "" && recipient !== "";
|
|
5126
5161
|
}, [selectedCoin, memoError, recipientError, sendAmountError, sendAmount, recipient]);
|
|
5127
|
-
const resetSendForm = (0,
|
|
5162
|
+
const resetSendForm = (0, import_react29.useCallback)(() => {
|
|
5128
5163
|
setSelectedCoin(void 0);
|
|
5129
5164
|
setSendAmount("");
|
|
5130
5165
|
setRecipient("");
|
|
5131
5166
|
setMemo("");
|
|
5132
5167
|
}, []);
|
|
5133
|
-
const handleSend = (0,
|
|
5168
|
+
const handleSend = (0, import_react29.useCallback)(async () => {
|
|
5134
5169
|
var _a2, _b2;
|
|
5135
5170
|
if (!isValidForm) {
|
|
5136
5171
|
toast.error("Can not send coins!", "Please check the input data.");
|
|
5137
5172
|
return;
|
|
5138
5173
|
}
|
|
5139
|
-
if (status !==
|
|
5174
|
+
if (status !== import_core2.WalletState.Connected) {
|
|
5140
5175
|
toast.error("Wallet not connected!", "Please connect your wallet first.");
|
|
5141
5176
|
return;
|
|
5142
5177
|
}
|
|
@@ -5155,11 +5190,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5155
5190
|
setIsLoading(false);
|
|
5156
5191
|
onClose();
|
|
5157
5192
|
}, [address, memo, onClose, recipient, selectedCoin, sendAmount, status]);
|
|
5158
|
-
const handleCancel = (0,
|
|
5193
|
+
const handleCancel = (0, import_react29.useCallback)(() => {
|
|
5159
5194
|
resetSendForm();
|
|
5160
5195
|
onClose();
|
|
5161
5196
|
}, [onClose, resetSendForm]);
|
|
5162
|
-
const onRecipientChange = (0,
|
|
5197
|
+
const onRecipientChange = (0, import_react29.useCallback)((recipient2) => {
|
|
5163
5198
|
setRecipient(recipient2);
|
|
5164
5199
|
if (recipient2.length === 0) {
|
|
5165
5200
|
setRecipientError("");
|
|
@@ -5172,11 +5207,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5172
5207
|
setRecipientError(validate.message);
|
|
5173
5208
|
}
|
|
5174
5209
|
}, []);
|
|
5175
|
-
const onAmountChange = (0,
|
|
5210
|
+
const onAmountChange = (0, import_react29.useCallback)((amount) => {
|
|
5176
5211
|
setSendAmount(sanitizeNumberInput(amount));
|
|
5177
5212
|
setSendAmountError("");
|
|
5178
5213
|
}, []);
|
|
5179
|
-
const onCoinSelectChange = (0,
|
|
5214
|
+
const onCoinSelectChange = (0, import_react29.useCallback)((ticker) => {
|
|
5180
5215
|
if (ticker === "") return;
|
|
5181
5216
|
const selectedCoin2 = balances.find((item) => item.ticker === ticker);
|
|
5182
5217
|
if (selectedCoin2) {
|
|
@@ -5184,13 +5219,13 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5184
5219
|
validateAmount(sendAmount, selectedCoin2, setSendAmountError);
|
|
5185
5220
|
}
|
|
5186
5221
|
}, [sendAmount, balances]);
|
|
5187
|
-
const setMaxAmount = (0,
|
|
5222
|
+
const setMaxAmount = (0, import_react29.useCallback)(() => {
|
|
5188
5223
|
if (!selectedCoin) return;
|
|
5189
5224
|
const maxAmount = uAmountToBigNumberAmount(selectedCoin.amount, selectedCoin.decimals);
|
|
5190
5225
|
onAmountChange(maxAmount.toString());
|
|
5191
5226
|
validateAmount(maxAmount.toString(), selectedCoin, setSendAmountError);
|
|
5192
5227
|
}, [selectedCoin, onAmountChange]);
|
|
5193
|
-
const onMemoChange = (0,
|
|
5228
|
+
const onMemoChange = (0, import_react29.useCallback)((memo2) => {
|
|
5194
5229
|
setMemo(memo2);
|
|
5195
5230
|
if (memo2.length > 256) {
|
|
5196
5231
|
setMemoError("Memo must be less than or equal to 256 characters");
|
|
@@ -5198,16 +5233,16 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5198
5233
|
setMemoError("");
|
|
5199
5234
|
}
|
|
5200
5235
|
}, []);
|
|
5201
|
-
(0,
|
|
5236
|
+
(0, import_react29.useEffect)(() => {
|
|
5202
5237
|
if (selectedTicker !== "") {
|
|
5203
5238
|
onCoinSelectChange(selectedTicker);
|
|
5204
5239
|
}
|
|
5205
5240
|
}, [onCoinSelectChange, selectedTicker]);
|
|
5206
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5207
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5208
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5241
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.VStack, { gap: "4", align: "stretch", children: [
|
|
5242
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { justify: "space-between", align: "center", children: [
|
|
5243
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "sm", fontWeight: "medium", children: "Send Coins" }),
|
|
5209
5244
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5210
|
-
|
|
5245
|
+
import_react28.Button,
|
|
5211
5246
|
{
|
|
5212
5247
|
size: "xs",
|
|
5213
5248
|
variant: "ghost",
|
|
@@ -5217,25 +5252,25 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5217
5252
|
}
|
|
5218
5253
|
)
|
|
5219
5254
|
] }),
|
|
5220
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5255
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Box, { children: [
|
|
5221
5256
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5222
|
-
|
|
5257
|
+
import_react28.Select.Root,
|
|
5223
5258
|
{
|
|
5224
5259
|
collection: coinsCollection,
|
|
5225
5260
|
size: "sm",
|
|
5226
5261
|
value: (selectedCoin == null ? void 0 : selectedCoin.ticker) ? [selectedCoin.ticker] : [],
|
|
5227
5262
|
onValueChange: (details) => onCoinSelectChange(details.value[0] || ""),
|
|
5228
5263
|
children: [
|
|
5229
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5230
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5231
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5232
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5233
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5264
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.Label, { children: "Coin" }),
|
|
5265
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.HiddenSelect, {}),
|
|
5266
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Select.Control, { children: [
|
|
5267
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.ValueText, { placeholder: "Select coin" }) }),
|
|
5268
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.IndicatorGroup, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.Indicator, {}) })
|
|
5234
5269
|
] }),
|
|
5235
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5236
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5270
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.Content, { children: coinsCollection.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Select.Item, { item, children: [
|
|
5271
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { gap: "2", children: [
|
|
5237
5272
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5238
|
-
|
|
5273
|
+
import_react28.Image,
|
|
5239
5274
|
{
|
|
5240
5275
|
src: item.logo,
|
|
5241
5276
|
alt: item.value,
|
|
@@ -5244,15 +5279,15 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5244
5279
|
borderRadius: "full"
|
|
5245
5280
|
}
|
|
5246
5281
|
),
|
|
5247
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5282
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { children: item.label })
|
|
5248
5283
|
] }),
|
|
5249
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5284
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Select.ItemIndicator, {})
|
|
5250
5285
|
] }, item.value)) }) }) })
|
|
5251
5286
|
]
|
|
5252
5287
|
}
|
|
5253
5288
|
),
|
|
5254
5289
|
selectedCoin && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5255
|
-
|
|
5290
|
+
import_react28.Box,
|
|
5256
5291
|
{
|
|
5257
5292
|
mt: "2",
|
|
5258
5293
|
p: "3",
|
|
@@ -5262,15 +5297,15 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5262
5297
|
borderRadius: "md",
|
|
5263
5298
|
borderWidth: "1px",
|
|
5264
5299
|
borderColor: `${accentColor}.500/30`,
|
|
5265
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5266
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5267
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5268
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5300
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { justify: "space-between", children: [
|
|
5301
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "xs", color: "fg.muted", children: "Available:" }),
|
|
5302
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.VStack, { gap: "0", align: "end", children: [
|
|
5303
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Text, { fontSize: "sm", fontWeight: "medium", children: [
|
|
5269
5304
|
uAmountToAmount(selectedCoin.amount, selectedCoin.decimals),
|
|
5270
5305
|
" ",
|
|
5271
5306
|
selectedCoin.ticker
|
|
5272
5307
|
] }),
|
|
5273
|
-
selectedCoin.USDValue.gt(0) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5308
|
+
selectedCoin.USDValue.gt(0) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Text, { fontSize: "xs", color: "fg.muted", children: [
|
|
5274
5309
|
"\u2248 $",
|
|
5275
5310
|
shortNumberFormat(selectedCoin.USDValue)
|
|
5276
5311
|
] })
|
|
@@ -5279,11 +5314,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5279
5314
|
}
|
|
5280
5315
|
)
|
|
5281
5316
|
] }),
|
|
5282
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5283
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5284
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5317
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Field.Root, { invalid: sendAmountError !== "", children: [
|
|
5318
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Field.Label, { children: "Amount" }),
|
|
5319
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Group, { attached: true, w: "full", maxW: "sm", children: [
|
|
5285
5320
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5286
|
-
|
|
5321
|
+
import_react28.Input,
|
|
5287
5322
|
{
|
|
5288
5323
|
size: "sm",
|
|
5289
5324
|
placeholder: "Amount to send",
|
|
@@ -5292,14 +5327,14 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5292
5327
|
onBlur: () => validateAmount(sendAmount, selectedCoin, setSendAmountError)
|
|
5293
5328
|
}
|
|
5294
5329
|
),
|
|
5295
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5330
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Button, { variant: "outline", size: "sm", onClick: setMaxAmount, disabled: isLoading, children: "Max" })
|
|
5296
5331
|
] }),
|
|
5297
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5332
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Field.ErrorText, { children: sendAmountError })
|
|
5298
5333
|
] }) }),
|
|
5299
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5300
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5334
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Field.Root, { invalid: recipientError !== "", children: [
|
|
5335
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Field.Label, { children: "Recipient Address" }),
|
|
5301
5336
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5302
|
-
|
|
5337
|
+
import_react28.Input,
|
|
5303
5338
|
{
|
|
5304
5339
|
size: "sm",
|
|
5305
5340
|
placeholder: "bze...2a1b",
|
|
@@ -5307,20 +5342,20 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5307
5342
|
onChange: (e) => onRecipientChange(e.target.value)
|
|
5308
5343
|
}
|
|
5309
5344
|
),
|
|
5310
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5345
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Field.ErrorText, { children: recipientError })
|
|
5311
5346
|
] }) }),
|
|
5312
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5313
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5347
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Field.Root, { invalid: memoError !== "", children: [
|
|
5348
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Field.Label, { children: [
|
|
5314
5349
|
"Memo",
|
|
5315
5350
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5316
|
-
|
|
5351
|
+
import_react28.Field.RequiredIndicator,
|
|
5317
5352
|
{
|
|
5318
|
-
fallback: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5353
|
+
fallback: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Badge, { size: "xs", variant: "surface", children: "Optional" })
|
|
5319
5354
|
}
|
|
5320
5355
|
)
|
|
5321
5356
|
] }),
|
|
5322
5357
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5323
|
-
|
|
5358
|
+
import_react28.Textarea,
|
|
5324
5359
|
{
|
|
5325
5360
|
size: "sm",
|
|
5326
5361
|
placeholder: "Transaction memo",
|
|
@@ -5330,11 +5365,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5330
5365
|
resize: "none"
|
|
5331
5366
|
}
|
|
5332
5367
|
),
|
|
5333
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5368
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Field.ErrorText, { children: memoError })
|
|
5334
5369
|
] }) }),
|
|
5335
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5370
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { gap: "2", children: [
|
|
5336
5371
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5337
|
-
|
|
5372
|
+
import_react28.Button,
|
|
5338
5373
|
{
|
|
5339
5374
|
size: "sm",
|
|
5340
5375
|
flex: "1",
|
|
@@ -5347,7 +5382,7 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5347
5382
|
}
|
|
5348
5383
|
),
|
|
5349
5384
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5350
|
-
|
|
5385
|
+
import_react28.Button,
|
|
5351
5386
|
{
|
|
5352
5387
|
size: "sm",
|
|
5353
5388
|
flex: "1",
|
|
@@ -5361,25 +5396,25 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
5361
5396
|
] });
|
|
5362
5397
|
};
|
|
5363
5398
|
var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
5364
|
-
const [viewState, setViewState] = (0,
|
|
5365
|
-
const [isDisconnecting, setIsDisconnecting] = (0,
|
|
5366
|
-
const [showCopiedTooltip, setShowCopiedTooltip] = (0,
|
|
5367
|
-
const [clickedBalance, setClickedBalance] = (0,
|
|
5368
|
-
const copyButtonRef = (0,
|
|
5399
|
+
const [viewState, setViewState] = (0, import_react29.useState)("balances");
|
|
5400
|
+
const [isDisconnecting, setIsDisconnecting] = (0, import_react29.useState)(false);
|
|
5401
|
+
const [showCopiedTooltip, setShowCopiedTooltip] = (0, import_react29.useState)(false);
|
|
5402
|
+
const [clickedBalance, setClickedBalance] = (0, import_react29.useState)("");
|
|
5403
|
+
const copyButtonRef = (0, import_react29.useRef)(null);
|
|
5369
5404
|
const {
|
|
5370
5405
|
status,
|
|
5371
5406
|
username,
|
|
5372
5407
|
address,
|
|
5373
5408
|
disconnect,
|
|
5374
5409
|
connect
|
|
5375
|
-
} = (0,
|
|
5410
|
+
} = (0, import_react27.useChain)(getChainName());
|
|
5376
5411
|
const { assetsBalances, isLoading: assetsLoading } = useBalances();
|
|
5377
|
-
const balancesWithoutLps = (0,
|
|
5412
|
+
const balancesWithoutLps = (0, import_react29.useMemo)(() => {
|
|
5378
5413
|
if (assetsLoading) return [];
|
|
5379
5414
|
return assetsBalances.filter((asset) => !isLpDenom(asset.denom));
|
|
5380
5415
|
}, [assetsLoading, assetsBalances]);
|
|
5381
5416
|
const nativeDenom = getChainNativeAssetDenom();
|
|
5382
|
-
const sortedBalances = (0,
|
|
5417
|
+
const sortedBalances = (0, import_react29.useMemo)(() => {
|
|
5383
5418
|
return balancesWithoutLps.sort((a, b) => {
|
|
5384
5419
|
if (a.denom === nativeDenom) return -1;
|
|
5385
5420
|
if (b.denom === nativeDenom) return 1;
|
|
@@ -5395,21 +5430,21 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5395
5430
|
return 0;
|
|
5396
5431
|
});
|
|
5397
5432
|
}, [balancesWithoutLps]);
|
|
5398
|
-
const walletAddress = (0,
|
|
5433
|
+
const walletAddress = (0, import_react29.useMemo)(() => stringTruncateFromCenter(address != null ? address : "", 16), [address]);
|
|
5399
5434
|
const handleCopyAddress = () => {
|
|
5400
5435
|
navigator.clipboard.writeText(address);
|
|
5401
5436
|
setShowCopiedTooltip(true);
|
|
5402
5437
|
setTimeout(() => setShowCopiedTooltip(false), 2e3);
|
|
5403
5438
|
};
|
|
5404
|
-
const handleCancel = (0,
|
|
5439
|
+
const handleCancel = (0, import_react29.useCallback)(() => {
|
|
5405
5440
|
setViewState("balances");
|
|
5406
5441
|
setClickedBalance("");
|
|
5407
5442
|
}, []);
|
|
5408
|
-
const onBalanceClick = (0,
|
|
5443
|
+
const onBalanceClick = (0, import_react29.useCallback)((ticker) => {
|
|
5409
5444
|
setClickedBalance(ticker);
|
|
5410
5445
|
setViewState("send");
|
|
5411
5446
|
}, []);
|
|
5412
|
-
const handleDisconnectAll = (0,
|
|
5447
|
+
const handleDisconnectAll = (0, import_react29.useCallback)(async () => {
|
|
5413
5448
|
setIsDisconnecting(true);
|
|
5414
5449
|
try {
|
|
5415
5450
|
console.log("Disconnected from all chains");
|
|
@@ -5420,16 +5455,16 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5420
5455
|
setIsDisconnecting(false);
|
|
5421
5456
|
}
|
|
5422
5457
|
}, [disconnect]);
|
|
5423
|
-
const renderBalancesView = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5424
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5425
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5426
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5458
|
+
const renderBalancesView = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.VStack, { gap: "6", align: "stretch", children: [
|
|
5459
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Box, { children: [
|
|
5460
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Balances" }),
|
|
5461
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.VStack, { gap: "2", align: "stretch", children: sortedBalances.map((bal) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(BalanceItem, { asset: bal, onClick: () => onBalanceClick(bal.ticker), accentColor }, bal.denom)) })
|
|
5427
5462
|
] }),
|
|
5428
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5429
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5430
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5463
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Box, { children: [
|
|
5464
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Quick Actions" }),
|
|
5465
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.VStack, { gap: "2", align: "stretch", children: [
|
|
5431
5466
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5432
|
-
|
|
5467
|
+
import_react28.Button,
|
|
5433
5468
|
{
|
|
5434
5469
|
size: "sm",
|
|
5435
5470
|
variant: "outline",
|
|
@@ -5440,7 +5475,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5440
5475
|
}
|
|
5441
5476
|
),
|
|
5442
5477
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5443
|
-
|
|
5478
|
+
import_react28.Button,
|
|
5444
5479
|
{
|
|
5445
5480
|
size: "sm",
|
|
5446
5481
|
variant: "outline",
|
|
@@ -5453,7 +5488,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5453
5488
|
}
|
|
5454
5489
|
),
|
|
5455
5490
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5456
|
-
|
|
5491
|
+
import_react28.Button,
|
|
5457
5492
|
{
|
|
5458
5493
|
size: "sm",
|
|
5459
5494
|
variant: "outline",
|
|
@@ -5467,8 +5502,8 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5467
5502
|
)
|
|
5468
5503
|
] })
|
|
5469
5504
|
] }),
|
|
5470
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5471
|
-
|
|
5505
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5506
|
+
import_react28.Button,
|
|
5472
5507
|
{
|
|
5473
5508
|
size: "sm",
|
|
5474
5509
|
width: "full",
|
|
@@ -5481,27 +5516,27 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5481
5516
|
}
|
|
5482
5517
|
) })
|
|
5483
5518
|
] });
|
|
5484
|
-
const statusColor = (0,
|
|
5519
|
+
const statusColor = (0, import_react29.useMemo)(() => {
|
|
5485
5520
|
switch (status) {
|
|
5486
|
-
case
|
|
5521
|
+
case import_core2.WalletState.Connected:
|
|
5487
5522
|
return "green";
|
|
5488
|
-
case
|
|
5523
|
+
case import_core2.WalletState.Connecting:
|
|
5489
5524
|
return "yellow";
|
|
5490
|
-
case
|
|
5525
|
+
case import_core2.WalletState.Disconnected:
|
|
5491
5526
|
return "red";
|
|
5492
5527
|
default:
|
|
5493
5528
|
return "gray";
|
|
5494
5529
|
}
|
|
5495
5530
|
}, [status]);
|
|
5496
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5497
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5498
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5499
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5500
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5501
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5531
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.VStack, { gap: "6", align: "stretch", children: [
|
|
5532
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Box, { children: [
|
|
5533
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react27.InterchainWalletModal, {}),
|
|
5534
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { justify: "space-between", mb: "3", children: [
|
|
5535
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "sm", fontWeight: "medium", children: "Wallet Status" }),
|
|
5536
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Badge, { colorPalette: statusColor, size: "sm", children: status })
|
|
5502
5537
|
] }),
|
|
5503
|
-
status ===
|
|
5504
|
-
|
|
5538
|
+
status === import_core2.WalletState.Connected && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5539
|
+
import_react28.Box,
|
|
5505
5540
|
{
|
|
5506
5541
|
p: "3",
|
|
5507
5542
|
bgGradient: "to-br",
|
|
@@ -5511,12 +5546,12 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5511
5546
|
borderWidth: "1px",
|
|
5512
5547
|
borderColor: `${accentColor}.500/20`,
|
|
5513
5548
|
children: [
|
|
5514
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5515
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5516
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5517
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5549
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "xs", color: "fg.muted", mb: "1", children: username != null ? username : "Address" }),
|
|
5550
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.HStack, { justify: "space-between", children: [
|
|
5551
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Text, { fontSize: "sm", fontFamily: "mono", children: walletAddress }),
|
|
5552
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react28.Box, { position: "relative", children: [
|
|
5518
5553
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5519
|
-
|
|
5554
|
+
import_react28.Button,
|
|
5520
5555
|
{
|
|
5521
5556
|
ref: copyButtonRef,
|
|
5522
5557
|
size: "xs",
|
|
@@ -5526,7 +5561,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5526
5561
|
}
|
|
5527
5562
|
),
|
|
5528
5563
|
showCopiedTooltip && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5529
|
-
|
|
5564
|
+
import_react28.Box,
|
|
5530
5565
|
{
|
|
5531
5566
|
position: "absolute",
|
|
5532
5567
|
top: "-35px",
|
|
@@ -5551,8 +5586,8 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5551
5586
|
]
|
|
5552
5587
|
}
|
|
5553
5588
|
),
|
|
5554
|
-
status !==
|
|
5555
|
-
|
|
5589
|
+
status !== import_core2.WalletState.Connected && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5590
|
+
import_react28.Button,
|
|
5556
5591
|
{
|
|
5557
5592
|
size: "sm",
|
|
5558
5593
|
variant: "solid",
|
|
@@ -5562,14 +5597,14 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5562
5597
|
}
|
|
5563
5598
|
)
|
|
5564
5599
|
] }),
|
|
5565
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5566
|
-
status ===
|
|
5567
|
-
status ===
|
|
5600
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react28.Separator, {}),
|
|
5601
|
+
status === import_core2.WalletState.Connected && viewState === "balances" && renderBalancesView(),
|
|
5602
|
+
status === import_core2.WalletState.Connected && viewState === "send" && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SendForm, { balances: sortedBalances, onClose: handleCancel, selectedTicker: clickedBalance, accentColor })
|
|
5568
5603
|
] });
|
|
5569
5604
|
};
|
|
5570
5605
|
|
|
5571
5606
|
// src/components/settings-toggle.tsx
|
|
5572
|
-
var
|
|
5607
|
+
var import_react30 = require("@chakra-ui/react");
|
|
5573
5608
|
var import_lu4 = require("react-icons/lu");
|
|
5574
5609
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
5575
5610
|
function SettingsToggle({ accentColor }) {
|
|
@@ -5577,21 +5612,21 @@ function SettingsToggle({ accentColor }) {
|
|
|
5577
5612
|
Sidebar,
|
|
5578
5613
|
{
|
|
5579
5614
|
ariaLabel: "Settings",
|
|
5580
|
-
trigger: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
5615
|
+
trigger: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react30.Button, { variant: "subtle", size: { base: "sm", md: "md" }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lu4.LuSettings, {}) }),
|
|
5581
5616
|
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SettingsSidebarContent, { accentColor })
|
|
5582
5617
|
}
|
|
5583
5618
|
);
|
|
5584
5619
|
}
|
|
5585
5620
|
|
|
5586
5621
|
// src/components/testnet-banner.tsx
|
|
5587
|
-
var
|
|
5622
|
+
var import_react31 = require("@chakra-ui/react");
|
|
5588
5623
|
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
5589
5624
|
var TestnetBanner = () => {
|
|
5590
5625
|
if (!isTestnetChain()) {
|
|
5591
5626
|
return null;
|
|
5592
5627
|
}
|
|
5593
5628
|
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
5594
|
-
|
|
5629
|
+
import_react31.Box,
|
|
5595
5630
|
{
|
|
5596
5631
|
position: "fixed",
|
|
5597
5632
|
bottom: "0",
|
|
@@ -5605,7 +5640,7 @@ var TestnetBanner = () => {
|
|
|
5605
5640
|
fontSize: "xs",
|
|
5606
5641
|
fontWeight: "bold",
|
|
5607
5642
|
letterSpacing: "wide",
|
|
5608
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
5643
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react31.Text, { children: "YOU ARE ON TESTNET" })
|
|
5609
5644
|
}
|
|
5610
5645
|
);
|
|
5611
5646
|
};
|
|
@@ -5876,6 +5911,7 @@ var TestnetBanner = () => {
|
|
|
5876
5911
|
useSigningClient,
|
|
5877
5912
|
useToast,
|
|
5878
5913
|
useValidatorLogos,
|
|
5914
|
+
useWalletHealthCheck,
|
|
5879
5915
|
validateBZEBech32Address,
|
|
5880
5916
|
validateBech32Address,
|
|
5881
5917
|
validateEndpoints,
|