feat(guardian-ui): hook up wallet module config to bitcoin node card

fedimint · Sep 11, 2023 · f822616 · f822616
1 parent 8f0124c
commit f822616
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 11 deletions.
diff --git a/apps/guardian-ui/src/admin/FederationAdmin.tsx b/apps/guardian-ui/src/admin/FederationAdmin.tsx
@@ -3,7 +3,11 @@ import { Flex, Box, Icon, Text, useTheme, Heading } from '@chakra-ui/react';
 import { CopyInput } from '@fedimint/ui';
 import { useTranslation } from '@fedimint/utils';
 import { useAdminContext } from '../hooks';
-import { ConfigResponse, StatusResponse } from '../types';
+import {
+  ConfigResponse,
+  ModulesConfigResponse,
+  StatusResponse,
+} from '../types';
 import { GatewaysCard } from '../components/GatewaysCard';
 import { ReactComponent as CopyIcon } from '../assets/svgs/copy.svg';
 import { GuardiansCard } from '../components/GuardiansCard';
@@ -17,12 +21,14 @@ export const FederationAdmin: React.FC = () => {
   const [status, setStatus] = useState<StatusResponse>();
   const [inviteCode, setInviteCode] = useState<string>('');
   const [config, setConfig] = useState<ConfigResponse>();
+  const [modulesConfigs, setModulesConfigs] = useState<ModulesConfigResponse>();
   const { t } = useTranslation();
 
   useEffect(() => {
     // TODO: poll server status
     api.status().then(setStatus).catch(console.error);
     api.inviteCode().then(setInviteCode).catch(console.error);
+    api.modulesConfig().then(setModulesConfigs).catch(console.error);
   }, [api]);
 
   useEffect(() => {
@@ -69,7 +75,7 @@ export const FederationAdmin: React.FC = () => {
           <FederationInfoCard status={status} />
           <Flex w='100%' direction='column' gap={5}>
             <BalanceCard />
-            <BitcoinNodeCard config={config} />
+            <BitcoinNodeCard modulesConfigs={modulesConfigs} />
           </Flex>
         </Flex>
         <GuardiansCard status={status} config={config} />

diff --git a/apps/guardian-ui/src/components/BitcoinNodeCard.tsx b/apps/guardian-ui/src/components/BitcoinNodeCard.tsx
@@ -1,32 +1,47 @@
-import { Card, CardBody, CardHeader, Text } from '@chakra-ui/react';
+import { Card, CardBody, CardHeader, Skeleton, Text } from '@chakra-ui/react';
 import { useTranslation } from '@fedimint/utils';
 import React, { useMemo } from 'react';
-import { ConfigResponse } from '../types';
+import { ModuleConfig, ModuleKind, ModulesConfigResponse } from '../types';
 import { KeyValues } from '@fedimint/ui';
 
 interface Props {
-  config: ConfigResponse | undefined;
+  modulesConfigs: ModulesConfigResponse | undefined;
 }
 
-export const BitcoinNodeCard: React.FC<Props> = () => {
+export const BitcoinNodeCard: React.FC<Props> = ({ modulesConfigs }) => {
   const { t } = useTranslation();
 
+  const walletConfig = modulesConfigs
+    ? Object.values(modulesConfigs).find(
+        (config): config is ModuleConfig<ModuleKind.Wallet> =>
+          config.kind === ModuleKind.Wallet
+      )
+    : undefined;
+
   // TODO: Populate values from config.client_config.modules.config
   // It's currently mysteriously hex encoded
   const keyValues = useMemo(
     () => [
       {
         key: 'url',
         label: t('federation-dashboard.bitcoin-node.url-label'),
-        value: t('common.unknown'),
+        value: walletConfig ? (
+          walletConfig.client_default_bitcoin_rpc?.url
+        ) : (
+          <Skeleton height='24px' width='160px' />
+        ),
       },
       {
         key: 'blockHeight',
-        label: t('federation-dashboard.bitcoin-node.block-height-label'),
-        value: t('common.unknown'),
+        label: t('federation-dashboard.bitcoin-node.network-label'),
+        value: walletConfig ? (
+          walletConfig.network
+        ) : (
+          <Skeleton height='24px' width='100px' />
+        ),
       },
     ],
-    [t]
+    [walletConfig, t]
   );
 
   return (

diff --git a/apps/guardian-ui/src/languages/en.json b/apps/guardian-ui/src/languages/en.json
@@ -32,7 +32,7 @@
     "bitcoin-node": {
       "label": "Bitcoin Node",
       "url-label": "URL",
-      "block-height-label": "Current block height"
+      "network-label": "Network"
     },
     "guardians": {
       "label": "Guardians",