diff --git a/apps/minifront/src/components/swap/swap-form/token-swap-input.tsx b/apps/minifront/src/components/swap/swap-form/token-swap-input.tsx
index 2790303f..96ad94ad 100644
--- a/apps/minifront/src/components/swap/swap-form/token-swap-input.tsx
+++ b/apps/minifront/src/components/swap/swap-form/token-swap-input.tsx
@@ -24,6 +24,7 @@ import {
import { AssetSelector } from '../../shared/asset-selector';
import BalanceSelector from '../../shared/balance-selector';
import { Amount } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/num/v1/num_pb';
+import { useStatus } from '../../../state/status';
const isValidAmount = (amount: string, assetIn?: BalancesResponse) =>
Number(amount) >= 0 && (!assetIn || !amountMoreThanBalance(assetIn, amount));
@@ -61,7 +62,6 @@ const tokenSwapInputSelector = (state: AllSlices) => ({
setAmount: state.swap.setAmount,
balancesResponses: state.swap.balancesResponses,
priceHistory: state.swap.priceHistory,
- latestKnownBlockHeight: state.status.latestKnownBlockHeight,
assetOutBalance: assetOutBalanceSelector(state),
});
@@ -72,6 +72,8 @@ const tokenSwapInputSelector = (state: AllSlices) => ({
* amount.
*/
export const TokenSwapInput = () => {
+ const status = useStatus();
+ const latestKnownBlockHeight = status.data?.latestKnownBlockHeight ?? 0n;
const {
swappableAssets,
amount,
@@ -82,7 +84,6 @@ export const TokenSwapInput = () => {
setAssetOut,
balancesResponses,
priceHistory,
- latestKnownBlockHeight = 0n,
assetOutBalance,
} = useStoreShallow(tokenSwapInputSelector);
diff --git a/apps/minifront/src/components/swap/swap-loader.ts b/apps/minifront/src/components/swap/swap-loader.ts
index 78be4764..9adc5fe3 100644
--- a/apps/minifront/src/components/swap/swap-loader.ts
+++ b/apps/minifront/src/components/swap/swap-loader.ts
@@ -3,10 +3,6 @@ import { useStore } from '../../state';
import { abortLoader } from '../../abort-loader';
import { SwapRecord } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/view/v1/view_pb';
import { Metadata } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
-import { fetchUnclaimedSwaps } from '../../fetchers/unclaimed-swaps';
-import { viewClient } from '../../clients';
-import { getSwapAsset1, getSwapAsset2 } from '@penumbra-zone/getters/swap-record';
-import { uint8ArrayToBase64 } from '@penumbra-zone/types/base64';
import { getSwappableBalancesResponses, isSwappable } from './helpers';
import { getAllAssets } from '../../fetchers/assets';
@@ -30,44 +26,14 @@ const getAndSetDefaultAssetBalances = async (swappableAssets: Metadata[]) => {
return balancesResponses;
};
-const fetchMetadataForSwap = async (swap: SwapRecord): Promise
=> {
- const assetId1 = getSwapAsset1(swap);
- const assetId2 = getSwapAsset2(swap);
-
- const [{ denomMetadata: asset1Metadata }, { denomMetadata: asset2Metadata }] = await Promise.all([
- viewClient.assetMetadataById({ assetId: assetId1 }),
- viewClient.assetMetadataById({ assetId: assetId2 }),
- ]);
-
- return {
- swap,
- // If no metadata, uses assetId for asset icon display
- asset1: asset1Metadata
- ? asset1Metadata
- : new Metadata({ display: uint8ArrayToBase64(assetId1.inner) }),
- asset2: asset2Metadata
- ? asset2Metadata
- : new Metadata({ display: uint8ArrayToBase64(assetId2.inner) }),
- };
-};
-
-export const unclaimedSwapsWithMetadata = async (): Promise => {
- const unclaimedSwaps = await fetchUnclaimedSwaps();
- return Promise.all(unclaimedSwaps.map(fetchMetadataForSwap));
-};
-
-export const SwapLoader: LoaderFunction = async (): Promise => {
+export const SwapLoader: LoaderFunction = async (): Promise => {
await abortLoader();
const assets = await getAllAssets();
const swappableAssets = assets.filter(isSwappable);
- const [balancesResponses, unclaimedSwaps] = await Promise.all([
- getAndSetDefaultAssetBalances(swappableAssets),
- unclaimedSwapsWithMetadata(),
- ]);
+ const balancesResponses = await getAndSetDefaultAssetBalances(swappableAssets);
useStore.getState().swap.setBalancesResponses(balancesResponses);
useStore.getState().swap.setSwappableAssets(swappableAssets);
- void useStore.getState().swap.dutchAuction.loadAuctionInfos();
- return unclaimedSwaps;
+ return null;
};
diff --git a/apps/minifront/src/components/swap/unclaimed-swaps.tsx b/apps/minifront/src/components/swap/unclaimed-swaps.tsx
index 50174ab2..573c5e3b 100644
--- a/apps/minifront/src/components/swap/unclaimed-swaps.tsx
+++ b/apps/minifront/src/components/swap/unclaimed-swaps.tsx
@@ -1,35 +1,28 @@
import { Button } from '@penumbra-zone/ui/components/ui/button';
import { Card } from '@penumbra-zone/ui/components/ui/card';
-import { useLoaderData, useRevalidator } from 'react-router-dom';
-import { SwapLoaderResponse, UnclaimedSwapsWithMetadata } from './swap-loader';
import { AssetIcon } from '@penumbra-zone/ui/components/ui/tx/view/asset-icon';
-import { useStore } from '../../state';
-import { unclaimedSwapsSelector } from '../../state/unclaimed-swaps';
+import { AllSlices } from '../../state';
+import { useUnclaimedSwaps } from '../../state/unclaimed-swaps';
import { getSwapRecordCommitment } from '@penumbra-zone/getters/swap-record';
import { uint8ArrayToBase64 } from '@penumbra-zone/types/base64';
import { GradientHeader } from '@penumbra-zone/ui/components/ui/gradient-header';
+import { useStoreShallow } from '../../utils/use-store-shallow';
+
+const unclaimedSwapsSelector = (state: AllSlices) => ({
+ claimSwap: state.unclaimedSwaps.claimSwap,
+ isInProgress: state.unclaimedSwaps.isInProgress,
+});
export const UnclaimedSwaps = () => {
- const unclaimedSwaps = useLoaderData() as SwapLoaderResponse;
+ const unclaimedSwaps = useUnclaimedSwaps();
+ const { claimSwap, isInProgress } = useStoreShallow(unclaimedSwapsSelector);
- const sortedUnclaimedSwaps = unclaimedSwaps.sort(
- (a, b) => Number(b.swap.outputData?.height) - Number(a.swap.outputData?.height),
- );
- return !unclaimedSwaps.length ? (
+ return !unclaimedSwaps.data?.length ? (
) : (
- <_UnclaimedSwaps unclaimedSwaps={sortedUnclaimedSwaps}>
- );
-};
-
-const _UnclaimedSwaps = ({ unclaimedSwaps }: { unclaimedSwaps: UnclaimedSwapsWithMetadata[] }) => {
- const { revalidate } = useRevalidator();
- const { claimSwap, isInProgress } = useStore(unclaimedSwapsSelector);
-
- return (
Unclaimed Swaps
- {unclaimedSwaps.map(({ swap, asset1, asset2 }) => {
+ {unclaimedSwaps.data.map(({ swap, asset1, asset2 }) => {
const id = uint8ArrayToBase64(getSwapRecordCommitment(swap).inner);
return (
@@ -46,7 +39,7 @@ const _UnclaimedSwaps = ({ unclaimedSwaps }: { unclaimedSwaps: UnclaimedSwapsWit