namehash · Y3drk · Jun 3, 2026 · Jun 1, 2026 · Jun 1, 2026 · Jun 1, 2026
@@ -79,11 +79,12 @@ export default defineConfig({
       "/docs/services/ensrainbow/concepts/label-sets-and-versioning",
     "/docs/reference/rest-api": "/docs/services/ensapi/reference/api-reference",
     "/docs/integrate/hosted-instances": "/docs/hosted-instances",
-    "/docs/integrate/migrate-from-subgraph": "/docs/integrate/ensv2-readiness",
-    "/docs/reference/ensnode-v2-notes": "/docs/integrate/ensv2-readiness",
+    "/docs/integrate/migrate-from-subgraph": "/docs/integrate/why-ensnode/ensv2-readiness",
+    "/docs/reference/ensnode-v2-notes": "/docs/integrate/why-ensnode/ensv2-readiness",
     "/docs/reference/mainnet-registered-subnames-of-subregistries": "/docs/integrate/omnigraph",
-    "/docs/reference/roadmap": "/docs/integrate/ensv2-readiness",
+    "/docs/reference/roadmap": "/docs/integrate/why-ensnode/ensv2-readiness",
     "/docs/reference/what-is-ensnode": "/docs/integrate/why-ensnode",
+    "/docs/integrate/ensv2-readiness": "/docs/integrate/why-ensnode/ensv2-readiness",
   },
   env: {
     schema: {

@@ -17,5 +17,6 @@ export const starlightLlmsTxtPlugin = starlightLlmsTxt({
     "docs/integrate/integration-options/enskit/example",
     "docs/integrate/omnigraph/schema-reference",
     "docs/integrate/ens-subgraph/schema-reference",
+    "docs/integrate/why-ensnode/keep-ens-working",
   ],
 });
@@ -10,15 +10,25 @@ export const integrateSidebarTopic = {
     },
     {
       label: "Why ENSNode?",
-      link: "/docs/integrate/why-ensnode",
-    },
-    {
-      label: "ENSv2 Readiness",
-      link: "/docs/integrate/ensv2-readiness",
+      collapsed: false,
+      items: [
+        {
+          label: "Overview",
+          link: "/docs/integrate/why-ensnode",
+        },
+        {
+          label: "Keep ENS apps working 🚨",
+          link: "/docs/integrate/why-ensnode/keep-ens-working",
+        },
+        {
+          label: "ENSv2 Readiness",
+          link: "/docs/integrate/why-ensnode/ensv2-readiness",
+        },
+      ],
     },
     {
       label: "ENS Subgraph",
-      collapsed: true,
+      collapsed: false,
       badge: {
         text: "LEGACY",
         variant: "danger",

@@ -0,0 +1,82 @@
+import type React from "react";
+import { CheckSolidIcon } from "@components/atoms/icons/CheckSolidIcon";
+import { SkullIcon } from "@components/atoms/icons/SkullIcon";
+import { XMarkIcon } from "@components/atoms/icons/XMarkIcon";
+import { Tooltip } from "@namehash/namehash-ui/legacy";
+import { useIsMobile } from "@namehash/namehash-ui";
+
+export interface ENSSubgraphDependentApplicationTransitionStages {
+  toENSNodeSubgraphCompatibleEndpoint: boolean;
+  toOmnigraphAPI: boolean;
+}
+
+interface NotENSv2ReadyBadgeProps {
+  transitionStages: ENSSubgraphDependentApplicationTransitionStages;
+}
+export const NotENSv2ReadyBadge = ({ transitionStages }: NotENSv2ReadyBadgeProps) => {
+  const isMobile = useIsMobile(440);
+  return (
+    <Tooltip
+      sideOffset={-4}
+      maxTooltipWidth={250}
+      placement={isMobile ? "bottom" : "right"}
+      trigger={
+        <button
+          type="button"
+          aria-label="Not ENSv2 ready"
+          className="w-fit flex flex-row flex-nowrap justify-center items-center gap-1 px-1.5 py-0.5 rounded-sm text-white bg-[#ef4444] cursor-default font-semibold leading-5 text-xs"
+        >
+          <SkullIcon className="w-3 h-3 shrink-0" />
+          Not ENSv2 ready
+          <NotENSv2ReadyInfoIcon className="w-3 h-3 shrink-0 opacity-50" />
+        </button>
+      }
+    >
+      <ENSv2NotReadyTooltipContent transitionStages={transitionStages} />
+    </Tooltip>
+  );
+};
+
+const ENSv2NotReadyTooltipContent = ({ transitionStages }: NotENSv2ReadyBadgeProps) => {
+  const transitionInfoStyles = "flex flex-row flex-nowrap justify-start items-start gap-1.5";
+
+  return (
+    <div className="h-fit flex flex-col justify-start items-start gap-2 cursor-default -mx-1 py-1">
+      <div className={transitionInfoStyles}>
+        {transitionStages.toENSNodeSubgraphCompatibleEndpoint ? (
+          <CheckSolidIcon className="w-5 h-5 shrink-0 pt-1" />
+        ) : (
+          <XMarkIcon className="w-5 h-5 shrink-0 stroke-red-500 stroke-2 pt-0.5" />
+        )}
+        <p className="text-xs leading-5">Transitioned from The Graph to ENSNode</p>
+      </div>
+      <div className={transitionInfoStyles}>
+        {transitionStages.toOmnigraphAPI ? (
+          <CheckSolidIcon className="w-5 h-5 shrink-0 pt-1" />
+        ) : (
+          <XMarkIcon className="w-5 h-5 shrink-0 stroke-red-500 stroke-2 pt-0.5" />
+        )}
+        <p className="text-xs leading-5">Transitioned from the Subgraph API to the Omnigraph API</p>
+      </div>
+    </div>
+  );
+};
+
+// This icon is located here (and not exported)
+// because this variant of info icon is only used in this badge
+// and nowhere else in the codebase
+const NotENSv2ReadyInfoIcon = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="12"
+    height="12"
+    viewBox="0 0 12 12"
+    fill="none"
+    {...props}
+  >
+    <path
+      d="M6 0C9.31371 0 12 2.68629 12 6C12 9.31371 9.31371 12 6 12C2.68629 12 0 9.31371 0 6C0 2.68629 2.68629 0 6 0ZM5 5C4.58579 5 4.25 5.33579 4.25 5.75C4.25 6.16421 4.58579 6.5 5 6.5H5.25293C5.41287 6.5 5.53176 6.64856 5.49707 6.80469L5.25293 8C5.01013 9.09286 5.84239 10.1299 6.96191 10.1299H7.21484C7.62897 10.1299 7.96471 9.79398 7.96484 9.37988C7.96484 8.96567 7.62906 8.62988 7.21484 8.62988H6.96191C6.80198 8.62988 6.68308 8.48132 6.71777 8.3252L6.96191 7.12988C7.20478 6.03698 6.37249 5 5.25293 5H5ZM6 2C5.44771 2 5 2.44772 5 3C5 3.55228 5.44771 4 6 4C6.55228 4 7 3.55228 7 3C7 2.44772 6.55228 2 6 2Z"
+      fill="currentColor"
+    />
+  </svg>
+);
@@ -0,0 +1,27 @@
+import type React from "react";
+
+export const CheckSolidIcon = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    width="12"
+    height="12"
+    viewBox="0 0 12 12"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    {...props}
+  >
+    <rect width="12" height="12" fill="url(#pattern0_2974_708)" />
+    <defs>
+      <pattern id="pattern0_2974_708" patternContentUnits="objectBoundingBox" width="1" height="1">
+        <use xlinkHref="#image0_2974_708" transform="scale(0.0227273)" />
+      </pattern>
+      <image
+        id="image0_2974_708"
+        width="44"
+        height="44"
+        preserveAspectRatio="none"
+        xlinkHref="data:image/png;base64,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"
+      />
+    </defs>
+  </svg>
+);
@@ -0,0 +1,24 @@
+import type React from "react";
+
+export const SkullIcon = (props: React.SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="12"
+    height="12"
+    viewBox="0 0 12 12"
+    fill="none"
+    {...props}
+  >
+    <g clipPath="url(#clip0_2974_600)">
+      <path
+        d="M6 0C2.9675 0 0.5 2.4675 0.5 5.5C0.5 7.355 1.451 9.0935 3 10.1045V11.5C3 11.776 3.224 12 3.5 12H8.5C8.776 12 9 11.776 9 11.5V10.1045C10.549 9.093 11.5 7.3545 11.5 5.5C11.5 2.4675 9.0325 0 6 0ZM3.75 7C3.0595 7 2.5 6.4405 2.5 5.75C2.5 5.0595 3.0595 4.5 3.75 4.5C4.4405 4.5 5 5.0595 5 5.75C5 6.4405 4.4405 7 3.75 7ZM5 9L6 7.5L7 9H5ZM8.25 7C7.5595 7 7 6.4405 7 5.75C7 5.0595 7.5595 4.5 8.25 4.5C8.9405 4.5 9.5 5.0595 9.5 5.75C9.5 6.4405 8.9405 7 8.25 7Z"
+        fill="currentColor"
+      />
+    </g>
+    <defs>
+      <clipPath id="clip0_2974_600">
+        <rect width="12" height="12" fill="currentColor" />
+      </clipPath>
+    </defs>
+  </svg>
+);
@@ -0,0 +1,17 @@
+---
+import { NotENSv2ReadyBadge } from "@components/atoms/NotENSv2ReadyBadge";
+import type { ENSSubgraphDependentApplicationTransitionStages } from "@components/atoms/NotENSv2ReadyBadge";
+
+interface Props extends ENSSubgraphDependentApplicationTransitionStages {}
+
+const { toENSNodeSubgraphCompatibleEndpoint, toOmnigraphAPI } = Astro.props;
+---
+
+<div
+  class="w-full h-fit flex flex-col justify-start items-start gap-2.5 px-4 py-3 border-t border-gray-200">
+  <slot />
+  <NotENSv2ReadyBadge
+    transitionStages={{ toENSNodeSubgraphCompatibleEndpoint, toOmnigraphAPI }}
+    client:load
+  />
+</div>
@@ -0,0 +1,11 @@
+---
+---
+
+<section
+  class="not-content w-full h-fit flex flex-col justify-start items-center gap-0 border border-gray-200 rounded-xl overflow-hidden">
+  <h2
+    class="w-full text-center text-balanced text-sm leading-6 font-semibold text-gray-500! px-2.5 py-1.5">
+    Upgrade to the ENS Omnigraph required
+  </h2>
+  <slot />
+</section>