From bef7ca440a629c0bc459fba7cf146246cc3c7b48 Mon Sep 17 00:00:00 2001
From: Jesse Pinho <jesse@jessepinho.com>
Date: Fri, 3 Jan 2025 21:31:58 -0800
Subject: [PATCH] Switch to using Metadata

---
 .../DefaultPaymentTokenScreen/assets.ts           | 11 -----------
 .../DefaultPaymentTokenScreen/index.tsx           |  6 +++---
 .../useFilteredAssets.ts                          | 15 +++++++++++----
 react-native-expo/utils/constants.ts              |  1 +
 4 files changed, 15 insertions(+), 18 deletions(-)
 delete mode 100644 react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/assets.ts
 create mode 100644 react-native-expo/utils/constants.ts

diff --git a/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/assets.ts b/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/assets.ts
deleted file mode 100644
index 7f37895..0000000
--- a/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/assets.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import Asset from '@/types/Asset';
-
-const ASSETS: Asset[] = [
-  { name: 'USD Coin', symbol: 'USDC' },
-  { name: 'Penumbra', symbol: 'UM' },
-  { name: 'Cosmo', symbol: 'ATOM' },
-  { name: 'Ethereum', symbol: 'ETH' },
-  { name: 'Osmosis', symbol: 'OSMO' },
-];
-
-export default ASSETS;
diff --git a/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/index.tsx b/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/index.tsx
index fd1a8c1..ffeba97 100644
--- a/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/index.tsx
+++ b/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/index.tsx
@@ -7,7 +7,7 @@ import { setSearchText } from '@/store/defaultPaymentTokenScreen';
 import { useAppDispatch, useAppSelector } from '@/store/hooks';
 import { setDefaultPaymentToken } from '@/store/secureStore';
 import { Trans, useLingui } from '@lingui/react/macro';
-import { Sx, Text, View } from 'dripsy';
+import { ScrollView, Sx, Text } from 'dripsy';
 import { Check, Search } from 'lucide-react-native';
 import useFilteredAssets from './useFilteredAssets';
 import TextInputIconStartAdornment from '@/components/TextInputIconStartAdornment';
@@ -20,7 +20,7 @@ export default function DefaultPaymentTokenScreen() {
   const { t } = useLingui();
 
   return (
-    <View sx={sx.root}>
+    <ScrollView contentContainerSx={sx.root}>
       <Text variant='h4'>
         <Trans>Default payment token</Trans>
       </Text>
@@ -49,7 +49,7 @@ export default function DefaultPaymentTokenScreen() {
           />
         ))}
       </List>
-    </View>
+    </ScrollView>
   );
 }
 
diff --git a/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/useFilteredAssets.ts b/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/useFilteredAssets.ts
index 34c8ee9..1ea08d6 100644
--- a/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/useFilteredAssets.ts
+++ b/react-native-expo/components/ProfileScreen/DefaultPaymentTokenScreen/useFilteredAssets.ts
@@ -1,7 +1,14 @@
 import { useAppSelector } from '@/store/hooks';
-import ASSETS from './assets';
+import { PENUMBRA_CHAIN_ID } from '@/utils/constants';
+import { ChainRegistryClient } from '@penumbra-labs/registry';
 import { useMemo } from 'react';
 
+/**
+ * @todo: Use remote client? (To avoid having to update the app just to get the
+ * latest metadatas.)
+ */
+const ALL_METADATAS = new ChainRegistryClient().bundled.get(PENUMBRA_CHAIN_ID).getAllAssets();
+
 /**
  * Returns asset types filtered by the search text from state.
  *
@@ -14,11 +21,11 @@ export default function useFilteredAssets() {
 
   const filteredAssets = useMemo(
     () =>
-      ASSETS.filter(asset => {
+      ALL_METADATAS.filter(metadata => {
         const searchTextLowerCase = searchText.toLocaleLowerCase();
 
-        if (asset.name.toLocaleLowerCase().includes(searchTextLowerCase)) return true;
-        if (asset.symbol.toLocaleLowerCase().includes(searchTextLowerCase)) return true;
+        if (metadata.name.toLocaleLowerCase().includes(searchTextLowerCase)) return true;
+        if (metadata.symbol.toLocaleLowerCase().includes(searchTextLowerCase)) return true;
 
         return false;
       }),
diff --git a/react-native-expo/utils/constants.ts b/react-native-expo/utils/constants.ts
new file mode 100644
index 0000000..bf56dc9
--- /dev/null
+++ b/react-native-expo/utils/constants.ts
@@ -0,0 +1 @@
+export const PENUMBRA_CHAIN_ID = 'penumbra-1';