diff --git a/apps/mobile/package.json b/apps/mobile/package.json
index dbc91299ab..1c1683f82f 100644
--- a/apps/mobile/package.json
+++ b/apps/mobile/package.json
@@ -78,6 +78,7 @@
     "react-native-ble-plx": "^2.0.3",
     "react-native-code-push": "^8.2.1",
     "react-native-device-info": "^10.11.0",
+    "react-native-draggable-flatlist": "^4.0.1",
     "react-native-exception-handler": "^2.10.10",
     "react-native-fs": "^2.20.0",
     "react-native-gesture-handler": "2.16.0",
diff --git a/apps/mobile/src/languages/en.json b/apps/mobile/src/languages/en.json
index c49bbef1e5..cd4bebb006 100644
--- a/apps/mobile/src/languages/en.json
+++ b/apps/mobile/src/languages/en.json
@@ -329,6 +329,9 @@
   "page.migration.welcome.restart-modal.title": "Keplr will automatically restart",
   "page.migration.welcome.restart-modal.paragraph": "Keplr will be closed in {seconds}s...",
   "page.wallet.title": "Select Wallet",
+  "page.wallet.input.search.placeholder": "Search wallet name or address",
+  "page.wallet.search-empty-view-title": "Oops!",
+  "page.wallet.search-empty-view-paragraph": "No Result Found",
   "page.wallet.add-wallet-button": "Add Wallet",
   "page.wallet.recovery-phrase-title": "Recovery Phrase",
   "page.wallet.connect-with-social-account-title": "Connected with {social} Account",
diff --git a/apps/mobile/src/languages/ko.json b/apps/mobile/src/languages/ko.json
index f88135d902..4446221c05 100644
--- a/apps/mobile/src/languages/ko.json
+++ b/apps/mobile/src/languages/ko.json
@@ -326,6 +326,9 @@
   "page.migration.welcome.restart-modal.title": "케플러 앱이 자동으로 재시작됩니다.",
   "page.migration.welcome.restart-modal.paragraph": "{seconds}초 후 재시작돼요.",
   "page.wallet.title": "지갑 선택",
+  "page.wallet.input.search.placeholder": "지갑 이름이나 주소로 검색",
+  "page.wallet.search-empty-view-title": "앗!",
+  "page.wallet.search-empty-view-paragraph": "검색 결과가 없어요",
   "page.wallet.add-wallet-button": "지갑 추가",
   "page.wallet.recovery-phrase-title": "복구 문구 기반",
   "page.wallet.connect-with-social-account-title": "{social} 계정으로 연결",
diff --git a/apps/mobile/src/screen/wallet/select/index.tsx b/apps/mobile/src/screen/wallet/select/index.tsx
index a03f5481d1..a75f9f883a 100644
--- a/apps/mobile/src/screen/wallet/select/index.tsx
+++ b/apps/mobile/src/screen/wallet/select/index.tsx
@@ -15,12 +15,10 @@ import {Box} from '../../../components/box';
 import {XAxis, YAxis} from '../../../components/axis';
 import {useStyle} from '../../../styles';
 import {Gutter} from '../../../components/gutter';
-import {Stack} from '../../../components/stack';
 import {Column, Columns} from '../../../components/column';
-import {CheckIcon, CopyOutlineIcon} from '../../../components/icon';
+import {CopyOutlineIcon} from '../../../components/icon';
 import {Button} from '../../../components/button';
 import {App, AppCoinType} from '@keplr-wallet/ledger-cosmos';
-import {PageWithScrollView} from '../../../components/page';
 import {StyleSheet, Text} from 'react-native';
 import {StackActions, useNavigation} from '@react-navigation/native';
 import {useIntl} from 'react-intl';
@@ -32,24 +30,78 @@ import {RNMessageRequesterInternal} from '../../../router';
 import * as Clipboard from 'expo-clipboard';
 import {MenuModal, ModalMenuItem} from '../../../components/modal/menu-modal';
 import {TouchableWithoutFeedback} from 'react-native-gesture-handler';
