wip

apps/extension/src/routes/popup/settings/settings.tsx

@@ -13,6 +13,8 @@ import { passwordSelector } from '../../../state/password';
 import { usePopupNav } from '../../../utils/navigate';
 import { PopupPath } from '../paths';
 import { SettingsScreen } from './settings-screen';
+import { useChainIdQuery } from '../../../hooks/chain-id';
+import { getNumeraireFromRegistry } from '../../../utils/get-numeraires-from-registry';
 
 const links = [
   {
@@ -39,6 +41,7 @@ const links = [
     title: 'Price denomination',
     icon: <BarChartIcon className='size-5 text-muted-foreground' />,
     href: PopupPath.SETTINGS_NUMERAIRES,
+    disabled: false,
   },
   {
     title: 'Advanced',
@@ -51,6 +54,11 @@ export const Settings = () => {
   const navigate = usePopupNav();
   const { clearSessionPassword } = useStore(passwordSelector);
 
+  const { chainId } = useChainIdQuery();
+  const numeraires = getNumeraireFromRegistry(chainId);
+
+  console.log(chainId, numeraires);
+
   return (
     <SettingsScreen title='Settings'>
       <div className='flex grow flex-col justify-between'>
@@ -61,6 +69,7 @@ export const Settings = () => {
               title={i.title}
               icon={i.icon}
               onClick={() => navigate(i.href)}
+              disabled={i.href === PopupPath.SETTINGS_NUMERAIRES && numeraires.length === 0}
             />
           ))}
         </div>

apps/extension/src/shared/components/default-frontend-form/index.tsx

@@ -14,13 +14,17 @@ interface DisplayedFrontend {
 }
 
 const getFrontendsFromRegistry = (selectedRpc?: string): DisplayedFrontend[] => {
-  const registryClient = new ChainRegistryClient();
-  const { frontends } = registryClient.globals();
-
-  const registeredFrontends = frontends.map(frontend => ({
-    title: extractDomain(frontend),
-    url: frontend,
-  }));
+  let registeredFrontends: DisplayedFrontend[] = [];
+  try {
+    const registryClient = new ChainRegistryClient();
+    const { frontends } = registryClient.globals();
+    registeredFrontends = frontends.map(frontend => ({
+      title: extractDomain(frontend),
+      url: frontend,
+    }));
+  } catch (e) {
+    console.error('Registry globals is not available', e);
+  }
 
   if (selectedRpc) {
     registeredFrontends.push({ title: 'Embedded RPC frontend', url: `${selectedRpc}/app/` });

apps/extension/src/shared/components/grpc-endpoint-form/use-grpc-endpoint-form.ts

@@ -18,9 +18,14 @@ const useSaveGrpcEndpointSelector = (state: AllSlices) => ({
 });
 
 const getRpcsFromRegistry = () => {
-  const registryClient = new ChainRegistryClient();
-  const { rpcs } = registryClient.globals();
-  return rpcs.toSorted(randomSort);
+  try {
+    const registryClient = new ChainRegistryClient();
+    const { rpcs } = registryClient.globals();
+    return rpcs.toSorted(randomSort);
+  } catch (e) {
+    console.error('Registry globals is not available', e);
+    return [];
+  }
 };
 
 export const useGrpcEndpointForm = () => {

apps/extension/src/shared/components/link.tsx

@@ -5,12 +5,14 @@ interface LinkProps {
   icon: ReactElement;
   title: string;
   onClick: () => void;
+  disabled?: boolean;
 }
 
-export const CustomLink = ({ icon, title, onClick }: LinkProps) => {
+export const CustomLink = ({ icon, title, onClick, disabled }: LinkProps) => {
   return (
     <Button
       variant='ghost'
+      disabled={disabled}
       className='flex w-full items-center justify-start gap-2 p-[10px] text-left hover:bg-transparent hover:opacity-50'
       onClick={onClick}
     >

apps/extension/src/shared/components/numeraires-form.tsx

@@ -1,4 +1,3 @@
-import { ChainRegistryClient } from '@penumbra-labs/registry';
 import { AllSlices, useStore } from '../../state';
 import { useChainIdQuery } from '../../hooks/chain-id';
 import { useMemo, useState } from 'react';
@@ -7,14 +6,7 @@ import { SelectList } from '@repo/ui/components/ui/select';
 import { bech32mAssetId } from '@penumbra-zone/bech32m/passet';
 import { getAssetId } from '@penumbra-zone/getters/metadata';
 import { Button } from '@repo/ui/components/ui/button';
-import { Metadata } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
-
-const getNumeraireFromRegistry = (chainId?: string): Metadata[] => {
-  if (!chainId) return [];
-  const registryClient = new ChainRegistryClient();
-  const registry = registryClient.get(chainId);
-  return registry.numeraires.map(n => registry.getMetadata(n));
-};
+import { getNumeraireFromRegistry } from '../../utils/get-numeraires-from-registry';
 
 const useNumerairesSelector = (state: AllSlices) => {
   return {
@@ -40,6 +32,11 @@ export const NumeraireForm = ({
   // this forces you to use two sources to guarantee 'chainId' for both settings and onboarding
   const numeraires = useMemo(() => getNumeraireFromRegistry(chainId ?? networkChainId), [chainId]);
 
+  if (numeraires.length === 0) {
+    void (async function () {
+      await onSuccess();
+    })();
+  }
   const [loading, setLoading] = useState(false);
 
   const handleSubmit = () => {

apps/extension/src/utils/get-numeraires-from-registry.ts

@@ -0,0 +1,14 @@
+import { Metadata } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
+import { ChainRegistryClient } from '@penumbra-labs/registry';
+
+export const getNumeraireFromRegistry = (chainId?: string): Metadata[] => {
+  if (!chainId) return [];
+  try {
+    const registryClient = new ChainRegistryClient();
+    const registry = registryClient.get(chainId);
+    return registry.numeraires.map(n => registry.getMetadata(n));
+  } catch (error) {
+    console.error('Registry numeraires is not available', error);
+    return [];
+  }
+};