diff --git a/airflow-core/src/airflow/ui/src/components/AssetExpression/AssetNode.tsx b/airflow-core/src/airflow/ui/src/components/AssetExpression/AssetNode.tsx
index 6289309ec59f4..86a0a2e6e8b89 100644
--- a/airflow-core/src/airflow/ui/src/components/AssetExpression/AssetNode.tsx
+++ b/airflow-core/src/airflow/ui/src/components/AssetExpression/AssetNode.tsx
@@ -16,10 +16,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Box, Text, HStack, Link } from "@chakra-ui/react";
+import { Box, Text, HStack } from "@chakra-ui/react";
 import { FiDatabase } from "react-icons/fi";
 import { PiRectangleDashed } from "react-icons/pi";
-import { Link as RouterLink } from "react-router-dom";
+
+import { RouterLink } from "src/components/ui";
 
 import Time from "../Time";
 import type { AssetSummary, NextRunEvent } from "./types";
@@ -47,9 +48,9 @@ export const AssetNode = ({
       {"alias" in asset ? (
         <Text fontSize="sm">{asset.alias.name}</Text>
       ) : (
-        <Link asChild color="fg.info" display="block" py={2}>
-          <RouterLink to={`/assets/${asset.asset.id}`}>{asset.asset.name}</RouterLink>
-        </Link>
+        <RouterLink display="block" py={2} to={`/assets/${asset.asset.id}`}>
+          {asset.asset.name}
+        </RouterLink>
       )}
     </HStack>
     {event?.lastUpdate === undefined ? undefined : (
diff --git a/airflow-core/src/airflow/ui/src/components/Assets/TriggeredRuns.tsx b/airflow-core/src/airflow/ui/src/components/Assets/TriggeredRuns.tsx
index 1efb1ec8c5473..478cce363236d 100644
--- a/airflow-core/src/airflow/ui/src/components/Assets/TriggeredRuns.tsx
+++ b/airflow-core/src/airflow/ui/src/components/Assets/TriggeredRuns.tsx
@@ -16,12 +16,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Button, Flex, Link, Text } from "@chakra-ui/react";
+import { Button, Flex, Text } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink } from "react-router-dom";
 
 import type { DagRunAssetReference, DagRunState } from "openapi/requests/types.gen";
-import { Popover } from "src/components/ui";
+import { Popover, RouterLink } from "src/components/ui";
 
 import { StateBadge } from "../StateBadge";
 
@@ -40,11 +39,9 @@ export const TriggeredRuns = ({ dagRuns }: Props) => {
     <Flex gap={1}>
       <Text>{`${translate("triggered")} ${translate("dagRun_one")}`}: </Text>
       <StateBadge state={dagRuns[0]?.state as DagRunState} />
-      <Link asChild color="fg.info">
-        <RouterLink to={`/dags/${dagRuns[0]?.dag_id}/runs/${dagRuns[0]?.run_id}`}>
-          {dagRuns[0]?.dag_id}
-        </RouterLink>
-      </Link>
+      <RouterLink to={`/dags/${dagRuns[0]?.dag_id}/runs/${dagRuns[0]?.run_id}`}>
+        {dagRuns[0]?.dag_id}
+      </RouterLink>
     </Flex>
   ) : (
     // eslint-disable-next-line jsx-a11y/no-autofocus
@@ -60,9 +57,7 @@ export const TriggeredRuns = ({ dagRuns }: Props) => {
           {dagRuns.map((dagRun) => (
             <Flex gap={1} key={dagRun.dag_id} my={2}>
               <StateBadge state={dagRun.state as DagRunState} />
-              <Link asChild color="fg.info">
-                <RouterLink to={`/dags/${dagRun.dag_id}/runs/${dagRun.run_id}`}>{dagRun.dag_id}</RouterLink>
-              </Link>
+              <RouterLink to={`/dags/${dagRun.dag_id}/runs/${dagRun.run_id}`}>{dagRun.dag_id}</RouterLink>
             </Flex>
           ))}
         </Popover.Body>
diff --git a/airflow-core/src/airflow/ui/src/components/ui/RouterLink.tsx b/airflow-core/src/airflow/ui/src/components/ui/RouterLink.tsx
new file mode 100644
index 0000000000000..59d4a04366cb5
--- /dev/null
+++ b/airflow-core/src/airflow/ui/src/components/ui/RouterLink.tsx
@@ -0,0 +1,30 @@
+/*!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { Link as ChakraLink, type LinkProps as ChakraLinkProps } from "@chakra-ui/react";
+import { Link as ReactRouterLink, type To } from "react-router-dom";
+
+type RouterLinkProps = {
+  readonly to: To;
+} & Omit<ChakraLinkProps, "as" | "asChild" | "href">;
+
+export const RouterLink = ({ children, to, ...rest }: RouterLinkProps) => (
+  <ChakraLink asChild color="fg.info" {...rest}>
+    <ReactRouterLink to={to}>{children}</ReactRouterLink>
+  </ChakraLink>
+);
diff --git a/airflow-core/src/airflow/ui/src/components/ui/index.ts b/airflow-core/src/airflow/ui/src/components/ui/index.ts
index 4adadca3731ba..8569cce7df8d3 100644
--- a/airflow-core/src/airflow/ui/src/components/ui/index.ts
+++ b/airflow-core/src/airflow/ui/src/components/ui/index.ts
@@ -35,3 +35,4 @@ export * from "./ResetButton";
 export * from "./InputWithAddon";
 export * from "./ButtonGroupToggle";
 export * from "./LazyClipboard";
+export * from "./RouterLink";
diff --git a/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx b/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
index 95b9420b3d73b..9ddbe3d77ee0b 100644
--- a/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/AssetsList/AssetsList.tsx
@@ -16,10 +16,10 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Flex, Heading, Link, useDisclosure, VStack } from "@chakra-ui/react";
+import { Flex, Heading, useDisclosure, VStack } from "@chakra-ui/react";
 import type { ColumnDef } from "@tanstack/react-table";
 import { useTranslation } from "react-i18next";
-import { useSearchParams, Link as RouterLink } from "react-router-dom";
+import { useSearchParams } from "react-router-dom";
 
 import { useAssetServiceGetAssets } from "openapi/queries";
 import type { AssetResponse } from "openapi/requests/types.gen";
@@ -30,6 +30,7 @@ import { ExpandCollapseButtons } from "src/components/ExpandCollapseButtons";
 import RenderedJsonField from "src/components/RenderedJsonField";
 import { SearchBar } from "src/components/SearchBar";
 import Time from "src/components/Time";
+import { RouterLink } from "src/components/ui";
 import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
 import { useAdvancedSearch } from "src/hooks/useAdvancedSearch";
 import { CreateAssetEvent } from "src/pages/Asset/CreateAssetEvent";
@@ -45,9 +46,9 @@ const createColumns = (
   {
     accessorKey: "name",
     cell: ({ row: { original } }: AssetRow) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/assets/${original.id}`}>{original.name}</RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/assets/${original.id}`}>
+        {original.name}
+      </RouterLink>
     ),
     header: () => translate("name"),
   },
diff --git a/airflow-core/src/airflow/ui/src/pages/AssetsList/DependencyPopover.tsx b/airflow-core/src/airflow/ui/src/pages/AssetsList/DependencyPopover.tsx
index 9eee5e46404af..9eba94f2647b0 100644
--- a/airflow-core/src/airflow/ui/src/pages/AssetsList/DependencyPopover.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/AssetsList/DependencyPopover.tsx
@@ -16,12 +16,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Button, Link } from "@chakra-ui/react";
+import { Button } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink } from "react-router-dom";
 
 import type { DagScheduleAssetReference, TaskOutletAssetReference } from "openapi/requests/types.gen";
-import { Popover } from "src/components/ui";
+import { Popover, RouterLink } from "src/components/ui";
 
 type Props = {
   readonly dependencies: Array<DagScheduleAssetReference | TaskOutletAssetReference>;
@@ -57,9 +56,9 @@ export const DependencyPopover = ({ dependencies, type }: Props) => {
             }
 
             return (
-              <Link asChild color="fg.info" display="block" key={key} py={2}>
-                <RouterLink to={link}>{label}</RouterLink>
-              </Link>
+              <RouterLink display="block" key={key} py={2} to={link}>
+                {label}
+              </RouterLink>
             );
           })}
         </Popover.Body>
diff --git a/airflow-core/src/airflow/ui/src/pages/Dag/Header.tsx b/airflow-core/src/airflow/ui/src/pages/Dag/Header.tsx
index 7367e7ea0a816..c18671b3c6b06 100644
--- a/airflow-core/src/airflow/ui/src/pages/Dag/Header.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Dag/Header.tsx
@@ -16,10 +16,9 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Link } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
 import { FiBookOpen } from "react-icons/fi";
-import { useParams, Link as RouterLink } from "react-router-dom";
+import { useParams } from "react-router-dom";
 
 import type { DAGDetailsResponse, DagRunState } from "openapi/requests/types.gen";
 import { DagIcon } from "src/assets/DagIcon";
@@ -32,6 +31,7 @@ import { DagVersion } from "src/components/DagVersion";
 import DisplayMarkdownButton from "src/components/DisplayMarkdownButton";
 import { HeaderCard } from "src/components/HeaderCard";
 import { TogglePause } from "src/components/TogglePause";
+import { RouterLink } from "src/components/ui";
 
 import { DagOwners } from "../DagsList/DagOwners";
 import { DagTags } from "../DagsList/DagTags";
@@ -93,17 +93,15 @@ export const Header = ({
       label: translate("dagDetails.latestRun"),
       value:
         Boolean(latestRunInfo) && latestRunInfo !== undefined ? (
-          <Link asChild color="fg.info">
-            <RouterLink to={`/dags/${latestRunInfo.dag_id}/runs/${latestRunInfo.run_id}`}>
-              <DagRunInfo
-                endDate={latestRunInfo.end_date}
-                logicalDate={latestRunInfo.logical_date}
-                runAfter={latestRunInfo.run_after}
-                startDate={latestRunInfo.start_date}
-                state={latestRunInfo.state}
-              />
-            </RouterLink>
-          </Link>
+          <RouterLink to={`/dags/${latestRunInfo.dag_id}/runs/${latestRunInfo.run_id}`}>
+            <DagRunInfo
+              endDate={latestRunInfo.end_date}
+              logicalDate={latestRunInfo.logical_date}
+              runAfter={latestRunInfo.run_after}
+              startDate={latestRunInfo.start_date}
+              state={latestRunInfo.state}
+            />
+          </RouterLink>
         ) : undefined,
     },
     ...nextRunStat,
diff --git a/airflow-core/src/airflow/ui/src/pages/Dag/Overview/DeadlineRow.tsx b/airflow-core/src/airflow/ui/src/pages/Dag/Overview/DeadlineRow.tsx
index 011530f082cc6..3e47861c90d82 100644
--- a/airflow-core/src/airflow/ui/src/pages/Dag/Overview/DeadlineRow.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Dag/Overview/DeadlineRow.tsx
@@ -16,16 +16,16 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Badge, HStack, Link, Text, VStack } from "@chakra-ui/react";
+import { Badge, HStack, Text, VStack } from "@chakra-ui/react";
 import dayjs from "dayjs";
 import duration from "dayjs/plugin/duration";
 import relativeTime from "dayjs/plugin/relativeTime";
 import { useTranslation } from "react-i18next";
 import { FiAlertTriangle, FiClock } from "react-icons/fi";
-import { Link as RouterLink } from "react-router-dom";
 
 import type { DeadlineAlertResponse, DeadlineResponse } from "openapi/requests/types.gen";
 import Time from "src/components/Time";
+import { RouterLink } from "src/components/ui";
 
 dayjs.extend(duration);
 dayjs.extend(relativeTime);
@@ -53,11 +53,13 @@ export const DeadlineRow = ({ alert, deadline }: DeadlineRowProps) => {
             {deadline.missed ? <FiAlertTriangle /> : <FiClock />}
             {translate(deadline.missed ? "deadlineStatus.missed" : "deadlineStatus.upcoming")}
           </Badge>
-          <Link asChild color="fg.info" fontSize="sm" fontWeight="bold">
-            <RouterLink to={`/dags/${deadline.dag_id}/runs/${deadline.dag_run_id}`}>
-              {deadline.dag_run_id}
-            </RouterLink>
-          </Link>
+          <RouterLink
+            fontSize="sm"
+            fontWeight="bold"
+            to={`/dags/${deadline.dag_id}/runs/${deadline.dag_run_id}`}
+          >
+            {deadline.dag_run_id}
+          </RouterLink>
         </HStack>
         {reference !== undefined && interval !== undefined ? (
           <Text color="fg.muted" fontSize="xs">
diff --git a/airflow-core/src/airflow/ui/src/pages/Dag/Overview/TaskLogPreview.tsx b/airflow-core/src/airflow/ui/src/pages/Dag/Overview/TaskLogPreview.tsx
index e4ca4e1e966fb..efd38e01c5f00 100644
--- a/airflow-core/src/airflow/ui/src/pages/Dag/Overview/TaskLogPreview.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Dag/Overview/TaskLogPreview.tsx
@@ -16,15 +16,15 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Box, Flex, Link, Button } from "@chakra-ui/react";
+import { Box, Flex, Button } from "@chakra-ui/react";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink } from "react-router-dom";
 
 import type { TaskInstanceResponse } from "openapi/requests/types.gen";
 import { ClearTaskInstanceButton } from "src/components/Clear";
 import { StateBadge } from "src/components/StateBadge";
 import Time from "src/components/Time";
+import { RouterLink } from "src/components/ui";
 import { TaskLogContent } from "src/pages/TaskInstance/Logs/TaskLogContent";
 import { useLogs } from "src/queries/useLogs";
 import { getTaskInstanceLink } from "src/utils/links";
@@ -73,11 +73,9 @@ export const TaskLogPreview = ({
               : translate("overview.failedLogs.showLogs")}
           </Button>
           <ClearTaskInstanceButton taskInstance={taskInstance} />
-          <Link asChild color="fg.info" fontSize="sm">
-            <RouterLink to={getTaskInstanceLink(taskInstance)}>
-              {translate("overview.failedLogs.viewFullLogs")}
-            </RouterLink>
-          </Link>
+          <RouterLink fontSize="sm" to={getTaskInstanceLink(taskInstance)}>
+            {translate("overview.failedLogs.viewFullLogs")}
+          </RouterLink>
         </Flex>
       </Flex>
       {isExpanded ? (
diff --git a/airflow-core/src/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx b/airflow-core/src/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx
index 154e0394a2cb6..993044dc851bb 100644
--- a/airflow-core/src/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Dag/Tasks/Tasks.tsx
@@ -16,18 +16,18 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Box, Link } from "@chakra-ui/react";
+import { Box } from "@chakra-ui/react";
 import type { ColumnDef } from "@tanstack/react-table";
 import type { TFunction } from "i18next";
 import { useTranslation } from "react-i18next";
 import { useParams, useSearchParams } from "react-router-dom";
-import { Link as RouterLink } from "react-router-dom";
 
 import { useTaskServiceGetTasks } from "openapi/queries";
 import type { TaskResponse } from "openapi/requests/types.gen";
 import { DataTable } from "src/components/DataTable";
 import { ErrorAlert } from "src/components/ErrorAlert";
 import { TruncatedText } from "src/components/TruncatedText";
+import { RouterLink } from "src/components/ui";
 import { SearchParamsKeys } from "src/constants/searchParams.ts";
 import { TaskFilters } from "src/pages/Dag/Tasks/TaskFilters/TaskFilters.tsx";
 
@@ -43,11 +43,9 @@ const createColumns = ({
   {
     accessorKey: "task_display_name",
     cell: ({ row: { original } }: TaskRow) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/dags/${dagId}/tasks/${original.task_id}`}>
-          <TruncatedText text={original.task_display_name ?? original.task_id ?? ""} />
-        </RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/dags/${dagId}/tasks/${original.task_id}`}>
+        <TruncatedText text={original.task_display_name ?? original.task_id ?? ""} />
+      </RouterLink>
     ),
     enableSorting: false,
     header: translate("common:taskId"),
diff --git a/airflow-core/src/airflow/ui/src/pages/DagRuns.tsx b/airflow-core/src/airflow/ui/src/pages/DagRuns.tsx
index 11cb870f77c71..bc1aa2f3d14b9 100644
--- a/airflow-core/src/airflow/ui/src/pages/DagRuns.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/DagRuns.tsx
@@ -16,11 +16,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Flex, HStack, Link, Text } from "@chakra-ui/react";
+import { Flex, HStack, Text } from "@chakra-ui/react";
 import type { ColumnDef } from "@tanstack/react-table";
 import type { TFunction } from "i18next";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink, useParams, useSearchParams } from "react-router-dom";
+import { useParams, useSearchParams } from "react-router-dom";
 
 import { useDagRunServiceGetDagRuns } from "openapi/queries";
 import type { DAGRunResponse } from "openapi/requests/types.gen";
@@ -36,6 +36,7 @@ import { RunTypeIcon } from "src/components/RunTypeIcon";
 import { StateBadge } from "src/components/StateBadge";
 import Time from "src/components/Time";
 import { TruncatedText } from "src/components/TruncatedText";
+import { RouterLink } from "src/components/ui";
 import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
 import { useAdvancedSearchArg } from "src/hooks/useAdvancedSearch";
 import { DagRunsFilters } from "src/pages/DagRunsFilters";
@@ -73,11 +74,9 @@ const runColumns = (translate: TFunction, dagId?: string): Array<ColumnDef<DAGRu
         {
           accessorKey: "dag_display_name",
           cell: ({ row: { original } }: DagRunRow) => (
-            <Link asChild color="fg.info">
-              <RouterLink to={`/dags/${original.dag_id}`}>
-                <TruncatedText text={original.dag_display_name} />
-              </RouterLink>
-            </Link>
+            <RouterLink to={`/dags/${original.dag_id}`}>
+              <TruncatedText text={original.dag_display_name} />
+            </RouterLink>
           ),
           enableSorting: false,
           header: translate("dagId"),
@@ -86,22 +85,18 @@ const runColumns = (translate: TFunction, dagId?: string): Array<ColumnDef<DAGRu
   {
     accessorKey: "dag_run_id",
     cell: ({ row: { original } }: DagRunRow) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/dags/${original.dag_id}/runs/${original.dag_run_id}`}>
-          <TruncatedText text={original.dag_run_id} />
-        </RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/dags/${original.dag_id}/runs/${original.dag_run_id}`}>
+        <TruncatedText text={original.dag_run_id} />
+      </RouterLink>
     ),
     header: translate("dagRunId"),
   },
   {
     accessorKey: "run_after",
     cell: ({ row: { original } }: DagRunRow) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/dags/${original.dag_id}/runs/${original.dag_run_id}`}>
-          <Time datetime={original.run_after} />
-        </RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/dags/${original.dag_id}/runs/${original.dag_run_id}`}>
+        <Time datetime={original.run_after} />
+      </RouterLink>
     ),
     header: translate("dagRun.runAfter"),
   },
diff --git a/airflow-core/src/airflow/ui/src/pages/DagsList/AssetSchedule.tsx b/airflow-core/src/airflow/ui/src/pages/DagsList/AssetSchedule.tsx
index 78536cc1c1a46..f57d8e138d8ff 100644
--- a/airflow-core/src/airflow/ui/src/pages/DagsList/AssetSchedule.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/DagsList/AssetSchedule.tsx
@@ -16,18 +16,17 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Button, HStack, Link, Text } from "@chakra-ui/react";
+import { Button, HStack, Text } from "@chakra-ui/react";
 import dayjs from "dayjs";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { FiDatabase } from "react-icons/fi";
-import { Link as RouterLink } from "react-router-dom";
 
 import { useAssetServiceGetDagAssetQueuedEvents, useAssetServiceNextRunAssets } from "openapi/queries";
 import { AssetExpression, type ExpressionType } from "src/components/AssetExpression";
 import type { NextRunEvent } from "src/components/AssetExpression/types";
 import { TruncatedText } from "src/components/TruncatedText";
-import { Popover } from "src/components/ui";
+import { Popover, RouterLink } from "src/components/ui";
 
 import { PartitionScheduleModal } from "./PartitionScheduleModal";
 
@@ -128,11 +127,9 @@ export const AssetSchedule = ({ assetExpression, dagId, timetablePartitioned, ti
     return (
       <HStack>
         <FiDatabase style={{ display: "inline", flexShrink: 0 }} />
-        <Link asChild color="fg.info" display="block" fontSize="sm">
-          <RouterLink to={`/assets/${asset.id}`}>
-            <TruncatedText minWidth={0} text={asset.name ?? asset.uri} />
-          </RouterLink>
-        </Link>
+        <RouterLink display="block" fontSize="sm" to={`/assets/${asset.id}`}>
+          <TruncatedText minWidth={0} text={asset.name ?? asset.uri} />
+        </RouterLink>
       </HStack>
     );
   }
diff --git a/airflow-core/src/airflow/ui/src/pages/DagsList/DagCard.tsx b/airflow-core/src/airflow/ui/src/pages/DagsList/DagCard.tsx
index b8dbe516b8a19..aefe80c5aaae2 100644
--- a/airflow-core/src/airflow/ui/src/pages/DagsList/DagCard.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/DagsList/DagCard.tsx
@@ -16,9 +16,8 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Box, Flex, HStack, SimpleGrid, Link, Spinner } from "@chakra-ui/react";
+import { Box, Flex, HStack, SimpleGrid, Spinner } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink } from "react-router-dom";
 
 import type { DAGWithLatestDagRunsResponse } from "openapi/requests/types.gen";
 import { DeleteDagButton } from "src/components/DagActions/DeleteDagButton";
@@ -28,7 +27,7 @@ import { NeedsReviewBadge } from "src/components/NeedsReviewBadge";
 import { Stat } from "src/components/Stat";
 import { TogglePause } from "src/components/TogglePause";
 import { TriggerDAGButton } from "src/components/TriggerDag/TriggerDAGButton";
-import { Tooltip } from "src/components/ui";
+import { RouterLink, Tooltip } from "src/components/ui";
 import { isStatePending, useAutoRefresh } from "src/utils";
 
 import { DagTags } from "./DagTags";
@@ -50,11 +49,9 @@ export const DagCard = ({ dag }: Props) => {
       <Flex alignItems="center" bg="bg.muted" justifyContent="space-between" px={3} py={1}>
         <HStack>
           <Tooltip content={dag.description} disabled={!Boolean(dag.description)}>
-            <Link asChild color="fg.info" fontWeight="bold">
-              <RouterLink data-testid="dag-id" to={`/dags/${dag.dag_id}`}>
-                {dag.dag_display_name}
-              </RouterLink>
-            </Link>
+            <RouterLink color="fg.info" data-testid="dag-id" fontWeight="bold" to={`/dags/${dag.dag_id}`}>
+              {dag.dag_display_name}
+            </RouterLink>
           </Tooltip>
           <DagTags tags={dag.tags} />
         </HStack>
@@ -83,20 +80,18 @@ export const DagCard = ({ dag }: Props) => {
         </Stat>
         <Stat data-testid="latest-run" label={translate("dagDetails.latestRun")}>
           {latestRun ? (
-            <Link asChild color="fg.info">
-              <RouterLink to={`/dags/${latestRun.dag_id}/runs/${latestRun.run_id}`}>
-                <DagRunInfo
-                  endDate={latestRun.end_date}
-                  logicalDate={latestRun.logical_date}
-                  runAfter={latestRun.run_after}
-                  startDate={latestRun.start_date}
-                  state={latestRun.state}
-                />
-                {isStatePending(latestRun.state) && !dag.is_paused && Boolean(refetchInterval) ? (
-                  <Spinner />
-                ) : undefined}
-              </RouterLink>
-            </Link>
+            <RouterLink to={`/dags/${latestRun.dag_id}/runs/${latestRun.run_id}`}>
+              <DagRunInfo
+                endDate={latestRun.end_date}
+                logicalDate={latestRun.logical_date}
+                runAfter={latestRun.run_after}
+                startDate={latestRun.start_date}
+                state={latestRun.state}
+              />
+              {isStatePending(latestRun.state) && !dag.is_paused && Boolean(refetchInterval) ? (
+                <Spinner />
+              ) : undefined}
+            </RouterLink>
           ) : undefined}
         </Stat>
         <Stat data-testid="next-run" label={translate("dagDetails.nextRun")}>
diff --git a/airflow-core/src/airflow/ui/src/pages/DagsList/DagOwners.tsx b/airflow-core/src/airflow/ui/src/pages/DagsList/DagOwners.tsx
index e4102eb22de6c..c0049c224f69e 100644
--- a/airflow-core/src/airflow/ui/src/pages/DagsList/DagOwners.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/DagsList/DagOwners.tsx
@@ -18,9 +18,9 @@
  */
 import { Link } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink } from "react-router-dom";
 
 import { LimitedItemsList } from "src/components/LimitedItemsList";
+import { RouterLink } from "src/components/ui";
 import { getSafeExternalUrl } from "src/utils/links";
 
 const DEFAULT_OWNERS: Array<string> = [];
@@ -52,9 +52,9 @@ export const DagOwners = ({
         {owner}
       </Link>
     ) : (
-      <Link asChild color="fg.info" key={owner}>
-        <RouterLink to={ownerFilterLink}>{owner}</RouterLink>
-      </Link>
+      <RouterLink key={owner} to={ownerFilterLink}>
+        {owner}
+      </RouterLink>
     );
   });
 
diff --git a/airflow-core/src/airflow/ui/src/pages/DagsList/DagTags.tsx b/airflow-core/src/airflow/ui/src/pages/DagsList/DagTags.tsx
index 01a0a207cf30f..d978b558705a6 100644
--- a/airflow-core/src/airflow/ui/src/pages/DagsList/DagTags.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/DagsList/DagTags.tsx
@@ -16,12 +16,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Link } from "@chakra-ui/react";
 import { FiTag } from "react-icons/fi";
-import { Link as RouterLink } from "react-router-dom";
 
 import type { DagTagResponse } from "openapi/requests/types.gen";
 import { LimitedItemsList } from "src/components/LimitedItemsList";
+import { RouterLink } from "src/components/ui";
 import { SearchParamsKeys } from "src/constants/searchParams";
 
 const MAX_TAGS = 3;
@@ -36,9 +35,9 @@ export const DagTags = ({ hideIcon = false, tags }: Props) => (
     icon={hideIcon ? undefined : <FiTag data-testid="dag-tag" />}
     interactive
     items={tags.map(({ name }) => (
-      <Link asChild color="fg.info" key={name}>
-        <RouterLink to={`/dags?${SearchParamsKeys.TAGS}=${encodeURIComponent(name)}`}>{name}</RouterLink>
-      </Link>
+      <RouterLink key={name} to={`/dags?${SearchParamsKeys.TAGS}=${encodeURIComponent(name)}`}>
+        {name}
+      </RouterLink>
     ))}
     maxItems={MAX_TAGS}
   />
diff --git a/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx b/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx
index deda3679f65ae..29af6d24f2839 100644
--- a/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/DagsList/DagsList.tsx
@@ -16,18 +16,10 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import {
-  Heading,
-  HStack,
-  Skeleton,
-  VStack,
-  Link,
-  type SelectValueChangeDetails,
-  Box,
-} from "@chakra-ui/react";
+import { Heading, HStack, Skeleton, VStack, type SelectValueChangeDetails, Box } from "@chakra-ui/react";
 import type { ColumnDef } from "@tanstack/react-table";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink, useSearchParams } from "react-router-dom";
+import { useSearchParams } from "react-router-dom";
 import { useLocalStorage } from "usehooks-ts";
 
 import type { DagRunState, DAGWithLatestDagRunsResponse } from "openapi/requests/types.gen";
@@ -42,6 +34,7 @@ import { NeedsReviewBadge } from "src/components/NeedsReviewBadge";
 import { SearchBar } from "src/components/SearchBar";
 import { TogglePause } from "src/components/TogglePause";
 import { TriggerDAGButton } from "src/components/TriggerDag/TriggerDAGButton";
+import { RouterLink } from "src/components/ui";
 import { DAGS_LIST_DISPLAY_KEY } from "src/constants/localStorage";
 import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
 import { useAdvancedSearch } from "src/hooks/useAdvancedSearch";
@@ -78,9 +71,9 @@ const createColumns = (
   {
     accessorKey: "dag_display_name",
     cell: ({ row: { original } }) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/dags/${original.dag_id}`}>{original.dag_display_name}</RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/dags/${original.dag_id}`}>
+        {original.dag_display_name}
+      </RouterLink>
     ),
     header: () => translate("dagId"),
   },
