Merge pull request #13582 from ethereum/fix-glossary-tooltip

Fix glossary tooltip links

Author: wackerow

src/components/Glossary/GlossaryTooltip/index.tsx

@@ -3,6 +3,7 @@ import { useRouter } from "next/router"
 import { Box, Text, VStack } from "@chakra-ui/react"
 
 import Heading from "@/components/Heading"
+import InlineLink from "@/components/Link"
 import Tooltip, { type TooltipProps } from "@/components/Tooltip"
 import Translation from "@/components/Translation"
 
@@ -31,6 +32,9 @@ const GlossaryTooltip = ({
               <Translation
                 id={termKey + "-term"}
                 options={{ ns: "glossary-tooltip" }}
+                // Override the default `a` tag transformation to avoid circular
+                // dependency issues
+                transform={{ a: InlineLink }}
               />
             </Heading>
             {/**
@@ -43,6 +47,9 @@ const GlossaryTooltip = ({
               <Translation
                 id={termKey + "-definition"}
                 options={{ ns: "glossary-tooltip" }}
+                // Override the default `a` tag transformation to avoid circular
+                // dependency issues
+                transform={{ a: InlineLink }}
               />
             </Text>
           </VStack>

src/components/Roadmap/RoadmapActionCard/RoadmapActionCard.stories.tsx

@@ -1,8 +1,6 @@
 import { Box, SimpleGrid } from "@chakra-ui/react"
 import type { Meta, StoryObj } from "@storybook/react"
 
-import { ContentContainer } from "@/components/MdComponents"
-
 import RoadmapActionCardComponent from "."
 
 const meta = {
@@ -11,11 +9,11 @@ const meta = {
   decorators: [
     (Story) => (
       <Box maxW="1008px">
-        <ContentContainer>
+        <div>
           <SimpleGrid columns={{ base: 1, md: 2 }} spacing={8}>
             <Story />
           </SimpleGrid>
-        </ContentContainer>
+        </div>
       </Box>
     ),
   ],

src/components/Translation.tsx

@@ -5,7 +5,7 @@ import { useTranslation } from "next-i18next"
 
 import { getRequiredNamespacesForPage } from "@/lib/utils/translations"
 
-import InlineLink from "./Link"
+import TooltipLink from "./TooltipLink"
 
 type TranslationProps = {
   id: string
@@ -16,7 +16,7 @@ type TranslationProps = {
 // Custom components mapping to be used by `htmr` when parsing the translation
 // text
 const defaultTransform = {
-  a: InlineLink,
+  a: TooltipLink,
 }
 
 // Renders the translation string for the given translation key `id`. It