feat: CP-12572 add function checking, remove but from testnet (#517)

Author: vvava

apps/next/src/pages/Portfolio/components/PortfolioHome/components/PortolioDetails/components/PortfolioActionButtons.tsx

@@ -11,6 +11,7 @@ import { MdAdd } from 'react-icons/md';
 import { useHistory } from 'react-router-dom';
 
 import { getBridgePath, getSendPath, getSwapPath } from '@/config/routes';
+import { FunctionNames, useIsFunctionAvailable } from '@core/ui';
 
 const onNotImplementedClick = (e: React.MouseEvent<HTMLButtonElement>) => {
   e.preventDefault();
@@ -27,34 +28,48 @@ const ICON_SIZE = 19.2;
 
 export const PortfolioActionButtons = () => {
   const { push } = useHistory();
+  const { checkIsFunctionSupported } = useIsFunctionAvailable();
+
+  const isSwapSupported = checkIsFunctionSupported(FunctionNames.SWAP);
+  const isBuySupported = checkIsFunctionSupported(FunctionNames.BUY);
+
+  let delay = 0;
+  const getDelay = () => (delay += 300);
+
   return (
     <Stack direction="row" gap={1} width="100%">
       {/* TODO: create the proper animation */}
-      <Slide direction="left" in timeout={300} easing="ease-out">
+      <Slide direction="left" in timeout={getDelay()} easing="ease-out">
         <SquareButton
           variant="extension"
           icon={<SendIcon size={ICON_SIZE} />}
           label="Send"
           onClick={() => push(getSendPath())}
         />
       </Slide>
-      <Slide direction="left" in timeout={600} easing="ease-out">
-        <SquareButton
-          variant="extension"
-          icon={<SwapIcon size={ICON_SIZE} />}
-          label="Swap"
-          onClick={() => push(getSwapPath())}
-        />
-      </Slide>
-      <Slide direction="left" in timeout={900} easing="ease-out">
-        <SquareButton
-          variant="extension"
-          icon={<MdAdd size={ICON_SIZE} />}
-          label="Buy"
-          onClick={onNotImplementedClick}
-        />
-      </Slide>
-      <Slide direction="left" in timeout={1200} easing="ease-out">
+
+      {isSwapSupported && (
+        <Slide direction="left" in timeout={getDelay()} easing="ease-out">
+          <SquareButton
+            variant="extension"
+            icon={<SwapIcon size={ICON_SIZE} />}
+            label="Swap"
+            onClick={() => push(getSwapPath())}
+          />
+        </Slide>
+      )}
+
+      {isBuySupported && (
+        <Slide direction="left" in timeout={getDelay()} easing="ease-out">
+          <SquareButton
+            variant="extension"
+            icon={<MdAdd size={ICON_SIZE} />}
+            label="Buy"
+            onClick={onNotImplementedClick}
+          />
+        </Slide>
+      )}
+      <Slide direction="left" in timeout={getDelay()} easing="ease-out">
         <SquareButton
           variant="extension"
           icon={<BridgeIcon size={ICON_SIZE} />}

packages/ui/src/hooks/useIsFunctionAvailable.ts

@@ -168,7 +168,7 @@ const enabledFeatures = {
     ChainId.ETHEREUM_HOMESTEAD,
     ChainId.SOLANA_MAINNET_ID,
   ],
-  Buy: [ChainId.AVALANCHE_MAINNET_ID, ChainId.AVALANCHE_TESTNET_ID],
+  Buy: [ChainId.AVALANCHE_MAINNET_ID],
 };
 
 /**