@@ -113,17 +106,18 @@ const createColumns = (
     accessorKey: "last_run_start_date",
     cell: ({ row: { original } }) =>
       original.latest_dag_runs[0] ? (
-        <Link asChild color="fg.info" fontWeight="bold">
-          <RouterLink to={`/dags/${original.dag_id}/runs/${original.latest_dag_runs[0].run_id}`}>
-            <DagRunInfo
-              endDate={original.latest_dag_runs[0].end_date}
-              logicalDate={original.latest_dag_runs[0].logical_date}
-              runAfter={original.latest_dag_runs[0].run_after}
-              startDate={original.latest_dag_runs[0].start_date}
-              state={original.latest_dag_runs[0].state}
-            />
-          </RouterLink>
-        </Link>
+        <RouterLink
+          fontWeight="bold"
+          to={`/dags/${original.dag_id}/runs/${original.latest_dag_runs[0].run_id}`}
+        >
+          <DagRunInfo
+            endDate={original.latest_dag_runs[0].end_date}
+            logicalDate={original.latest_dag_runs[0].logical_date}
+            runAfter={original.latest_dag_runs[0].run_after}
+            startDate={original.latest_dag_runs[0].start_date}
+            state={original.latest_dag_runs[0].state}
+          />
+        </RouterLink>
       ) : undefined,
     header: () => translate("dagDetails.latestRun"),
   },
