🚩(frontend) Add feature flag for document import

We want to be able to enable/disable the document
import feature for testing and gradual rollout
purposes. This commit adds a feature flag for
document import and updates the relevant components
and tests to respect this flag.

env.d/development/common

@@ -102,3 +102,5 @@ SEARCH_INDEXER_SECRET=find-api-key-for-docs-with-exactly-50-chars-length  # Key
 INDEXING_URL=http://find:8000/api/v1.0/documents/index/
 SEARCH_URL=http://find:8000/api/v1.0/documents/search/
 SEARCH_INDEXER_QUERY_LIMIT=50
+
+CONVERSION_UPLOAD_ENABLED=true

src/frontend/apps/e2e/__tests__/app-impress/doc-import.spec.ts

@@ -3,6 +3,7 @@ import path from 'path';
 
 import { Page, expect, test } from '@playwright/test';
 
+import { overrideConfig } from './utils-common';
 import { getEditor } from './utils-editor';
 
 test.beforeEach(async ({ page }) => {
@@ -10,6 +11,16 @@ test.beforeEach(async ({ page }) => {
 });
 
 test.describe('Doc Import', () => {
+  test('import is not enabled if flag is disabled', async ({ page }) => {
+    await overrideConfig(page, {
+      CONVERSION_UPLOAD_ENABLED: false,
+    });
+
+    await page.goto('/');
+
+    await expect(page.getByLabel('Open the upload dialog')).toBeHidden();
+  });
+
   test('it imports 2 docs with the import icon', async ({ page }) => {
     const fileChooserPromise = page.waitForEvent('filechooser');
     await page.getByLabel('Open the upload dialog').click();

src/frontend/apps/e2e/__tests__/app-impress/utils-common.ts

@@ -20,6 +20,7 @@ export const CONFIG = {
   CRISP_WEBSITE_ID: null,
   COLLABORATION_WS_URL: 'ws://localhost:4444/collaboration/ws/',
   COLLABORATION_WS_NOT_CONNECTED_READY_ONLY: true,
+  CONVERSION_UPLOAD_ENABLED: true,
   CONVERSION_FILE_EXTENSIONS_ALLOWED: ['.docx', '.md'],
   CONVERSION_FILE_MAX_SIZE: 20971520,
   ENVIRONMENT: 'development',

src/frontend/apps/impress/src/core/config/api/useConfig.tsx

@@ -40,6 +40,7 @@ export interface ConfigResponse {
   COLLABORATION_WS_NOT_CONNECTED_READY_ONLY?: boolean;
   CONVERSION_FILE_EXTENSIONS_ALLOWED: string[];
   CONVERSION_FILE_MAX_SIZE: number;
+  CONVERSION_UPLOAD_ENABLED?: boolean;
   CRISP_WEBSITE_ID?: string;
   ENVIRONMENT: string;
   FRONTEND_CSS_URL?: string;

src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGrid.tsx

@@ -44,6 +44,7 @@ export const DocsGrid = ({
     getInputProps,
     open,
     isPending: isImportPending,
+    isEnabled: isImportEnabled,
   } = useImport({
     onDragOver: (dragOver: boolean) => {
       setIsDragOver(dragOver);
@@ -51,9 +52,10 @@ export const DocsGrid = ({
   });
 
   const withUpload =
-    !target ||
+    (!target ||
       target === DocDefaultFilter.ALL_DOCS ||
-    target === DocDefaultFilter.MY_DOCS;
+      target === DocDefaultFilter.MY_DOCS) &&
+    isImportEnabled;
 
   const { isDesktop } = useResponsiveStore();
   const { flexLeft, flexRight } = useResponsiveDocGrid();

src/frontend/apps/impress/src/features/docs/docs-grid/hooks/useImport.tsx

@@ -112,5 +112,11 @@ export const useImport = ({ onDragOver }: UseImportProps) => {
   });
   const { mutate: importDoc, isPending } = useImportDoc();
 
-  return { getRootProps, getInputProps, open, isPending };
+  return {
+    getRootProps,
+    getInputProps,
+    open,
+    isEnabled: config?.CONVERSION_UPLOAD_ENABLED || false,
+    isPending,
+  };
 };