Skip to content

Commit

Permalink
Re-enable numeraires in onboarding (#203)
Browse files Browse the repository at this point in the history
  • Loading branch information
grod220 authored Sep 26, 2024
1 parent 523e864 commit cb29a43
Show file tree
Hide file tree
Showing 4 changed files with 23 additions and 24 deletions.
13 changes: 6 additions & 7 deletions apps/extension/src/hooks/numeraires-query.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,26 +3,25 @@ import { ChainRegistryClient } from '@penumbra-labs/registry';
import { useMemo } from 'react';

export const useNumeraires = (chainId?: string) => {
const { data, isLoading, error, isError } = useQuery({
const { data, isLoading, isError } = useQuery({
queryKey: ['registry', chainId],
queryFn: async () => {
const registryClient = new ChainRegistryClient();
return registryClient.remote.get(chainId!);
},
retry: 1,
retryDelay: 0,
staleTime: Infinity,
enabled: Boolean(chainId),
});

const numeraires = useMemo(() => {
if (!chainId) {
if (isError) {
console.error(`Could not load numeraires for chainId: ${chainId}`);
}
return [];
if (isError) {
console.error(`Could not load numeraires for chainId: ${chainId}`);
}

return data?.numeraires.map(n => data.getMetadata(n)) ?? [];
}, [data, chainId, isError]);

return { numeraires, isLoading, error };
return { numeraires, isLoading, isError };
};
4 changes: 3 additions & 1 deletion apps/extension/src/routes/page/onboarding/set-numeraire.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,11 @@ import { FadeTransition } from '@repo/ui/components/ui/fade-transition';
import { usePageNav } from '../../../utils/navigate';
import { PagePath } from '../paths';
import { NumeraireForm } from '../../../shared/components/numeraires-form';
import { useStore } from '../../../state';

export const SetNumerairesPage = () => {
const navigate = usePageNav();
const chainId = useStore(state => state.network.chainId);

const onSuccess = (): void => {
navigate(PagePath.ONBOARDING_SUCCESS);
Expand All @@ -22,7 +24,7 @@ export const SetNumerairesPage = () => {
</CardDescription>
</CardHeader>
<div className='mt-6'>
<NumeraireForm isOnboarding onSuccess={onSuccess} />
<NumeraireForm isOnboarding onSuccess={onSuccess} chainId={chainId} />
</div>
</Card>
</FadeTransition>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,18 @@ import { NumerairesGradientIcon } from '../../../icons/numeraires-gradient';
import { usePopupNav } from '../../../utils/navigate';
import { PopupPath } from '../paths';
import { NumeraireForm } from '../../../shared/components/numeraires-form';
import { useChainIdQuery } from '../../../hooks/chain-id';

export const SettingsNumeraires = () => {
const navigate = usePopupNav();
const { chainId } = useChainIdQuery();

const onSuccess = () => {
navigate(PopupPath.INDEX);
};
return (
<SettingsScreen title='Price denominations' IconComponent={NumerairesGradientIcon}>
<NumeraireForm onSuccess={onSuccess} />
<NumeraireForm onSuccess={onSuccess} chainId={chainId} />
</SettingsScreen>
);
};
26 changes: 11 additions & 15 deletions apps/extension/src/shared/components/numeraires-form.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { AllSlices, useStore } from '../../state';
import { useChainIdQuery } from '../../hooks/chain-id';
import { useEffect, useState } from 'react';
import { ServicesMessage } from '../../message/services';
import { SelectList } from '@repo/ui/components/ui/select';
Expand All @@ -13,39 +12,36 @@ const useNumerairesSelector = (state: AllSlices) => {
selectedNumeraires: state.numeraires.selectedNumeraires,
selectNumeraire: state.numeraires.selectNumeraire,
saveNumeraires: state.numeraires.saveNumeraires,
networkChainId: state.network.chainId,
};
};

export const NumeraireForm = ({
isOnboarding,
onSuccess,
chainId,
}: {
chainId?: string;
isOnboarding?: boolean;
onSuccess: () => void | Promise<void>;
onSuccess: () => void;
}) => {
const { chainId } = useChainIdQuery();
const { selectedNumeraires, selectNumeraire, saveNumeraires, networkChainId } =
useStore(useNumerairesSelector);

// 'chainId' from 'useChainIdQuery' is not available during onboarding,
// this forces you to use two sources to guarantee 'chainId' for both settings and onboarding
const { numeraires } = useNumeraires(chainId ?? networkChainId);
const { selectedNumeraires, selectNumeraire, saveNumeraires } = useStore(useNumerairesSelector);
const { numeraires, isLoading, isError } = useNumeraires(chainId);

// If query errors or there aren't numeraires in the registry, can skip
useEffect(() => {
if (numeraires.length === 0) {
void onSuccess();
if (isError || (!isLoading && numeraires.length === 0)) {
onSuccess();
}
}, [numeraires]);
}, [numeraires.length, isError, isLoading]);

const [loading, setLoading] = useState(false);

const handleSubmit = () => {
setLoading(true);
void (async function () {
await saveNumeraires();
await chrome.runtime.sendMessage(ServicesMessage.ChangeNumeraires);
await onSuccess();
void chrome.runtime.sendMessage(ServicesMessage.ChangeNumeraires);
onSuccess();
})();
};

Expand Down

0 comments on commit cb29a43

Please sign in to comment.