diff --git a/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx b/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx
index 9955ad82a8d10..b306bcfe3cdb1 100644
--- a/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Dashboard/PoolSummary/PoolSummary.tsx
@@ -16,15 +16,15 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Box, Heading, Flex, Skeleton, Link } from "@chakra-ui/react";
+import { Box, Heading, Flex, Skeleton } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
 import { BiTargetLock } from "react-icons/bi";
-import { Link as RouterLink } from "react-router-dom";
 
 import { type PoolServiceGetPoolsDefaultResponse, useAuthLinksServiceGetAuthMenus } from "openapi/queries";
 import { usePoolServiceGetPools } from "openapi/queries/queries";
 import type { ApiError } from "openapi/requests";
 import { PoolBar, UNLIMITED_SLOTS } from "src/components/PoolBar";
+import { RouterLink } from "src/components/ui";
 import { useAutoRefresh } from "src/utils";
 import { type Slots, slotKeys } from "src/utils/slots";
 
@@ -98,9 +98,9 @@ export const PoolSummary = () => {
           </Heading>
         </Flex>
         {hasPoolsAccess ? (
-          <Link asChild color="fg.info" fontSize="xs" h={4}>
-            <RouterLink to="/pools">{translate("managePools")}</RouterLink>
-          </Link>
+          <RouterLink fontSize="xs" h={4} to="/pools">
+            {translate("managePools")}
+          </RouterLink>
         ) : undefined}
       </Flex>
 
diff --git a/airflow-core/src/airflow/ui/src/pages/HITLTaskInstances/HITLTaskInstances.tsx b/airflow-core/src/airflow/ui/src/pages/HITLTaskInstances/HITLTaskInstances.tsx
index 4538bc204af22..e9e0e86e4d29a 100644
--- a/airflow-core/src/airflow/ui/src/pages/HITLTaskInstances/HITLTaskInstances.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/HITLTaskInstances/HITLTaskInstances.tsx
@@ -16,11 +16,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Link, VStack } from "@chakra-ui/react";
+import { VStack } from "@chakra-ui/react";
 import type { ColumnDef } from "@tanstack/react-table";
 import type { TFunction } from "i18next";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink, useParams, useSearchParams } from "react-router-dom";
