chore(apollo-vertex): lint for manual memoization with React Compiler

apps/apollo-vertex/.oxlintrc.json

@@ -70,7 +70,19 @@
     "unicorn/no-useless-error-capture-stack-trace": "error",
     "unicorn/prefer-modern-math-apis": "error",
     "unicorn/prefer-node-protocol": "error",
-    "unicorn/prefer-number-properties": "error"
+    "unicorn/prefer-number-properties": "error",
+    "eslint/no-restricted-imports": [
+      "error",
+      {
+        "patterns": [
+          {
+            "group": ["react"],
+            "importNamePattern": "^(useMemo|useCallback|memo)$",
+            "message": "Manual memoization is unnecessary — the React Compiler handles this automatically."
+          }
+        ]
+      }
+    ]
   },
   "settings": {},
   "env": {
@@ -91,6 +103,12 @@
         "shaggy-eslint-plugin-react/jsx-no-literals": ["error"]
       }
     },
+    {
+      "files": ["registry/**/*.{ts,tsx}"],
+      "rules": {
+        "eslint/no-restricted-imports": "off"
+      }
+    },
     {
       "files": ["app/**/layout.tsx", "app/**/page.tsx"],
       "rules": {

apps/apollo-vertex/app/_components/foundation/icon-grid.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { icons } from "lucide-react";
-import { useMemo, useState } from "react";
+import { useState } from "react";
 
 type IconName = keyof typeof icons;
 
@@ -134,17 +134,17 @@ export function IconGrid() {
   const [copiedName, setCopiedName] = useState<string | null>(null);
 
   // eslint-disable-next-line @typescript-eslint/no-unsafe-type-assertion -- Object.keys(icons) is guaranteed to be IconName[]
-  const allNames = useMemo(() => Object.keys(icons) as IconName[], []);
+  const allNames = Object.keys(icons) as IconName[];
 
   const isFiltering = query.trim().length > 0;
 
-  const filtered = useMemo(() => {
-    if (!isFiltering) return allNames;
-    const q = query.toLowerCase().trim();
-    return allNames.filter((name) => name.toLowerCase().includes(q));
-  }, [query, allNames, isFiltering]);
+  const filtered = isFiltering
+    ? allNames.filter((name) =>
+        name.toLowerCase().includes(query.toLowerCase().trim()),
+      )
+    : allNames;
 
-  const groups = useMemo(() => categorize(allNames), [allNames]);
+  const groups = categorize(allNames);
 
   function handleCopy(name: string) {
     void navigator.clipboard

apps/apollo-vertex/app/components/feature-flags/feature-flag-demo.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useCallback, useMemo, useRef, useState } from "react";
+import { useRef, useState } from "react";
 import type { FeatureFlagProviderConfig } from "@/lib/feature-flag-provider/types";
 import { FeatureFlagProvider } from "@/lib/feature-flag-provider";
 import { useFeatureFlag } from "@/hooks/use-feature-flag";
@@ -146,15 +146,15 @@ export function FeatureFlagDemo() {
   const providerRef = useRef(createDemoProvider(INITIAL_FLAGS));
   const [flags, setFlags] = useState(INITIAL_FLAGS);
 
-  const toggle = useCallback((key: string) => {
+  function toggle(key: string) {
     setFlags((prev) => {
       const next = !prev[key];
       providerRef.current.setFlag(key, next);
       return { ...prev, [key]: next };
     });
-  }, []);
+  }
 
-  const provider = useMemo(() => providerRef.current, []);
+  const provider = providerRef.current;
 
   return (
     <FeatureFlagProvider provider={provider}>

apps/apollo-vertex/biome.json

@@ -42,27 +42,6 @@
           }
         }
       }
-    },
-    {
-      "includes": ["**/*.tsx", "**/*.ts"],
-      "linter": {
-        "enabled": true,
-        "rules": {
-          "style": {
-            "noRestrictedImports": {
-              "level": "error",
-              "options": {
-                "paths": {
-                  "react": {
-                    "importNames": ["useMemo", "useCallback"],
-                    "message": "Manual memoization is unnecessary — the React Compiler handles this automatically."
-                  }
-                }
-              }
-            }
-          }
-        }
-      }
     }
   ]
 }