Merge pull request #2105 from blockscout/remove-action-button-experiment

Remove action button experiment
blockscout · Jul 22, 2024 · 9e6c078 · 9e6c078
2 parents bf34442 + c3f130a
commit 9e6c078
Show file tree

Hide file tree

Showing 8 changed files with 15 additions and 30 deletions.
diff --git a/lib/growthbook/init.ts b/lib/growthbook/init.ts
@@ -7,7 +7,6 @@ import { STORAGE_KEY, STORAGE_LIMIT } from './consts';
 
 export interface GrowthBookFeatures {
   test_value: string;
-  action_button_exp: boolean;
 }
 
 export const growthBook = (() => {

diff --git a/ui/shared/AppActionButton/useAppActionData.tsx b/ui/shared/AppActionButton/useAppActionData.tsx
@@ -2,7 +2,7 @@ import { useMemo } from 'react';
 
 import useAddressMetadataInfoQuery from 'lib/address/useAddressMetadataInfoQuery';
 
-export default function useAppActionData(address: string | undefined = '', isEnabled = false) {
+export default function useAppActionData(address: string | undefined = '', isEnabled = true) {
   const memoizedArray = useMemo(() => address ? [ address ] : [], [ address ]);
   const { data } = useAddressMetadataInfoQuery(memoizedArray, isEnabled);
   const metadata = data?.addresses[address?.toLowerCase()];

diff --git a/ui/token/TokenDetails.tsx b/ui/token/TokenDetails.tsx
@@ -12,7 +12,6 @@ import type { ResourceError } from 'lib/api/resources';
 import useApiQuery from 'lib/api/useApiQuery';
 import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import getCurrencyValue from 'lib/getCurrencyValue';
-import useFeatureValue from 'lib/growthbook/useFeatureValue';
 import useIsMounted from 'lib/hooks/useIsMounted';
 import { TOKEN_COUNTERS } from 'stubs/token';
 import type { TokenTabs } from 'ui/pages/Token';
@@ -31,7 +30,6 @@ interface Props {
 const TokenDetails = ({ tokenQuery }: Props) => {
   const router = useRouter();
   const isMounted = useIsMounted();
-  const { value: isActionButtonExperiment } = useFeatureValue('action_button_exp', false);
 
   const hash = router.query.hash?.toString();
 
@@ -40,7 +38,7 @@ const TokenDetails = ({ tokenQuery }: Props) => {
     queryOptions: { enabled: Boolean(router.query.hash), placeholderData: TOKEN_COUNTERS },
   });
 
-  const appActionData = useAppActionData(hash, isActionButtonExperiment);
+  const appActionData = useAppActionData(hash);
 
   const changeUrlAndScroll = useCallback((tab: TokenTabs) => () => {
     router.push(
@@ -200,11 +198,10 @@ const TokenDetails = ({ tokenQuery }: Props) => {
           isLoading={ tokenQuery.isPlaceholderData }
           appActionData={ appActionData }
           source="NFT collection"
-          isActionButtonExperiment={ isActionButtonExperiment }
         />
       ) }
 
-      { (type !== 'ERC-20' && config.UI.views.nft.marketplaces.length === 0 && appActionData && isActionButtonExperiment) && (
+      { (type !== 'ERC-20' && config.UI.views.nft.marketplaces.length === 0 && appActionData) && (
         <>
           <DetailsInfoItem.Label
             hint="Link to the dapp"

diff --git a/ui/token/TokenNftMarketplaces.tsx b/ui/token/TokenNftMarketplaces.tsx
@@ -14,10 +14,9 @@ interface Props {
   isLoading?: boolean;
   appActionData?: AddressMetadataTagFormatted['meta'];
   source: 'NFT collection' | 'NFT item';
-  isActionButtonExperiment?: boolean;
 }
 
-const TokenNftMarketplaces = ({ hash, id, isLoading, appActionData, source, isActionButtonExperiment }: Props) => {
+const TokenNftMarketplaces = ({ hash, id, isLoading, appActionData, source }: Props) => {
   if (!hash || config.UI.views.nft.marketplaces.length === 0) {
     return null;
   }
@@ -31,7 +30,7 @@ const TokenNftMarketplaces = ({ hash, id, isLoading, appActionData, source, isAc
         Marketplaces
       </DetailsInfoItem.Label>
       <DetailsInfoItem.Value
-        py={ (appActionData && isActionButtonExperiment) ? '1px' : '6px' }
+        py={ appActionData ? '1px' : '6px' }
       >
         <Skeleton isLoaded={ !isLoading } display="flex" columnGap={ 3 } flexWrap="wrap" alignItems="center">
           { config.UI.views.nft.marketplaces.map((item) => {
@@ -52,7 +51,7 @@ const TokenNftMarketplaces = ({ hash, id, isLoading, appActionData, source, isAc
               </Tooltip>
             );
           }) }
-          { (appActionData && isActionButtonExperiment) && (
+          { appActionData && (
             <>
               <TextSeparator color="gray.500" margin={ 0 }/>
               <AppActionButton data={ appActionData } height="30px" source={ source }/>

diff --git a/ui/tokenInstance/TokenInstanceDetails.pw.tsx b/ui/tokenInstance/TokenInstanceDetails.pw.tsx
@@ -55,8 +55,7 @@ test('base view +@dark-mode +@mobile', async({ render, page }) => {
 });
 
 test.describe('action button', () => {
-  test.beforeEach(async({ mockFeatures, mockApiResponse, mockAssetResponse }) => {
-    await mockFeatures([ [ 'action_button_exp', true ] ]);
+  test.beforeEach(async({ mockApiResponse, mockAssetResponse }) => {
     const metadataResponse = generateAddressMetadataResponse(protocolTagWithMeta);
     await mockApiResponse('address_metadata_info', metadataResponse, { queryParams: addressMetadataQueryParams });
     await mockAssetResponse(protocolTagWithMeta?.meta?.appLogoURL as string, './playwright/mocks/image_s.jpg');

diff --git a/ui/tokenInstance/TokenInstanceDetails.tsx b/ui/tokenInstance/TokenInstanceDetails.tsx
@@ -4,7 +4,6 @@ import React from 'react';
 import type { TokenInfo, TokenInstance } from 'types/api/token';
 
 import config from 'configs/app';
-import useFeatureValue from 'lib/growthbook/useFeatureValue';
 import useIsMounted from 'lib/hooks/useIsMounted';
 import AppActionButton from 'ui/shared/AppActionButton/AppActionButton';
 import useAppActionData from 'ui/shared/AppActionButton/useAppActionData';
@@ -29,8 +28,7 @@ interface Props {
 }
 
 const TokenInstanceDetails = ({ data, token, scrollRef, isLoading }: Props) => {
-  const { value: isActionButtonExperiment } = useFeatureValue('action_button_exp', false);
-  const appActionData = useAppActionData(token?.address, isActionButtonExperiment && !isLoading);
+  const appActionData = useAppActionData(token?.address, !isLoading);
   const isMounted = useIsMounted();
 
   const handleCounterItemClick = React.useCallback(() => {
@@ -96,10 +94,9 @@ const TokenInstanceDetails = ({ data, token, scrollRef, isLoading }: Props) => {
             id={ data.id }
             appActionData={ appActionData }
             source="NFT item"
-            isActionButtonExperiment={ isActionButtonExperiment }
           />
 
-          { (config.UI.views.nft.marketplaces.length === 0 && appActionData && isActionButtonExperiment) && (
+          { (config.UI.views.nft.marketplaces.length === 0 && appActionData) && (
             <>
               <DetailsInfoItem.Label
                 hint="Link to the dapp"

diff --git a/ui/tx/TxSubHeading.pw.tsx b/ui/tx/TxSubHeading.pw.tsx
@@ -55,8 +55,7 @@ test.describe('blockscout provider', () => {
     await expect(component).toHaveScreenshot();
   });
 
-  test('with interpretation and action button +@mobile +@dark-mode', async({ render, mockApiResponse, mockAssetResponse, mockFeatures }) => {
-    await mockFeatures([ [ 'action_button_exp', true ] ]);
+  test('with interpretation and action button +@mobile +@dark-mode', async({ render, mockApiResponse, mockAssetResponse }) => {
     const metadataResponse = generateAddressMetadataResponse(protocolTagWithMeta);
     await mockApiResponse('address_metadata_info', metadataResponse, { queryParams: addressMetadataQueryParams });
     await mockAssetResponse(protocolTagWithMeta?.meta?.appLogoURL as string, './playwright/mocks/image_s.jpg');
@@ -76,9 +75,8 @@ test.describe('blockscout provider', () => {
   });
 
   test('with interpretation and view all link, and action button (external link) +@mobile', async({
-    render, mockApiResponse, mockAssetResponse, mockFeatures,
+    render, mockApiResponse, mockAssetResponse,
   }) => {
-    await mockFeatures([ [ 'action_button_exp', true ] ]);
     delete protocolTagWithMeta?.meta?.appID;
     const metadataResponse = generateAddressMetadataResponse(protocolTagWithMeta);
     await mockApiResponse('address_metadata_info', metadataResponse, { queryParams: addressMetadataQueryParams });
@@ -92,9 +90,8 @@ test.describe('blockscout provider', () => {
     await expect(component).toHaveScreenshot();
   });
 
-  test('no interpretation, has method called', async({ render, mockApiResponse, mockFeatures }) => {
+  test('no interpretation, has method called', async({ render, mockApiResponse }) => {
     // the action button should not render if there is no interpretation
-    await mockFeatures([ [ 'action_button_exp', true ] ]);
     const metadataResponse = generateAddressMetadataResponse(protocolTagWithMeta);
     await mockApiResponse('address_metadata_info', metadataResponse, { queryParams: addressMetadataQueryParams });
 
@@ -103,9 +100,8 @@ test.describe('blockscout provider', () => {
     await expect(component).toHaveScreenshot();
   });
 
-  test('no interpretation', async({ render, mockApiResponse, mockFeatures }) => {
+  test('no interpretation', async({ render, mockApiResponse }) => {
     // the action button should not render if there is no interpretation
-    await mockFeatures([ [ 'action_button_exp', true ] ]);
     const metadataResponse = generateAddressMetadataResponse(protocolTagWithMeta);
     await mockApiResponse('address_metadata_info', metadataResponse, { queryParams: addressMetadataQueryParams });
 

diff --git a/ui/tx/TxSubHeading.tsx b/ui/tx/TxSubHeading.tsx
@@ -3,7 +3,6 @@ import React from 'react';
 
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
-import useFeatureValue from 'lib/growthbook/useFeatureValue';
 import { NOVES_TRANSLATE } from 'stubs/noves/NovesTranslate';
 import { TX_INTERPRETATION } from 'stubs/txInterpretation';
 import AccountActionsMenu from 'ui/shared/AccountActionsMenu/AccountActionsMenu';
@@ -29,8 +28,7 @@ const TxSubHeading = ({ hash, hasTag, txQuery }: Props) => {
   const hasInterpretationFeature = feature.isEnabled;
   const isNovesInterpretation = hasInterpretationFeature && feature.provider === 'noves';
 
-  const { value: isActionButtonExperiment } = useFeatureValue('action_button_exp', false);
-  const appActionData = useAppActionData(txQuery.data?.to?.hash, isActionButtonExperiment && !txQuery.isPlaceholderData);
+  const appActionData = useAppActionData(txQuery.data?.to?.hash, !txQuery.isPlaceholderData);
 
   const txInterpretationQuery = useApiQuery('tx_interpretation', {
     pathParams: { hash },
@@ -127,7 +125,7 @@ const TxSubHeading = ({ hash, hasTag, txQuery }: Props) => {
         mt={{ base: 3, lg: 0 }}
       >
         { !hasTag && <AccountActionsMenu/> }
-        { (appActionData && isActionButtonExperiment && hasAnyInterpretation) && (
+        { (appActionData && hasAnyInterpretation) && (
           <AppActionButton data={ appActionData } txHash={ hash } source="Txn"/>
         ) }
         <NetworkExplorers type="tx" pathParam={ hash } ml={{ base: 0, lg: 'auto' }}/>