Org level feature flag for query access

Author: matt-aitken

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

@@ -34,6 +34,7 @@ import { TaskIconSmall } from "~/assets/icons/TaskIcon";
 import { WaitpointTokenIcon } from "~/assets/icons/WaitpointTokenIcon";
 import { Avatar } from "~/components/primitives/Avatar";
 import { type MatchedEnvironment } from "~/hooks/useEnvironment";
+import { useFeatureFlags } from "~/hooks/useFeatureFlags";
 import { useFeatures } from "~/hooks/useFeatures";
 import { type MatchedOrganization } from "~/hooks/useOrganizations";
 import { type MatchedProject } from "~/hooks/useProject";
@@ -130,6 +131,7 @@ export function SideMenu({
   const isFreeUser = currentPlan?.v3Subscription?.isPaying === false;
   const isAdmin = useHasAdminAccess();
   const { isManagedCloud } = useFeatures();
+  const featureFlags = useFeatureFlags();
 
   useEffect(() => {
     const handleScroll = () => {
@@ -272,7 +274,7 @@ export function SideMenu({
               to={v3TestPath(organization, project, environment)}
               data-action="test"
             />
-            {user.admin && (
+            {(user.admin || featureFlags.hasQueryAccess) && (
               <SideMenuItem
                 name="Query"
                 icon={TableCellsIcon}

apps/webapp/app/hooks/useFeatureFlags.ts

@@ -0,0 +1,11 @@
+import { type UIMatch } from "@remix-run/react";
+import { useOptionalOrganization } from "./useOrganizations";
+
+/**
+ * Hook to access organization-level feature flags.
+ * Returns the feature flags from the current organization, or an empty object if no organization is found.
+ */
+export function useFeatureFlags(matches?: UIMatch[]) {
+  const org = useOptionalOrganization(matches);
+  return org?.featureFlags ?? {};
+}

apps/webapp/app/presenters/OrganizationsPresenter.server.ts

@@ -10,6 +10,7 @@ import {
 } from "./SelectBestEnvironmentPresenter.server";
 import { sortEnvironments } from "~/utils/environmentSort";
 import { defaultAvatar, parseAvatar } from "~/components/primitives/Avatar";
+import { validatePartialFeatureFlags } from "~/v3/featureFlags.server";
 
 export class OrganizationsPresenter {
   #prismaClient: PrismaClient;
@@ -132,6 +133,7 @@ export class OrganizationsPresenter {
         slug: true,
         title: true,
         avatar: true,
+        featureFlags: true,
         projects: {
           where: { deletedAt: null, version: "V3" },
           select: {
@@ -152,11 +154,17 @@ export class OrganizationsPresenter {
     });
 
     return orgs.map((org) => {
+      const flagsResult = org.featureFlags
+        ? validatePartialFeatureFlags(org.featureFlags as Record<string, unknown>)
+        : ({ success: false } as const);
+      const flags = flagsResult.success ? flagsResult.data : {};
+
       return {
         id: org.id,
         slug: org.slug,
         title: org.title,
         avatar: parseAvatar(org.avatar, defaultAvatar),
+        featureFlags: flags,
         projects: org.projects.map((project) => ({
           id: project.id,
           slug: project.slug,

apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.query/route.tsx

@@ -62,15 +62,50 @@ import { SimpleTooltip } from "~/components/primitives/Tooltip";
 import { useEnvironment } from "~/hooks/useEnvironment";
 import { useOrganization } from "~/hooks/useOrganizations";
 import { useProject } from "~/hooks/useProject";
+import { prisma } from "~/db.server";
 import { findProjectBySlug } from "~/models/project.server";
 import { findEnvironmentBySlug } from "~/models/runtimeEnvironment.server";
 import { QueryPresenter, type QueryHistoryItem } from "~/presenters/v3/QueryPresenter.server";
 import { executeQuery, type QueryScope } from "~/services/queryService.server";
 import { requireUser } from "~/services/session.server";
 import { downloadFile, rowsToCSV, rowsToJSON } from "~/utils/dataExport";
 import { EnvironmentParamSchema } from "~/utils/pathBuilder";
+import { FEATURE_FLAG, validateFeatureFlagValue } from "~/v3/featureFlags.server";
 import { querySchemas } from "~/v3/querySchemas";
 
+async function hasQueryAccess(
+  userId: string,
+  isAdmin: boolean,
+  organizationSlug: string
+): Promise<boolean> {
+  if (isAdmin) {
+    return true;
+  }
+
+  // Check organization feature flags
+  const organization = await prisma.organization.findFirst({
+    where: {
+      slug: organizationSlug,
+      members: { some: { userId } },
+    },
+    select: {
+      featureFlags: true,
+    },
+  });
+
+  if (!organization?.featureFlags) {
+    return false;
+  }
+
+  const flags = organization.featureFlags as Record<string, unknown>;
+  const hasQueryAccessResult = validateFeatureFlagValue(
+    FEATURE_FLAG.hasQueryAccess,
+    flags.hasQueryAccess
+  );
+
+  return hasQueryAccessResult.success && hasQueryAccessResult.data === true;
+}
+
 const scopeOptions = [
   { value: "environment", label: "Environment" },
   { value: "project", label: "Project" },
@@ -79,13 +114,13 @@ const scopeOptions = [
 
 export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const user = await requireUser(request);
+  const { projectParam, organizationSlug, envParam } = EnvironmentParamSchema.parse(params);
 
-  if (!user.admin) {
+  const canAccess = await hasQueryAccess(user.id, user.admin, organizationSlug);
+  if (!canAccess) {
     throw redirect("/");
   }
 
-  const { projectParam, organizationSlug, envParam } = EnvironmentParamSchema.parse(params);
-
   const project = await findProjectBySlug(organizationSlug, projectParam, user.id);
   if (!project) {
     throw new Response(undefined, {
@@ -120,17 +155,16 @@ const ActionSchema = z.object({
 
 export const action = async ({ request, params }: ActionFunctionArgs) => {
   const user = await requireUser(request);
+  const { projectParam, organizationSlug, envParam } = EnvironmentParamSchema.parse(params);
 
-  // Temporarily admin-only
-  if (!user.admin) {
+  const canAccess = await hasQueryAccess(user.id, user.admin, organizationSlug);
+  if (!canAccess) {
     return typedjson(
       { error: "Unauthorized", rows: null, columns: null, stats: null },
       { status: 403 }
     );
   }
 
-  const { projectParam, organizationSlug, envParam } = EnvironmentParamSchema.parse(params);
-
   const project = await findProjectBySlug(organizationSlug, projectParam, user.id);
   if (!project) {
     return typedjson(

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

@@ -5,12 +5,14 @@ export const FEATURE_FLAG = {
   defaultWorkerInstanceGroupId: "defaultWorkerInstanceGroupId",
   runsListRepository: "runsListRepository",
   taskEventRepository: "taskEventRepository",
+  hasQueryAccess: "hasQueryAccess",
 } as const;
 
 const FeatureFlagCatalog = {
   [FEATURE_FLAG.defaultWorkerInstanceGroupId]: z.string(),
   [FEATURE_FLAG.runsListRepository]: z.enum(["clickhouse", "postgres"]),
   [FEATURE_FLAG.taskEventRepository]: z.enum(["clickhouse", "clickhouse_v2", "postgres"]),
+  [FEATURE_FLAG.hasQueryAccess]: z.coerce.boolean(),
 };
 
 type FeatureFlagKey = keyof typeof FeatureFlagCatalog;
@@ -83,6 +85,7 @@ export const setFlags = makeSetFlags();
 
 // Create a Zod schema from the existing catalog
 export const FeatureFlagCatalogSchema = z.object(FeatureFlagCatalog);
+export type FeatureFlagCatalog = z.infer<typeof FeatureFlagCatalogSchema>;
 
 // Utility function to validate a feature flag value
 export function validateFeatureFlagValue<T extends FeatureFlagKey>(