diff --git a/src/components/Nft/NftCard.js b/src/components/Nft/NftCard.tsx
similarity index 79%
rename from src/components/Nft/NftCard.js
rename to src/components/Nft/NftCard.tsx
index c1a4b76b30..674180fef8 100644
--- a/src/components/Nft/NftCard.js
+++ b/src/components/Nft/NftCard.tsx
@@ -5,32 +5,30 @@ import { RectButton } from "react-native-gesture-handler";
 import { View, StyleSheet, Platform } from "react-native";
 import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
 import { useTheme, useNavigation } from "@react-navigation/native";
-import type { CollectionWithNFT, NFT } from "@ledgerhq/live-common/lib/nft";
-import { ScreenName } from "../../const";
+import { ProtoNFT } from "@ledgerhq/live-common/lib/types";
+import { NFTResource } from "@ledgerhq/live-common/lib/nft/NftMetadataProvider/types";
+import { NavigatorName, ScreenName } from "../../const";
 import Skeleton from "../Skeleton";
 import NftImage from "./NftImage";
 import LText from "../LText";
 
 type Props = {
-  nft: NFT | $Diff<NFT, { collection: * }>,
-  collection: CollectionWithNFT,
-  style?: Object,
+  nft: ProtoNFT;
+  style?: Object;
 };
 
 const NftCardView = ({
   nft,
-  collection,
   style,
   status,
   metadata,
 }: {
-  nft: NFT | $Diff<NFT, { collection: * }>,
-  collection: CollectionWithNFT,
-  style?: Object,
-  status: "queued" | "loading" | "loaded" | "error" | "nodata",
-  metadata?: Object,
+  nft: ProtoNFT;
+  style?: Object;
+  status: NFTResource["status"];
+  metadata?: Object;
 }) => {
-  const amount = nft.amount.toFixed();
+  const amount = nft?.amount?.toFixed();
   const { colors } = useTheme();
   const navigation = useNavigation();
   const loading = status === "loading";
@@ -45,9 +43,11 @@ const NftCardView = ({
           },
         ]}
         onPress={() => {
-          navigation.navigate(ScreenName.NftViewer, {
-            nft,
-            collection,
+          navigation.navigate(NavigatorName.NftNavigator, {
+            screen: ScreenName.NftViewer,
+            params: {
+              nft,
+            },
           });
         }}
       >
@@ -71,7 +71,7 @@ const NftCardView = ({
             ellipsizeMode="middle"
             numberOfLines={1}
           >
-            ID {nft.tokenId}
+            ID {nft?.tokenId}
           </LText>
           {amount > 1 ? (
             <LText
@@ -92,17 +92,15 @@ const NftCardView = ({
 const NftCardMemo = memo(NftCardView);
 // this technique of splitting the usage of context and memoing the presentational component is used to prevent
 // the rerender of all NftCards whenever the NFT cache changes (whenever a new NFT is loaded)
-const NftCard = ({ nft, collection, style }: Props) => {
-  const { status, metadata } = useNftMetadata(collection.contract, nft.tokenId);
+const NftCard = ({ nft, style }: Props) => {
+  const { status, metadata } = useNftMetadata(
+    nft?.contract,
+    nft?.tokenId,
+    nft?.currencyId,
+  );
 
   return (
-    <NftCardMemo
-      nft={nft}
-      collection={collection}
-      style={style}
-      status={status}
-      metadata={metadata}
-    />
+    <NftCardMemo nft={nft} style={style} status={status} metadata={metadata} />
   );
 };
 
diff --git a/src/components/Nft/NftCollectionRow.tsx b/src/components/Nft/NftCollectionRow.tsx
index 7c142f0319..634121e07f 100644
--- a/src/components/Nft/NftCollectionRow.tsx
+++ b/src/components/Nft/NftCollectionRow.tsx
@@ -1,25 +1,35 @@
-import React from "react";
+import React, { memo } from "react";
 import { StyleSheet } from "react-native";
 import { RectButton } from "react-native-gesture-handler";
 import {
+  useNftCollectionMetadata,
   useNftMetadata,
-  CollectionWithNFT,
 } from "@ledgerhq/live-common/lib/nft";
+import { ProtoNFT } from "@ledgerhq/live-common/lib/types";
 import { Flex, Text } from "@ledgerhq/native-ui";
 import { useTheme } from "styled-components/native";
 import Skeleton from "../Skeleton";
 import NftImage from "./NftImage";
 
 type Props = {
-  collection: CollectionWithNFT;
+  collection: ProtoNFT[];
   onCollectionPress: () => void;
 };
 
 function NftCollectionRow({ collection, onCollectionPress }: Props) {
   const { colors } = useTheme();
-  const { contract, nfts } = collection;
-  const { status, metadata } = useNftMetadata(contract, nfts[0].tokenId);
-  const loading = status === "loading";
+  const nft = collection[0];
+  const { status: nftStatus, metadata: nftMetadata } = useNftMetadata(
+    nft?.contract,
+    nft?.tokenId,
+    nft?.currencyId,
+  );
+  const {
+    status: collectionStatus,
+    metadata: collectionMetadata,
+  } = useNftCollectionMetadata(nft?.contract, nft?.currencyId);
+
+  const loading = nftStatus === "loading" || collectionStatus === "loading";
 
   return (
     <RectButton
@@ -30,8 +40,8 @@ function NftCollectionRow({ collection, onCollectionPress }: Props) {
       <Flex accessible flexDirection={"row"} alignItems={"center"} py={6}>
         <NftImage
           style={styles.collectionImage}
-          status={status}
-          src={metadata?.media}
+          status={nftStatus}
+          src={nftMetadata?.media}
         />
         <Flex flexGrow={1} flexShrink={1} ml={6} flexDirection={"column"}>
           <Skeleton style={styles.collectionNameSkeleton} loading={loading}>
@@ -41,7 +51,7 @@ function NftCollectionRow({ collection, onCollectionPress }: Props) {
               ellipsizeMode="tail"
               numberOfLines={2}
             >
-              {metadata?.tokenName || collection.contract}
+              {collectionMetadata?.tokenName || nft?.contract}
             </Text>
           </Skeleton>
         </Flex>
@@ -51,14 +61,14 @@ function NftCollectionRow({ collection, onCollectionPress }: Props) {
           color={"neutral.c70"}
           ml={5}
         >
-          {collection.nfts.length}
+          {collection?.length}
         </Text>
       </Flex>
     </RectButton>
   );
 }
 
-export default NftCollectionRow;
+export default memo(NftCollectionRow);
 
 const styles = StyleSheet.create({
   container: {
diff --git a/src/components/Nft/NftImage.js b/src/components/Nft/NftImage.tsx
similarity index 70%
rename from src/components/Nft/NftImage.js
rename to src/components/Nft/NftImage.tsx
index 94059e8a8a..b40cf13210 100644
--- a/src/components/Nft/NftImage.js
+++ b/src/components/Nft/NftImage.tsx
@@ -1,41 +1,30 @@
-// @flow
-
 import React, { useState } from "react";
-
-import FastImage from "react-native-fast-image";
-import { Image, View, StyleSheet, Animated } from "react-native";
+import FastImage, {
+  OnLoadEvent,
+  FastImageProps,
+} from "react-native-fast-image";
+import { View, StyleSheet, Animated } from "react-native";
 import ImageNotFoundIcon from "../../icons/ImageNotFound";
 import { withTheme } from "../../colors";
 import Skeleton from "../Skeleton";
 
 const ImageComponent = ({
-  style,
-  source,
-  resizeMode,
-  onLoadEnd,
-  onLoad,
+  ...props
 }: {
-  style: Object,
-  source: { [string]: string },
-  resizeMode: string,
-  onLoadEnd: () => *,
-  onLoad: () => *,
-}) => (
-  <FastImage
-    style={style}
-    resizeMode={FastImage.resizeMode[resizeMode]}
-    source={source}
-    onLoad={onLoad}
-    onLoadEnd={onLoadEnd}
-  />
-);
+  style: Object;
+} & FastImageProps) =>
+  typeof props?.source === "object" && props?.source?.uri ? (
+    <FastImage {...props} />
+  ) : (
+    <></>
+  );
 
 const NotFound = ({
   colors,
   onLayout,
 }: {
-  colors: Object,
-  onLayout: () => *,
+  colors: Object;
+  onLayout: () => void;
 }) => {
   const [iconWidth, setIconWidth] = useState(40);
 
@@ -58,20 +47,22 @@ const NotFound = ({
 };
 
 type Props = {
-  style?: Object,
-  status: string,
-  src: string,
-  resizeMode?: string,
-  colors: any,
+  style?: Object;
+  status: string;
+  src: string;
+  resizeMode?: string;
+  colors: any;
 };
 
 type State = {
-  loadError: boolean,
+  loadError: boolean;
 };
 
 class NftImage extends React.PureComponent<Props, State> {
   state = {
+    beforeLoadDone: false,
     loadError: false,
+    contentType: null,
   };
 
   opacityAnim = new Animated.Value(0);
@@ -84,10 +75,24 @@ class NftImage extends React.PureComponent<Props, State> {
     }).start();
   };
 
+  onLoad = ({ nativeEvent }: OnLoadEvent) => {
+    if (!nativeEvent) {
+      this.setState({ loadError: true });
+    }
+  };
+
+  onError = () => {
+    this.setState({ loadError: true });
+  };
+
   render() {
     const { style, status, src, colors, resizeMode = "cover" } = this.props;
     const { loadError } = this.state;
 
+    const noData = status === "nodata";
+    const metadataError = status === "error";
+    const noSource = status === "loaded" && !src;
+
     return (
       <View style={[style, styles.root]}>
         <Skeleton style={styles.skeleton} loading={true} />
@@ -99,10 +104,7 @@ class NftImage extends React.PureComponent<Props, State> {
             },
           ]}
         >
-          {status === "nodata" ||
-          status === "error" ||
-          (status === "loaded" && !src) ||
-          loadError ? (
+          {noData || metadataError || noSource || loadError ? (
             <NotFound colors={colors} onLayout={this.startAnimation} />
           ) : (
             <ImageComponent
@@ -116,13 +118,9 @@ class NftImage extends React.PureComponent<Props, State> {
               source={{
                 uri: src,
               }}
-              onLoad={({ nativeEvent }: Image.ImageLoadEvent) => {
-                if (!nativeEvent) {
-                  this.setState({ loadError: true });
-                }
-              }}
+              onLoad={this.onLoad}
               onLoadEnd={this.startAnimation}
-              onError={() => this.setState({ loadError: true })}
+              onError={this.onError}
             />
           )}
         </Animated.View>
diff --git a/src/components/Nft/NftImageViewer.js b/src/components/Nft/NftImageViewer.tsx
similarity index 84%
rename from src/components/Nft/NftImageViewer.js
rename to src/components/Nft/NftImageViewer.tsx
index b23ec9f36a..cd276eeaca 100644
--- a/src/components/Nft/NftImageViewer.js
+++ b/src/components/Nft/NftImageViewer.tsx
@@ -1,6 +1,4 @@
-// @flow
-
-import React from "react";
+import React, { memo } from "react";
 import { View, StyleSheet } from "react-native";
 import NftImage from "./NftImage";
 
@@ -8,13 +6,13 @@ import NftImage from "./NftImage";
 
 type Props = {
   route: {
-    params?: RouteParams,
-  },
+    params?: RouteParams;
+  };
 };
 
 type RouteParams = {
-  media: string,
-  status: string,
+  media: string;
+  status: string;
 };
 
 const NftViewer = ({ route }: Props) => {
@@ -47,4 +45,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default NftViewer;
+export default memo(NftViewer);
diff --git a/src/components/Nft/NftLinksPanel.js b/src/components/Nft/NftLinksPanel.tsx
similarity index 72%
rename from src/components/Nft/NftLinksPanel.js
rename to src/components/Nft/NftLinksPanel.tsx
index 384a178922..07d1b7d610 100644
--- a/src/components/Nft/NftLinksPanel.js
+++ b/src/components/Nft/NftLinksPanel.tsx
@@ -1,11 +1,8 @@
-// @flow
-
-import React from "react";
+import React, { memo } from "react";
 import { useTranslation } from "react-i18next";
 import { useTheme } from "@react-navigation/native";
-import type { NFTMetadata } from "@ledgerhq/live-common/lib/nft";
+import { NFTMetadata } from "@ledgerhq/live-common/lib/types";
 import { View, StyleSheet, TouchableOpacity, Linking } from "react-native";
-
 import ExternalLinkIcon from "../../icons/ExternalLink";
 import OpenSeaIcon from "../../icons/OpenSea";
 import RaribleIcon from "../../icons/Rarible";
@@ -15,9 +12,9 @@ import { rgba } from "../../colors";
 import LText from "../LText";
 
 type Props = {
-  links: $PropertyType<NFTMetadata, "links">,
-  isOpen: boolean,
-  onClose: () => void,
+  links: NFTMetadata["links"] | null;
+  isOpen: boolean;
+  onClose: () => void;
 };
 
 const NftLink = ({
@@ -28,12 +25,12 @@ const NftLink = ({
   subtitle,
   onPress,
 }: {
-  style?: Object,
-  leftIcon: React$Node,
-  rightIcon?: React$Node,
-  title: string,
-  subtitle?: string,
-  onPress?: () => any,
+  style?: Object;
+  leftIcon: React$Node;
+  rightIcon?: React$Node;
+  title: string;
+  subtitle?: string;
+  onPress?: () => any;
 }) => (
   <TouchableOpacity style={[styles.section, style]} onPress={onPress}>
     <View style={styles.sectionBody}>
@@ -65,7 +62,7 @@ const NftLinksPanel = ({ links, isOpen, onClose }: Props) => {
       isOpened={isOpen}
       onClose={onClose}
     >
-      {!links.opensea ? null : (
+      {!links?.opensea ? null : (
         <NftLink
           style={styles.sectionMargin}
           leftIcon={<OpenSeaIcon size={36} />}
@@ -75,7 +72,7 @@ const NftLinksPanel = ({ links, isOpen, onClose }: Props) => {
         />
       )}
 
-      {!links.rarible ? null : (
+      {!links?.rarible ? null : (
         <NftLink
           leftIcon={<RaribleIcon size={36} />}
           title={`${t("nft.viewerModal.viewOn")} Rarible`}
@@ -84,23 +81,27 @@ const NftLinksPanel = ({ links, isOpen, onClose }: Props) => {
         />
       )}
 
-      <View style={styles.hr} />
+      {!links?.explorer ? null : (
+        <>
+          <View style={styles.hr} />
 
-      <NftLink
-        leftIcon={
-          <View
-            style={[
-              styles.roundIconContainer,
-              { backgroundColor: rgba(colors.live, 0.1) },
-            ]}
-          >
-            <GlobeIcon size={16} color={colors.live} />
-          </View>
-        }
-        title={t("nft.viewerModal.viewInExplorer")}
-        rightIcon={<ExternalLinkIcon size={20} color={colors.grey} />}
-        onPress={() => Linking.openURL(links.etherscan)}
-      />
+          <NftLink
+            leftIcon={
+              <View
+                style={[
+                  styles.roundIconContainer,
+                  { backgroundColor: rgba(colors.live, 0.1) },
+                ]}
+              >
+                <GlobeIcon size={16} color={colors.live} />
+              </View>
+            }
+            title={t("nft.viewerModal.viewInExplorer")}
+            rightIcon={<ExternalLinkIcon size={20} color={colors.grey} />}
+            onPress={() => Linking.openURL(links.explorer)}
+          />
+        </>
+      )}
     </BottomModal>
   );
 };
@@ -152,4 +153,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default NftLinksPanel;
+export default memo(NftLinksPanel);
diff --git a/src/components/Nft/NftViewer.js b/src/components/Nft/NftViewer.tsx
similarity index 81%
rename from src/components/Nft/NftViewer.js
rename to src/components/Nft/NftViewer.tsx
index acb7e36fc1..6a5a28a1cb 100644
--- a/src/components/Nft/NftViewer.js
+++ b/src/components/Nft/NftViewer.tsx
@@ -1,5 +1,3 @@
-// @flow
-
 import React, { useMemo, useState, useCallback } from "react";
 
 import {
@@ -9,21 +7,22 @@ import {
   Platform,
   TouchableOpacity,
 } from "react-native";
+import {
+  useNftMetadata,
+  decodeNftId,
+  getNftCapabilities,
+  useNftCollectionMetadata,
+} from "@ledgerhq/live-common/lib/nft";
 import { BigNumber } from "bignumber.js";
 import { useSelector } from "react-redux";
+import { Button, Icons } from "@ledgerhq/native-ui";
 import { useTranslation, Trans } from "react-i18next";
+import { ProtoNFT } from "@ledgerhq/live-common/lib/types";
 import { useNavigation, useTheme } from "@react-navigation/native";
 import { getAccountBridge } from "@ledgerhq/live-common/lib/bridge";
-import { useNftMetadata, decodeNftId } from "@ledgerhq/live-common/lib/nft";
-
-import type { NFT, CollectionWithNFT } from "@ledgerhq/live-common/lib/nft";
-import Clipboard from "@react-native-community/clipboard";
-
-import { Button, Icons } from "@ledgerhq/native-ui";
-
 import { accountSelector } from "../../reducers/accounts";
-import NftLinksPanel from "./NftLinksPanel";
 import { ScreenName, NavigatorName } from "../../const";
+import NftLinksPanel from "./NftLinksPanel";
 import { rgba } from "../../colors";
 import Skeleton from "../Skeleton";
 import NftImage from "./NftImage";
@@ -31,13 +30,12 @@ import LText from "../LText";
 
 type Props = {
   route: {
-    params: RouteParams,
-  },
+    params: RouteParams;
+  };
 };
 
 type RouteParams = {
-  nft: NFT,
-  collection: CollectionWithNFT,
+  nft: ProtoNFT;
 };
 
 const Section = ({
@@ -48,12 +46,12 @@ const Section = ({
   copyAvailable,
   copiedString,
 }: {
-  title: string,
-  value?: any,
-  style?: Object,
-  children?: React$Node,
-  copyAvailable?: boolean,
-  copiedString?: string,
+  title: string;
+  value?: any;
+  style?: Object;
+  children?: React$Node;
+  copyAvailable?: boolean;
+  copiedString?: string;
 }) => {
   const [copied, setCopied] = useState(false);
   const [timeoutFunction, setTimeoutFunction] = useState(null);
@@ -101,23 +99,27 @@ const Section = ({
 
 const NftViewer = ({ route }: Props) => {
   const { params } = route;
-  const { nft, collection } = params;
-  const { status, metadata } = useNftMetadata(collection.contract, nft.tokenId);
+  const { nft } = params;
+  const { status: nftStatus, metadata: nftMetadata } = useNftMetadata(
+    nft?.contract,
+    nft?.tokenId,
+    nft?.currencyId,
+  );
+  const {
+    status: collectionStatus,
+    metadata: collectionMetadata,
+  } = useNftCollectionMetadata(nft?.contract, nft?.currencyId);
   const { colors } = useTheme();
   const { t } = useTranslation();
   const navigation = useNavigation();
 
-  const { accountId } = decodeNftId(nft.id);
+  const { accountId } = decodeNftId(nft?.id);
   const account = useSelector(state => accountSelector(state, { accountId }));
 
   const [bottomModalOpen, setBottomModalOpen] = useState(false);
-  const isLoading = status === "loading";
+  const isLoading = nftStatus === "loading" || collectionStatus === "loading";
 
-  const defaultLinks = {
-    opensea: `https://opensea.io/assets/${collection.contract}/${nft.tokenId}`,
-    rarible: `https://rarible.com/token/${collection.contract}:${nft.tokenId}`,
-    etherscan: `https://etherscan.io/token/${collection.contract}?a=${nft.tokenId}`,
-  };
+  const nftCapabilities = useMemo(() => getNftCapabilities(nft), [nft]);
 
   const closeModal = () => {
     setBottomModalOpen(false);
@@ -128,10 +130,11 @@ const NftViewer = ({ route }: Props) => {
 
     let transaction = bridge.createTransaction(account);
     transaction = bridge.updateTransaction(transaction, {
-      tokenIds: [nft.tokenId],
-      quantities: [BigNumber(1)],
-      collection: collection.contract,
-      mode: `${collection.standard?.toLowerCase()}.transfer`,
+      tokenIds: [nft?.tokenId],
+      // Quantity is set to null first to allow the user to change it on the amount page
+      quantities: [nftCapabilities.hasQuantity ? null : new BigNumber(1)],
+      collection: nft?.contract,
+      mode: `${nft?.standard?.toLowerCase()}.transfer`,
     });
 
     navigation.navigate(NavigatorName.SendFunds, {
@@ -142,7 +145,7 @@ const NftViewer = ({ route }: Props) => {
         transaction,
       },
     });
-  }, [account, nft, collection, navigation]);
+  }, [account, nft, nftCapabilities.hasQuantity, navigation]);
 
   const properties = useMemo(() => {
     if (isLoading) {
@@ -164,14 +167,14 @@ const NftViewer = ({ route }: Props) => {
       );
     }
 
-    if (metadata?.properties?.length) {
+    if (nftMetadata?.properties?.length) {
       return (
         <ScrollView
           showsHorizontalScrollIndicator={false}
           horizontal={true}
           contentContainerStyle={styles.properties}
         >
-          {metadata?.properties?.map?.((prop, i) => (
+          {nftMetadata?.properties?.map?.((prop, i) => (
             <View
               style={[
                 styles.property,
@@ -192,7 +195,7 @@ const NftViewer = ({ route }: Props) => {
     }
 
     return null;
-  }, [colors, isLoading, metadata]);
+  }, [colors, isLoading, nftMetadata]);
 
   const description = useMemo(() => {
     if (isLoading) {
@@ -205,19 +208,19 @@ const NftViewer = ({ route }: Props) => {
       );
     }
 
-    if (metadata?.description) {
-      return <LText>{metadata.description}</LText>;
+    if (nftMetadata?.description) {
+      return <LText>{nftMetadata.description}</LText>;
     }
 
     return null;
-  }, [isLoading, metadata]);
+  }, [isLoading, nftMetadata]);
 
   const nftImage = (
     <NftImage
       resizeMode="contain"
       style={styles.image}
-      src={metadata?.media}
-      status={status}
+      src={nftMetadata?.media}
+      status={nftStatus}
     />
   );
 
@@ -229,7 +232,9 @@ const NftViewer = ({ route }: Props) => {
             style={[styles.tokenName, styles.tokenNameSkeleton]}
             loading={isLoading}
           >
-            <LText style={styles.tokenName}>{metadata?.tokenName || "-"}</LText>
+            <LText style={styles.tokenName}>
+              {collectionMetadata?.tokenName || "-"}
+            </LText>
           </Skeleton>
 
           <Skeleton
@@ -237,18 +242,18 @@ const NftViewer = ({ route }: Props) => {
             loading={isLoading}
           >
             <LText style={styles.nftName} numberOfLines={3} semiBold>
-              {metadata?.nftName || "-"}
+              {nftMetadata?.nftName || "-"}
             </LText>
           </Skeleton>
 
           <View style={styles.imageContainer}>
-            {metadata?.media ? (
+            {nftMetadata?.media ? (
               <TouchableOpacity
                 onPress={() =>
                   navigation.navigate(NavigatorName.NftNavigator, {
                     screen: ScreenName.NftImageViewer,
                     params: {
-                      media: metadata.media,
+                      media: nftMetadata.media,
                     },
                   })
                 }
@@ -271,13 +276,15 @@ const NftViewer = ({ route }: Props) => {
                 <Trans i18nKey="account.send" />
               </Button>
             </View>
-            <View style={styles.ellipsisButtonContainer}>
-              <Button
-                type="main"
-                Icon={Icons.OthersMedium}
-                onPress={() => setBottomModalOpen(true)}
-              />
-            </View>
+            {nftMetadata?.links && (
+              <View style={styles.ellipsisButtonContainer}>
+                <Button
+                  type="main"
+                  Icon={Icons.OthersMedium}
+                  onPress={() => setBottomModalOpen(true)}
+                />
+              </View>
+            )}
           </View>
         </View>
 
@@ -306,7 +313,7 @@ const NftViewer = ({ route }: Props) => {
 
           <Section
             title={t("nft.viewer.tokenContract")}
-            value={collection.contract}
+            value={nft?.contract}
             copyAvailable
             copiedString={t("nft.viewer.tokenContractCopied")}
           />
@@ -315,18 +322,18 @@ const NftViewer = ({ route }: Props) => {
 
           <Section
             title={t("nft.viewer.tokenId")}
-            value={nft.tokenId}
+            value={nft?.tokenId}
             copyAvailable
             copiedString={t("nft.viewer.tokenIdCopied")}
           />
 
-          {collection.standard === "ERC1155" && (
+          {nft?.standard === "ERC1155" && (
             <>
               <View style={styles.hr} />
               <TouchableOpacity onPress={closeModal}>
                 <Section
                   title={t("nft.viewer.quantity")}
-                  value={nft.amount.toFixed()}
+                  value={nft?.amount?.toFixed()}
                 />
               </TouchableOpacity>
             </>
@@ -334,11 +341,7 @@ const NftViewer = ({ route }: Props) => {
         </View>
       </ScrollView>
       <NftLinksPanel
-        links={
-          metadata && Object.keys(metadata?.links)?.length
-            ? metadata.links
-            : defaultLinks
-        }
+        links={nftMetadata?.links}
         isOpen={bottomModalOpen}
         onClose={closeModal}
       />
diff --git a/src/components/OperationRowNftName.tsx b/src/components/OperationRowNftName.tsx
index bff4a182af..f160db42ec 100644
--- a/src/components/OperationRowNftName.tsx
+++ b/src/components/OperationRowNftName.tsx
@@ -1,8 +1,9 @@
-import React from "react";
+import React, { memo } from "react";
 
 import { Operation } from "@ledgerhq/live-common/lib/types";
 import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
-import { StyleSheet } from "react-native";
+import { decodeAccountId } from "@ledgerhq/live-common/lib/account";
+import { View, StyleSheet } from "react-native";
 import { Text } from "@ledgerhq/native-ui";
 import Skeleton from "./Skeleton";
 
@@ -12,14 +13,16 @@ type Props = {
 };
 
 const OperationRowNftName = ({ style, operation }: Props) => {
+  const { currencyId } = decodeAccountId(operation.accountId);
   const { status, metadata } = useNftMetadata(
     operation.contract,
     operation.tokenId,
+    currencyId,
   );
 
   return (
-    <>
-      <Skeleton style={[styles.skeleton]} loading={status === "loading"}>
+    <View style={style}>
+      <Skeleton style={styles.skeleton} loading={status === "loading"}>
         <Text
           numberOfLines={1}
           ellipsizeMode="tail"
@@ -38,7 +41,7 @@ const OperationRowNftName = ({ style, operation }: Props) => {
       >
         ID {operation.tokenId}
       </Text>
-    </>
+    </View>
   );
 };
 
@@ -48,6 +51,13 @@ const styles = StyleSheet.create({
     width: 120,
     borderRadius: 4,
   },
+  nftName: {
+    fontSize: 15,
+    marginBottom: 4,
+  },
+  tokenId: {
+    fontSize: 12,
+  },
 });
 
-export default OperationRowNftName;
+export default memo(OperationRowNftName);
diff --git a/src/components/RootNavigator/BaseNavigator.tsx b/src/components/RootNavigator/BaseNavigator.tsx
index 4f3007aa9f..11be691a2a 100644
--- a/src/components/RootNavigator/BaseNavigator.tsx
+++ b/src/components/RootNavigator/BaseNavigator.tsx
@@ -545,11 +545,7 @@ export default function BaseNavigator() {
       <Stack.Screen
         name={NavigatorName.NftNavigator}
         component={NftNavigator}
-        options={({ navigation }) => ({
-          title: null,
-          headerRight: null,
-          headerLeft: () => <CloseButton navigation={navigation} />,
-        })}
+        options={{ headerShown: false }}
       />
       <Stack.Screen
         name={NavigatorName.Accounts}
diff --git a/src/components/RootNavigator/NftNavigator.js b/src/components/RootNavigator/NftNavigator.tsx
similarity index 99%
rename from src/components/RootNavigator/NftNavigator.js
rename to src/components/RootNavigator/NftNavigator.tsx
index 8ccc1b8a5d..7def41bc9a 100644
--- a/src/components/RootNavigator/NftNavigator.js
+++ b/src/components/RootNavigator/NftNavigator.tsx
@@ -1,5 +1,3 @@
-// @flow
-
 import React, { useMemo } from "react";
 import { useTheme } from "styled-components/native";
 import { createStackNavigator } from "@react-navigation/stack";
diff --git a/src/components/Skeleton.js b/src/components/Skeleton.tsx
similarity index 83%
rename from src/components/Skeleton.js
rename to src/components/Skeleton.tsx
index 98c3d7f44f..0b35b6c089 100644
--- a/src/components/Skeleton.js
+++ b/src/components/Skeleton.tsx
@@ -1,20 +1,18 @@
-// @flow
-
-import React, { memo, useRef, useEffect, useMemo } from "react";
+import React, { memo, useRef, useEffect, useMemo, ReactElement } from "react";
 import { Animated } from "react-native";
 import { useTheme } from "@react-navigation/native";
 
 type Props = {
-  style?: any,
-  loading: boolean,
-  children?: React$Node,
-  animated?: boolean,
+  style?: any;
+  loading: boolean;
+  children?: ReactElement;
+  animated?: boolean;
 };
 
 const Skeleton = ({
   style,
   loading,
-  children = null,
+  children = <></>,
   animated = true,
 }: Props) => {
   const { colors } = useTheme();
@@ -58,4 +56,4 @@ const Skeleton = ({
   return loading ? <Animated.View style={animatedStyle} /> : children;
 };
 
-export default memo<Props>(Skeleton);
+export default memo(Skeleton);
diff --git a/src/locales/en/common.json b/src/locales/en/common.json
index 5136fc7dc7..2dc9eebacd 100644
--- a/src/locales/en/common.json
+++ b/src/locales/en/common.json
@@ -400,6 +400,9 @@
     "NotEnoughBalanceInParentAccount": {
       "title": "Insufficient balance in the parent account"
     },
+    "QuantityNeedsToBePositive": {
+      "title": "Quantity needs to be at least 1"
+    },
     "NotEnoughSpendableBalance": {
       "title": "Balance cannot be below {{minimumAmount}}"
     },
diff --git a/src/screens/Account/NftCollectionsList.tsx b/src/screens/Account/NftCollectionsList.tsx
index f669cd06fa..883823f0ab 100644
--- a/src/screens/Account/NftCollectionsList.tsx
+++ b/src/screens/Account/NftCollectionsList.tsx
@@ -4,11 +4,9 @@ import take from "lodash/take";
 import { Trans, useTranslation } from "react-i18next";
 import useEnv from "@ledgerhq/live-common/lib/hooks/useEnv";
 import { nftsByCollections } from "@ledgerhq/live-common/lib/nft";
-import { useNavigation, useTheme } from "@react-navigation/native";
+import { useNavigation } from "@react-navigation/native";
 import { StyleSheet, View, FlatList } from "react-native";
-
-import { Account } from "@ledgerhq/live-common/lib/types";
-
+import { Account, ProtoNFT } from "@ledgerhq/live-common/lib/types";
 import { Box, Text } from "@ledgerhq/native-ui";
 import {
   ArrowBottomMedium,
@@ -16,13 +14,11 @@ import {
 } from "@ledgerhq/native-ui/assets/icons";
 import NftCollectionRow from "../../components/Nft/NftCollectionRow";
 import { NavigatorName, ScreenName } from "../../const";
-import Link from "../../components/wrappedUi/Link";
 import Button from "../../components/wrappedUi/Button";
+import Link from "../../components/wrappedUi/Link";
 
 const MAX_COLLECTIONS_TO_SHOW = 3;
 
-const collectionKeyExtractor = (o: any) => o.contract;
-
 type Props = {
   account: Account;
 };
@@ -31,11 +27,15 @@ export default function NftCollectionsList({ account }: Props) {
   useEnv("HIDE_EMPTY_TOKEN_ACCOUNTS");
 
   const { t } = useTranslation();
-  const { colors } = useTheme();
   const navigation = useNavigation();
   const { nfts } = account;
-  const nftCollections = useMemo(() => nftsByCollections(nfts), [nfts]);
-  const data = take(nftCollections, MAX_COLLECTIONS_TO_SHOW);
+  const nftCollections = useMemo(() => nftsByCollections(nfts), [
+    nfts,
+  ]) as Record<string, ProtoNFT[]>;
+  const data = useMemo(
+    () => take(Object.values(nftCollections), MAX_COLLECTIONS_TO_SHOW),
+    [nftCollections],
+  );
 
   const navigateToReceive = useCallback(
     () =>
@@ -48,28 +48,19 @@ export default function NftCollectionsList({ account }: Props) {
     [account.id, navigation],
   );
 
-  // Forced to use useCallback here to avoid a non sensical warning...
   const navigateToCollection = useCallback(
     collection =>
-      navigation.navigate(NavigatorName.PortfolioAccounts, {
-        screen: ScreenName.NftCollection,
-        params: {
-          collection,
-          accountId: account.id,
-        },
-        initial: false,
+      navigation.navigate(ScreenName.NftCollection, {
+        collection,
+        accountId: account.id,
       }),
     [account.id, navigation],
   );
 
   const navigateToGallery = useCallback(() => {
-    navigation.navigate(NavigatorName.PortfolioAccounts, {
-      screen: ScreenName.NftGallery,
-      params: {
-        title: t("nft.gallery.allNft"),
-        accountId: account.id,
-      },
-      initial: false,
+    navigation.navigate(ScreenName.NftGallery, {
+      title: t("nft.gallery.allNft"),
+      accountId: account.id,
     });
   }, [account.id, navigation, t]);
 
@@ -104,11 +95,11 @@ export default function NftCollectionsList({ account }: Props) {
         <Trans i18nKey="nft.account.seeAllNfts" />
       </Button>
     ),
-    [colors, navigateToGallery, nftCollections.length],
+    [navigateToGallery],
   );
 
   const renderItem = useCallback(
-    ({ item, index }) => (
+    ({ item, index }: { item: ProtoNFT[]; index: number }) => (
       <Box
         borderBottomWidth={data.length - 1 !== index ? "1px" : 0}
         borderBottomColor={"neutral.c40"}
@@ -122,20 +113,13 @@ export default function NftCollectionsList({ account }: Props) {
     [data.length, navigateToCollection],
   );
 
-  const listFooterComponent = useMemo(
-    () =>
-      nftCollections.length > MAX_COLLECTIONS_TO_SHOW ? renderFooter : null,
-    [nftCollections.length, renderFooter],
-  );
-
   return (
     <View style={styles.collectionList}>
       <FlatList
         data={data}
         renderItem={renderItem}
-        keyExtractor={collectionKeyExtractor}
         ListHeaderComponent={renderHeader}
-        ListFooterComponent={listFooterComponent}
+        ListFooterComponent={renderFooter}
       />
     </View>
   );
diff --git a/src/screens/Nft/NftCollection/NftCollectionHeaderTitle.js b/src/screens/Nft/NftCollection/NftCollectionHeaderTitle.tsx
similarity index 51%
rename from src/screens/Nft/NftCollection/NftCollectionHeaderTitle.js
rename to src/screens/Nft/NftCollection/NftCollectionHeaderTitle.tsx
index 70569c91d2..02326100a3 100644
--- a/src/screens/Nft/NftCollection/NftCollectionHeaderTitle.js
+++ b/src/screens/Nft/NftCollection/NftCollectionHeaderTitle.tsx
@@ -1,18 +1,30 @@
-/* @flow */
-import React from "react";
+import React, { memo } from "react";
 import { TouchableWithoutFeedback, View, StyleSheet } from "react-native";
-import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
-import { useRoute, useTheme } from "@react-navigation/native";
+import {
+  useNftMetadata,
+  useNftCollectionMetadata,
+} from "@ledgerhq/live-common/lib/nft";
+import { useRoute, useTheme, RouteProp } from "@react-navigation/native";
+import { ProtoNFT } from "@ledgerhq/live-common/lib/types";
 import { scrollToTop } from "../../../navigation/utils";
 import NftImage from "../../../components/Nft/NftImage";
 import LText from "../../../components/LText";
 
+type RouteParams = RouteProp<{ params: { collection: ProtoNFT[] } }, "params">;
+
 const NftCollectionHeaderTitle = () => {
-  const { params } = useRoute();
+  const { params } = useRoute<RouteParams>();
   const { colors } = useTheme();
-  const { status, metadata } = useNftMetadata(
-    params.collection.contract,
-    params.collection.nfts[0].tokenId,
+  const { collection } = params;
+  const nft = collection?.[0];
+  const { status: nftStatus, metadata: nftMetadata } = useNftMetadata(
+    nft?.contract,
+    nft?.tokenId,
+    nft?.currencyId,
+  );
+  const { metadata: collectionMetadata } = useNftCollectionMetadata(
+    nft?.contract,
+    nft?.currencyId,
   );
 
   return (
@@ -26,20 +38,18 @@ const NftCollectionHeaderTitle = () => {
         ]}
       >
         <NftImage
-          height={24}
-          width={24}
           style={styles.headerImage}
-          src={metadata?.media}
-          status={status}
+          src={nftMetadata?.media}
+          status={nftStatus}
         />
         <LText
-          ellipsizeMode={metadata?.tokenName ? "tail" : "middle"}
+          ellipsizeMode={collectionMetadata?.tokenName ? "tail" : "middle"}
           semiBold
           secondary
           numberOfLines={1}
           style={styles.title}
         >
-          {metadata?.tokenName || params.collection.contract}
+          {collectionMetadata?.tokenName || nft?.contract}
         </LText>
       </View>
     </TouchableWithoutFeedback>
@@ -59,8 +69,11 @@ const styles = StyleSheet.create({
   },
   headerImage: {
     borderRadius: 4,
+    overflow: "hidden",
     marginRight: 12,
+    width: 24,
+    height: 24,
   },
 });
 
-export default NftCollectionHeaderTitle;
+export default memo(NftCollectionHeaderTitle);
diff --git a/src/screens/Nft/NftCollection/index.js b/src/screens/Nft/NftCollection/index.tsx
similarity index 84%
rename from src/screens/Nft/NftCollection/index.js
rename to src/screens/Nft/NftCollection/index.tsx
index 1eb38b6f1d..07dd08a112 100644
--- a/src/screens/Nft/NftCollection/index.js
+++ b/src/screens/Nft/NftCollection/index.tsx
@@ -1,6 +1,4 @@
-// @flow
-
-import React, { useState, useRef, useCallback, useMemo } from "react";
+import React, { useState, useRef, useCallback, useMemo, memo } from "react";
 
 import {
   View,
@@ -15,11 +13,8 @@ import { useTranslation } from "react-i18next";
 import { useNavigation, useTheme } from "@react-navigation/native";
 import { groupAccountOperationsByDay } from "@ledgerhq/live-common/lib/account";
 import Animated, { Value, event } from "react-native-reanimated";
-
-import type { SectionBase } from "react-native/Libraries/Lists/SectionList";
-import type { CollectionWithNFT, NFT } from "@ledgerhq/live-common/lib/nft";
-import type { Operation } from "@ledgerhq/live-common/lib/types";
-
+import { SectionBase } from "react-native/Libraries/Lists/SectionList";
+import { Operation, ProtoNFT } from "@ledgerhq/live-common/lib/types";
 import NoMoreOperationFooter from "../../../components/NoMoreOperationFooter";
 import { accountScreenSelector } from "../../../reducers/accounts";
 import LoadingFooter from "../../../components/LoadingFooter";
@@ -35,15 +30,15 @@ const MAX_NFT_FIRST_RENDER = 12;
 const NFTS_TO_ADD_ON_LIST_END_REACHED = 6;
 
 type Props = {
-  navigation: any,
-  route: RouteParams,
+  navigation: any;
+  route: RouteParams;
 };
 
 type RouteParams = {
   params: {
-    accountId: string,
-    collection: CollectionWithNFT,
-  },
+    accountId: string;
+    collection: ProtoNFT[];
+  };
 };
 
 const NftList = Animated.createAnimatedComponent(FlatList);
@@ -57,7 +52,10 @@ const NftCollection = ({ route }: Props) => {
   const navigation = useNavigation();
   const { t } = useTranslation();
   const { colors } = useTheme();
-  const { params } = route;
+  const {
+    params: { collection },
+  } = route;
+  const nft = collection[0];
   const { account, parentAccount } = useSelector(accountScreenSelector(route));
   const scrollY = useRef(new Value(0)).current;
   const onScroll = () =>
@@ -74,16 +72,16 @@ const NftCollection = ({ route }: Props) => {
 
   // nfts' list related -----
   const [nftCount, setNftCount] = useState(MAX_NFT_FIRST_RENDER);
-  const nfts = useMemo(() => params.collection.nfts.slice(0, nftCount), [
+  const nfts = useMemo(() => collection?.slice(0, nftCount), [
     nftCount,
-    params.collection,
+    collection,
   ]);
   const sendToken = () => {
     navigation.navigate(NavigatorName.SendFunds, {
       screen: ScreenName.SendNft,
       params: {
         account,
-        collection: params.collection,
+        collection,
       },
     });
   };
@@ -93,7 +91,6 @@ const NftCollection = ({ route }: Props) => {
       <NftCard
         key={item.id}
         nft={item}
-        collection={params.collection}
         style={{
           maxWidth: "50%",
           paddingLeft: index % 2 !== 0 ? 8 : 0,
@@ -101,12 +98,12 @@ const NftCollection = ({ route }: Props) => {
         }}
       />
     ),
-    [params.collection],
+    [],
   );
 
   const renderNftListFooter = useCallback(
-    () => (params.collection.nfts.length > nftCount ? <LoadingFooter /> : null),
-    [params.collection.nfts.length, nftCount],
+    () => (collection?.length > nftCount ? <LoadingFooter /> : null),
+    [collection?.length, nftCount],
   );
 
   const onNftsEndReached = useCallback(() => {
@@ -115,12 +112,10 @@ const NftCollection = ({ route }: Props) => {
 
   // operations' list related -----
   const [opCount, setOpCount] = useState(100);
-  const { sections, completed } = groupAccountOperationsByDay(account, {
+  const { sections, completed } = groupAccountOperationsByDay(account!, {
     count: opCount,
     filterOperation: op =>
-      op?.nftOperations?.find(
-        op => op?.contract === params?.collection?.contract,
-      ),
+      !!op?.nftOperations?.find(op => op?.contract === nft?.contract),
   });
 
   const renderOperationItem = useCallback(
@@ -129,9 +124,9 @@ const NftCollection = ({ route }: Props) => {
       index,
       section,
     }: {
-      item: Operation,
-      index: number,
-      section: SectionBase<any>,
+      item: Operation;
+      index: number;
+      section: SectionBase<any>;
     }) => {
       if (!account) return null;
 
@@ -165,7 +160,7 @@ const NftCollection = ({ route }: Props) => {
       <NftList
         data={nfts}
         numColumns={2}
-        keyExtractor={(nft: NFT) => nft.id}
+        keyExtractor={(n: ProtoNFT) => n.id}
         renderItem={renderNftItem}
         onEndReached={onNftsEndReached}
         onScroll={onScroll}
@@ -249,4 +244,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default withDiscreetMode(NftCollection);
+export default memo(withDiscreetMode(NftCollection));
diff --git a/src/screens/Nft/NftGallery/NftCollectionWithName.js b/src/screens/Nft/NftGallery/NftCollectionWithName.tsx
similarity index 64%
rename from src/screens/Nft/NftGallery/NftCollectionWithName.js
rename to src/screens/Nft/NftGallery/NftCollectionWithName.tsx
index cf67272a11..c5a1ad5345 100644
--- a/src/screens/Nft/NftGallery/NftCollectionWithName.js
+++ b/src/screens/Nft/NftGallery/NftCollectionWithName.tsx
@@ -1,37 +1,32 @@
-// @flow
-
-import React, { useCallback, memo } from "react";
-import type { NFT, CollectionWithNFT } from "@ledgerhq/live-common/lib/nft";
+import React, { memo } from "react";
+import { useNftCollectionMetadata } from "@ledgerhq/live-common/lib/nft";
 import { FlatList, View, SafeAreaView, StyleSheet } from "react-native";
-import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
+import { ProtoNFT, NFTMetadata } from "@ledgerhq/live-common/lib/types";
+import { NFTResource } from "@ledgerhq/live-common/lib/nft/NftMetadataProvider/types";
 import NftCard from "../../../components/Nft/NftCard";
 import Skeleton from "../../../components/Skeleton";
 import LText from "../../../components/LText";
 
+const renderItem = ({ item, index }: { item: ProtoNFT; index: number }) => (
+  <NftCard
+    key={item.id}
+    nft={item}
+    style={index % 2 === 0 ? evenNftCardStyles : oddNftCardStyles}
+  />
+);
+
 const NftCollectionWithNameList = ({
-  collectionWithNfts,
+  collection,
   contentContainerStyle,
   status,
   metadata,
 }: {
-  collectionWithNfts: CollectionWithNFT,
-  contentContainerStyle?: Object,
-  status: "queued" | "loading" | "loaded" | "error" | "nodata",
-  metadata?: Object,
+  collection: ProtoNFT[];
+  contentContainerStyle?: Object;
+  status: NFTResource["status"];
+  metadata?: NFTMetadata;
 }) => {
-  const { contract, nfts } = collectionWithNfts;
-
-  const renderItem = useCallback(
-    ({ item, index }) => (
-      <NftCard
-        key={item.id}
-        nft={item}
-        collection={collectionWithNfts}
-        style={index % 2 === 0 ? evenNftCardStyles : oddNftCardStyles}
-      />
-    ),
-    [collectionWithNfts],
-  );
+  const nft = collection?.[0] || {};
 
   return (
     <SafeAreaView style={contentContainerStyle}>
@@ -46,12 +41,12 @@ const NftCollectionWithNameList = ({
             semiBold
             style={styles.tokenName}
           >
-            {metadata?.tokenName || contract}
+            {metadata?.tokenName || nft?.contract}
           </LText>
         </Skeleton>
       </View>
       <FlatList
-        data={nfts}
+        data={collection}
         keyExtractor={nftKeyExtractor}
         scrollEnabled={false}
         numColumns={2}
@@ -65,20 +60,23 @@ const NftCollectionWithNameMemo = memo(NftCollectionWithNameList);
 // this technique of splitting the usage of context and memoing the presentational component is used to prevent
 // the rerender of all Nft Collections whenever the NFT cache changes (whenever a new NFT is loaded)
 type Props = {
-  collectionWithNfts: CollectionWithNFT,
-  contentContainerStyle?: Object,
+  collection: ProtoNFT[];
+  contentContainerStyle?: Object;
 };
 
 const NftCollectionWithName = ({
-  collectionWithNfts,
+  collection,
   contentContainerStyle,
 }: Props) => {
-  const { contract, nfts } = collectionWithNfts;
-  const { status, metadata } = useNftMetadata(contract, nfts?.[0]?.tokenId);
+  const nft: ProtoNFT | null = collection[0];
+  const { status, metadata } = useNftCollectionMetadata(
+    nft?.contract,
+    nft?.currencyId,
+  );
 
   return (
     <NftCollectionWithNameMemo
-      collectionWithNfts={collectionWithNfts}
+      collection={collection}
       contentContainerStyle={contentContainerStyle}
       status={status}
       metadata={metadata}
@@ -86,7 +84,7 @@ const NftCollectionWithName = ({
   );
 };
 
-const nftKeyExtractor = (nft: NFT) => nft.id;
+const nftKeyExtractor = (nft: ProtoNFT) => nft?.id;
 
 const styles = StyleSheet.create({
   title: {
diff --git a/src/screens/Nft/NftGallery/NftGalleryHeaderTitle.js b/src/screens/Nft/NftGallery/NftGalleryHeaderTitle.tsx
similarity index 92%
rename from src/screens/Nft/NftGallery/NftGalleryHeaderTitle.js
rename to src/screens/Nft/NftGallery/NftGalleryHeaderTitle.tsx
index 447f750dfb..792cfe1e01 100644
--- a/src/screens/Nft/NftGallery/NftGalleryHeaderTitle.js
+++ b/src/screens/Nft/NftGallery/NftGalleryHeaderTitle.tsx
@@ -1,5 +1,4 @@
-/* @flow */
-import React from "react";
+import React, { memo } from "react";
 import { TouchableWithoutFeedback, View, StyleSheet } from "react-native";
 import { useRoute, useTheme } from "@react-navigation/native";
 import { scrollToTop } from "../../../navigation/utils";
@@ -40,4 +39,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default NftGalleryHeaderTitle;
+export default memo(NftGalleryHeaderTitle);
diff --git a/src/screens/Nft/NftGallery/index.js b/src/screens/Nft/NftGallery/index.tsx
similarity index 88%
rename from src/screens/Nft/NftGallery/index.js
rename to src/screens/Nft/NftGallery/index.tsx
index 2559d54f0a..5190d3f42a 100644
--- a/src/screens/Nft/NftGallery/index.js
+++ b/src/screens/Nft/NftGallery/index.tsx
@@ -1,39 +1,38 @@
 // @flow
 
-import React, { useState, useMemo, useCallback, useRef } from "react";
-
-import { useSelector } from "react-redux";
-import { useTranslation } from "react-i18next";
-import Animated, { Value, event } from "react-native-reanimated";
-import { nftsByCollections } from "@ledgerhq/live-common/lib/nft";
-import type { CollectionWithNFT } from "@ledgerhq/live-common/lib/nft";
-import { useNavigation, useRoute, useTheme } from "@react-navigation/native";
+import React, { useState, useMemo, useCallback, useRef, memo } from "react";
 import {
   View,
   FlatList,
   SafeAreaView,
   StyleSheet,
   Platform,
+  ListRenderItemInfo,
 } from "react-native";
-
+import { useSelector } from "react-redux";
+import { useTranslation } from "react-i18next";
+import { ProtoNFT } from "@ledgerhq/live-common/lib/types";
+import Animated, { Value, event } from "react-native-reanimated";
+import { nftsByCollections } from "@ledgerhq/live-common/lib/nft";
+import { useNavigation, useRoute, useTheme } from "@react-navigation/native";
+import { withDiscreetMode } from "../../../context/DiscreetModeContext";
 import LoadingFooter from "../../../components/LoadingFooter";
 import { accountSelector } from "../../../reducers/accounts";
 import NftCollectionWithName from "./NftCollectionWithName";
 import { NavigatorName, ScreenName } from "../../../const";
 import Button from "../../../components/Button";
 import SendIcon from "../../../icons/Send";
-import { withDiscreetMode } from "../../../context/DiscreetModeContext";
 
 const MAX_COLLECTIONS_FIRST_RENDER = 12;
 const COLLECTIONS_TO_ADD_ON_LIST_END_REACHED = 6;
 
 const CollectionsList = Animated.createAnimatedComponent(FlatList);
 
-const renderItem = ({ item: collection }) => (
+const renderItem = ({ item: collection }: ListRenderItemInfo<ProtoNFT[]>) => (
   <View style={styles.collectionContainer}>
     <NftCollectionWithName
-      key={collection.contract}
-      collectionWithNfts={collection}
+      key={collection?.[0]?.contract}
+      collection={collection}
     />
   </View>
 );
@@ -65,8 +64,8 @@ const NftGallery = () => {
   const collections = useMemo(() => nftsByCollections(account.nfts), [
     account.nfts,
   ]);
-  const collectionsSlice = useMemo(
-    () => collections.slice(0, collectionsCount),
+  const collectionsSlice: Array<ProtoNFT[]> = useMemo(
+    () => Object.values(collections).slice(0, collectionsCount),
     [collections, collectionsCount],
   );
 
@@ -81,7 +80,6 @@ const NftGallery = () => {
       screen: ScreenName.SendCollection,
       params: {
         account,
-        collections,
       },
     });
 
@@ -98,7 +96,6 @@ const NftGallery = () => {
       <CollectionsList
         data={collectionsSlice}
         contentContainerStyle={styles.collectionsList}
-        keyExtractor={(collection: CollectionWithNFT) => collection.contract}
         renderItem={renderItem}
         onEndReached={onEndReached}
         onScroll={onScroll}
@@ -154,4 +151,4 @@ const styles = StyleSheet.create({
     borderRadius: 100,
   },
 });
-export default withDiscreetMode(NftGallery);
+export default memo(withDiscreetMode(NftGallery));
diff --git a/src/screens/OperationDetails/Content.js b/src/screens/OperationDetails/Content.js
index 9d8042a8cf..fcc908237c 100644
--- a/src/screens/OperationDetails/Content.js
+++ b/src/screens/OperationDetails/Content.js
@@ -5,23 +5,24 @@ import uniq from "lodash/uniq";
 import { useSelector } from "react-redux";
 import { Trans, useTranslation } from "react-i18next";
 import { useNavigation, useTheme } from "@react-navigation/native";
-import type {
+import {
   Account,
   Operation,
   AccountLike,
 } from "@ledgerhq/live-common/lib/types";
 import {
-  getOperationAmountNumber,
-  isConfirmedOperation,
-  getOperationConfirmationDisplayableNumber,
-} from "@ledgerhq/live-common/lib/operation";
-import {
+  decodeAccountId,
   getMainAccount,
   getAccountCurrency,
   getAccountUnit,
   getAccountName,
 } from "@ledgerhq/live-common/lib/account";
-import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
+import {
+  getOperationAmountNumber,
+  isConfirmedOperation,
+  getOperationConfirmationDisplayableNumber,
+} from "@ledgerhq/live-common/lib/operation";
+import { useNftCollectionMetadata } from "@ledgerhq/live-common/lib/nft";
 import { NavigatorName, ScreenName } from "../../const";
 import LText from "../../components/LText";
 import OperationIcon from "../../components/OperationIcon";
@@ -76,9 +77,10 @@ export default function Content({
   const navigation = useNavigation();
   const { t } = useTranslation();
   const [isModalOpened, setIsModalOpened] = useState(false);
-  const { status, metadata } = useNftMetadata(
+  const { currencyId } = decodeAccountId(operation.accountId);
+  const { status, metadata } = useNftCollectionMetadata(
     operation.contract,
-    operation.tokenId,
+    currencyId,
   );
 
   const onPress = useCallback(() => {
diff --git a/src/screens/SendFunds/01b-SelectCollection.js b/src/screens/SendFunds/01b-SelectCollection.tsx
similarity index 74%
rename from src/screens/SendFunds/01b-SelectCollection.js
rename to src/screens/SendFunds/01b-SelectCollection.tsx
index 2a5704107b..dda5ff8b1b 100644
--- a/src/screens/SendFunds/01b-SelectCollection.js
+++ b/src/screens/SendFunds/01b-SelectCollection.tsx
@@ -1,8 +1,6 @@
 // @flow
 import React, { useCallback, useMemo, useState, memo } from "react";
 
-import { useNavigation, useTheme } from "@react-navigation/native";
-import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
 import {
   View,
   StyleSheet,
@@ -11,10 +9,13 @@ import {
   TouchableOpacity,
   Platform,
 } from "react-native";
-
-import type { Account } from "@ledgerhq/live-common/lib/types";
-import type { CollectionWithNFT } from "@ledgerhq/live-common/lib/nft";
-
+import {
+  nftsByCollections,
+  useNftCollectionMetadata,
+  useNftMetadata,
+} from "@ledgerhq/live-common/lib/nft";
+import { useNavigation, useTheme } from "@react-navigation/native";
+import { Account, ProtoNFT } from "@ledgerhq/live-common/lib/types";
 import LoadingFooter from "../../components/LoadingFooter";
 import NftImage from "../../components/Nft/NftImage";
 import Skeleton from "../../components/Skeleton";
@@ -26,22 +27,22 @@ const MAX_COLLECTIONS_FIRST_RENDER = 8;
 const COLLECTIONS_TO_ADD_ON_LIST_END_REACHED = 8;
 
 const CollectionRow = memo(
-  ({
-    account,
-    collection,
-  }: {
-    account: Account,
-    collection: CollectionWithNFT,
-  }) => {
+  ({ account, collection }: { account: Account; collection: ProtoNFT[] }) => {
     const navigation = useNavigation();
     const { colors } = useTheme();
-    const { status, metadata } = useNftMetadata(
-      collection?.contract,
-      collection?.nfts?.[0]?.tokenId,
+    const nft: ProtoNFT | null = collection[0];
+    const { status: nftStatus, metadata: nftMetadata } = useNftMetadata(
+      nft?.contract,
+      nft?.tokenId,
+      nft?.currencyId,
+    );
+    const { metadata: collectionMetadata } = useNftCollectionMetadata(
+      nft?.contract,
+      nft?.currencyId,
     );
 
     const goToNftSelection = () => {
-      navigation.push(ScreenName.SendNft, {
+      navigation.navigate(ScreenName.SendNft, {
         account,
         collection,
       });
@@ -52,16 +53,16 @@ const CollectionRow = memo(
         <View style={styles.nftImageContainer}>
           <NftImage
             style={styles.nftImage}
-            src={metadata?.media}
-            status={status}
+            src={nftMetadata?.media}
+            status={nftStatus}
           />
         </View>
         <View style={styles.tokenNameContainer}>
           <Skeleton
             style={[styles.tokenNameSkeleton, styles.tokenName]}
-            loading={status === "loading"}
+            loading={nftStatus === "loading"}
           >
-            <LText>{metadata?.tokenName || collection.contract}</LText>
+            <LText>{collectionMetadata?.tokenName || nft?.contract}</LText>
           </Skeleton>
         </View>
         <View style={styles.chevronContainer}>
@@ -72,27 +73,29 @@ const CollectionRow = memo(
   },
 );
 
-const keyExtractor = (collection: CollectionWithNFT) => collection?.contract;
+const keyExtractor = (collection: ProtoNFT[]) => collection?.[0]?.contract;
 
 type Props = {
   route: {
     params: {
-      account: Account,
-      collections: CollectionWithNFT[],
-    },
-  },
+      account: Account;
+    };
+  };
 };
 
 const SendFundsSelectCollection = ({ route }: Props) => {
   const { params } = route;
-  const { account, collections } = params;
+  const { account } = params;
   const { colors } = useTheme();
 
   const [collectionCount, setCollectionCount] = useState(
     MAX_COLLECTIONS_FIRST_RENDER,
   );
+  const collections = useMemo(() => nftsByCollections(account.nfts), [
+    account.nfts,
+  ]);
   const collectionsSlice = useMemo(
-    () => collections.slice(0, collectionCount),
+    () => Object.values(collections).slice(0, collectionCount),
     [collections, collectionCount],
   );
   const onEndReached = useCallback(
@@ -104,7 +107,7 @@ const SendFundsSelectCollection = ({ route }: Props) => {
   );
 
   const renderItem = useCallback(
-    ({ item }: { item: CollectionWithNFT }) => (
+    ({ item }: { item: ProtoNFT[] }) => (
       <CollectionRow account={account} collection={item} />
     ),
     [account],
@@ -186,4 +189,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default SendFundsSelectCollection;
+export default memo(SendFundsSelectCollection);
diff --git a/src/screens/SendFunds/01c-SelectNft.js b/src/screens/SendFunds/01c-SelectNft.tsx
similarity index 51%
rename from src/screens/SendFunds/01c-SelectNft.js
rename to src/screens/SendFunds/01c-SelectNft.tsx
index f9ce86ba87..be88a4a67c 100644
--- a/src/screens/SendFunds/01c-SelectNft.js
+++ b/src/screens/SendFunds/01c-SelectNft.tsx
@@ -1,9 +1,12 @@
-// @flow
 import React, { useCallback, useMemo, useState, memo } from "react";
 
+import {
+  useNftMetadata,
+  getNftCapabilities,
+} from "@ledgerhq/live-common/lib/nft";
 import { BigNumber } from "bignumber.js";
-import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
 import { useNavigation, useTheme } from "@react-navigation/native";
+import { Account, ProtoNFT } from "@ledgerhq/live-common/lib/types";
 import { getAccountBridge } from "@ledgerhq/live-common/lib/bridge";
 import {
   View,
@@ -13,10 +16,6 @@ import {
   TouchableOpacity,
   Platform,
 } from "react-native";
-
-import type { Account } from "@ledgerhq/live-common/lib/types";
-import type { NFT, CollectionWithNFT } from "@ledgerhq/live-common/lib/nft";
-
 import LoadingFooter from "../../components/LoadingFooter";
 import NftImage from "../../components/Nft/NftImage";
 import Skeleton from "../../components/Skeleton";
@@ -26,93 +25,87 @@ import { ScreenName } from "../../const";
 const MAX_NFTS_FIRST_RENDER = 8;
 const NFTS_TO_ADD_ON_LIST_END_REACHED = 8;
 
-const NftRow = memo(
-  ({
-    account,
-    collection,
-    nft,
-  }: {
-    account: Account,
-    collection: CollectionWithNFT,
-    nft: NFT,
-  }) => {
-    const navigation = useNavigation();
-    const { colors } = useTheme();
-    const { status, metadata } = useNftMetadata(
-      collection.contract,
-      nft.tokenId,
-    );
-
-    const goToRecipientSelection = useCallback(() => {
-      const bridge = getAccountBridge(account);
-
-      let transaction = bridge.createTransaction(account);
-      transaction = bridge.updateTransaction(transaction, {
-        tokenIds: [nft.tokenId],
-        quantities: [BigNumber(1)],
-        collection: collection.contract,
-        mode: `${collection.standard?.toLowerCase()}.transfer`,
-      });
-
-      navigation.navigate(ScreenName.SendSelectRecipient, {
-        accountId: account.id,
-        parentId: account.parentId,
-        transaction,
-      });
-    }, [account, nft, collection, navigation]);
-
-    return (
-      <TouchableOpacity style={styles.nftRow} onPress={goToRecipientSelection}>
-        <View style={styles.nftImageContainer}>
-          <NftImage
-            style={styles.nftImage}
-            src={metadata?.media}
-            status={status}
-          />
-        </View>
-        <View style={styles.nftNameContainer}>
-          <Skeleton
-            style={[styles.nftNameSkeleton, styles.nftName]}
-            loading={status === "loading"}
-          >
-            <LText
-              style={styles.nftName}
-              semiBold
-              numberOfLines={1}
-              ellipsizeMode="tail"
-            >
-              {metadata?.nftName || "-"}
-            </LText>
-          </Skeleton>
+const NftRow = memo(({ account, nft }: { account: Account; nft: ProtoNFT }) => {
+  const navigation = useNavigation();
+  const { colors } = useTheme();
+  const { status, metadata } = useNftMetadata(
+    nft?.contract,
+    nft?.tokenId,
+    nft?.currencyId,
+  );
+
+  const nftCapabilities = useMemo(() => getNftCapabilities(nft), [nft]);
+
+  const goToRecipientSelection = useCallback(() => {
+    const bridge = getAccountBridge(account);
+
+    let transaction = bridge.createTransaction(account);
+    transaction = bridge.updateTransaction(transaction, {
+      tokenIds: [nft?.tokenId],
+      // Quantity is set to null first to allow the user to change it on the amount page
+      quantities: [nftCapabilities.hasQuantity ? null : new BigNumber(1)],
+      collection: nft?.contract,
+      mode: `${nft?.standard?.toLowerCase()}.transfer`,
+    });
+
+    navigation.navigate(ScreenName.SendSelectRecipient, {
+      accountId: account.id,
+      parentId: account.parentId,
+      transaction,
+    });
+  }, [account, nft, nftCapabilities.hasQuantity, navigation]);
+
+  return (
+    <TouchableOpacity style={styles.nftRow} onPress={goToRecipientSelection}>
+      <View style={styles.nftImageContainer}>
+        <NftImage
+          style={styles.nftImage}
+          src={metadata?.media}
+          status={status}
+        />
+      </View>
+      <View style={styles.nftNameContainer}>
+        <Skeleton
+          style={[styles.nftNameSkeleton, styles.nftName]}
+          loading={status === "loading"}
+        >
           <LText
+            style={styles.nftName}
+            semiBold
             numberOfLines={1}
-            ellipsizeMode="middle"
-            style={[styles.tokenId, { color: colors.grey }]}
+            ellipsizeMode="tail"
           >
-            ID {nft.tokenId}
+            {metadata?.nftName || "-"}
+          </LText>
+        </Skeleton>
+        <LText
+          numberOfLines={1}
+          ellipsizeMode="middle"
+          style={[styles.tokenId, { color: colors.grey }]}
+        >
+          ID {nft?.tokenId}
+        </LText>
+      </View>
+      {nft?.standard === "ERC1155" ? (
+        <View style={styles.amount}>
+          <LText numberOfLines={1} style={{ color: colors.grey }}>
+            x{nft?.amount?.toFixed()}
           </LText>
         </View>
-        {collection?.standard === "ERC1155" ? (
-          <View style={styles.amount}>
-            <LText numberOfLines={1} style={{ color: colors.grey }}>
-              x{nft.amount.toFixed()}
-            </LText>
-          </View>
-        ) : null}
-      </TouchableOpacity>
-    );
-  },
-);
+      ) : null}
+    </TouchableOpacity>
+  );
+});
 
-const keyExtractor = (nft: NFT) => nft?.tokenId;
+const keyExtractor = (nft: ProtoNFT) => nft?.tokenId;
 
 type Props = {
   route: {
     params: {
-      account: Account,
-      collection: CollectionWithNFT,
-    },
-  },
+      account: Account;
+      collection: ProtoNFT[];
+    };
+  };
 };
 
 const SendFundsSelectNft = ({ route }: Props) => {
@@ -121,8 +114,8 @@ const SendFundsSelectNft = ({ route }: Props) => {
   const { colors } = useTheme();
 
   const [nftCount, setNftCount] = useState(MAX_NFTS_FIRST_RENDER);
-  const nftsSlice = useMemo(() => collection?.nfts?.slice(0, nftCount) || [], [
-    collection.nfts,
+  const nftsSlice = useMemo(() => collection?.slice(0, nftCount) || [], [
+    collection,
     nftCount,
   ]);
   const onEndReached = useCallback(
@@ -131,7 +124,7 @@ const SendFundsSelectNft = ({ route }: Props) => {
   );
 
   const renderItem = useCallback(
-    ({ item }: { item: NFT }) => (
+    ({ item }: { item: ProtoNFT }) => (
       <NftRow account={account} collection={collection} nft={item} />
     ),
     [account, collection],
@@ -149,7 +142,7 @@ const SendFundsSelectNft = ({ route }: Props) => {
         keyExtractor={keyExtractor}
         onEndReached={onEndReached}
         ListFooterComponent={
-          nftCount < collection.nfts?.length ? <LoadingFooter /> : null
+          nftCount < collection?.length ? <LoadingFooter /> : null
         }
       />
     </SafeAreaView>
@@ -217,4 +210,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default SendFundsSelectNft;
+export default memo(SendFundsSelectNft);
diff --git a/src/screens/SendFunds/02-SelectRecipient.js b/src/screens/SendFunds/02-SelectRecipient.js
index a182246749..87f1165659 100644
--- a/src/screens/SendFunds/02-SelectRecipient.js
+++ b/src/screens/SendFunds/02-SelectRecipient.js
@@ -7,6 +7,7 @@ import {
   SyncSkipUnderPriority,
 } from "@ledgerhq/live-common/lib/bridge/react";
 import useBridgeTransaction from "@ledgerhq/live-common/lib/bridge/useBridgeTransaction";
+import { isNftTransaction } from "@ledgerhq/live-common/lib/nft";
 import type { Transaction } from "@ledgerhq/live-common/lib/types";
 import React, { useCallback, useRef, useEffect, useState } from "react";
 import { Trans, useTranslation } from "react-i18next";
@@ -63,9 +64,7 @@ export default function SendSelectRecipient({ navigation, route }: Props) {
 
   const shouldSkipAmount =
     transaction.family === "ethereum" && transaction.mode === "erc721.transfer";
-  const isNftSend = ["erc721.transfer", "erc1155.transfer"].includes(
-    transaction.mode,
-  );
+  const isNftSend = isNftTransaction(transaction);
 
   // handle changes from camera qr code
   const initialTransaction = useRef(transaction);
diff --git a/src/screens/SendFunds/03b-AmountNft.js b/src/screens/SendFunds/03b-AmountNft.tsx
similarity index 89%
rename from src/screens/SendFunds/03b-AmountNft.js
rename to src/screens/SendFunds/03b-AmountNft.tsx
index aa906dcc30..b80e53abbe 100644
--- a/src/screens/SendFunds/03b-AmountNft.js
+++ b/src/screens/SendFunds/03b-AmountNft.tsx
@@ -1,5 +1,4 @@
-// @flow
-import React, { useCallback, useMemo, useEffect } from "react";
+import React, { useCallback, useMemo, memo } from "react";
 
 import {
   View,
@@ -37,7 +36,7 @@ type Props = {
   },
 };
 
-export default function SendAmountNFT({ route }: Props) {
+const SendAmountNFT = ({ route }: Props) => {
   const navigation = useNavigation();
   const { t } = useTranslation();
 
@@ -71,22 +70,18 @@ export default function SendAmountNFT({ route }: Props) {
     },
     [bridge, setTransaction, transaction],
   );
-  // Set the quantity as null as a start to allow the placeholder to appear
-  useEffect(() => {
-    setTransaction(
-      bridge.updateTransaction(transaction, {
-        quantities: [null],
-      }),
-    );
-  }, []);
   const quantity = useMemo(() => transaction.quantities?.[0]?.toNumber(), [
     transaction.quantities,
   ]);
 
-  const nft = account?.nfts?.find(
-    nft =>
-      nft.collection.contract === transaction?.collection &&
-      nft.tokenId === transaction?.tokenIds[0],
+  const nft = useMemo(
+    () =>
+      account?.nfts?.find(
+        nft =>
+          nft?.contract === transaction?.collection &&
+          nft?.tokenId === transaction?.tokenIds[0],
+      ),
+    [account?.nfts, transaction?.collection, transaction?.tokenIds],
   );
 
   const onContinue = useCallback(() => {
@@ -98,8 +93,8 @@ export default function SendAmountNFT({ route }: Props) {
   }, [account, parentAccount, navigation, transaction]);
   const blur = useCallback(() => Keyboard.dismiss(), []);
 
-  const error = (() => {
-    if (status?.warnings?.amount) {
+  const error = useMemo(() => {
+    if (typeof quantity !== "undefined" && status?.warnings?.amount) {
       return (
         <LText style={styles.error} color={"orange"} numberOfLines={2}>
           <TranslatedError error={status?.warnings?.amount} />
@@ -107,7 +102,7 @@ export default function SendAmountNFT({ route }: Props) {
       );
     }
 
-    if (status?.errors?.amount) {
+    if (typeof quantity !== "undefined" && status?.errors?.amount) {
       return (
         <LText style={styles.error} color={"alert"} numberOfLines={2}>
           <TranslatedError error={status?.errors?.amount} />
@@ -116,7 +111,7 @@ export default function SendAmountNFT({ route }: Props) {
     }
 
     return <LText style={styles.error} numberOfLines={2} />;
-  })();
+  }, [status?.errors?.amount, status?.warnings?.amount]);
 
   return (
     <>
@@ -219,3 +214,5 @@ const styles = StyleSheet.create({
     paddingBottom: 16,
   },
 });
+
+export default memo(SendAmountNFT)
\ No newline at end of file
diff --git a/src/screens/SendFunds/04-Summary.js b/src/screens/SendFunds/04-Summary.js
index 6c858dd651..08075eb272 100644
--- a/src/screens/SendFunds/04-Summary.js
+++ b/src/screens/SendFunds/04-Summary.js
@@ -10,6 +10,7 @@ import {
   getMainAccount,
   getAccountCurrency,
 } from "@ledgerhq/live-common/lib/account";
+import { isNftTransaction } from "@ledgerhq/live-common/lib/nft";
 import { NotEnoughGas } from "@ledgerhq/errors";
 import { useTheme } from "@react-navigation/native";
 import { accountScreenSelector } from "../../reducers/accounts";
@@ -79,9 +80,7 @@ function SendSummary({ navigation, route: initialRoute }: Props) {
     parentAccount,
   }));
 
-  const isNFTSend = ["erc721.transfer", "erc1155.transfer"].includes(
-    transaction.mode,
-  );
+  const isNFTSend = isNftTransaction(transaction);
 
   // handle any edit screen changes like fees changes
   useTransactionChangeFromNavigation(setTransaction);
@@ -220,7 +219,10 @@ function SendSummary({ navigation, route: initialRoute }: Props) {
         />
         <SectionSeparator lineColor={colors.lightFog} />
         {isNFTSend ? (
-          <SummaryNft transaction={transaction} />
+          <SummaryNft
+            transaction={transaction}
+            currencyId={account.currency.id}
+          />
         ) : (
           <SummaryAmountSection
             account={account}
diff --git a/src/screens/SendFunds/SummaryNft.js b/src/screens/SendFunds/SummaryNft.tsx
similarity index 83%
rename from src/screens/SendFunds/SummaryNft.js
rename to src/screens/SendFunds/SummaryNft.tsx
index b3bf10d85d..44a6239d1c 100644
--- a/src/screens/SendFunds/SummaryNft.js
+++ b/src/screens/SendFunds/SummaryNft.tsx
@@ -1,24 +1,31 @@
-// @flow
 import React, { memo } from "react";
 
 import { useTranslation } from "react-i18next";
 import { View, StyleSheet } from "react-native";
 import { useTheme } from "@react-navigation/native";
 import { useNftMetadata } from "@ledgerhq/live-common/lib/nft";
-import type { Transaction } from "@ledgerhq/live-common/lib/types";
+import type {
+  Transaction,
+  CryptoCurrency,
+} from "@ledgerhq/live-common/lib/types";
 import LText from "../../components/LText";
 import SummaryRow from "./SummaryRow";
 
 type Props = {
   transaction: Transaction,
+  currencyId: CryptoCurrency["id"],
 };
 
-const SummaryNft = ({ transaction }: Props) => {
+const SummaryNft = ({ transaction, currencyId }: Props) => {
   const { colors } = useTheme();
   const { t } = useTranslation();
   const tokenId = transaction?.tokenIds?.[0];
   const quantity = transaction?.quantities?.[0];
-  const { metadata } = useNftMetadata(transaction?.collection, tokenId);
+  const { metadata } = useNftMetadata(
+    transaction?.collection,
+    tokenId,
+    currencyId,
+  );
   return (
     <>
       <SummaryRow title="NFT">
@@ -59,5 +66,4 @@ const styles = StyleSheet.create({
   },
 });
 
-// $FlowFixMe
 export default memo(SummaryNft);
diff --git a/yarn.lock b/yarn.lock
index 35e4f42e13..68bc284b65 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1154,10 +1154,17 @@
     core-js-pure "^3.19.0"
     regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.10.2", "@babel/runtime@^7.10.4", "@babel/runtime@^7.10.5", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.0", "@babel/runtime@^7.12.5", "@babel/runtime@^7.14.0", "@babel/runtime@^7.14.5", "@babel/runtime@^7.15.4", "@babel/runtime@^7.16.3", "@babel/runtime@^7.17.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
-  version "7.17.2"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.2.tgz#66f68591605e59da47523c631416b18508779941"
-  integrity sha512-hzeyJyMA1YGdJTuWU0e/j4wKXrU4OMFvY2MSlaI9B7VQb0r5cxTE3EAIS2Q7Tn2RIcDkRvTA/v2JsAEhxe99uw==
+"@babel/runtime@^7.10.2", "@babel/runtime@^7.10.4", "@babel/runtime@^7.10.5", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.0", "@babel/runtime@^7.12.5", "@babel/runtime@^7.14.0", "@babel/runtime@^7.14.5", "@babel/runtime@^7.15.4", "@babel/runtime@^7.16.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
+  version "7.17.8"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.8.tgz#3e56e4aff81befa55ac3ac6a0967349fd1c5bca2"
+  integrity sha512-dQpEpK0O9o6lj6oPu0gRDbbnk+4LeHlNcBpspf6Olzt3GIX4P1lWF1gS+pHLDFlaJvbR6q7jCfQ08zA4QJBnmA==
+  dependencies:
+    regenerator-runtime "^0.13.4"
+
+"@babel/runtime@^7.17.9":
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.9.tgz#d19fbf802d01a8cb6cf053a64e472d42c434ba72"
+  integrity sha512-lSiBBvodq29uShpWGNbgFdKYNiFDo5/HIYsaCEY9ff4sb10x9jizo2+pRrSyF4jKZCXqgzuqBOQKbUm90gQwJg==
   dependencies:
     regenerator-runtime "^0.13.4"
 
@@ -1387,6 +1394,16 @@
     "@cosmjs/math" "^0.25.6"
     "@cosmjs/utils" "^0.25.6"
 
+"@cosmjs/amino@^0.28.4":
+  version "0.28.4"
+  resolved "https://registry.yarnpkg.com/@cosmjs/amino/-/amino-0.28.4.tgz#9315f6876dba80148cf715ced44d1dc7a9b68b94"
+  integrity sha512-b8y5gFC0eGrH0IoYSNtDmTdsTgeQ1KFZ5YVOeIiKmzF91MeiciYO/MNqc027kctacZ+UbnVWGEUGyRBPi9ta/g==
+  dependencies:
+    "@cosmjs/crypto" "0.28.4"
+    "@cosmjs/encoding" "0.28.4"
+    "@cosmjs/math" "0.28.4"
+    "@cosmjs/utils" "0.28.4"
+
 "@cosmjs/crypto@0.26.6", "@cosmjs/crypto@^0.26.5":
   version "0.26.6"
   resolved "https://registry.yarnpkg.com/@cosmjs/crypto/-/crypto-0.26.6.tgz#4ee84e8707406a951a43eac34ffc83ff6c6030f3"
@@ -1403,6 +1420,19 @@
     ripemd160 "^2.0.2"
     sha.js "^2.4.11"
 
+"@cosmjs/crypto@0.28.4":
+  version "0.28.4"
+  resolved "https://registry.yarnpkg.com/@cosmjs/crypto/-/crypto-0.28.4.tgz#b2f1ccb9edee7d357ed1dcd92bdb61f6a1ca06d3"
+  integrity sha512-JRxNLlED3DDh9d04A0RcRw3mYkoobN7q7wafUFy3vI1TjoyWx33v0gqqaYE6/hoo9ghUrJSVOfzVihl8fZajJA==
+  dependencies:
+    "@cosmjs/encoding" "0.28.4"
+    "@cosmjs/math" "0.28.4"
+    "@cosmjs/utils" "0.28.4"
+    "@noble/hashes" "^1"
+    bn.js "^5.2.0"
+    elliptic "^6.5.3"
+    libsodium-wrappers "^0.7.6"
+
 "@cosmjs/crypto@^0.24.1":
   version "0.24.1"
   resolved "https://registry.yarnpkg.com/@cosmjs/crypto/-/crypto-0.24.1.tgz#62da59c32b26344f26b10dd31a02b93655586d04"
@@ -1455,6 +1485,15 @@
     bech32 "^1.1.4"
     readonly-date "^1.0.0"
 
+"@cosmjs/encoding@0.28.4":
+  version "0.28.4"
+  resolved "https://registry.yarnpkg.com/@cosmjs/encoding/-/encoding-0.28.4.tgz#ea39eb4c27ebf7b35e62e9898adae189b86d0da7"
+  integrity sha512-N6Qnjs4dd8KwjW5m9t3L+rWYYGW2wyS+iLtJJ9DD8DiTTxpW9h7/AmUVO/dsRe5H2tV8/DzH/B9pFfpsgro22A==
+  dependencies:
+    base64-js "^1.3.0"
+    bech32 "^1.1.4"
+    readonly-date "^1.0.0"
+
 "@cosmjs/encoding@^0.24.1":
   version "0.24.1"
   resolved "https://registry.yarnpkg.com/@cosmjs/encoding/-/encoding-0.24.1.tgz#b30e92cdb70fc200a163b8c7aa5254606c8a09ab"
@@ -1501,19 +1540,6 @@
     axios "^0.21.1"
     fast-deep-equal "^3.1.3"
 
-"@cosmjs/ledger-amino@^0.26.5":
-  version "0.26.6"
-  resolved "https://registry.yarnpkg.com/@cosmjs/ledger-amino/-/ledger-amino-0.26.6.tgz#4fd342229f3de3059e193f8db3f88877074aabe0"
-  integrity sha512-L5KDfEq7EswV4ku2SbWlozfKVv9WJWtap4/7SMXKH0XrYWOIz0AYeBfM0OGtJQjuHAiD/1QJ8pam/kjUL3+quQ==
-  dependencies:
-    "@cosmjs/amino" "0.26.6"
-    "@cosmjs/crypto" "0.26.6"
-    "@cosmjs/encoding" "0.26.6"
-    "@cosmjs/math" "0.26.6"
-    "@cosmjs/utils" "0.26.6"
-    ledger-cosmos-js "^2.1.8"
-    semver "^7.3.2"
-
 "@cosmjs/math@0.23.1":
   version "0.23.1"
   resolved "https://registry.yarnpkg.com/@cosmjs/math/-/math-0.23.1.tgz#706f38742a9a1f6561cf2c4510f8e5ab001fc5e6"
@@ -1528,6 +1554,13 @@
   dependencies:
     bn.js "^4.11.8"
 
+"@cosmjs/math@0.28.4":
+  version "0.28.4"
+  resolved "https://registry.yarnpkg.com/@cosmjs/math/-/math-0.28.4.tgz#ddc35b69fa1ffeaf5928f70d4c2faf9284627d84"
+  integrity sha512-wsWjbxFXvk46Dsx8jQ5vsBZOIQuiUIyaaZbUvxsgIhAMpuuBnV5O/drK87+B+4cL+umTelFqTbWnkqueVCIFxQ==
+  dependencies:
+    bn.js "^5.2.0"
+
 "@cosmjs/math@^0.24.1":
   version "0.24.1"
   resolved "https://registry.yarnpkg.com/@cosmjs/math/-/math-0.24.1.tgz#9eed507885aacc9b269441fc9ecb00fb5876883a"
@@ -1690,6 +1723,11 @@
   resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.26.6.tgz#134ef1ea0675580c2cc7524589d09f3d42c678a7"
   integrity sha512-Zx60MMI1vffX8c2UbUMlszrGIug3TWa25bD7NF3blJ5k/MVCZFsPafEZ+jEi7kcqoxdhMhgJTI6AmUhnMfq9SQ==
 
+"@cosmjs/utils@0.28.4":
+  version "0.28.4"
+  resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.28.4.tgz#ecbc72458cdaffa6eeef572bc691502b3151330f"
+  integrity sha512-lb3TU6833arPoPZF8HTeG9V418CpurvqH5Aa/ls0I0wYdPDEMO6622+PQNQhQ8Vw8Az2MXoSyc8jsqrgawT84Q==
+
 "@cosmjs/utils@^0.24.1":
   version "0.24.1"
   resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.24.1.tgz#0adfefe63b7f17222bc2bc12f71296f35e7ad378"
@@ -1795,20 +1833,20 @@
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
-"@ethereumjs/common@^2.6.1", "@ethereumjs/common@^2.6.2":
-  version "2.6.2"
-  resolved "https://registry.yarnpkg.com/@ethereumjs/common/-/common-2.6.2.tgz#eb006c9329c75c80f634f340dc1719a5258244df"
-  integrity sha512-vDwye5v0SVeuDky4MtKsu+ogkH2oFUV8pBKzH/eNBzT8oI91pKa8WyzDuYuxOQsgNgv5R34LfFDh2aaw3H4HbQ==
+"@ethereumjs/common@^2.6.2", "@ethereumjs/common@^2.6.3":
+  version "2.6.3"
+  resolved "https://registry.yarnpkg.com/@ethereumjs/common/-/common-2.6.3.tgz#39ddece7300b336276bad6c02f6a9f1a082caa05"
+  integrity sha512-mQwPucDL7FDYIg9XQ8DL31CnIYZwGhU5hyOO5E+BMmT71G0+RHvIT5rIkLBirJEKxV6+Rcf9aEIY0kXInxUWpQ==
   dependencies:
     crc-32 "^1.2.0"
     ethereumjs-util "^7.1.4"
 
 "@ethereumjs/tx@^3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@ethereumjs/tx/-/tx-3.5.0.tgz#783b0aeb08518b9991b23f5155763bbaf930a037"
-  integrity sha512-/+ZNbnJhQhXC83Xuvy6I9k4jT5sXiV0tMR9C+AzSSpcCV64+NB8dTE1m3x98RYMqb8+TLYWA+HML4F5lfXTlJw==
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/@ethereumjs/tx/-/tx-3.5.1.tgz#8d941b83a602b4a89949c879615f7ea9a90e6671"
+  integrity sha512-xzDrTiu4sqZXUcaBxJ4n4W5FrppwxLxZB4ZDGVLtxSQR4lVuOnFR6RcUHdg1mpUhAPVrmnzLJpxaeXnPxIyhWA==
   dependencies:
-    "@ethereumjs/common" "^2.6.1"
+    "@ethereumjs/common" "^2.6.3"
     ethereumjs-util "^7.1.4"
 
 "@ethersproject/abi@5.0.7":
@@ -2688,7 +2726,7 @@
     "@ledgerhq/hw-transport" "^6.27.1"
     "@ledgerhq/logs" "^6.10.0"
     rxjs "6"
-
+    
 "@ledgerhq/hw-transport@6.27.1", "@ledgerhq/hw-transport@^6.27.1":
   version "6.27.1"
   resolved "https://registry.yarnpkg.com/@ledgerhq/hw-transport/-/hw-transport-6.27.1.tgz#88072278f69c279cb6569352acd4ae2fec33ace3"
@@ -2698,7 +2736,7 @@
     "@ledgerhq/errors" "^6.10.0"
     events "^3.3.0"
 
-"@ledgerhq/hw-transport@^5.11.0", "@ledgerhq/hw-transport@^5.19.1", "@ledgerhq/hw-transport@^5.25.0", "@ledgerhq/hw-transport@^5.51.1":
+"@ledgerhq/hw-transport@^5.11.0", "@ledgerhq/hw-transport@^5.19.1", "@ledgerhq/hw-transport@^5.51.1":
   version "5.51.1"
   resolved "https://registry.yarnpkg.com/@ledgerhq/hw-transport/-/hw-transport-5.51.1.tgz#8dd14a8e58cbee4df0c29eaeef983a79f5f22578"
   integrity sha512-6wDYdbWrw9VwHIcoDnqWBaDFyviyjZWv6H9vz9Vyhe4Qd7TIFmbTl/eWs6hZvtZBza9K8y7zD8ChHwRI4s9tSw==
@@ -2747,8 +2785,8 @@
     "@celo/contractkit" "^1.5.2"
     "@celo/wallet-base" "^1.5.2"
     "@celo/wallet-ledger" "^1.5.2"
+    "@cosmjs/amino" "^0.28.4"
     "@cosmjs/crypto" "^0.26.5"
-    "@cosmjs/ledger-amino" "^0.26.5"
     "@cosmjs/proto-signing" "^0.26.5"
     "@cosmjs/stargate" "^0.26.5"
     "@crypto-com/chain-jslib" "0.0.19"
@@ -2774,8 +2812,8 @@
     "@ledgerhq/json-bignumber" "^1.1.0"
     "@ledgerhq/live-app-sdk" "^0.6.1"
     "@ledgerhq/logs" "6.10.0"
-    "@polkadot/types" "7.8.1"
-    "@polkadot/types-known" "7.8.1"
+    "@polkadot/types" "8.1.1"
+    "@polkadot/types-known" "8.1.1"
     "@solana/spl-token" "^0.1.8"
     "@solana/web3.js" "^1.32.0"
     "@taquito/ledger-signer" stablelib
@@ -2908,6 +2946,11 @@
   resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-0.4.1.tgz#ef8ef347cfb3a03692f16ed31fda717f8e78d392"
   integrity sha512-Qxy9mZoDf5SyFrQ8hpWHeMZ2Scmb9BAz/lt23sKdr/QHnACW9dD6S+/WVJHd3R/BPoNHcUYWXoXXe74cxSEYoA==
 
+"@noble/hashes@^1":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.0.0.tgz#d5e38bfbdaba174805a4e649f13be9a9ed3351ae"
+  integrity sha512-DZVbtY62kc3kkBtMHqwCOfXrT/hnoORy5BJ4+HU1IR59X0KWAOqsfzQPcUl/lQLlG7qXbe/fZ3r/emxtAl+sqg==
+
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
@@ -3036,14 +3079,14 @@
   dependencies:
     "@octokit/openapi-types" "^11.2.0"
 
-"@polkadot/keyring@^8.4.1":
-  version "8.4.1"
-  resolved "https://registry.yarnpkg.com/@polkadot/keyring/-/keyring-8.4.1.tgz#71098121c60a05e1ad33653fcc521c52f22ad1b8"
-  integrity sha512-0qfS7qikUxhe6LEdCOcMRdCxEa26inJ5aSUWaf5dXy+dgy9VJiov6uXAbXdAd1UHpDvr9hvw94FX+hXsJ7Vsyw==
+"@polkadot/keyring@^9.0.1":
+  version "9.1.1"
+  resolved "https://registry.yarnpkg.com/@polkadot/keyring/-/keyring-9.1.1.tgz#d4bf244d6dd23d06fed9334e79c0d46a8fdb5988"
+  integrity sha512-qjnO1795v7wDvU2hW0H+z7bMPNV3xcVnIjozt3/+Y5Lphu3Tohh3WNgf9uNKIUTwbWxTF4wWsiUM1ajY4CRuMA==
   dependencies:
-    "@babel/runtime" "^7.17.2"
-    "@polkadot/util" "8.4.1"
-    "@polkadot/util-crypto" "8.4.1"
+    "@babel/runtime" "^7.17.9"
+    "@polkadot/util" "9.1.1"
+    "@polkadot/util-crypto" "9.1.1"
 
 "@polkadot/networks@8.0.6-8":
   version "8.0.6-8"
@@ -3052,14 +3095,14 @@
   dependencies:
     "@babel/runtime" "^7.16.3"
 
-"@polkadot/networks@^8.4.1":
-  version "8.4.1"
-  resolved "https://registry.yarnpkg.com/@polkadot/networks/-/networks-8.4.1.tgz#c22585edb38f5ae0a329a1f471577d8b35bf64e4"
-  integrity sha512-YFY3fPLbc1Uz9zsX4TOzjY/FF09nABMgrMkvqddrVbSgo71NvoBv3Gqw3mKV/7bX1Gzk1ODfvTzamdpsKEWSnA==
+"@polkadot/networks@^9.0.1":
+  version "9.1.1"
+  resolved "https://registry.yarnpkg.com/@polkadot/networks/-/networks-9.1.1.tgz#3b99dcedd1ed626f6efecc642e1dcebca64978e3"
+  integrity sha512-L/jk8vDr4shzGEVOqOimmXySLpbrN8+qlk+BR3A6rFa4N+XjtcGvnnt+so+rXwJOu7U4/ir6qPU2Iq63XbQTMA==
   dependencies:
-    "@babel/runtime" "^7.17.2"
-    "@polkadot/util" "8.4.1"
-    "@substrate/ss58-registry" "^1.14.0"
+    "@babel/runtime" "^7.17.9"
+    "@polkadot/util" "9.1.1"
+    "@substrate/ss58-registry" "^1.17.0"
 
 "@polkadot/reactnative-identicon@0.87.5":
   version "0.87.5"
@@ -3072,58 +3115,58 @@
     "@polkadot/util-crypto" "^8.1.2"
     react-native-svg "^12.2.0"
 
-"@polkadot/types-augment@7.8.1":
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/@polkadot/types-augment/-/types-augment-7.8.1.tgz#f790f3874384e3bd3a4850affb775c6d125f2ff3"
-  integrity sha512-uKDOlU6arH/Oz/faHq315tCA5vjIJTO/zQt0Iuz9woEbmXd6ga0vkCr3gXWfPvjg+QnMQuRpNG8rxtiX5w0vCw==
+"@polkadot/types-augment@8.1.1":
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/@polkadot/types-augment/-/types-augment-8.1.1.tgz#f62107ca46080b9ddfc55f4acda30265dcf033ff"
+  integrity sha512-JyJigD/rH33uDKPRF8u2rMRmxkh/brM/AkD+pOH5ZO6AfcQ3mNsFEvM5OZ+Wx2vq6+vX3oH922wjK3d3/ILkpQ==
   dependencies:
-    "@babel/runtime" "^7.17.2"
-    "@polkadot/types" "7.8.1"
-    "@polkadot/types-codec" "7.8.1"
-    "@polkadot/util" "^8.4.1"
+    "@babel/runtime" "^7.17.9"
+    "@polkadot/types" "8.1.1"
+    "@polkadot/types-codec" "8.1.1"
+    "@polkadot/util" "^9.0.1"
 
-"@polkadot/types-codec@7.8.1":
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/@polkadot/types-codec/-/types-codec-7.8.1.tgz#b42df0baeac7d424c4e5216752f7a630d95381fa"
-  integrity sha512-4et1ZiXXK/KsveKcXd0p1FwAYq8rwHmf1pyf1tOH9JglA/Ip6mArrIjivnfofxY5WFWgeuAv7b2+Rk5vGq/0Xw==
+"@polkadot/types-codec@8.1.1":
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/@polkadot/types-codec/-/types-codec-8.1.1.tgz#f45c40953169c28e406fbdb0b7306f90b858861a"
+  integrity sha512-JJkSYJrkSjNZYIWAqpihgtMKbTfk2r9J6eHeESiWFYhce61o2x1ylyzedaZkvoxD9hVhb7l94ulrHZKtlJKBFQ==
   dependencies:
-    "@babel/runtime" "^7.17.2"
-    "@polkadot/util" "^8.4.1"
+    "@babel/runtime" "^7.17.9"
+    "@polkadot/util" "^9.0.1"
 
-"@polkadot/types-create@7.8.1":
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/@polkadot/types-create/-/types-create-7.8.1.tgz#9b68e1f4bb3d71e4ed1eaa03119940e3e3952396"
-  integrity sha512-TxUFc3/WAzFHT1DIgzIssBKxtbjrSDe3GzHbOlJcIcLI17rLHFCVi53uDYvR9kMxterJ9MFMxXc76iqwnnXCgQ==
+"@polkadot/types-create@8.1.1":
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/@polkadot/types-create/-/types-create-8.1.1.tgz#7e9663b1d8abf8caedb71482c1370e4438eee858"
+  integrity sha512-cL+CpLkHiTxRH67oHiCeunant9JpVvmtJZh+t/NZZypjRkH7YVOpKj643vkiP2m02259N2BzYTR6CEQP8QZGGQ==
   dependencies:
-    "@babel/runtime" "^7.17.2"
-    "@polkadot/types-codec" "7.8.1"
-    "@polkadot/util" "^8.4.1"
+    "@babel/runtime" "^7.17.9"
+    "@polkadot/types-codec" "8.1.1"
+    "@polkadot/util" "^9.0.1"
 
-"@polkadot/types-known@7.8.1":
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/@polkadot/types-known/-/types-known-7.8.1.tgz#1ed7ed5f5bdd5eb8816258753c1f0fa881a0c38f"
-  integrity sha512-qUTZq6B4tm+Gt3G/CvivZVHTD3NueTyNpv9/nEUWwOAmKgrZyJy7uLgGwHoqEjcXn+F86B3raIgp6WP+v8PibQ==
+"@polkadot/types-known@8.1.1":
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/@polkadot/types-known/-/types-known-8.1.1.tgz#f956b5e0f282cabc32416c81e1a47f6dcda92e06"
+  integrity sha512-aOuHf/vTFrScipGx9DOcD83ki1jBLHg3549SAkMwyz0K+RnIlt2nat32/M60eUWJgyHHITl4G0QCZrtFY2D2OA==
   dependencies:
-    "@babel/runtime" "^7.17.2"
-    "@polkadot/networks" "^8.4.1"
-    "@polkadot/types" "7.8.1"
-    "@polkadot/types-codec" "7.8.1"
-    "@polkadot/types-create" "7.8.1"
-    "@polkadot/util" "^8.4.1"
+    "@babel/runtime" "^7.17.9"
+    "@polkadot/networks" "^9.0.1"
+    "@polkadot/types" "8.1.1"
+    "@polkadot/types-codec" "8.1.1"
+    "@polkadot/types-create" "8.1.1"
+    "@polkadot/util" "^9.0.1"
 
-"@polkadot/types@7.8.1":
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/@polkadot/types/-/types-7.8.1.tgz#67ccf5f10fde4e47f007391f7c39c942cc12bdd8"
-  integrity sha512-B+b3q5qprJb6PJGiJ1r6FiXW6LxH2SOFXkTpcFpJeM2wBkJmeQoiEQ7M/r8kkrqtORptfsrxmhbjMr0xvUHZHA==
-  dependencies:
-    "@babel/runtime" "^7.17.2"
-    "@polkadot/keyring" "^8.4.1"
-    "@polkadot/types-augment" "7.8.1"
-    "@polkadot/types-codec" "7.8.1"
-    "@polkadot/types-create" "7.8.1"
-    "@polkadot/util" "^8.4.1"
-    "@polkadot/util-crypto" "^8.4.1"
-    rxjs "^7.5.4"
+"@polkadot/types@8.1.1":
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/@polkadot/types/-/types-8.1.1.tgz#43e5fb78e6214e6af7c5edbdb6ac69d5b919421d"
+  integrity sha512-x9WDx9XcaSkQGlnk2MNu+49oK80s8Js7lr0mmCinV12m8+3si+GvIOvnuV3ydmWgWtpTt2ERfN+T8a/6f50EpA==
+  dependencies:
+    "@babel/runtime" "^7.17.9"
+    "@polkadot/keyring" "^9.0.1"
+    "@polkadot/types-augment" "8.1.1"
+    "@polkadot/types-codec" "8.1.1"
+    "@polkadot/types-create" "8.1.1"
+    "@polkadot/util" "^9.0.1"
+    "@polkadot/util-crypto" "^9.0.1"
+    rxjs "^7.5.5"
 
 "@polkadot/ui-shared@0.87.5":
   version "0.87.5"
@@ -3133,7 +3176,7 @@
     "@babel/runtime" "^7.16.3"
     color "^3.2.1"
 
-"@polkadot/util-crypto@8.0.6-8", "@polkadot/util-crypto@8.4.1", "@polkadot/util-crypto@^8.1.2", "@polkadot/util-crypto@^8.4.1":
+"@polkadot/util-crypto@8.0.6-8", "@polkadot/util-crypto@9.1.1", "@polkadot/util-crypto@^8.1.2", "@polkadot/util-crypto@^9.0.1":
   version "8.0.6-8"
   resolved "https://registry.yarnpkg.com/@polkadot/util-crypto/-/util-crypto-8.0.6-8.tgz#47735fcf409819f3eaeaf9a7099ff170e501adda"
   integrity sha512-ssITWN1mRwvzM0wexDaGAfHWWbqOys4D3vg8mY8WYUZ8NKbdGoOSirnOY/0LlsKDUSQ/kRCtWDiPHZs7UC3Y1A==
@@ -3151,7 +3194,7 @@
     micro-base "^0.9.0"
     tweetnacl "^1.0.3"
 
-"@polkadot/util@8.0.6-8", "@polkadot/util@8.4.1", "@polkadot/util@^8.1.2", "@polkadot/util@^8.4.1":
+"@polkadot/util@8.0.6-8", "@polkadot/util@9.1.1", "@polkadot/util@^8.1.2", "@polkadot/util@^9.0.1":
   version "8.0.6-8"
   resolved "https://registry.yarnpkg.com/@polkadot/util/-/util-8.0.6-8.tgz#83e18960abc49d7dc523bd5375923064742d12bf"
   integrity sha512-ZH3Yb7tFaatBjiurK8sDcK+jupmgSK5NEB0j89Jwyv/R+wwTjkyeUlRg0wo7srvRQGfazIQMyryD4pFVRaQx3g==
@@ -3958,10 +4001,10 @@
     "@styled-system/core" "^5.1.2"
     "@styled-system/css" "^5.1.5"
 
-"@substrate/ss58-registry@^1.14.0":
-  version "1.15.0"
-  resolved "https://registry.yarnpkg.com/@substrate/ss58-registry/-/ss58-registry-1.15.0.tgz#211c7c9e5cbcbfb6ee9c300efd719a038af38c36"
-  integrity sha512-UU5uN8HEp0NM22od6kHWLltX0McQPgPX6O3gj7fSf1mMExsCS5fzW88gv1WaVaT8Q+umvGgnIAF7+Tvp8fqTFw==
+"@substrate/ss58-registry@^1.17.0":
+  version "1.17.0"
+  resolved "https://registry.yarnpkg.com/@substrate/ss58-registry/-/ss58-registry-1.17.0.tgz#a6a50dbef67da0114aff7cdae7c6eec685c5983b"
+  integrity sha512-YdQOxCtEZLnYZFg/zSzfROYtvIs5+iLD7p/VHoll7AVEhrPAmxgF5ggMDB2Dass7dfwABVx7heATbPFNg95Q8w==
 
 "@szmarczak/http-timer@^1.1.2":
   version "1.1.2"
@@ -4555,13 +4598,13 @@
   dependencies:
     eslint-visitor-keys "^1.1.0"
 
-"@walletconnect/browser-utils@^1.7.3":
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/browser-utils/-/browser-utils-1.7.3.tgz#06efabd67a6b487a2690e12ae7f75707f05582e0"
-  integrity sha512-QYpzoBgvEDBF2lu6L55d0jX1K9bfEy1UtPqAWCi6KBOgw1KQgfvHavephOXW+tQIAWYB5CROTxa4HTSVyYUEQA==
+"@walletconnect/browser-utils@^1.7.5":
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/@walletconnect/browser-utils/-/browser-utils-1.7.5.tgz#a12ff382310bfbb02509a69565dacf14aa744461"
+  integrity sha512-gm9ufi0n5cGBXoGWDtMVSqIJ0eXYW+ZFuTNVN0fm4oal26J7cPrOdFjzhv5zvx5fKztWQ21DNFZ+PRXBjXg04Q==
   dependencies:
     "@walletconnect/safe-json" "1.0.0"
-    "@walletconnect/types" "^1.7.3"
+    "@walletconnect/types" "^1.7.5"
     "@walletconnect/window-getters" "1.0.0"
     "@walletconnect/window-metadata" "1.0.0"
     detect-browser "5.2.0"
@@ -4577,29 +4620,29 @@
     "@walletconnect/utils" "^1.7.3"
 
 "@walletconnect/core@^1.7.3":
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-1.7.3.tgz#d67d7e0b96076aa47cad2ea7e83d0915e523069e"
-  integrity sha512-sDKWrQccs96T2uMbyWbKxLOFjKFLyoLIxMtknNuZXGG6kw+NUee5GBu9tTZ7zfVuIh0te1YcpZPX7slXwNjY8g==
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-1.7.5.tgz#623d19d4578b6195bb0f6e6313316d32fa4b2f10"
+  integrity sha512-c4B8s9fZ/Ah2p460Hxo4e9pwLQVYT2+dVYAfqaxVzfYjhAokDEtO55Bdm1hujtRjQVqwTvCljKxBB+LgMp3k8w==
   dependencies:
-    "@walletconnect/socket-transport" "^1.7.3"
-    "@walletconnect/types" "^1.7.3"
-    "@walletconnect/utils" "^1.7.3"
+    "@walletconnect/socket-transport" "^1.7.5"
+    "@walletconnect/types" "^1.7.5"
+    "@walletconnect/utils" "^1.7.5"
 
-"@walletconnect/crypto@^1.0.1":
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/@walletconnect/crypto/-/crypto-1.0.1.tgz#d4c1b1cd5dd1be88fe9a82dfc54cadbbb3f9d325"
-  integrity sha512-IgUReNrycIFxkGgq8YT9HsosCkhutakWD9Q411PR0aJfxpEa/VKJeaLRtoz6DvJpztWStwhIHnAbBoOVR72a6g==
+"@walletconnect/crypto@^1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/crypto/-/crypto-1.0.2.tgz#3fcc2b2cde6f529a19eadd883dc555cd0e861992"
+  integrity sha512-+OlNtwieUqVcOpFTvLBvH+9J9pntEqH5evpINHfVxff1XIgwV55PpbdvkHu6r9Ib4WQDOFiD8OeeXs1vHw7xKQ==
   dependencies:
-    "@walletconnect/encoding" "^1.0.0"
+    "@walletconnect/encoding" "^1.0.1"
     "@walletconnect/environment" "^1.0.0"
-    "@walletconnect/randombytes" "^1.0.1"
+    "@walletconnect/randombytes" "^1.0.2"
     aes-js "^3.1.2"
     hash.js "^1.1.7"
 
-"@walletconnect/encoding@^1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/encoding/-/encoding-1.0.0.tgz#e24190cb5e803526f9dfd7191fb0e4dc53c6d864"
-  integrity sha512-4nkJFnS0QF5JdieG/3VPD1/iEWkLSZ14EBInLZ00RWxmC6EMZrzAeHNAWIgm+xP3NK0lqz+7lEsmWGtcl5gYnQ==
+"@walletconnect/encoding@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@walletconnect/encoding/-/encoding-1.0.1.tgz#93c18ce9478c3d5283dbb88c41eb2864b575269a"
+  integrity sha512-8opL2rs6N6E3tJfsqwS82aZQDL3gmupWUgmvuZ3CGU7z/InZs3R9jkzH8wmYtpbq0sFK3WkJkQRZFFk4BkrmFA==
   dependencies:
     is-typedarray "1.0.0"
     typedarray-to-buffer "3.1.5"
@@ -4610,13 +4653,13 @@
   integrity sha512-4BwqyWy6KpSvkocSaV7WR3BlZfrxLbJSLkg+j7Gl6pTDE+U55lLhJvQaMuDVazXYxcjBsG09k7UlH7cGiUI5vQ==
 
 "@walletconnect/iso-crypto@^1.7.3":
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/iso-crypto/-/iso-crypto-1.7.3.tgz#973c1d45881a0db30a0d9d9ac15b07c7aea60ec7"
-  integrity sha512-T/mEoHMuYjft7SWiFTQa4Fng12U9Z7XQPUq9axJPgBY7a5dC4Bk3tJX8Ml7s7syLxc6inzCCMv/vaZGNskTgAw==
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/@walletconnect/iso-crypto/-/iso-crypto-1.7.5.tgz#12d624605c656c8eed31a9d073d85b73cd0be291"
+  integrity sha512-mJdRs2SqAPOLBBqLhU+ZnAh2c8TL2uDuL/ojV4aBzZ0ZHNT7X2zSOjAiixCb3vvH8GAt30OKmiRo3+ChI/9zvA==
   dependencies:
-    "@walletconnect/crypto" "^1.0.1"
-    "@walletconnect/types" "^1.7.3"
-    "@walletconnect/utils" "^1.7.3"
+    "@walletconnect/crypto" "^1.0.2"
+    "@walletconnect/types" "^1.7.5"
+    "@walletconnect/utils" "^1.7.5"
 
 "@walletconnect/jsonrpc-types@^1.0.0":
   version "1.0.0"
@@ -4633,12 +4676,12 @@
     "@walletconnect/environment" "^1.0.0"
     "@walletconnect/jsonrpc-types" "^1.0.0"
 
-"@walletconnect/randombytes@^1.0.1":
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/@walletconnect/randombytes/-/randombytes-1.0.1.tgz#87f0f02d9206704ce1c9e23f07d3b28898c48385"
-  integrity sha512-YJTyq69i0PtxVg7osEpKfvjTaWuAsR49QEcqGKZRKVQWMbGXBZ65fovemK/SRgtiFRv0V8PwsrlKSheqzfPNcg==
+"@walletconnect/randombytes@^1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/randombytes/-/randombytes-1.0.2.tgz#95c644251a15e6675f58fbffc9513a01486da49c"
+  integrity sha512-ivgOtAyqQnN0rLQmOFPemsgYGysd/ooLfaDA/ACQ3cyqlca56t3rZc7pXfqJOIETx/wSyoF5XbwL+BqYodw27A==
   dependencies:
-    "@walletconnect/encoding" "^1.0.0"
+    "@walletconnect/encoding" "^1.0.1"
     "@walletconnect/environment" "^1.0.0"
     randombytes "^2.1.0"
 
@@ -4647,29 +4690,29 @@
   resolved "https://registry.yarnpkg.com/@walletconnect/safe-json/-/safe-json-1.0.0.tgz#12eeb11d43795199c045fafde97e3c91646683b2"
   integrity sha512-QJzp/S/86sUAgWY6eh5MKYmSfZaRpIlmCJdi5uG4DJlKkZrHEF7ye7gA+VtbVzvTtpM/gRwO2plQuiooIeXjfg==
 
-"@walletconnect/socket-transport@^1.7.3":
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/socket-transport/-/socket-transport-1.7.3.tgz#3673996c984b735aadf0894c66515ba449ff2c24"
-  integrity sha512-t0WlbgtnyOKHqKjceVBJI0c7wlsZIvZTsbYgQ3NN03uX8r5gv01FJxLvf/Uu5uip+LcjBZEz4TVwIO80As64nw==
+"@walletconnect/socket-transport@^1.7.5":
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/@walletconnect/socket-transport/-/socket-transport-1.7.5.tgz#5416886403c7bea526f4ced6452fd1056c0a1354"
+  integrity sha512-4TYCxrNWb4f5a1NGsALXidr+/6dOiqgVfUQJ4fdP6R7ijL+7jtdiktguU9FIDq5wFXRE+ZdpCpwSAfOt60q/mQ==
   dependencies:
-    "@walletconnect/types" "^1.7.3"
-    "@walletconnect/utils" "^1.7.3"
+    "@walletconnect/types" "^1.7.5"
+    "@walletconnect/utils" "^1.7.5"
     ws "7.5.3"
 
-"@walletconnect/types@^1.7.3":
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-1.7.3.tgz#6378fc058b463beb869f5583b30c000ffd67c082"
-  integrity sha512-EtFM7LxjrbCoCJvRZf3wydPitwlB0s4S9sj9yXe13j7mMgf9ruS5Ixa/sCfDKskZdGvkhFis9+Nw+gO++A/klg==
+"@walletconnect/types@^1.7.3", "@walletconnect/types@^1.7.5":
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-1.7.5.tgz#145d7dd9df4415178995df6d4facef41c371ab6f"
+  integrity sha512-0HvZzxD93et4DdrYgAvclI1BqclkZS7iPWRtbGg3r+PQhRPbOkNypzBy6XH6wflbmr+WBGdmyJvynHsdhcCqUA==
 
-"@walletconnect/utils@^1.7.3":
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-1.7.3.tgz#187ef510dec3c0c2ce832b7c347dbcd98ee47b38"
-  integrity sha512-WVZqCBgoIer3fUUVEQm0TYZrDBEOSlKJ91EgA27I41TJGer7OE7pEjJhaNgwWTIwsfJJkjNWp+4wa78Qf/e5vg==
+"@walletconnect/utils@^1.7.3", "@walletconnect/utils@^1.7.5":
+  version "1.7.5"
+  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-1.7.5.tgz#762bf7f384846772416e44b636ce9792d1d7db5f"
+  integrity sha512-U954rIIA/g/Cmdqy+n3hMY1DDMmXxGs8w/QmrK9b/H5nkQ3e4QicOyynq5g/JTTesN5HZdDTFiyX9r0GSKa+iA==
   dependencies:
-    "@walletconnect/browser-utils" "^1.7.3"
-    "@walletconnect/encoding" "^1.0.0"
+    "@walletconnect/browser-utils" "^1.7.5"
+    "@walletconnect/encoding" "^1.0.1"
     "@walletconnect/jsonrpc-utils" "^1.0.0"
-    "@walletconnect/types" "^1.7.3"
+    "@walletconnect/types" "^1.7.5"
     bn.js "4.11.8"
     js-sha3 "0.8.0"
     query-string "6.13.5"
@@ -5262,7 +5305,7 @@ axios@0.25.0:
   dependencies:
     follow-redirects "^1.14.7"
 
-axios@0.26.1, axios@^0.26.1:
+axios@0.26.1, axios@^0.26.0, axios@^0.26.1:
   version "0.26.1"
   resolved "https://registry.yarnpkg.com/axios/-/axios-0.26.1.tgz#1ede41c51fcf51bbbd6fd43669caaa4f0495aaa9"
   integrity sha512-fPwcX4EvnSHuInCMItEhAGnaSEXRBjtzh9fOtsE6E1G6p7vl7edEeZe11QHf18+6+9gR5PbKV/sGKNaD8YaMeA==
@@ -5276,13 +5319,6 @@ axios@^0.21.1, axios@^0.21.2:
   dependencies:
     follow-redirects "^1.14.0"
 
-axios@^0.26.0:
-  version "0.26.0"
-  resolved "https://registry.yarnpkg.com/axios/-/axios-0.26.0.tgz#9a318f1c69ec108f8cd5f3c3d390366635e13928"
-  integrity sha512-lKoGLMYtHvFrPVt3r+RBMp9nh34N0M8zEfCWqdWZx6phynIEhQqAdydpyBAAG211zlhX9Rgu08cOamy6XjE5Og==
-  dependencies:
-    follow-redirects "^1.14.8"
-
 axobject-query@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-0.1.0.tgz#62f59dbc59c9f9242759ca349960e7a2fe3c36c0"
@@ -11586,16 +11622,6 @@ leb128@^0.0.5:
     bn.js "^5.0.0"
     buffer-pipe "0.0.3"
 
-ledger-cosmos-js@^2.1.8:
-  version "2.1.8"
-  resolved "https://registry.yarnpkg.com/ledger-cosmos-js/-/ledger-cosmos-js-2.1.8.tgz#b409ecd1e77f630e6fb212a9f602fe5c6e8f054b"
-  integrity sha512-Gl7SWMq+3R9OTkF1hLlg5+1geGOmcHX9OdS+INDsGNxSiKRWlsWCvQipGoDnRIQ6CPo2i/Ze58Dw0Mt/l3UYyA==
-  dependencies:
-    "@babel/runtime" "^7.11.2"
-    "@ledgerhq/hw-transport" "^5.25.0"
-    bech32 "^1.1.4"
-    ripemd160 "^2.0.2"
-
 level-blobs@^0.1.7:
   version "0.1.7"
   resolved "https://registry.yarnpkg.com/level-blobs/-/level-blobs-0.1.7.tgz#9ab9b97bb99f1edbf9f78a3433e21ed56386bdaf"
@@ -15314,10 +15340,10 @@ rxjs@6, rxjs@^6.4.0, rxjs@^6.6.3, rxjs@^6.6.6:
   dependencies:
     tslib "^1.9.0"
 
-rxjs@^7.5.4:
-  version "7.5.4"
-  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-7.5.4.tgz#3d6bd407e6b7ce9a123e76b1e770dc5761aa368d"
-  integrity sha512-h5M3Hk78r6wAheJF0a5YahB1yRQKCsZ4MsGdZ5O9ETbVtjPcScGfrMmoOq7EBsCRzd4BDkvDJ7ogP8Sz5tTFiQ==
+rxjs@^7.5.5:
+  version "7.5.5"
+  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-7.5.5.tgz#2ebad89af0f560f460ad5cc4213219e1f7dd4e9f"
+  integrity sha512-sy+H0pQofO95VDmFLzyaw9xNJU4KTRSwQIGM6+iG3SypAtCiLDzpeG8sJrNCWn2Up9km+KhkvTdbkrdy+yzZdw==
   dependencies:
     tslib "^2.1.0"
 
@@ -15443,13 +15469,20 @@ semver@^6.0.0, semver@^6.1.1, semver@^6.1.2, semver@^6.3.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
   integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
 
-semver@^7.0.0, semver@^7.2.1, semver@^7.3.2, semver@^7.3.5:
+semver@^7.0.0, semver@^7.2.1, semver@^7.3.2:
   version "7.3.5"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7"
   integrity sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==
   dependencies:
     lru-cache "^6.0.0"
 
+semver@^7.3.5:
+  version "7.3.7"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.7.tgz#12c5b649afdbf9049707796e22a4028814ce523f"
+  integrity sha512-QlYTucUYOews+WeEujDoEGziz4K6c47V/Bd+LjSSYcA94p+DmINdf7ncaUinThfvZyu13lN9OY1XDxt8C0Tw0g==
+  dependencies:
+    lru-cache "^6.0.0"
+
 semver@~2.3.1:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/semver/-/semver-2.3.2.tgz#b9848f25d6cf36333073ec9ef8856d42f1233e52"