+import { useParams, useSearchParams } from "react-router-dom";
 
 import { useTaskInstanceServiceGetHitlDetails } from "openapi/queries";
 import type { HITLDetail } from "openapi/requests/types.gen";
@@ -30,6 +30,7 @@ import { ErrorAlert } from "src/components/ErrorAlert";
 import { StateBadge } from "src/components/StateBadge";
 import Time from "src/components/Time";
 import { TruncatedText } from "src/components/TruncatedText";
+import { RouterLink } from "src/components/ui";
 import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
 import { useAdvancedSearchArg } from "src/hooks/useAdvancedSearch";
 import { useAutoRefresh } from "src/utils";
@@ -74,11 +75,9 @@ const taskInstanceColumns = ({
   {
     accessorKey: "subject",
     cell: ({ row: { original } }: HITLRow) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`${getTaskInstanceLink(original.task_instance)}/required_actions`}>
-          <TruncatedText text={original.subject} />
-        </RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`${getTaskInstanceLink(original.task_instance)}/required_actions`}>
+        <TruncatedText text={original.subject} />
+      </RouterLink>
     ),
     header: translate("subject"),
   },
@@ -88,11 +87,9 @@ const taskInstanceColumns = ({
         {
           accessorKey: "task_instance.dag_id",
           cell: ({ row: { original } }: HITLRow) => (
-            <Link asChild color="fg.info">
-              <RouterLink to={`/dags/${original.task_instance.dag_id}`}>
-                <TruncatedText text={original.task_instance.dag_display_name} />
-              </RouterLink>
-            </Link>
+            <RouterLink to={`/dags/${original.task_instance.dag_id}`}>
+              <TruncatedText text={original.task_instance.dag_display_name} />
+            </RouterLink>
           ),
           enableSorting: false,
           header: translate("common:dagId"),
@@ -104,13 +101,11 @@ const taskInstanceColumns = ({
         {
           accessorKey: "run_id",
           cell: ({ row: { original } }: HITLRow) => (
-            <Link asChild color="fg.info">
-              <RouterLink
-                to={`/dags/${original.task_instance.dag_id}/runs/${original.task_instance.dag_run_id}`}
-              >
-                <TruncatedText text={original.task_instance.dag_run_id} />
-              </RouterLink>
-            </Link>
+            <RouterLink
+              to={`/dags/${original.task_instance.dag_id}/runs/${original.task_instance.dag_run_id}`}
+            >
+              <TruncatedText text={original.task_instance.dag_run_id} />
+            </RouterLink>
           ),
           header: translate("common:dagRunId"),
         },
@@ -130,11 +125,12 @@ const taskInstanceColumns = ({
         {
           accessorKey: "task_display_name",
           cell: ({ row: { original } }: HITLRow) => (
-            <Link asChild color="fg.info" fontWeight="bold">
-              <RouterLink to={`${getTaskInstanceLink(original.task_instance)}/required_actions`}>
-                <TruncatedText text={original.task_instance.task_display_name} />
-              </RouterLink>
-            </Link>
+            <RouterLink
+              fontWeight="bold"
+              to={`${getTaskInstanceLink(original.task_instance)}/required_actions`}
+            >
+              <TruncatedText text={original.task_instance.task_display_name} />
+            </RouterLink>
           ),
           header: translate("common:taskId"),
         },
diff --git a/airflow-core/src/airflow/ui/src/pages/Run/Header.tsx b/airflow-core/src/airflow/ui/src/pages/Run/Header.tsx
index 6b29ba5187330..3f83146927c4d 100644
--- a/airflow-core/src/airflow/ui/src/pages/Run/Header.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/Run/Header.tsx
@@ -16,11 +16,10 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { HStack, Text, Box, Link } from "@chakra-ui/react";
+import { HStack, Text, Box } from "@chakra-ui/react";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { FiBarChart } from "react-icons/fi";
-import { Link as RouterLink } from "react-router-dom";
 
 import { useDeadlinesServiceGetDagDeadlineAlerts } from "openapi/queries";
 import type { DAGRunResponse } from "openapi/requests/types.gen";
@@ -32,6 +31,7 @@ import { LimitedItemsList } from "src/components/LimitedItemsList";
 import { MarkRunAsButton } from "src/components/MarkAs";
 import { RunTypeIcon } from "src/components/RunTypeIcon";
 import Time from "src/components/Time";
+import { RouterLink } from "src/components/ui";
 import { SearchParamsKeys } from "src/constants/searchParams";
 import DeleteRunButton from "src/pages/DeleteRunButton";
 import { usePatchDagRun } from "src/queries/usePatchDagRun";
@@ -124,13 +124,11 @@ export const Header = ({ dagRun }: { readonly dagRun: DAGRunResponse }) => {
                 {
                   label: translate("dagRun.triggeringUser"),
                   value: (
-                    <Link asChild color="fg.info">
-                      <RouterLink
-                        to={`/dag_runs?${SearchParamsKeys.TRIGGERING_USER_NAME_PATTERN}=${encodeURIComponent(dagRun.triggering_user_name)}`}
-                      >
-                        <Text>{dagRun.triggering_user_name}</Text>
-                      </RouterLink>
-                    </Link>
+                    <RouterLink
+                      to={`/dag_runs?${SearchParamsKeys.TRIGGERING_USER_NAME_PATTERN}=${encodeURIComponent(dagRun.triggering_user_name)}`}
+                    >
+                      <Text>{dagRun.triggering_user_name}</Text>
+                    </RouterLink>
                   ),
                 },
               ]),
diff --git a/airflow-core/src/airflow/ui/src/pages/TaskInstances/TaskInstances.tsx b/airflow-core/src/airflow/ui/src/pages/TaskInstances/TaskInstances.tsx
index 2f75a9ab0caf0..e2a567377688a 100644
--- a/airflow-core/src/airflow/ui/src/pages/TaskInstances/TaskInstances.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/TaskInstances/TaskInstances.tsx
@@ -16,11 +16,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Flex, Link } from "@chakra-ui/react";
+import { Flex } from "@chakra-ui/react";
 import type { ColumnDef } from "@tanstack/react-table";
 import type { TFunction } from "i18next";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink, useParams, useSearchParams } from "react-router-dom";
+import { useParams, useSearchParams } from "react-router-dom";
 
 import { useTaskInstanceServiceGetTaskInstances } from "openapi/queries";
 import type { TaskInstanceResponse } from "openapi/requests/types.gen";
@@ -34,6 +34,7 @@ import { MarkTaskInstanceAsButton } from "src/components/MarkAs";
 import { StateBadge } from "src/components/StateBadge";
 import Time from "src/components/Time";
 import { TruncatedText } from "src/components/TruncatedText";
+import { RouterLink } from "src/components/ui";
 import { ActionBar } from "src/components/ui/ActionBar";
 import { Checkbox } from "src/components/ui/Checkbox";
 import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
@@ -117,11 +118,9 @@ const taskInstanceColumns = ({
         {
           accessorKey: "dag_display_name",
           cell: ({ row: { original } }: TaskInstanceRow) => (
-            <Link asChild color="fg.info">
-              <RouterLink to={`/dags/${original.dag_id}`}>
-                <TruncatedText text={original.dag_display_name} />
-              </RouterLink>
-            </Link>
+            <RouterLink to={`/dags/${original.dag_id}`}>
+              <TruncatedText text={original.dag_display_name} />
+            </RouterLink>
           ),
           enableSorting: false,
           header: translate("dagId"),
@@ -134,11 +133,9 @@ const taskInstanceColumns = ({
           accessorKey: "run_after",
           cell: ({ row: { original } }: TaskInstanceRow) =>
             Boolean(taskId) ? (
-              <Link asChild color="fg.info" fontWeight="bold">
-                <RouterLink to={getTaskInstanceLink(original)}>
-                  <Time datetime={original.run_after} />
-                </RouterLink>
-              </Link>
+              <RouterLink fontWeight="bold" to={getTaskInstanceLink(original)}>
+                <Time datetime={original.run_after} />
+              </RouterLink>
             ) : (
               <Time datetime={original.run_after} />
             ),
@@ -151,11 +148,9 @@ const taskInstanceColumns = ({
         {
           accessorKey: "task_display_name",
           cell: ({ row: { original } }: TaskInstanceRow) => (
-            <Link asChild color="fg.info" fontWeight="bold">
-              <RouterLink to={getTaskInstanceLink(original)}>
-                <TruncatedText text={original.task_display_name} />
-              </RouterLink>
-            </Link>
+            <RouterLink fontWeight="bold" to={getTaskInstanceLink(original)}>
+              <TruncatedText text={original.task_display_name} />
+            </RouterLink>
           ),
           enableSorting: false,
           header: translate("taskId"),
@@ -182,11 +177,9 @@ const taskInstanceColumns = ({
     accessorKey: "start_date",
     cell: ({ row: { original } }) =>
       Boolean(taskId) && Boolean(runId) ? (
-        <Link asChild color="fg.info" fontWeight="bold">
-          <RouterLink to={getTaskInstanceLink(original)}>
-            <Time datetime={original.start_date} />
-          </RouterLink>
-        </Link>
+        <RouterLink fontWeight="bold" to={getTaskInstanceLink(original)}>
+          <Time datetime={original.start_date} />
+        </RouterLink>
       ) : (
         <Time datetime={original.start_date} />
       ),
diff --git a/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx b/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx
index c9465ab3c3e5f..cecc75f7bbbfe 100644
--- a/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx
+++ b/airflow-core/src/airflow/ui/src/pages/XCom/XCom.tsx
@@ -16,10 +16,10 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Box, Flex, Heading, Link, useDisclosure } from "@chakra-ui/react";
+import { Box, Flex, Heading, useDisclosure } from "@chakra-ui/react";
 import type { ColumnDef } from "@tanstack/react-table";
 import { useTranslation } from "react-i18next";
-import { Link as RouterLink, useParams, useSearchParams } from "react-router-dom";
+import { useParams, useSearchParams } from "react-router-dom";
 
 import { useXcomServiceGetXcomEntries } from "openapi/queries";
 import type { XComResponse } from "openapi/requests/types.gen";
@@ -29,6 +29,7 @@ import { ErrorAlert } from "src/components/ErrorAlert";
 import { ExpandCollapseButtons } from "src/components/ExpandCollapseButtons";
 import Time from "src/components/Time";
 import { TruncatedText } from "src/components/TruncatedText";
+import { RouterLink } from "src/components/ui";
 import { SearchParamsKeys, type SearchParamsKeysType } from "src/constants/searchParams";
 import { useAdvancedSearchArg } from "src/hooks/useAdvancedSearch";
 import { getTaskInstanceLink } from "src/utils/links";
@@ -60,49 +61,44 @@ const getColumns = ({ open, translate }: ColumnsProps): Array<ColumnDef<XComResp
   {
     accessorKey: "dag_id",
     cell: ({ row: { original } }) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/dags/${original.dag_id}`}>{original.dag_display_name}</RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/dags/${original.dag_id}`}>
+        {original.dag_display_name}
+      </RouterLink>
     ),
     header: translate("xcom.columns.dag"),
   },
   {
     accessorKey: "run_id",
     cell: ({ row: { original } }: { row: { original: XComResponse } }) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/dags/${original.dag_id}/runs/${original.run_id}`}>
-          <TruncatedText text={original.run_id} />
-        </RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/dags/${original.dag_id}/runs/${original.run_id}`}>
+        <TruncatedText text={original.run_id} />
+      </RouterLink>
     ),
     header: translate("common:dagRunId"),
   },
   {
     accessorKey: "run_after",
     cell: ({ row: { original } }: { row: { original: XComResponse } }) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink to={`/dags/${original.dag_id}/runs/${original.run_id}`}>
-          <Time datetime={original.run_after} />
-        </RouterLink>
-      </Link>
+      <RouterLink fontWeight="bold" to={`/dags/${original.dag_id}/runs/${original.run_id}`}>
+        <Time datetime={original.run_after} />
+      </RouterLink>
     ),
     header: translate("common:dagRun.runAfter"),
   },
   {
     accessorKey: "task_display_name",
     cell: ({ row: { original } }: { row: { original: XComResponse } }) => (
-      <Link asChild color="fg.info" fontWeight="bold">
-        <RouterLink
-          to={getTaskInstanceLink({
-            dagId: original.dag_id,
-            dagRunId: original.run_id,
-            mapIndex: original.map_index,
-            taskId: original.task_id,
-          })}
-        >
-          <TruncatedText text={original.task_display_name} />
-        </RouterLink>
-      </Link>
+      <RouterLink
+        fontWeight="bold"
+        to={getTaskInstanceLink({
+          dagId: original.dag_id,
+          dagRunId: original.run_id,
+          mapIndex: original.map_index,
+          taskId: original.task_id,
+        })}
+      >
+        <TruncatedText text={original.task_display_name} />
+      </RouterLink>
     ),
     header: translate("common:task_one"),
   },
