fix: currency select modal when chain is not supported (#6759)

* fix: currency select modal when chain is not supported

* removing pay with if on unsupported network

* refactor

src/nft/components/bag/BagFooter.tsx

@@ -13,7 +13,7 @@ import Row from 'components/Row'
 import CurrencySearchModal from 'components/SearchModal/CurrencySearchModal'
 import { LoadingBubble } from 'components/Tokens/loading'
 import { MouseoverTooltip } from 'components/Tooltip'
-import { SupportedChainId } from 'constants/chains'
+import { isSupportedChain, SupportedChainId } from 'constants/chains'
 import { useNftUniversalRouterAddress } from 'graphql/data/nft/NftUniversalRouterAddress'
 import { useCurrency } from 'hooks/Tokens'
 import { AllowanceState } from 'hooks/usePermit2Allowance'
@@ -461,6 +461,8 @@ export const BagFooter = ({ setModalIsOpen, eventProperties }: BagFooterProps) =
         <FooterHeader gap="xs">
           <CurrencyRow>
             <Column gap="xs">
+              {isSupportedChain(chainId) && (
+                <>
                   <ThemedText.SubHeaderSmall>
                     <Trans>Pay with</Trans>
                   </ThemedText.SubHeaderSmall>
@@ -478,6 +480,8 @@ export const BagFooter = ({ setModalIsOpen, eventProperties }: BagFooterProps) =
                     </ThemedText.HeadlineSmall>
                     <ChevronDown size={20} color={theme.textSecondary} />
                   </CurrencyInput>
+                </>
+              )}
             </Column>
             <TotalColumn gap="xs">
               <ThemedText.SubHeaderSmall marginBottom="4px">