Readable name dao table (#766)

* adding readbale network dao table * uipdating getNetowrk
HausDAO · Aug 31, 2022 · 2296b15 · 2296b15
1 parent f68cbcd
commit 2296b15
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 4 deletions.
diff --git a/apps/hub-app/src/components/DaoCard.tsx b/apps/hub-app/src/components/DaoCard.tsx
@@ -2,7 +2,7 @@ import styled from 'styled-components';
 
 import {
   charLimit,
-  getNetwork,
+  getNetworkName,
   readableNumbers,
 } from '@daohaus/common-utilities';
 import {
@@ -137,7 +137,7 @@ export const DaoCard = ({
         )}
       </div>
       <div className="tag-box">
-        <Tag tagColor="red">{getNetwork(networkId as string)?.name}</Tag>
+        <Tag tagColor="red">{getNetworkName(networkId)}</Tag>
         <Tag tagColor="blue">{contractType}</Tag>
       </div>
       <a

diff --git a/apps/hub-app/src/components/DaoTable.tsx b/apps/hub-app/src/components/DaoTable.tsx
@@ -6,6 +6,7 @@ import { indigoDark } from '@radix-ui/colors';
 import { ProfileAvatar, Tag } from '@daohaus/ui';
 import {
   charLimit,
+  getNetworkName,
   readableNumbers,
   truncateAddress,
 } from '@daohaus/common-utilities';
@@ -177,6 +178,9 @@ export const DaoTable = ({ daoData }: IDaoTableData) => {
       {
         Header: 'Network',
         accessor: 'networkId',
+        Cell: ({ value }: { value: string | undefined }) => {
+          return <Highlight>{getNetworkName(value)}</Highlight>;
+        },
       },
       {
         Header: 'Delegate',

diff --git a/libs/common-utilities/src/constants/chainData.ts b/libs/common-utilities/src/constants/chainData.ts
@@ -29,14 +29,14 @@ export const NETWORK_DATA: Keychain<NetworkType> = {
   },
 };
 
-export const getNetwork = (chainId: string) => {
+export const getNetwork = (chainId: string | undefined) => {
   if (!isValidNetwork(chainId)) {
     return null;
   }
   return NETWORK_DATA[chainId];
 };
 
-export const getNetworkName = (chainId: string) => {
+export const getNetworkName = (chainId: string | undefined) => {
   return getNetwork(chainId)?.name || null;
 };