Add feature flag for ai models specifically

Author: ericallam

apps/webapp/app/components/navigation/SideMenu.tsx

@@ -479,15 +479,17 @@ export function SideMenu({
                   data-action="prompts"
                   isCollapsed={isCollapsed}
                 />
-                <SideMenuItem
-                  name="Models"
-                  icon={CubeIcon}
-                  activeIconColor="text-purple-500"
-                  inactiveIconColor="text-purple-500"
-                  to={v3ModelsPath(organization, project, environment)}
-                  data-action="models"
-                  isCollapsed={isCollapsed}
-                />
+                {(user.admin || user.isImpersonating || featureFlags.hasAiModelsAccess) && (
+                  <SideMenuItem
+                    name="Models"
+                    icon={CubeIcon}
+                    activeIconColor="text-purple-500"
+                    inactiveIconColor="text-purple-500"
+                    to={v3ModelsPath(organization, project, environment)}
+                    data-action="models"
+                    isCollapsed={isCollapsed}
+                  />
+                )}
                 <SideMenuItem
                   name="AI Metrics"
                   icon={AIMetricsIcon}

apps/webapp/app/env.server.ts

@@ -1225,6 +1225,9 @@ const EnvironmentSchema = z
     // AI features (Prompts, Models, AI Metrics sidebar section)
     AI_FEATURES_ENABLED: z.string().default("0"),
 
+    // AI Models feature (Models sidebar item within AI section)
+    AI_MODELS_ENABLED: z.string().default("0"),
+
     // Logs page ClickHouse URL (for logs queries)
     LOGS_CLICKHOUSE_URL: z
       .string()

apps/webapp/app/v3/canAccessAiModels.server.ts

@@ -0,0 +1,46 @@
+import { prisma } from "~/db.server";
+import { env } from "~/env.server";
+import { FEATURE_FLAG, makeFlag } from "~/v3/featureFlags.server";
+
+export async function canAccessAiModels(options: {
+  userId: string;
+  isAdmin: boolean;
+  isImpersonating: boolean;
+  organizationSlug: string;
+}): Promise<boolean> {
+  const { userId, isAdmin, isImpersonating, organizationSlug } = options;
+
+  // 1. If env var is set then globally enabled
+  if (env.AI_MODELS_ENABLED === "1") {
+    return true;
+  }
+
+  // 2. Admins always have access
+  if (isAdmin || isImpersonating) {
+    return true;
+  }
+
+  // 3. Check if org/global feature flag is on
+  const org = await prisma.organization.findFirst({
+    where: {
+      slug: organizationSlug,
+      members: { some: { userId } },
+    },
+    select: {
+      featureFlags: true,
+    },
+  });
+
+  const flag = makeFlag();
+  const flagResult = await flag({
+    key: FEATURE_FLAG.hasAiModelsAccess,
+    defaultValue: false,
+    overrides: (org?.featureFlags as Record<string, unknown>) ?? {},
+  });
+  if (flagResult) {
+    return true;
+  }
+
+  // 4. Not enabled anywhere
+  return false;
+}

apps/webapp/app/v3/featureFlags.server.ts

@@ -8,6 +8,7 @@ export const FEATURE_FLAG = {
   hasQueryAccess: "hasQueryAccess",
   hasLogsPageAccess: "hasLogsPageAccess",
   hasAiAccess: "hasAiAccess",
+  hasAiModelsAccess: "hasAiModelsAccess",
 } as const;
 
 const FeatureFlagCatalog = {
@@ -17,6 +18,7 @@ const FeatureFlagCatalog = {
   [FEATURE_FLAG.hasQueryAccess]: z.coerce.boolean(),
   [FEATURE_FLAG.hasLogsPageAccess]: z.coerce.boolean(),
   [FEATURE_FLAG.hasAiAccess]: z.coerce.boolean(),
+  [FEATURE_FLAG.hasAiModelsAccess]: z.coerce.boolean(),
 };
 
 type FeatureFlagKey = keyof typeof FeatureFlagCatalog;