feat(frontend): gate editor v2 by environment variable

charts/conquery/templates/deployment.yml

@@ -33,6 +33,8 @@ spec:
                 value: {{ .Values.frontend.disableLogin | quote }}
               - name: REACT_APP_LANG
                 value: {{ .Values.frontend.lang }}
+              - name: REACT_APP_EDITOR_V2_ENABLE
+                value: {{ .Values.frontend.editorV2.enabled | quote }}
               - name: REACT_APP_IDP_ENABLE
                 value: {{ .Values.frontend.idp.enabled | quote }}
               - name: REACT_APP_IDP_URL

charts/conquery/values.yaml

@@ -36,6 +36,9 @@ frontend:
   lang: de
   # defines if a local login should be presented (for backend basic-auth-realm only)
   disableLogin: true
+  # defines if the extended query editor should be available
+  editorV2:
+    enabled: true
   # use external authentication (oauth/openid idp provider)
   idp:
     enabled: true

frontend/.env.e2e

@@ -14,7 +14,9 @@ REACT_APP_DISABLE_LOGIN=true
 
 REACT_APP_LANG=de
 
+REACT_APP_EDITOR_V2_ENABLE=true
+
 REACT_APP_IDP_ENABLE=false
 REACT_APP_IDP_URL=http://localhost:8080/auth
 REACT_APP_IDP_REALM=Myrealm
-REACT_APP_IDP_CLIENT_ID=frontend
+REACT_APP_IDP_CLIENT_ID=frontend

frontend/.env.example

@@ -16,6 +16,9 @@ REACT_APP_BASENAME=
 # also possible: en
 REACT_APP_LANG=de
 
+# Enable the extended query editor
+REACT_APP_EDITOR_V2_ENABLE=true
+
 # Using keycloak as the Identity Provider (IDP)
 REACT_APP_IDP_ENABLE=false
 REACT_APP_IDP_URL=http://localhost:8080/auth

frontend/src/js/app/RightPane.tsx

@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
 import { useSelector } from "react-redux";
 
 import { EditorV2 } from "../editor-v2/EditorV2";
+import { isEditorV2Enabled } from "../environment";
 import { ResetableErrorBoundary } from "../error-fallback/ResetableErrorBoundary";
 import FormsTab from "../external-forms/FormsTab";
 import Pane from "../pane/Pane";
@@ -37,11 +38,15 @@ const RightPane = () => {
         label: t("rightPane.queryEditor"),
         tooltip: t("help.tabQueryEditor"),
       },
-      {
-        key: "editorV2",
-        label: t("rightPane.editorV2"),
-        tooltip: t("help.tabEditorV2"),
-      },
+      ...(isEditorV2Enabled
+        ? [
+            {
+              key: "editorV2",
+              label: t("rightPane.editorV2"),
+              tooltip: t("help.tabEditorV2"),
+            },
+          ]
+        : []),
       {
         key: "externalForms",
         label: t("rightPane.externalForms"),
@@ -53,21 +58,23 @@ const RightPane = () => {
 
   return (
     <SxPane right tabs={tabs} dataTestId="right-pane">
-      <Tab key={tabs[0].key} isActive={activeTab === tabs[0].key}>
+      <Tab key="queryEditor" isActive={activeTab === "queryEditor"}>
         <StandardQueryEditorTab />
       </Tab>
-      <Tab key={tabs[1].key} isActive={activeTab === tabs[1].key}>
-        <EditorV2
-          featureDates
-          featureNegate
-          featureExpand
-          featureConnectorRotate
-          featureQueryNodeEdit
-          featureContentInfos
-          featureTimebasedQueries
-        />
-      </Tab>
-      <Tab key={tabs[2].key} isActive={activeTab === tabs[2].key}>
+      {isEditorV2Enabled && (
+        <Tab key="editorV2" isActive={activeTab === "editorV2"}>
+          <EditorV2
+            featureDates
+            featureNegate
+            featureExpand
+            featureConnectorRotate
+            featureQueryNodeEdit
+            featureContentInfos
+            featureTimebasedQueries
+          />
+        </Tab>
+      )}
+      <Tab key="externalForms" isActive={activeTab === "externalForms"}>
         <ResetableErrorBoundary>
           <FormsTab />
         </ResetableErrorBoundary>

frontend/src/js/environment/index.ts

@@ -16,6 +16,9 @@ const apiUrlEnv =
 const disableLoginEnv =
   runtimeVar("REACT_APP_DISABLE_LOGIN") ||
   import.meta.env.REACT_APP_DISABLE_LOGIN;
+const enableEditorV2Env =
+  runtimeVar("REACT_APP_EDITOR_V2_ENABLE") ||
+  import.meta.env.REACT_APP_EDITOR_V2_ENABLE;
 const enableIDPEnv =
   runtimeVar("REACT_APP_IDP_ENABLE") || import.meta.env.REACT_APP_IDP_ENABLE;
 const basenameEnv =
@@ -32,6 +35,7 @@ export const isProduction = isProductionEnv === "production" || true;
 export const language = languageEnv === "de" ? "de" : "en";
 export const apiUrl = apiUrlEnv || "";
 export const isLoginDisabled = disableLoginEnv === "true";
+export const isEditorV2Enabled = enableEditorV2Env !== "false";
 export const isIDPEnabled = enableIDPEnv === "true";
 export const basename = basenameEnv || "";
 export const idpUrl = idpUrlEnv || "";