feat(ui) Add readOnly flag that disables profile URL editing (#8067)

Author: chriscollins3456

datahub-graphql-core/src/main/java/com/linkedin/datahub/graphql/GmsGraphQLEngine.java

@@ -694,7 +694,8 @@ private void configureQueryResolvers(final RuntimeWiring.Builder builder) {
                     this.telemetryConfiguration,
                     this.testsConfiguration,
                     this.datahubConfiguration,
-                    this.viewsConfiguration
+                    this.viewsConfiguration,
+                    this.featureFlags
                 ))
             .dataFetcher("me", new MeResolver(this.entityClient, featureFlags))
             .dataFetcher("search", new SearchResolver(this.entityClient))

datahub-graphql-core/src/main/java/com/linkedin/datahub/graphql/featureflags/FeatureFlags.java

@@ -9,4 +9,5 @@ public class FeatureFlags {
   private boolean lineageSearchCacheEnabled = false;
   private boolean pointInTimeCreationEnabled = false;
   private boolean alwaysEmitChangeLog = false;
+  private boolean readOnlyModeEnabled = false;
 }

datahub-graphql-core/src/main/java/com/linkedin/datahub/graphql/resolvers/config/AppConfigResolver.java

@@ -3,10 +3,12 @@
 import com.datahub.authentication.AuthenticationConfiguration;
 import com.datahub.authorization.AuthorizationConfiguration;
 import com.linkedin.datahub.graphql.QueryContext;
+import com.linkedin.datahub.graphql.featureflags.FeatureFlags;
 import com.linkedin.datahub.graphql.generated.AnalyticsConfig;
 import com.linkedin.datahub.graphql.generated.AppConfig;
 import com.linkedin.datahub.graphql.generated.AuthConfig;
 import com.linkedin.datahub.graphql.generated.EntityType;
+import com.linkedin.datahub.graphql.generated.FeatureFlagsConfig;
 import com.linkedin.datahub.graphql.generated.IdentityManagementConfig;
 import com.linkedin.datahub.graphql.generated.LineageConfig;
 import com.linkedin.datahub.graphql.generated.ManagedIngestionConfig;
@@ -47,6 +49,7 @@ public class AppConfigResolver implements DataFetcher<CompletableFuture<AppConfi
   private final TestsConfiguration _testsConfiguration;
   private final DataHubConfiguration _datahubConfiguration;
   private final ViewsConfiguration _viewsConfiguration;
