feat(platform): wire feature flags resolver and add governance tab

services/platform/app/features/chat/components/chat-input.tsx

@@ -43,6 +43,7 @@ interface ChatInputProps extends Omit<
   uploadFiles: (files: File[]) => Promise<void>;
   removeAttachment: (fileId: Id<'_storage'>) => void;
   clearAttachments: () => FileAttachment[];
+  fileUploadDisabled?: boolean;
   isIndexing?: boolean;
   indexingStatuses?: Map<
     Id<'_storage'>,
@@ -65,6 +66,7 @@ export function ChatInput({
   uploadFiles,
   removeAttachment,
   clearAttachments,
+  fileUploadDisabled = false,
   isIndexing = false,
   indexingStatuses,
   ...restProps
@@ -124,7 +126,7 @@ export function ChatInput({
   };
 
   const handlePaste = (e: React.ClipboardEvent) => {
-    if (inputDisabled) return;
+    if (inputDisabled || fileUploadDisabled) return;
     const items = e.clipboardData?.items;
     if (!items) return;
 
@@ -165,7 +167,7 @@ export function ChatInput({
         className="relative flex h-full min-h-0 flex-1 flex-col"
         onFilesSelected={uploadFiles}
         clickable={false}
-        disabled={inputDisabled}
+        disabled={inputDisabled || fileUploadDisabled}
       >
         <FileUpload.Overlay className="mx-2 rounded-t-3xl" />
         <input
@@ -351,17 +353,19 @@ export function ChatInput({
 
           <HStack justify="between" align="center" className="pb-3">
             <HStack gap={3} align="center">
-              <Tooltip content={tDialogs('attach')} side="top">
-                <Button
-                  variant="ghost"
-                  size="icon"
-                  onClick={() => fileInputRef.current?.click()}
-                  disabled={inputDisabled}
-                  aria-label={tDialogs('attach')}
-                >
-                  <Paperclip className="size-4" />
-                </Button>
-              </Tooltip>
+              {!fileUploadDisabled && (
+                <Tooltip content={tDialogs('attach')} side="top">
+                  <Button
+                    variant="ghost"
+                    size="icon"
+                    onClick={() => fileInputRef.current?.click()}
+                    disabled={inputDisabled}
+                    aria-label={tDialogs('attach')}
+                  >
+                    <Paperclip className="size-4" />
+                  </Button>
+                </Tooltip>
+              )}
               <ArenaModeToggle disabled={isLoading} />
               {isArenaMode ? (
                 <ArenaModelSelector organizationId={organizationId} />

services/platform/app/features/chat/components/chat-interface.tsx

@@ -17,6 +17,7 @@ import { api } from '@/convex/_generated/api';
 import { useT } from '@/lib/i18n/client';
 import { cn } from '@/lib/utils/cn';
 
+import { useMyFeatureFlags } from '../../settings/governance/hooks/queries';
 import { useBranchContext } from '../context/branch-context';
 import { useChatLayout } from '../context/chat-layout-context';
 import { useEditAndBranch, useForkOwnThread } from '../hooks/mutations';
@@ -144,6 +145,9 @@ export function ChatInterface({
   const { isIndexing, statusMap: indexingStatuses } =
     useFileIndexingStatus(attachments);
 
+  const { data: featureFlags } = useMyFeatureFlags(organizationId);
+  const fileUploadDisabled = featureFlags?.fileUpload === false;
+
   usePersistedAttachments({
     userId: user?.userId,
     threadId,
@@ -695,6 +699,7 @@ export function ChatInterface({
               uploadFiles={uploadFiles}
               removeAttachment={removeAttachment}
               clearAttachments={clearAttachments}
+              fileUploadDisabled={fileUploadDisabled}
               isIndexing={isIndexing}
               indexingStatuses={indexingStatuses}
             />

services/platform/app/features/settings/governance/components/feature-flags-editor.stories.tsx

@@ -0,0 +1,26 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import { FeatureFlagsEditor } from './feature-flags-editor';
+
+const meta: Meta<typeof FeatureFlagsEditor> = {
+  title: 'Settings/Governance/FeatureFlagsEditor',
+  component: FeatureFlagsEditor,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'padded',
+  },
+  args: {
+    organizationId: 'org_test',
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof FeatureFlagsEditor>;
+
+export const Default: Story = {};
+
+export const WithOrganization: Story = {
+  args: {
+    organizationId: 'org_demo',
+  },
+};

services/platform/app/features/settings/governance/components/feature-flags-editor.test.tsx

@@ -0,0 +1,158 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+
+import { checkAccessibility } from '@/test/utils/a11y';
+import { render, screen } from '@/test/utils/render';
+
+vi.mock('@/app/hooks/use-organization-id', () => ({
+  useOrganizationId: () => 'org_test',
+}));
+
+vi.mock('@/app/hooks/use-ability', () => ({
+  useAbility: () => ({
+    can: () => true,
+    cannot: () => false,
+  }),
+}));
+
+vi.mock('@/app/hooks/use-toast', () => ({
+  useToast: () => ({
+    toast: vi.fn(),
+  }),
+}));
+
+vi.mock('../hooks/queries', () => ({
+  useGovernancePolicy: vi.fn().mockReturnValue({
+    data: null,
+    isLoading: false,
+  }),
+}));
+
+vi.mock('../hooks/mutations', () => ({
+  useUpsertGovernancePolicy: () => ({
+    mutateAsync: vi.fn(),
+    isPending: false,
+  }),
+}));
+
+vi.mock('@/app/features/settings/organization/hooks/queries', () => ({
+  useMembers: () => ({
+    members: [
+      { userId: 'user_1', displayName: 'Alice', email: 'alice@test.com' },
+      { userId: 'user_2', displayName: 'Bob', email: 'bob@test.com' },
+    ],
+  }),
+}));
+
+vi.mock('@/app/features/settings/teams/hooks/queries', () => ({
+  useOrgTeams: () => ({
+    teams: [
+      { id: 'team_1', name: 'Engineering' },
+      { id: 'team_2', name: 'Marketing' },
+    ],
+  }),
+}));
+
+const { useGovernancePolicy } = await import('../hooks/queries');
+const mockedUseGovernancePolicy = vi.mocked(useGovernancePolicy);
+
+const { FeatureFlagsEditor } = await import('./feature-flags-editor');
+
+describe('FeatureFlagsEditor', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    mockedUseGovernancePolicy.mockReturnValue({
+      data: null,
+      isLoading: false,
+    } as never);
+  });
+
+  it('renders empty state when no rules exist', () => {
+    render(<FeatureFlagsEditor organizationId="org_1" />);
+
+    expect(
+      screen.getByText(/no feature control rules configured/i),
+    ).toBeInTheDocument();
+  });
+
+  it('renders rules table when rules exist', () => {
+    mockedUseGovernancePolicy.mockReturnValue({
+      data: {
+        config: {
+          enabled: true,
+          rules: [
+            {
+              scope: 'default',
+              webSearch: true,
+              codeExecution: false,
+              fileUpload: true,
+            },
+          ],
+        },
+      },
+      isLoading: false,
+    } as never);
+
+    render(<FeatureFlagsEditor organizationId="org_1" />);
+
+    expect(screen.getByText('default')).toBeInTheDocument();
+    expect(screen.getByText('\u2718')).toBeInTheDocument();
+  });
+
+  it('renders add rule button', () => {
+    render(<FeatureFlagsEditor organizationId="org_1" />);
+
+    expect(
+      screen.getByRole('button', { name: /add rule/i }),
+    ).toBeInTheDocument();
+  });
+
+  it('renders enabled toggle', () => {
+    render(<FeatureFlagsEditor organizationId="org_1" />);
+
+    expect(screen.getByRole('switch')).toBeInTheDocument();
+  });
+
+  it('renders loading skeleton while loading', () => {
+    mockedUseGovernancePolicy.mockReturnValue({
+      data: null,
+      isLoading: true,
+    } as never);
+
+    const { container } = render(<FeatureFlagsEditor organizationId="org_1" />);
+
+    expect(container.querySelector('[aria-busy="true"]')).toBeInTheDocument();
+  });
+
+  describe('accessibility', () => {
+    it('passes axe audit with empty state', async () => {
+      const { container } = render(
+        <FeatureFlagsEditor organizationId="org_1" />,
+      );
+      await checkAccessibility(container);
+    });
+
+    it('passes axe audit with rules table', async () => {
+      mockedUseGovernancePolicy.mockReturnValue({
+        data: {
+          config: {
+            enabled: true,
+            rules: [
+              {
+                scope: 'default',
+                webSearch: true,
+                codeExecution: true,
+                fileUpload: true,
+              },
+            ],
+          },
+        },
+        isLoading: false,
+      } as never);
+
+      const { container } = render(
+        <FeatureFlagsEditor organizationId="org_1" />,
+      );
+      await checkAccessibility(container);
+    });
+  });
+});