feat: components for only infra or ipfs render modes

features/withdrawals/request/form/options/lido-option.tsx

@@ -19,6 +19,7 @@ import {
   LidoOptionValue,
   LidoOptionInlineLoader,
 } from './styles';
+import { OnlyInfraRender } from 'shared/components/only-infra-render';
 
 const TooltipWithdrawalAmount = () => {
   const { navigateInpageAnchor } = useInpageNavigation();
@@ -29,19 +30,21 @@ const TooltipWithdrawalAmount = () => {
       title={
         <>
           The final amount of claimable ETH can differ
-          <br /> For more info, please read{' '}
-          <a
-            data-testid="lidoOptionToolTipFAQ"
-            href="#amountDifferentFromRequested"
-            onClick={(e) => {
-              trackMatomoEvent(
-                MATOMO_CLICK_EVENTS_TYPES.withdrawalFAQtooltipEthAmount,
-              );
-              navigateInpageAnchor(e);
-            }}
-          >
-            FAQ
-          </a>
+          <OnlyInfraRender>
+            <br /> For more info, please read{' '}
+            <a
+              data-testid="lidoOptionToolTipFAQ"
+              href="#amountDifferentFromRequested"
+              onClick={(e) => {
+                trackMatomoEvent(
+                  MATOMO_CLICK_EVENTS_TYPES.withdrawalFAQtooltipEthAmount,
+                );
+                navigateInpageAnchor(e);
+              }}
+            >
+              FAQ
+            </a>
+          </OnlyInfraRender>
         </>
       }
     >

features/withdrawals/request/wallet/wallet-queue-tooltip.tsx

@@ -10,6 +10,8 @@ import {
 import { QueueInfoStyled, DataTableRowStyled } from './styles';
 import { useRequestFormData } from '../request-form-context';
 import { useInpageNavigation } from 'providers/inpage-navigation';
+import { OnlyIpfsRender } from 'shared/components/only-ipfs-render';
+import { OnlyInfraRender } from 'shared/components/only-infra-render';
 
 export const WalletQueueTooltip = () => {
   const waitingTime = useWaitingTime('');
@@ -38,19 +40,21 @@ export const WalletQueueTooltip = () => {
   const tooltipTitle = (
     <>
       The withdrawal request time depends on the mode, overall amount of stETH
-      in queue and{' '}
-      <a
-        href="#withdrawalsPeriod"
-        data-testid="otherFactorsLink"
-        onClick={(e) => {
-          trackMatomoEvent(
-            MATOMO_CLICK_EVENTS_TYPES.withdrawalOtherFactorsTooltipMode,
-          );
-          navigateInpageAnchor(e);
-        }}
-      >
-        other factors
-      </a>
+      in queue and <OnlyIpfsRender>other factors</OnlyIpfsRender>
+      <OnlyInfraRender>
+        <a
+          href="#withdrawalsPeriod"
+          data-testid="otherFactorsLink"
+          onClick={(e) => {
+            trackMatomoEvent(
+              MATOMO_CLICK_EVENTS_TYPES.withdrawalOtherFactorsTooltipMode,
+            );
+            navigateInpageAnchor(e);
+          }}
+        >
+          other factors
+        </a>
+      </OnlyInfraRender>
       .{queueInfo}
     </>
   );

shared/components/only-infra-render/index.ts

@@ -0,0 +1 @@
+export * from './only-infra-render';

shared/components/only-infra-render/only-infra-render.tsx

@@ -0,0 +1,5 @@
+import { dynamics } from 'config';
+
+export const OnlyInfraRender = ({ children }: React.PropsWithChildren) => {
+  return !dynamics.ipfsMode ? <>{children}</> : null;
+};

shared/components/only-ipfs-render/index.ts

@@ -0,0 +1 @@
+export * from './only-ipfs-render';

shared/components/only-ipfs-render/only-ipfs-render.tsx

@@ -0,0 +1,5 @@
+import { dynamics } from 'config';
+
+export const OnlyIpfsRender = ({ children }: React.PropsWithChildren) => {
+  return dynamics.ipfsMode ? <>{children}</> : null;
+};