+import {
+  NestableDraggableFlatList,
+  NestableScrollContainer,
+} from 'react-native-draggable-flatlist';
+import {SearchTextInput} from '../../../components/input/search-text-input';
+import {EmptyView, EmptyViewText} from '../../../components/empty-view';
+import {IconProps} from '../../../components/icon/types.ts';
+import Svg, {Rect} from 'react-native-svg';
+import Reanimated, {
+  useAnimatedStyle,
+  useSharedValue,
+  withSpring,
+} from 'react-native-reanimated';
+import {defaultSpringConfig} from '../../../styles/spring.ts';
 
 export const WalletSelectScreen: FunctionComponent = observer(() => {
   const {keyRingStore} = useStore();
   const navigation = useNavigation();
   const intl = useIntl();
+  const style = useStyle();
   const timerRef = useRef<any>(null);
   const [isOpenMenuModal, setIsOpenMenuModal] = useState(false);
 
   const [modalMenuItems, setModalMenuItems] = useState<ModalMenuItem[]>([]);
 
+  const [searchText, setSearchText] = useState<string>('');
+  const [debounceSearchText, setDebounceSearchText] = useState<string>('');
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setDebounceSearchText(searchText);
+    }, 300);
+
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [searchText]);
+
+  const [searchedKeyInfos, setSearchedKeyInfos] = useState<
+    KeyInfo[] | undefined
+  >(undefined);
+  useEffect(() => {
+    if (debounceSearchText.trim().length === 0) {
+      setSearchedKeyInfos(undefined);
+      return;
+    }
+
+    let exposed = false;
+
+    keyRingStore
+      .searchKeyRings(debounceSearchText)
+      .then(keyInfos => {
+        if (!exposed) {
+          setSearchedKeyInfos(keyInfos);
+        }
+      })
+      .catch(console.log);
+
+    return () => {
+      exposed = true;
+    };
+  }, [debounceSearchText, keyRingStore]);
+
+  const keyInfos = searchedKeyInfos ?? keyRingStore.keyInfos;
+
   const mnemonicKeys = useMemo(() => {
-    return keyRingStore.keyInfos.filter(keyInfo => {
+    return keyInfos.filter(keyInfo => {
       return keyInfo.type === 'mnemonic';
     });
-  }, [keyRingStore.keyInfos]);
+  }, [keyInfos]);
 
   const socialPrivateKeyInfos = useMemo(() => {
-    return keyRingStore.keyInfos.filter(keyInfo => {
+    return keyInfos.filter(keyInfo => {
       if (
         keyInfo.type === 'private-key' &&
         typeof keyInfo.insensitive === 'object' &&
@@ -66,28 +118,28 @@ export const WalletSelectScreen: FunctionComponent = observer(() => {
 
       return false;
     });
-  }, [keyRingStore.keyInfos]);
+  }, [keyInfos]);
 
   const privateKeyInfos = useMemo(() => {
-    return keyRingStore.keyInfos.filter(keyInfo => {
+    return keyInfos.filter(keyInfo => {
       return (
         keyInfo.type === 'private-key' &&
         !socialPrivateKeyInfos.some(k => k.id === keyInfo.id)
       );
     });
-  }, [keyRingStore.keyInfos, socialPrivateKeyInfos]);
+  }, [keyInfos, socialPrivateKeyInfos]);
 
   const ledgerKeys = useMemo(() => {
-    return keyRingStore.keyInfos.filter(keyInfo => {
+    return keyInfos.filter(keyInfo => {
       return keyInfo.type === 'ledger';
     });
-  }, [keyRingStore.keyInfos]);
+  }, [keyInfos]);
 
   const keystoneKeys = useMemo(() => {
-    return keyRingStore.keyInfos.filter(keyInfo => {
+    return keyInfos.filter(keyInfo => {
       return keyInfo.type === 'keystone';
     });
-  }, [keyRingStore.keyInfos]);
+  }, [keyInfos]);
 
   const unknownKeys = useMemo(() => {
     const knownKeys = mnemonicKeys
@@ -95,11 +147,11 @@ export const WalletSelectScreen: FunctionComponent = observer(() => {
       .concat(privateKeyInfos)
       .concat(socialPrivateKeyInfos)
       .concat(keystoneKeys);
-    return keyRingStore.keyInfos.filter(keyInfo => {
+    return keyInfos.filter(keyInfo => {
       return !knownKeys.find(k => k.id === keyInfo.id);
     });
   }, [
-    keyRingStore.keyInfos,
+    keyInfos,
     ledgerKeys,
     mnemonicKeys,
     privateKeyInfos,
@@ -165,90 +217,135 @@ export const WalletSelectScreen: FunctionComponent = observer(() => {
   }, [isOpenMenuModal]);
 
   return (
-    <PageWithScrollView backgroundMode={'default'}>
-      <Box padding={12} position="relative">
-        <Box position="absolute" style={{top: 14, right: 12, zIndex: 1000}}>
-          <Button
-            text={intl.formatMessage({id: 'page.wallet.add-wallet-button'})}
-            size="extra-small"
-            color="secondary"
-            onPress={async () => {
-              navigation.dispatch(StackActions.push('Register'));
+    <Box style={{flex: 1}}>
+      <NestableScrollContainer>
+        <Box paddingX={12}>
+          <Gutter size={8} />
+
+          <SearchTextInput
+            placeholder={intl.formatMessage({
+              id: 'page.wallet.input.search.placeholder',
+            })}
+            value={searchText}
+            onChangeText={text => {
+              setSearchText(text);
             }}
           />
-        </Box>
-        <Gutter size={16} />
-        <Stack gutter={20}>
-          {mnemonicKeys.length > 0 ? (
-            <KeyInfoList
-              title={intl.formatMessage({
-                id: 'page.wallet.recovery-phrase-title',
-              })}
-              keyInfos={mnemonicKeys}
-              setModalMenuItems={setModalMenuItems}
-              openModal={() => setIsOpenMenuModal(true)}
-            />
-          ) : null}
-
-          {socialPrivateKeyInfoByType.map(info => {
-            return (
-              <KeyInfoList
-                key={info.type}
-                title={intl.formatMessage(
-                  {id: 'page.wallet.connect-with-social-account-title'},
-                  {
-                    social:
-                      info.type.length > 0
-                        ? info.type[0].toUpperCase() + info.type.slice(1)
-                        : info.type,
-                  },
-                )}
-                keyInfos={info.keyInfos}
-                setModalMenuItems={setModalMenuItems}
-                openModal={() => setIsOpenMenuModal(true)}
+          <Box>
+            <Box position="absolute" style={{top: 14, right: 12, zIndex: 1000}}>
+              <Button
+                text={intl.formatMessage({
+                  id: 'page.wallet.add-wallet-button',
+                })}
+                size="extra-small"
+                color="secondary"
+                onPress={async () => {
+                  navigation.dispatch(StackActions.push('Register'));
+                }}
               />
-            );
-          })}
-
-          {privateKeyInfos.length > 0 ? (
-            <KeyInfoList
-              title={intl.formatMessage({
-                id: 'page.wallet.private-key-title',
-              })}
-              keyInfos={privateKeyInfos}
-              setModalMenuItems={setModalMenuItems}
-              openModal={() => setIsOpenMenuModal(true)}
-            />
-          ) : null}
+            </Box>
+          </Box>
+        </Box>
 
-          {ledgerKeys.length > 0 ? (
-            <KeyInfoList
-              title={intl.formatMessage({id: 'page.wallet.ledger-title'})}
-              keyInfos={ledgerKeys}
-              setModalMenuItems={setModalMenuItems}
-              openModal={() => setIsOpenMenuModal(true)}
-            />
-          ) : null}
+        <Gutter size={36} />
+
+        {mnemonicKeys.length > 0 ? (
+          <KeyInfoList
+            sortKey="sort-mnemonic"
+            title={intl.formatMessage({
+              id: 'page.wallet.recovery-phrase-title',
+            })}
+            keyInfos={mnemonicKeys}
+            setModalMenuItems={setModalMenuItems}
+            openModal={() => setIsOpenMenuModal(true)}
+          />
+        ) : null}
 
-          {keystoneKeys.length > 0 ? (
+        {socialPrivateKeyInfoByType.map(info => {
+          return (
             <KeyInfoList
-              title="Keystone"
-              keyInfos={keystoneKeys}
+              key={info.type}
+              sortKey={`sort-social-${info.type}`}
+              title={intl.formatMessage(
+                {id: 'page.wallet.connect-with-social-account-title'},
+                {
+                  social:
+                    info.type.length > 0
+                      ? info.type[0].toUpperCase() + info.type.slice(1)
+                      : info.type,
+                },
+              )}
+              keyInfos={info.keyInfos}
               setModalMenuItems={setModalMenuItems}
               openModal={() => setIsOpenMenuModal(true)}
             />
-          ) : null}
+          );
+        })}
+
+        {privateKeyInfos.length > 0 ? (
+          <KeyInfoList
+            sortKey="sort-private-key"
+            title={intl.formatMessage({
+              id: 'page.wallet.private-key-title',
+            })}
+            keyInfos={privateKeyInfos}
+            setModalMenuItems={setModalMenuItems}
+            openModal={() => setIsOpenMenuModal(true)}
+          />
+        ) : null}
+
+        {ledgerKeys.length > 0 ? (
+          <KeyInfoList
+            sortKey="sort-ledger"
+            title={intl.formatMessage({id: 'page.wallet.ledger-title'})}
+            keyInfos={ledgerKeys}
+            setModalMenuItems={setModalMenuItems}
+            openModal={() => setIsOpenMenuModal(true)}
+          />
+        ) : null}
+
+        {keystoneKeys.length > 0 ? (
+          <KeyInfoList
+            sortKey="sort-keystone"
+            title="Keystone"
+            keyInfos={keystoneKeys}
+            setModalMenuItems={setModalMenuItems}
+            openModal={() => setIsOpenMenuModal(true)}
+          />
+        ) : null}
+
+        {unknownKeys.length > 0 ? (
+          <KeyInfoList
+            sortKey="sort-unknown"
+            title={intl.formatMessage({id: 'page.wallet.unknown-title'})}
+            keyInfos={unknownKeys}
+            setModalMenuItems={setModalMenuItems}
+            openModal={() => setIsOpenMenuModal(true)}
+          />
+        ) : null}
+
+        {keyInfos.length === 0 ? (
+          <Box style={style.flatten(['margin-top-16'])}>
+            <Gutter size={40} />
+            <EmptyView>
+              <Box alignX="center" width={312}>
+                <EmptyViewText
+                  text={intl.formatMessage({
+                    id: 'page.wallet.search-empty-view-title',
+                  })}
+                />
+                <Gutter size={12} />
+                <EmptyViewText
+                  text={intl.formatMessage({
+                    id: 'page.wallet.search-empty-view-paragraph',
+                  })}
+                />
+              </Box>
+            </EmptyView>
+          </Box>
+        ) : null}
+      </NestableScrollContainer>
 
-          {unknownKeys.length > 0 ? (
-            <KeyInfoList
-              title={intl.formatMessage({id: 'page.wallet.unknown-title'})}
-              keyInfos={unknownKeys}
-              setModalMenuItems={setModalMenuItems}
-              openModal={() => setIsOpenMenuModal(true)}
-            />
-          ) : null}
-        </Stack>
-      </Box>
       <MenuModal
         isOpen={isOpenMenuModal}
         setIsOpen={setIsOpenMenuModal}
@@ -263,22 +360,47 @@ export const WalletSelectScreen: FunctionComponent = observer(() => {
           setIsOpenMenuModal(false);
         }}
       />
-    </PageWithScrollView>
+    </Box>
   );
 });
 
 const KeyInfoList: FunctionComponent<{
+  sortKey: string;
   title: string;
   keyInfos: KeyInfo[];
   setModalMenuItems: React.Dispatch<React.SetStateAction<ModalMenuItem[]>>;
   openModal: () => void;
-}> = observer(({title, keyInfos, setModalMenuItems, openModal}) => {
+}> = observer(({sortKey, title, keyInfos, setModalMenuItems, openModal}) => {
   const style = useStyle();
   const {uiConfigStore, chainStore, queriesStore} = useStore();
   const [keyInfosWithIcns, setKeyInfosWithIcns] = useState<
     (KeyInfo & {bech32Address?: string})[]
   >([]);
 
+  const indexMap =
+    uiConfigStore.selectWalletConfig.getKeyToSortVaultIdsMapIndex(sortKey);
+
+  const sortedKeyInfos = useMemo(() => {
+    return keyInfosWithIcns.sort((key1, key2) => {
+      const key1Id = key1.id;
+      const key2Id = key2.id;
+
+      const key1Index = indexMap.get(key1Id);
+      const key2Index = indexMap.get(key2Id);
+
+      if (key1Index == null && key2Index != null) {
+        return 1;
+      }
+      if (key1Index != null && key2Index == null) {
+        return -1;
+      }
+      if (key1Index == null && key2Index == null) {
+        return 0;
+      }
+      return key1Index! - key2Index!;
+    });
+  }, [keyInfosWithIcns, indexMap]);
+
   useEffect(() => {
     (async () => {
       if (
@@ -311,8 +433,8 @@ const KeyInfoList: FunctionComponent<{
   }, [chainStore, keyInfos, queriesStore, uiConfigStore.icnsInfo]);
 
   return (
-    <Box>
-      <YAxis>
+    <YAxis>
+      <Box paddingX={12}>
         <Text
           style={style.flatten([
             'subtitle4',
@@ -321,22 +443,42 @@ const KeyInfoList: FunctionComponent<{
           ])}>
           {title}
         </Text>
-        <Gutter size={8} />
-        <Stack gutter={8}>
-          {keyInfosWithIcns.map(keyInfo => {
-            return (
+      </Box>
+
+      <Gutter size={8} />
+
+      <NestableDraggableFlatList
+        data={sortedKeyInfos}
+        onDragEnd={data => {
+          uiConfigStore.selectWalletConfig.setKeyToSortVaultIds(
+            sortKey,
+            data.data.map(item => item.id),
+          );
+        }}
+        renderItem={({item, drag, isActive}) => {
+          return (
+            <React.Fragment key={item.id}>
+              <Gutter size={4} />
+
               <KeyringItem
                 setModalMenuItems={setModalMenuItems}
-                key={keyInfo.id}
-                keyInfo={keyInfo}
+                key={item.id}
+                keyInfo={item}
                 openModal={openModal}
-                bech32Address={keyInfo.bech32Address}
+                bech32Address={item.bech32Address}
+                drag={drag}
+                isActive={isActive}
               />
-            );
-          })}
-        </Stack>
-      </YAxis>
-    </Box>
+
+              <Gutter size={4} />
+            </React.Fragment>
+          );
+        }}
+        keyExtractor={item => item.id}
+      />
+
+      <Gutter size={20} />
+    </YAxis>
   );
 });
 
@@ -345,65 +487,91 @@ const KeyringItem: FunctionComponent<{
   setModalMenuItems: React.Dispatch<React.SetStateAction<ModalMenuItem[]>>;
   openModal: () => void;
   bech32Address?: string;
-}> = observer(({keyInfo, setModalMenuItems, openModal, bech32Address}) => {
-  const {chainStore, keyRingStore, uiConfigStore, queriesStore} = useStore();
-  const intl = useIntl();
-  const navigate = useNavigation<StackNavProp>();
+  drag?: () => void;
+  isActive?: boolean;
+}> = observer(
+  ({keyInfo, setModalMenuItems, openModal, bech32Address, drag, isActive}) => {
+    const {chainStore, keyRingStore, uiConfigStore, queriesStore} = useStore();
+    const intl = useIntl();
+    const navigate = useNavigation<StackNavProp>();
 
-  const style = useStyle();
+    const style = useStyle();
 
-  const icnsPrimaryName = (() => {
-    if (
-      uiConfigStore.icnsInfo &&
-      chainStore.hasChain(uiConfigStore.icnsInfo.chainId) &&
-      bech32Address
-    ) {
-      const queries = queriesStore.get(uiConfigStore.icnsInfo.chainId);
-      const icnsQuery = queries.icns.queryICNSNames.getQueryContract(
-        uiConfigStore.icnsInfo.resolverContractAddress,
-        bech32Address,
-      );
-      return icnsQuery.primaryName.split('.')[0];
-    }
-  })();
-
-  const paragraph = useMemo(() => {
-    if (keyInfo.insensitive['bip44Path']) {
-      const bip44Path = keyInfo.insensitive['bip44Path'] as any;
-
-      // -1 means it can be multiple coin type.
-      let coinType = -1;
-      if (keyInfo.type === 'ledger') {
-        const ledgerAppCandidate: (App | 'Ethereum')[] = [
-          'Cosmos',
-          'Terra',
-          'Secret',
-          'Ethereum',
-        ];
-
-        const app: (App | 'Ethereum')[] = [];
-        for (const ledgerApp of ledgerAppCandidate) {
-          if (keyInfo.insensitive[ledgerApp] != null) {
-            app.push(ledgerApp);
+    const icnsPrimaryName = (() => {
+      if (
+        uiConfigStore.icnsInfo &&
+        chainStore.hasChain(uiConfigStore.icnsInfo.chainId) &&
+        bech32Address
+      ) {
+        const queries = queriesStore.get(uiConfigStore.icnsInfo.chainId);
+        const icnsQuery = queries.icns.queryICNSNames.getQueryContract(
+          uiConfigStore.icnsInfo.resolverContractAddress,
+          bech32Address,
+        );
+        return icnsQuery.primaryName.split('.')[0];
+      }
+    })();
+
+    const paragraph = useMemo(() => {
+      if (keyInfo.insensitive['bip44Path']) {
+        const bip44Path = keyInfo.insensitive['bip44Path'] as any;
+
+        // -1 means it can be multiple coin type.
+        let coinType = -1;
+        if (keyInfo.type === 'ledger') {
+          const ledgerAppCandidate: (App | 'Ethereum')[] = [
+            'Cosmos',
+            'Terra',
+            'Secret',
+            'Ethereum',
+          ];
+
+          const app: (App | 'Ethereum')[] = [];
+          for (const ledgerApp of ledgerAppCandidate) {
+            if (keyInfo.insensitive[ledgerApp] != null) {
+              app.push(ledgerApp);
+            }
           }
-        }
 
-        if (app.length === 0 || app.length >= 2) {
-          coinType = -1;
-        } else if (app[0] === 'Ethereum') {
-          coinType = 60;
-        } else {
-          const c = AppCoinType[app[0]];
-          if (c != null) {
-            coinType = c;
-          } else {
+          if (app.length === 0 || app.length >= 2) {
             coinType = -1;
+          } else if (app[0] === 'Ethereum') {
+            coinType = 60;
+          } else {
+            const c = AppCoinType[app[0]];
+            if (c != null) {
+              coinType = c;
+            } else {
+              coinType = -1;
+            }
+          }
+
+          if (
+            app.length === 1 &&
+            app.includes('Cosmos') &&
+            bip44Path.account === 0 &&
+            bip44Path.change === 0 &&
+            bip44Path.addressIndex === 0
+          ) {
+            return;
           }
+
+          return `m/44'/${coinType >= 0 ? coinType : '-'}'/${
+            bip44Path.account
+          }'/${bip44Path.change}/${bip44Path.addressIndex}${(() => {
+            if (app.length === 1) {
+              if (app[0] !== 'Cosmos' && app[0] !== 'Ethereum') {
+                return ` ${intl.formatMessage({
+                  id: `page.wallet.keyring-item.bip44-path-${app[0]}-text`,
+                })}`;
+              }
+            }
+
+            return '';
+          })()}`;
         }
 
         if (
-          app.length === 1 &&
-          app.includes('Cosmos') &&
           bip44Path.account === 0 &&
           bip44Path.change === 0 &&
           bip44Path.addressIndex === 0
@@ -413,211 +581,261 @@ const KeyringItem: FunctionComponent<{
 
         return `m/44'/${coinType >= 0 ? coinType : '-'}'/${
           bip44Path.account
-        }'/${bip44Path.change}/${bip44Path.addressIndex}${(() => {
-          if (app.length === 1) {
-            if (app[0] !== 'Cosmos' && app[0] !== 'Ethereum') {
-              return ` ${intl.formatMessage({
-                id: `page.wallet.keyring-item.bip44-path-${app[0]}-text`,
-              })}`;
-            }
-          }
-
-          return '';
-        })()}`;
+        }'/${bip44Path.change}/${bip44Path.addressIndex}`;
       }
 
       if (
-        bip44Path.account === 0 &&
-        bip44Path.change === 0 &&
-        bip44Path.addressIndex === 0
+        keyInfo.type === 'private-key' &&
+        typeof keyInfo.insensitive === 'object' &&
+        keyInfo.insensitive['keyRingMeta'] &&
+        typeof keyInfo.insensitive['keyRingMeta'] === 'object' &&
+        keyInfo.insensitive['keyRingMeta']['web3Auth'] &&
+        typeof keyInfo.insensitive['keyRingMeta']['web3Auth'] === 'object'
       ) {
-        return;
+        const web3Auth = keyInfo.insensitive['keyRingMeta']['web3Auth'];
+        if (
+          web3Auth['type'] &&
+          web3Auth['email'] &&
+          typeof web3Auth['type'] === 'string' &&
+          typeof web3Auth['email'] === 'string'
+        ) {
+          return web3Auth['email'];
+        }
       }
+    }, [intl, keyInfo.insensitive, keyInfo.type]);
 
-      return `m/44'/${coinType >= 0 ? coinType : '-'}'/${bip44Path.account}'/${
-        bip44Path.change
-      }/${bip44Path.addressIndex}`;
-    }
-
-    if (
-      keyInfo.type === 'private-key' &&
-      typeof keyInfo.insensitive === 'object' &&
-      keyInfo.insensitive['keyRingMeta'] &&
-      typeof keyInfo.insensitive['keyRingMeta'] === 'object' &&
-      keyInfo.insensitive['keyRingMeta']['web3Auth'] &&
-      typeof keyInfo.insensitive['keyRingMeta']['web3Auth'] === 'object'
-    ) {
-      const web3Auth = keyInfo.insensitive['keyRingMeta']['web3Auth'];
-      if (
-        web3Auth['type'] &&
-        web3Auth['email'] &&
-        typeof web3Auth['type'] === 'string' &&
-        typeof web3Auth['email'] === 'string'
-      ) {
-        return web3Auth['email'];
-      }
-    }
-  }, [intl, keyInfo.insensitive, keyInfo.type]);
-
-  const dropdownItems = (() => {
-    const defaults: ModalMenuItem[] = [
-      {
-        key: 'change-wallet-name',
-        label: intl.formatMessage({
-          id: 'page.wallet.keyring-item.dropdown.change-wallet-name-title',
-        }),
-        onSelect: () =>
-          navigate.navigate('SelectWallet.ChangeName', {id: keyInfo.id}),
-      },
-      {
-        key: 'delete-wallet',
-        label: intl.formatMessage({
-          id: 'page.wallet.keyring-item.dropdown.delete-wallet-title',
-        }),
-        onSelect: () =>
-          navigate.navigate('SelectWallet.Delete', {id: keyInfo.id}),
-      },
-    ];
-
-    switch (keyInfo.type) {
-      case 'mnemonic': {
-        defaults.unshift({
-          key: 'view-recovery-phrase',
+    const dropdownItems = (() => {
+      const defaults: ModalMenuItem[] = [
+        {
+          key: 'change-wallet-name',
           label: intl.formatMessage({
-            id: 'page.wallet.keyring-item.dropdown.view-recovery-path-title',
+            id: 'page.wallet.keyring-item.dropdown.change-wallet-name-title',
           }),
           onSelect: () =>
-            navigate.navigate('SelectWallet.ViewRecoveryPhrase', {
-              id: keyInfo.id,
-            }),
-        });
-        break;
-      }
-      case 'private-key': {
-        defaults.unshift({
-          key: 'view-recovery-phrase',
+            navigate.navigate('SelectWallet.ChangeName', {id: keyInfo.id}),
+        },
+        {
+          key: 'delete-wallet',
           label: intl.formatMessage({
-            id: 'page.wallet.keyring-item.dropdown.view-private-key-title',
+            id: 'page.wallet.keyring-item.dropdown.delete-wallet-title',
           }),
           onSelect: () =>
-            navigate.navigate('SelectWallet.ViewRecoveryPhrase', {
-              id: keyInfo.id,
+            navigate.navigate('SelectWallet.Delete', {id: keyInfo.id}),
+        },
+      ];
+
+      switch (keyInfo.type) {
+        case 'mnemonic': {
+          defaults.unshift({
+            key: 'view-recovery-phrase',
+            label: intl.formatMessage({
+              id: 'page.wallet.keyring-item.dropdown.view-recovery-path-title',
             }),
+            onSelect: () =>
+              navigate.navigate('SelectWallet.ViewRecoveryPhrase', {
+                id: keyInfo.id,
+              }),
+          });
+          break;
+        }
+        case 'private-key': {
+          defaults.unshift({
+            key: 'view-recovery-phrase',
+            label: intl.formatMessage({
+              id: 'page.wallet.keyring-item.dropdown.view-private-key-title',
+            }),
+            onSelect: () =>
+              navigate.navigate('SelectWallet.ViewRecoveryPhrase', {
+                id: keyInfo.id,
+              }),
+          });
+          break;
+        }
+      }
+
+      if (icnsPrimaryName) {
+        defaults.unshift({
+          key: 'copy-icns-name',
+          label: icnsPrimaryName,
+          isClicked: false,
+          left: (
+            <ExpoImage.Image
+              source={require('../../../public/assets/img/icns-icon.png')}
+              style={style.flatten(['width-16', 'height-16'])}
+            />
+          ),
+          right: (
+            <CopyOutlineIcon
+              size={20}
+              color={style.get('color-text-low').color}
+            />
+          ),
+          onSelect: async () => {
+            await Clipboard.setStringAsync(icnsPrimaryName);
+            setModalMenuItems(prev =>
+              prev.map(item =>
+                item.key === 'copy-icns-name'
+                  ? {...item, isClicked: true, label: 'Copied to clipboard'}
+                  : item,
+              ),
+            );
+          },
         });
-        break;
       }
-    }
 
-    if (icnsPrimaryName) {
-      defaults.unshift({
-        key: 'copy-icns-name',
-        label: icnsPrimaryName,
-        isClicked: false,
-        left: (
-          <ExpoImage.Image
-            source={require('../../../public/assets/img/icns-icon.png')}
-            style={style.flatten(['width-16', 'height-16'])}
-          />
-        ),
-        right: (
-          <CopyOutlineIcon
-            size={20}
-            color={style.get('color-text-low').color}
-          />
-        ),
-        onSelect: async () => {
-          await Clipboard.setStringAsync(icnsPrimaryName);
-          setModalMenuItems(prev =>
-            prev.map(item =>
-              item.key === 'copy-icns-name'
-                ? {...item, isClicked: true, label: 'Copied to clipboard'}
-                : item,
-            ),
-          );
-        },
-      });
-    }
+      return defaults;
+    })();
 
-    return defaults;
-  })();
+    const isSelected = keyRingStore.selectedKeyInfo?.id === keyInfo.id;
+
+    const navigation = useNavigation();
+
+    // Drag를 할 때 왼쪽 스와이프로 뒤로가기를 막기 위해서 gesture를 disable한다.(올바른 동작을 위해서)
+    // Drag가 끝나면 다시 활성화한다.
+    useEffect(() => {
+      navigation.getParent()?.setOptions({gestureEnabled: !isActive});
+    }, [navigation, isActive]);
+
+    const [scale, setScale] = useState(1);
+    const animProgress = useSharedValue(scale);
+
+    useEffect(() => {
+      animProgress.value = withSpring(scale, defaultSpringConfig);
+    }, [animProgress, scale]);
+
+    const animatedStyle = useAnimatedStyle(() => {
+      return {
+        transform: [{scale: animProgress.value}],
+      };
+    });
+
+    // Drag가 시작되면 확대한다.
+    useEffect(() => {
+      if (isActive) {
+        setScale(1.05);
+      } else {
+        setScale(1);
+      }
+    }, [isActive]);
+
+    return (
+      <TouchableWithoutFeedback
+        style={style.flatten(['padding-x-12'])}
+        onPress={async () => {
+          if (isSelected) {
+            return;
+          }
+          await keyRingStore.selectKeyRing(keyInfo.id);
+          await chainStore.waitSyncedEnabledChains();
+          navigate.goBack();
+        }}>
+        <Reanimated.View style={{...animatedStyle}}>
+          <Box
+            paddingRight={20}
+            minHeight={74}
+            borderRadius={6}
+            alignY="center"
+            style={StyleSheet.flatten([
+              style.flatten([
+                isActive
+                  ? 'background-color-gray-600'
+                  : 'background-color-card-default',
+              ]),
+              isSelected &&
+                style.flatten([
+                  'border-width-1',
+                  'border-color-gray-200',
+                  'border-solid',
+                ]),
+            ])}>
+            <Columns sum={1} alignY="center">
+              <Box width={'85%'}>
+                <XAxis alignY="center">
+                  <TouchableWithoutFeedback
+                    onLongPress={drag}
+                    delayLongPress={0}>
+                    <Box alignY="center" minHeight={74} paddingLeft={12}>
+                      <ChangeSequenceIcon
+                        size={32}
+                        color={
+                          isActive
+                            ? style.get('color-gray-400').color
+                            : style.get('color-gray-300').color
+                        }
+                      />
+                    </Box>
+                  </TouchableWithoutFeedback>
 
-  const isSelected = keyRingStore.selectedKeyInfo?.id === keyInfo.id;
-  return (
-    <TouchableWithoutFeedback
-      onPress={async () => {
-        if (isSelected) {
-          return;
-        }
-        await keyRingStore.selectKeyRing(keyInfo.id);
-        await chainStore.waitSyncedEnabledChains();
-        navigate.goBack();
-      }}>
-      <Box
-        padding={16}
-        minHeight={74}
-        borderRadius={6}
-        alignY="center"
-        style={StyleSheet.flatten([
-          style.flatten(['background-color-card-default']),
-          isSelected &&
-            style.flatten([
-              'border-width-1',
-              'border-color-gray-200',
-              'border-solid',
-            ]),
-        ])}>
-        <Columns sum={1} alignY="center">
-          <Box width={'85%'}>
-            <XAxis alignY="center">
-              {isSelected ? (
-                <React.Fragment>
-                  <CheckIcon
-                    size={20}
-                    color={style.get('color-gray-200').color}
-                  />
-                  <Gutter size={4} />
-                </React.Fragment>
-              ) : null}
-              <Text
-                numberOfLines={1}
-                style={StyleSheet.flatten([
-                  style.flatten([
-                    'subtitle2',
-                    'dark:color-gray-700',
-                    'color-gray-10',
-                  ]),
-                  {maxWidth: '80%'},
-                ])}>
-                {keyInfo.name}
-              </Text>
-              {icnsPrimaryName ? (
-                <React.Fragment>
                   <Gutter size={8} />
-                  <ExpoImage.Image
-                    source={require('../../../public/assets/img/icns-icon.png')}
-                    style={style.flatten(['width-16', 'height-16'])}
-                  />
-                </React.Fragment>
-              ) : null}
-            </XAxis>
-            {paragraph ? (
-              <React.Fragment>
-                <Text style={style.flatten(['body2', 'color-gray-300'])}>
-                  {paragraph}
-                </Text>
-              </React.Fragment>
-            ) : null}
+
+                  <Text
+                    numberOfLines={1}
+                    style={StyleSheet.flatten([
+                      style.flatten([
+                        'subtitle2',
+                        'dark:color-gray-700',
+                        'color-gray-10',
+                      ]),
+                      {maxWidth: '80%'},
+                    ])}>
+                    {keyInfo.name}
+                  </Text>
+                  {icnsPrimaryName ? (
+                    <React.Fragment>
+                      <Gutter size={8} />
+                      <ExpoImage.Image
+                        source={require('../../../public/assets/img/icns-icon.png')}
+                        style={style.flatten(['width-16', 'height-16'])}
+                      />
+                    </React.Fragment>
+                  ) : null}
+                </XAxis>
+                {paragraph ? (
+                  <React.Fragment>
+                    <Text style={style.flatten(['body2', 'color-gray-300'])}>
+                      {paragraph}
+                    </Text>
+                  </React.Fragment>
+                ) : null}
+              </Box>
+              <Column weight={1} />
+              <TouchableWithoutFeedback
+                onPress={() => {
+                  setModalMenuItems(dropdownItems);
+                  openModal();
+                }}>
+                <EllipsisIcon
+                  size={24}
+                  color={style.get('color-gray-10').color}
+                />
+              </TouchableWithoutFeedback>
+            </Columns>
           </Box>
-          <Column weight={1} />
-          <TouchableWithoutFeedback
-            onPress={() => {
-              setModalMenuItems(dropdownItems);
-              openModal();
-            }}>
-            <EllipsisIcon size={24} color={style.get('color-gray-10').color} />
-          </TouchableWithoutFeedback>
-        </Columns>
-      </Box>
-    </TouchableWithoutFeedback>
+        </Reanimated.View>
+      </TouchableWithoutFeedback>
+    );
+  },
+);
+
+const ChangeSequenceIcon: FunctionComponent<IconProps> = ({size, color}) => {
+  return (
+    <Svg width={size} height={size} viewBox="0 0 32 32" fill="none">
+      <Rect
+        x="6.66699"
+        y="10"
+        width="18.6667"
+        height="4"
+        rx="2"
+        fill={color || 'currentColor'}
+      />
+      <Rect
+        x="6.66699"
+        y="18"
+        width="18.6667"
+        height="4"
+        rx="2"
+        fill={color || 'currentColor'}
+      />
+    </Svg>
   );
-});
+};
diff --git a/apps/mobile/src/stores/ui-config/index.ts b/apps/mobile/src/stores/ui-config/index.ts
index 5062f25f06..f3c7a19475 100644
--- a/apps/mobile/src/stores/ui-config/index.ts
+++ b/apps/mobile/src/stores/ui-config/index.ts
@@ -20,6 +20,7 @@ import {AddressBookConfig} from './address-book';
 import {MessageRequester} from '@keplr-wallet/router';
 import {AutoLockConfig} from './auto-lock';
 import {IBCSwapConfig} from './ibc-swap.ts';
+import {SelectWalletConfig} from './select-wallet.ts';
 
 export interface UIConfigOptions {
   isDeveloperMode: boolean;
@@ -43,6 +44,7 @@ export class UIConfigStore {
   public readonly addressBookConfig: AddressBookConfig;
   public readonly autoLockConfig: AutoLockConfig;
   public readonly ibcSwapConfig: IBCSwapConfig;
+  public readonly selectWalletConfig: SelectWalletConfig;
 
   @observable
   protected _isInitialized: boolean = false;
@@ -105,6 +107,7 @@ export class UIConfigStore {
       keyRingStore,
     );
     this.ibcSwapConfig = new IBCSwapConfig(kvStores.kvStore, chainStore);
+    this.selectWalletConfig = new SelectWalletConfig(kvStores.kvStore);
 
     this._icnsInfo = _icnsInfo;
 
@@ -165,6 +168,7 @@ export class UIConfigStore {
       this.addressBookConfig.init(),
       this.autoLockConfig.init(),
       this.ibcSwapConfig.init(),
+      this.selectWalletConfig.init(),
     ]);
 
     runInAction(() => {
diff --git a/apps/mobile/src/stores/ui-config/select-wallet.ts b/apps/mobile/src/stores/ui-config/select-wallet.ts
new file mode 100644
index 0000000000..995bbe2dec
--- /dev/null
+++ b/apps/mobile/src/stores/ui-config/select-wallet.ts
@@ -0,0 +1,55 @@
+import {KVStore, PrefixKVStore} from '@keplr-wallet/common';
+import {autorun, makeObservable, observable, runInAction, toJS} from 'mobx';
+import {computedFn} from 'mobx-utils';
+
+export class SelectWalletConfig {
+  protected readonly kvStore: KVStore;
+
+  @observable
+  protected readonly keyToSortVaultIdsMap = new Map<string, string[]>();
+
+  constructor(kvStore: KVStore) {
+    this.kvStore = new PrefixKVStore(kvStore, 'select-wallet');
+
+    makeObservable(this);
+  }
+
+  async init(): Promise<void> {
+    const saved = await this.kvStore.get<Record<string, string[]>>(
+      'keyToSortVaultIdsMap',
+    );
+    if (saved) {
+      runInAction(() => {
+        for (const [key, value] of Object.entries(saved)) {
+          this.keyToSortVaultIdsMap.set(key, value);
+        }
+      });
+    }
+    autorun(() => {
+      const js = toJS(this.keyToSortVaultIdsMap);
+      const obj = Object.fromEntries(js);
+      this.kvStore.set<Record<string, string[]>>('keyToSortVaultIdsMap', obj);
+    });
+  }
+
+  getKeyToSortVaultIds(key: string): string[] {
+    return this.keyToSortVaultIdsMap.get(key) || [];
+  }
+
+  getKeyToSortVaultIdsMapIndex = computedFn(
+    (key: string): Map<string, number> => {
+      const ids = this.getKeyToSortVaultIds(key);
+      const map = new Map<string, number>();
+      for (let i = 0; i < ids.length; i++) {
+        map.set(ids[i], i);
+      }
+      return map;
+    },
+  );
+
+  setKeyToSortVaultIds(key: string, vaultIds: string[]): void {
+    runInAction(() => {
+      this.keyToSortVaultIdsMap.set(key, vaultIds);
+    });
+  }
+}
diff --git a/yarn.lock b/yarn.lock
index 64611d73ce..172038aa5e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -336,6 +336,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/code-frame@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/code-frame@npm:7.24.7"
+  dependencies:
+    "@babel/highlight": ^7.24.7
+    picocolors: ^1.0.0
+  checksum: 830e62cd38775fdf84d612544251ce773d544a8e63df667728cc9e0126eeef14c6ebda79be0f0bc307e8318316b7f58c27ce86702e0a1f5c321d842eb38ffda4
+  languageName: node
+  linkType: hard
+
 "@babel/compat-data@npm:^7.13.11, @babel/compat-data@npm:^7.15.0":
   version: 7.15.0
   resolution: "@babel/compat-data@npm:7.15.0"
@@ -634,6 +644,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/generator@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/generator@npm:7.24.7"
+  dependencies:
+    "@babel/types": ^7.24.7
+    "@jridgewell/gen-mapping": ^0.3.5
+    "@jridgewell/trace-mapping": ^0.3.25
+    jsesc: ^2.5.1
+  checksum: 0ff31a73b15429f1287e4d57b439bba4a266f8c673bb445fe313b82f6d110f586776997eb723a777cd7adad9d340edd162aea4973a90112c5d0cfcaf6686844b
+  languageName: node
+  linkType: hard
+
 "@babel/helper-annotate-as-pure@npm:^7.10.4":
   version: 7.12.10
   resolution: "@babel/helper-annotate-as-pure@npm:7.12.10"
@@ -679,6 +701,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-annotate-as-pure@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-annotate-as-pure@npm:7.24.7"
+  dependencies:
+    "@babel/types": ^7.24.7
+  checksum: 6178566099a6a0657db7a7fa601a54fb4731ca0b8614fbdccfd8e523c210c13963649bc8fdfd53ce7dd14d05e3dda2fb22dea5b30113c488b9eb1a906d60212e
+  languageName: node
+  linkType: hard
+
 "@babel/helper-builder-binary-assignment-operator-visitor@npm:^7.14.5":
   version: 7.15.4
   resolution: "@babel/helper-builder-binary-assignment-operator-visitor@npm:7.15.4"
@@ -913,6 +944,25 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-create-class-features-plugin@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-create-class-features-plugin@npm:7.24.7"
+  dependencies:
+    "@babel/helper-annotate-as-pure": ^7.24.7
+    "@babel/helper-environment-visitor": ^7.24.7
+    "@babel/helper-function-name": ^7.24.7
+    "@babel/helper-member-expression-to-functions": ^7.24.7
+    "@babel/helper-optimise-call-expression": ^7.24.7
+    "@babel/helper-replace-supers": ^7.24.7
+    "@babel/helper-skip-transparent-expression-wrappers": ^7.24.7
+    "@babel/helper-split-export-declaration": ^7.24.7
+    semver: ^6.3.1
+  peerDependencies:
+    "@babel/core": ^7.0.0
+  checksum: 371a181a1717a9b0cebc97727c8ea9ca6afa34029476a684b6030f9d1ad94dcdafd7de175da10b63ae3ba79e4e82404db8ed968ebf264b768f097e5d64faab71
+  languageName: node
+  linkType: hard
+
 "@babel/helper-create-regexp-features-plugin@npm:^7.12.1":
   version: 7.12.7
   resolution: "@babel/helper-create-regexp-features-plugin@npm:7.12.7"
@@ -1044,6 +1094,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-environment-visitor@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-environment-visitor@npm:7.24.7"
+  dependencies:
+    "@babel/types": ^7.24.7
+  checksum: 079d86e65701b29ebc10baf6ed548d17c19b808a07aa6885cc141b690a78581b180ee92b580d755361dc3b16adf975b2d2058b8ce6c86675fcaf43cf22f2f7c6
+  languageName: node
+  linkType: hard
+
 "@babel/helper-explode-assignable-expression@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-explode-assignable-expression@npm:7.15.4"
@@ -1105,6 +1164,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-function-name@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-function-name@npm:7.24.7"
+  dependencies:
+    "@babel/template": ^7.24.7
+    "@babel/types": ^7.24.7
+  checksum: 142ee08922074dfdc0ff358e09ef9f07adf3671ab6eef4fca74dcf7a551f1a43717e7efa358c9e28d7eea84c28d7f177b7a58c70452fc312ae3b1893c5dab2a4
+  languageName: node
+  linkType: hard
+
 "@babel/helper-get-function-arity@npm:^7.12.13":
   version: 7.12.13
   resolution: "@babel/helper-get-function-arity@npm:7.12.13"
@@ -1150,6 +1219,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-hoist-variables@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-hoist-variables@npm:7.24.7"
+  dependencies:
+    "@babel/types": ^7.24.7
+  checksum: 6cfdcf2289cd12185dcdbdf2435fa8d3447b797ac75851166de9fc8503e2fd0021db6baf8dfbecad3753e582c08e6a3f805c8d00cbed756060a877d705bd8d8d
+  languageName: node
+  linkType: hard
+
 "@babel/helper-member-expression-to-functions@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-member-expression-to-functions@npm:7.15.4"
@@ -1195,6 +1273,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-member-expression-to-functions@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-member-expression-to-functions@npm:7.24.7"
+  dependencies:
+    "@babel/traverse": ^7.24.7
+    "@babel/types": ^7.24.7
+  checksum: 9fecf412f85fa23b7cf55d19eb69de39f8240426a028b141c9df2aed8cfedf20b3ec3318d40312eb7a3dec9eea792828ce0d590e0ff62da3da532482f537192c
+  languageName: node
+  linkType: hard
+
 "@babel/helper-module-imports@npm:^7.0.0, @babel/helper-module-imports@npm:^7.16.0, @babel/helper-module-imports@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/helper-module-imports@npm:7.18.6"
@@ -1249,6 +1337,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-module-imports@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-module-imports@npm:7.24.7"
+  dependencies:
+    "@babel/traverse": ^7.24.7
+    "@babel/types": ^7.24.7
+  checksum: 8ac15d96d262b8940bc469052a048e06430bba1296369be695fabdf6799f201dd0b00151762b56012a218464e706bc033f27c07f6cec20c6f8f5fd6543c67054
+  languageName: node
+  linkType: hard
+
 "@babel/helper-module-transforms@npm:^7.14.5, @babel/helper-module-transforms@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-module-transforms@npm:7.15.4"
@@ -1327,6 +1425,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-module-transforms@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-module-transforms@npm:7.24.7"
+  dependencies:
+    "@babel/helper-environment-visitor": ^7.24.7
+    "@babel/helper-module-imports": ^7.24.7
+    "@babel/helper-simple-access": ^7.24.7
+    "@babel/helper-split-export-declaration": ^7.24.7
+    "@babel/helper-validator-identifier": ^7.24.7
+  peerDependencies:
+    "@babel/core": ^7.0.0
+  checksum: ddff3b41c2667876b4e4e73d961168f48a5ec9560c95c8c2d109e6221f9ca36c6f90c6317eb7a47f2a3c99419c356e529a86b79174cad0d4f7a61960866b88ca
+  languageName: node
+  linkType: hard
+
 "@babel/helper-optimise-call-expression@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-optimise-call-expression@npm:7.15.4"
@@ -1354,6 +1467,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-optimise-call-expression@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-optimise-call-expression@npm:7.24.7"
+  dependencies:
+    "@babel/types": ^7.24.7
+  checksum: 280654eaf90e92bf383d7eed49019573fb35a98c9e992668f701ad099957246721044be2068cf6840cb2299e0ad393705a1981c88c23a1048096a8d59e5f79a3
+  languageName: node
+  linkType: hard
+
 "@babel/helper-plugin-utils@npm:^7.0.0, @babel/helper-plugin-utils@npm:^7.10.4, @babel/helper-plugin-utils@npm:^7.8.0, @babel/helper-plugin-utils@npm:^7.8.3":
   version: 7.10.4
   resolution: "@babel/helper-plugin-utils@npm:7.10.4"
@@ -1403,6 +1525,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-plugin-utils@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-plugin-utils@npm:7.24.7"
+  checksum: 81f2a15751d892e4a8fce25390f973363a5b27596167861d2d6eab0f61856eb2ba389b031a9f19f669c0bd4dd601185828d3cebafd25431be7a1696f2ce3ef68
+  languageName: node
+  linkType: hard
+
 "@babel/helper-remap-async-to-generator@npm:^7.14.5, @babel/helper-remap-async-to-generator@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-remap-async-to-generator@npm:7.15.4"
@@ -1518,6 +1647,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-replace-supers@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-replace-supers@npm:7.24.7"
+  dependencies:
+    "@babel/helper-environment-visitor": ^7.24.7
+    "@babel/helper-member-expression-to-functions": ^7.24.7
+    "@babel/helper-optimise-call-expression": ^7.24.7
+  peerDependencies:
+    "@babel/core": ^7.0.0
+  checksum: 2bf0d113355c60d86a04e930812d36f5691f26c82d4ec1739e5ec0a4c982c9113dad3167f7c74f888a96328bd5e696372232406d8200e5979e6e0dc2af5e7c76
+  languageName: node
+  linkType: hard
+
 "@babel/helper-simple-access@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-simple-access@npm:7.15.4"
@@ -1563,6 +1705,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-simple-access@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-simple-access@npm:7.24.7"
+  dependencies:
+    "@babel/traverse": ^7.24.7
+    "@babel/types": ^7.24.7
+  checksum: ddbf55f9dea1900213f2a1a8500fabfd21c5a20f44dcfa957e4b0d8638c730f88751c77f678644f754f1a1dc73f4eb8b766c300deb45a9daad000e4247957819
+  languageName: node
+  linkType: hard
+
 "@babel/helper-skip-transparent-expression-wrappers@npm:^7.14.5, @babel/helper-skip-transparent-expression-wrappers@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-skip-transparent-expression-wrappers@npm:7.15.4"
@@ -1581,6 +1733,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-skip-transparent-expression-wrappers@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-skip-transparent-expression-wrappers@npm:7.24.7"
+  dependencies:
+    "@babel/traverse": ^7.24.7
+    "@babel/types": ^7.24.7
+  checksum: 11b28fe534ce2b1a67c4d8e51a7b5711a2a0a0cae802f74614eee54cca58c744d9a62f6f60103c41759e81c537d270bfd665bf368a6bea214c6052f2094f8407
+  languageName: node
+  linkType: hard
+
 "@babel/helper-split-export-declaration@npm:^7.12.13":
   version: 7.12.13
   resolution: "@babel/helper-split-export-declaration@npm:7.12.13"
@@ -1626,6 +1788,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-split-export-declaration@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-split-export-declaration@npm:7.24.7"
+  dependencies:
+    "@babel/types": ^7.24.7
+  checksum: e3ddc91273e5da67c6953f4aa34154d005a00791dc7afa6f41894e768748540f6ebcac5d16e72541aea0c89bee4b89b4da6a3d65972a0ea8bfd2352eda5b7e22
+  languageName: node
+  linkType: hard
+
 "@babel/helper-string-parser@npm:^7.18.10":
   version: 7.18.10
   resolution: "@babel/helper-string-parser@npm:7.18.10"
@@ -1661,6 +1832,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-string-parser@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-string-parser@npm:7.24.7"
+  checksum: 09568193044a578743dd44bf7397940c27ea693f9812d24acb700890636b376847a611cdd0393a928544e79d7ad5b8b916bd8e6e772bc8a10c48a647a96e7b1a
+  languageName: node
+  linkType: hard
+
 "@babel/helper-validator-identifier@npm:^7.10.4, @babel/helper-validator-identifier@npm:^7.12.11":
   version: 7.12.11
   resolution: "@babel/helper-validator-identifier@npm:7.12.11"
@@ -1710,6 +1888,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-validator-identifier@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-validator-identifier@npm:7.24.7"
+  checksum: 6799ab117cefc0ecd35cd0b40ead320c621a298ecac88686a14cffceaac89d80cdb3c178f969861bf5fa5e4f766648f9161ea0752ecfe080d8e89e3147270257
+  languageName: node
+  linkType: hard
+
 "@babel/helper-validator-option@npm:^7.12.17":
   version: 7.12.17
   resolution: "@babel/helper-validator-option@npm:7.12.17"
@@ -1745,6 +1930,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/helper-validator-option@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/helper-validator-option@npm:7.24.7"
+  checksum: 9689166bf3f777dd424c026841c8cd651e41b21242dbfd4569a53086179a3e744c8eddd56e9d10b54142270141c91581b53af0d7c00c82d552d2540e2a919f7e
+  languageName: node
+  linkType: hard
+
 "@babel/helper-wrap-function@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/helper-wrap-function@npm:7.15.4"
@@ -1924,6 +2116,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/highlight@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/highlight@npm:7.24.7"
+  dependencies:
+    "@babel/helper-validator-identifier": ^7.24.7
+    chalk: ^2.4.2
+    js-tokens: ^4.0.0
+    picocolors: ^1.0.0
+  checksum: 5cd3a89f143671c4ac129960024ba678b669e6fc673ce078030f5175002d1d3d52bc10b22c5b916a6faf644b5028e9a4bd2bb264d053d9b05b6a98690f1d46f1
+  languageName: node
+  linkType: hard
+
 "@babel/parser@npm:^7.1.0":
   version: 7.12.11
   resolution: "@babel/parser@npm:7.12.11"
@@ -2005,6 +2209,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/parser@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/parser@npm:7.24.7"
+  bin:
+    parser: ./bin/babel-parser.js
+  checksum: fc9d2c4c8712f89672edc55c0dc5cf640dcec715b56480f111f85c2bc1d507e251596e4110d65796690a96ac37a4b60432af90b3e97bb47e69d4ef83872dbbd6
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-bugfix-firefox-class-in-computed-class-key@npm:^7.24.5":
   version: 7.24.5
   resolution: "@babel/plugin-bugfix-firefox-class-in-computed-class-key@npm:7.24.5"
@@ -2658,6 +2871,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-syntax-jsx@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/plugin-syntax-jsx@npm:7.24.7"
+  dependencies:
+    "@babel/helper-plugin-utils": ^7.24.7
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 7a5ca629d8ca1e1ee78705a78e58c12920d07ed8006d7e7232b31296a384ff5e41d7b649bde5561196041037bbb9f9715be1d1c20975df87ca204f34ad15b965
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-syntax-jsx@npm:^7.7.2":
   version: 7.18.6
   resolution: "@babel/plugin-syntax-jsx@npm:7.18.6"
@@ -2790,6 +3014,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-syntax-typescript@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/plugin-syntax-typescript@npm:7.24.7"
+  dependencies:
+    "@babel/helper-plugin-utils": ^7.24.7
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 56fe84f3044ecbf038977281648db6b63bd1301f2fff6595820dc10ee276c1d1586919d48d52a8d497ecae32c958be38f42c1c8d174dc58aad856c516dc5b35a
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-syntax-typescript@npm:^7.7.2":
   version: 7.18.6
   resolution: "@babel/plugin-syntax-typescript@npm:7.18.6"
@@ -3697,6 +3932,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-transform-modules-commonjs@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/plugin-transform-modules-commonjs@npm:7.24.7"
+  dependencies:
+    "@babel/helper-module-transforms": ^7.24.7
+    "@babel/helper-plugin-utils": ^7.24.7
+    "@babel/helper-simple-access": ^7.24.7
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: bfda2a0297197ed342e2a02e5f9847a489a3ae40a4a7d7f00f4aeb8544a85e9006e0c5271c8f61f39bc97975ef2717b5594cf9486694377a53433162909d64c1
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-transform-modules-systemjs@npm:^7.15.4":
   version: 7.15.4
   resolution: "@babel/plugin-transform-modules-systemjs@npm:7.15.4"
@@ -4614,6 +4862,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/plugin-transform-typescript@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/plugin-transform-typescript@npm:7.24.7"
+  dependencies:
+    "@babel/helper-annotate-as-pure": ^7.24.7
+    "@babel/helper-create-class-features-plugin": ^7.24.7
+    "@babel/helper-plugin-utils": ^7.24.7
+    "@babel/plugin-syntax-typescript": ^7.24.7
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 6b367d1e3d6bdbe438878a76436fc6903e2b4fd7c31fa036d43865570d282679ec3f7c0306399851f2866a9b36686a0ea8c343df3750f70d427f1fe20ca54310
+  languageName: node
+  linkType: hard
+
 "@babel/plugin-transform-unicode-escapes@npm:^7.14.5":
   version: 7.14.5
   resolution: "@babel/plugin-transform-unicode-escapes@npm:7.14.5"
@@ -5111,6 +5373,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/preset-typescript@npm:^7.17.12":
+  version: 7.24.7
+  resolution: "@babel/preset-typescript@npm:7.24.7"
+  dependencies:
+    "@babel/helper-plugin-utils": ^7.24.7
+    "@babel/helper-validator-option": ^7.24.7
+    "@babel/plugin-syntax-jsx": ^7.24.7
+    "@babel/plugin-transform-modules-commonjs": ^7.24.7
+    "@babel/plugin-transform-typescript": ^7.24.7
+  peerDependencies:
+    "@babel/core": ^7.0.0-0
+  checksum: 12929b24757f3bd6548103475f86478eda4c872bc7cefd920b29591eee8f4a4f350561d888e133d632d0c9402b8615fdcec9138e5127a6567dcb22f804ff207f
+  languageName: node
+  linkType: hard
+
 "@babel/preset-typescript@npm:^7.23.0, @babel/preset-typescript@npm:^7.24.1":
   version: 7.24.1
   resolution: "@babel/preset-typescript@npm:7.24.1"
@@ -5294,6 +5571,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/template@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/template@npm:7.24.7"
+  dependencies:
+    "@babel/code-frame": ^7.24.7
+    "@babel/parser": ^7.24.7
+    "@babel/types": ^7.24.7
+  checksum: ea90792fae708ddf1632e54c25fe1a86643d8c0132311f81265d2bdbdd42f9f4fac65457056c1b6ca87f7aa0d6a795b549566774bba064bdcea2034ab3960ee9
+  languageName: node
+  linkType: hard
+
 "@babel/traverse@npm:^7.13.0":
   version: 7.13.17
   resolution: "@babel/traverse@npm:7.13.17"
@@ -5417,6 +5705,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/traverse@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/traverse@npm:7.24.7"
+  dependencies:
+    "@babel/code-frame": ^7.24.7
+    "@babel/generator": ^7.24.7
+    "@babel/helper-environment-visitor": ^7.24.7
+    "@babel/helper-function-name": ^7.24.7
+    "@babel/helper-hoist-variables": ^7.24.7
+    "@babel/helper-split-export-declaration": ^7.24.7
+    "@babel/parser": ^7.24.7
+    "@babel/types": ^7.24.7
+    debug: ^4.3.1
+    globals: ^11.1.0
+  checksum: 7cd366afe9e7ee77e493779fdf24f67bf5595247289364f4689e29688572505eaeb886d7a8f20ebb9c29fc2de7d0895e4ff9e203e78e39ac67239724d45aa83b
+  languageName: node
+  linkType: hard
+
 "@babel/types@npm:^7.0.0, @babel/types@npm:^7.12.10, @babel/types@npm:^7.3.0, @babel/types@npm:^7.4.4":
   version: 7.12.12
   resolution: "@babel/types@npm:7.12.12"
@@ -5525,6 +5831,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/types@npm:^7.24.7":
+  version: 7.24.7
+  resolution: "@babel/types@npm:7.24.7"
+  dependencies:
+    "@babel/helper-string-parser": ^7.24.7
+    "@babel/helper-validator-identifier": ^7.24.7
+    to-fast-properties: ^2.0.0
+  checksum: 3e4437fced97e02982972ce5bebd318c47d42c9be2152c0fd28c6f786cc74086cc0a8fb83b602b846e41df37f22c36254338eada1a47ef9d8a1ec92332ca3ea8
+  languageName: node
+  linkType: hard
+
 "@base2/pretty-print-object@npm:1.0.1":
   version: 1.0.1
   resolution: "@base2/pretty-print-object@npm:1.0.1"
@@ -8654,6 +8971,7 @@ __metadata:
     react-native-ble-plx: ^2.0.3
     react-native-code-push: ^8.2.1
     react-native-device-info: ^10.11.0
+    react-native-draggable-flatlist: ^4.0.1
     react-native-exception-handler: ^2.10.10
     react-native-fs: ^2.20.0
     react-native-gesture-handler: 2.16.0
@@ -35974,6 +36292,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-native-draggable-flatlist@npm:^4.0.1":
+  version: 4.0.1
+  resolution: "react-native-draggable-flatlist@npm:4.0.1"
+  dependencies:
+    "@babel/preset-typescript": ^7.17.12
+  peerDependencies:
+    react-native: ">=0.64.0"
+    react-native-gesture-handler: ">=2.0.0"
+    react-native-reanimated: ">=2.8.0"
+  checksum: f904e3f30737a883b683e12e119856188e81d7b6cd8811e38124353630391326385bec040a3c200a06535bcd4bbbe973e504c2e0546f7aa4cc96aa573787813d
+  languageName: node
+  linkType: hard
+
 "react-native-exception-handler@npm:^2.10.10":
   version: 2.10.10
   resolution: "react-native-exception-handler@npm:2.10.10"