refactor(web): enable graphql playground by env var

web/.env.example

@@ -12,13 +12,14 @@ REEARTH_WEB_AUTH_PROVIDER=  # Optional, "auth0", "mock", or leave empty for defa
 REEARTH_WEB_CONFIG_URL= # Optional, URL to your reearth_config.json, or leave empty to use the default configuration
 REEARTH_WEB_CESIUM_ION_ACCESS_TOKEN= # Set your Cesium Ion access token here if you want to override token from config
 REEARTH_WEB_FEATURE_COLLECTION= # Optional, "ee" or left empty for default feature collection
+REEARTH_WEB_ENABLE_GQL_PLAYGROUND= # Optional, set to "true" to enable GraphQL Playground
 
 # ===== API Configuration =====
 REEARTH_WEB_API=http://localhost:8080/api
 
 # ===== Plugin Configuration =====
 REEARTH_WEB_PLUGINS=http://localhost:8080/plugins
-REEARTH_WEB_UNSAFE_PLUGIN_URLS='["http://example.com/plugin.js"]]' # Optional, URLs for unsafe plugins, adjust as needed
+REEARTH_WEB_UNSAFE_PLUGIN_URLS='["http://example.com/plugin.js"]' # Optional, URLs for unsafe plugins, adjust as needed
 
 # ===== Extensions Configuration =====
 REEARTH_WEB_EXTENSION_URLS='["http://example.com/extension.js"]' # Optional, URLs for extensions, adjust as needed

web/Dockerfile

@@ -52,10 +52,9 @@ ENV REEARTH_BRAND=null
 ENV REEARTH_CESIUM_ION_ACCESS_TOKEN=null
 ENV REEARTH_CLOUD_API=null
 ENV REEARTH_CURRENT_TOS=null
-ENV REEARTH_DEVELOPER_MODE=null
-ENV REEARTH_DISABLE_WORKSPACE_MANAGEMENT=null
 ENV REEARTH_DOCUMENTATION_URL=null
 ENV REEARTH_EARLY_ACCESS_ADMINS=[]
+ENV REEARTH_ENABLE_GQL_PLAYGROUND=false
 ENV REEARTH_EXTENSION_URLS=[]
 ENV REEARTH_FAVICON_URL=
 ENV REEARTH_FEATURE_COLLECTION=null

web/docker/reearth_config.json.template

@@ -7,10 +7,9 @@
     "cesiumIonAccessToken": ${REEARTH_CESIUM_ION_ACCESS_TOKEN},
     "cloudApi": ${REEARTH_CLOUD_API},
     "currentTos": ${REEARTH_CURRENT_TOS},
-    "disableWorkspaceManagement": ${REEARTH_DISABLE_WORKSPACE_MANAGEMENT},
-    "developerMode": ${REEARTH_DEVELOPER_MODE},
     "documentationUrl": ${REEARTH_DOCUMENTATION_URL},
     "earlyAccessAdmins": ${REEARTH_EARLY_ACCESS_ADMINS},
+    "enableGqlPlayground": ${REEARTH_ENABLE_GQL_PLAYGROUND},
     "extensionUrls": ${REEARTH_EXTENSION_URLS},
     "featureCollection": ${REEARTH_FEATURE_COLLECTION},
     "ip": ${REEARTH_IP},

web/src/app/pages/GraphQLPlayground/index.tsx

@@ -1,16 +1,18 @@
 import { createGraphiQLFetcher } from "@graphiql/toolkit";
 import { Typography } from "@reearth/app/lib/reearth-ui";
 import { useAuth } from "@reearth/services/auth";
+import { config } from "@reearth/services/config";
 import { styled } from "@reearth/services/theme";
 import { GraphiQL } from "graphiql";
-import { useEffect, useState } from "react";
+import { ReactNode, useEffect, useState } from "react";
 import "graphiql/graphiql.css";
+import { Navigate } from "react-router-dom";
 
 const fetcher = createGraphiQLFetcher({
   url: `${window.REEARTH_CONFIG?.api || "/api"}` + "/graphql"
 });
 
-export default function GraphQLPlayground(_: { path?: string }): JSX.Element {
+export default function GraphQLPlayground(_: { path?: string }): ReactNode {
   const { getAccessToken } = useAuth();
   const [headers, setHeaders] = useState<string>();
   useEffect(() => {
@@ -19,6 +21,10 @@ export default function GraphQLPlayground(_: { path?: string }): JSX.Element {
     });
   }, [getAccessToken]);
 
+  if (!config()?.enableGqlPlayground) {
+    return <Navigate to="/404" replace />;
+  }
+
   return headers ? (
     <Filled>
       <GraphiQL fetcher={fetcher} isHeadersEditorEnabled headers={headers} />

web/src/services/config/index.ts

@@ -55,6 +55,7 @@ export type Config = {
   multiTenant?: Record<string, AuthInfo>;
   devPluginUrls?: string[];
   featureCollection?: string;
+  enableGqlPlayground?: boolean;
   platformUrl?: string;
 } & AuthInfo;