+  private final FeatureFlags _featureFlags;
 
   public AppConfigResolver(
       final GitVersion gitVersion,
@@ -59,7 +62,8 @@ public AppConfigResolver(
       final TelemetryConfiguration telemetryConfiguration,
       final TestsConfiguration testsConfiguration,
       final DataHubConfiguration datahubConfiguration,
-      final ViewsConfiguration viewsConfiguration) {
+      final ViewsConfiguration viewsConfiguration,
+      final FeatureFlags featureFlags) {
     _gitVersion = gitVersion;
     _isAnalyticsEnabled = isAnalyticsEnabled;
     _ingestionConfiguration = ingestionConfiguration;
@@ -71,6 +75,7 @@ public AppConfigResolver(
     _testsConfiguration = testsConfiguration;
     _datahubConfiguration = datahubConfiguration;
     _viewsConfiguration = viewsConfiguration;
+    _featureFlags = featureFlags;
   }
 
   @Override
@@ -142,6 +147,10 @@ public CompletableFuture<AppConfig> get(final DataFetchingEnvironment environmen
     viewsConfig.setEnabled(_viewsConfiguration.isEnabled());
     appConfig.setViewsConfig(viewsConfig);
 
+    final FeatureFlagsConfig featureFlagsConfig = new FeatureFlagsConfig();
+    featureFlagsConfig.setReadOnlyModeEnabled(_featureFlags.isReadOnlyModeEnabled());
+    appConfig.setFeatureFlags(featureFlagsConfig);
+
     return CompletableFuture.completedFuture(appConfig);
   }
 

datahub-graphql-core/src/main/resources/app.graphql

@@ -181,6 +181,11 @@ type AppConfig {
   Configurations related to DataHub Views
   """
   viewsConfig: ViewsConfig!
+
+  """
+  Feature flags telling the UI whether a feature is enabled or not
+  """
+  featureFlags: FeatureFlagsConfig!
 }
 
 """
@@ -360,6 +365,17 @@ type ViewsConfig {
   enabled: Boolean!
 }
 
+"""
+Configurations related to DataHub Views feature
+"""
+type FeatureFlagsConfig {
+  """
+  Whether read only mode is enabled on an instance.
+  Right now this only affects ability to edit user profile image URL but can be extended.
+  """
+  readOnlyModeEnabled: Boolean!
+}
+
 """
 Input required to update Global View Settings.
 """

datahub-web-react/src/app/entity/user/UserEditProfileModal.tsx

@@ -1,7 +1,8 @@
 import React, { useEffect, useState } from 'react';
-import { message, Button, Input, Modal, Typography, Form } from 'antd';
+import { message, Button, Input, Modal, Typography, Form, Tooltip } from 'antd';
 import { useUpdateCorpUserPropertiesMutation } from '../../../graphql/user.generated';
 import { useEnterKeyListener } from '../../shared/useEnterKeyListener';
+import { useAppConfig } from '../../useAppConfig';
 
 type PropsData = {
     name: string | undefined;
@@ -24,6 +25,8 @@ type Props = {
 export const USER_NAME_REGEX = new RegExp('^[a-zA-Z ]*$');
 
 export default function UserEditProfileModal({ visible, onClose, onSave, editModalData }: Props) {
+    const { config } = useAppConfig();
+    const { readOnlyModeEnabled } = config.featureFlags;
     const [updateCorpUserPropertiesMutation] = useUpdateCorpUserPropertiesMutation();
     const [form] = Form.useForm();
 
@@ -149,18 +152,25 @@ export default function UserEditProfileModal({ visible, onClose, onSave, editMod
                         onChange={(event) => setData({ ...data, title: event.target.value })}
                     />
                 </Form.Item>
-                <Form.Item
-                    name="image"
-                    label={<Typography.Text strong>Image URL</Typography.Text>}
-                    rules={[{ whitespace: true }, { type: 'url', message: 'not valid url' }]}
-                    hasFeedback
+                <Tooltip
+                    title="Editing image URL has been disabled."
+                    overlayStyle={readOnlyModeEnabled ? {} : { display: 'none' }}
+                    placement="bottom"
                 >
-                    <Input
-                        placeholder="https://www.example.com/photo.png"
-                        value={data.image}
-                        onChange={(event) => setData({ ...data, image: event.target.value })}
-                    />
-                </Form.Item>
+                    <Form.Item
+                        name="image"
+                        label={<Typography.Text strong>Image URL</Typography.Text>}
+                        rules={[{ whitespace: true }, { type: 'url', message: 'not valid url' }]}
+                        hasFeedback
+                    >
+                        <Input
+                            placeholder="https://www.example.com/photo.png"
+                            value={data.image}
+                            onChange={(event) => setData({ ...data, image: event.target.value })}
+                            disabled={readOnlyModeEnabled}
+                        />
+                    </Form.Item>
+                </Tooltip>
                 <Form.Item
                     name="team"
                     label={<Typography.Text strong>Team</Typography.Text>}

datahub-web-react/src/appConfigContext.tsx

@@ -37,6 +37,9 @@ export const DEFAULT_APP_CONFIG = {
     viewsConfig: {
         enabled: false,
     },
+    featureFlags: {
+        readOnlyModeEnabled: false,
+    },
 };
 
 export const AppConfigContext = React.createContext<{

datahub-web-react/src/graphql/app.graphql

@@ -50,6 +50,9 @@ query appConfig {
         viewsConfig {
             enabled
         }
+        featureFlags {
+            readOnlyModeEnabled
+        }
     }
 }
 

metadata-service/factories/src/main/resources/application.yml

@@ -279,6 +279,7 @@ featureFlags:
   pointInTimeCreationEnabled: ${POINT_IN_TIME_CREATION_ENABLED:false} # Enables creation of point in time snapshots for the scroll API, only works with main line ElasticSearch releases after 7.10. OpenSearch is unsupported, plans to eventually target OpenSearch 2.4+ with a divergent client
   alwaysEmitChangeLog: ${ALWAYS_EMIT_CHANGE_LOG:false} # Enables always emitting a MCL even when no changes are detected. Used for Time Based Lineage when no changes occur.
   searchServiceDiffModeEnabled: ${SEARCH_SERVICE_DIFF_MODE_ENABLED:true} # Enables diff mode for search document writes, reduces amount of writes to ElasticSearch documents for no-ops
+  readOnlyModeEnabled: ${READ_ONLY_MODE_ENABLED:false} # Enables read only mode for an instance. Right now this only affects ability to edit user profile image URL but can be extended
 
 entityChangeEvents:
   enabled: ${ENABLE_ENTITY_CHANGE_EVENTS_HOOK:true}