diff --git a/packages/web/src/components/tooltip/Tooltip.tsx b/packages/web/src/components/tooltip/Tooltip.tsx
index 5558594d670..10cbe75d68d 100644
--- a/packages/web/src/components/tooltip/Tooltip.tsx
+++ b/packages/web/src/components/tooltip/Tooltip.tsx
@@ -4,6 +4,8 @@ import { useTheme } from '@emotion/react'
 import AntTooltip from 'antd/lib/tooltip'
 import cn from 'classnames'
 
+import { useSsrContext } from 'ssr/SsrContext'
+
 import styles from './Tooltip.module.css'
 import { TooltipProps } from './types'
 
@@ -23,6 +25,7 @@ export const Tooltip = ({
 }: TooltipProps) => {
   // Keep track of a hidden state ourselves so we can dismiss the tooltip on click
   const [isHiddenOverride, setIsHiddenOverride] = useState(false)
+  const { isServerSide } = useSsrContext()
 
   const theme = useTheme()
 
@@ -89,7 +92,9 @@ export const Tooltip = ({
     visibility: isHiddenOverride ? 'hidden' : 'visible'
   } as CSSProperties
 
-  return (
+  return isServerSide ? (
+    <>{children}</>
+  ) : (
     <AntTooltip
       {...visibleProps}
       overlayStyle={overlayStyle}
diff --git a/packages/web/src/hooks/useTabs/useTabs.tsx b/packages/web/src/hooks/useTabs/useTabs.tsx
index bb35a74234b..aaf2dfc0957 100644
--- a/packages/web/src/hooks/useTabs/useTabs.tsx
+++ b/packages/web/src/hooks/useTabs/useTabs.tsx
@@ -21,7 +21,6 @@ import { throttle } from 'lodash'
 import { animated, useTransition, useSpring } from 'react-spring'
 import { useDrag } from 'react-use-gesture'
 
-import { ClientOnly } from 'components/client-only/ClientOnly'
 import { SeoLink } from 'components/link'
 import Tooltip from 'components/tooltip/Tooltip'
 
@@ -269,21 +268,20 @@ const TabBar = memo(
           }
 
           return (
-            <ClientOnly key={i}>
-              <Tooltip
-                text={tab.disabledTooltipText || disabledTabTooltipText}
-                placement='bottom'
-                disabled={!tooltipActive}
-              >
-                {to && pathname ? (
-                  <SeoLink {...rootProps} to={`${pathname}/${to}`}>
-                    {tabElement}
-                  </SeoLink>
-                ) : (
-                  <div {...rootProps}>{tabElement}</div>
-                )}
-              </Tooltip>
-            </ClientOnly>
+            <Tooltip
+              text={tab.disabledTooltipText || disabledTabTooltipText}
+              placement='bottom'
+              disabled={!tooltipActive}
+              key={i}
+            >
+              {to && pathname ? (
+                <SeoLink {...rootProps} to={`${pathname}/${to}`}>
+                  {tabElement}
+                </SeoLink>
+              ) : (
+                <div {...rootProps}>{tabElement}</div>
+              )}
+            </Tooltip>
           )
         })}
       </div>