Fixed: Fixed service and services page issue and other miner fixes (#5669)

* Fixed service and services page issue and other miner fixes * fixed failing unit test
2025-11-01 02:56:10 +00:00 · 2022-06-27 22:32:24 +05:30 · 2022-06-27 22:32:24 +05:30 · 9b588c998a
commit 9b588c998a
parent 3a1dfbdbcb
9 changed files with 116 additions and 74 deletions
--- a/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/EntityLineage.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/EntityLineage.component.tsx
@ -1280,60 +1280,56 @@ const Entitylineage: FunctionComponent<EntityLineageProp> = ({
    }
  }, [entityLineage]);

-  if (isLoading) {
+  if (isLoading || (nodes.length === 0 && !deleted)) {
    return <Loader />;
  }

  return deleted ? (
    getDeletedLineagePlaceholder()
  ) : (
-    <Fragment>
-      <div
-        className={classNames(
-          'tw-relative tw-h-full tw--ml-4 tw--mr-7 tw--mt-4'
-        )}
-        data-testid="lineage-container">
-        <div className="tw-w-full tw-h-full" ref={reactFlowWrapper}>
-          <ReactFlowProvider>
-            <ReactFlow
-              data-testid="react-flow-component"
-              edgeTypes={{ buttonedge: CustomEdge }}
-              edges={edges}
-              maxZoom={2}
-              minZoom={0.5}
-              nodeTypes={nodeTypes}
-              nodes={nodes}
-              nodesConnectable={isEditMode}
-              selectNodesOnDrag={false}
-              zoomOnDoubleClick={false}
-              zoomOnScroll={false}
-              onConnect={onConnect}
-              onDragOver={onDragOver}
-              onDrop={onDrop}
-              onEdgesChange={onEdgesChange}
-              onInit={(reactFlowInstance: ReactFlowInstance) => {
-                onLoad(reactFlowInstance, nodes.length);
-                setReactFlowInstance(reactFlowInstance);
-              }}
-              onNodeClick={(_e, node) => onNodeClick(node)}
-              onNodeContextMenu={onNodeContextMenu}
-              onNodeDrag={dragHandle}
-              onNodeDragStart={dragHandle}
-              onNodeDragStop={dragHandle}
-              onNodeMouseEnter={onNodeMouseEnter}
-              onNodeMouseLeave={onNodeMouseLeave}
-              onNodeMouseMove={onNodeMouseMove}
-              onNodesChange={onNodesChange}>
-              {getCustomControlElements()}
-              {getGraphBackGround()}
-            </ReactFlow>
-          </ReactFlowProvider>
-        </div>
-        {getEntityDrawer()}
-        <EntityLineageSidebar newAddedNode={newAddedNode} show={isEditMode} />
-        {getConfirmationModal()}
+    <div
+      className={classNames('tw-relative tw-h-full tw--ml-4 tw--mr-7 tw--mt-4')}
+      data-testid="lineage-container">
+      <div className="tw-w-full tw-h-full" ref={reactFlowWrapper}>
+        <ReactFlowProvider>
+          <ReactFlow
+            data-testid="react-flow-component"
+            edgeTypes={{ buttonedge: CustomEdge }}
+            edges={edges}
+            maxZoom={2}
+            minZoom={0.5}
+            nodeTypes={nodeTypes}
+            nodes={nodes}
+            nodesConnectable={isEditMode}
+            selectNodesOnDrag={false}
+            zoomOnDoubleClick={false}
+            zoomOnScroll={false}
+            onConnect={onConnect}
+            onDragOver={onDragOver}
+            onDrop={onDrop}
+            onEdgesChange={onEdgesChange}
+            onInit={(reactFlowInstance: ReactFlowInstance) => {
+              onLoad(reactFlowInstance, nodes.length);
+              setReactFlowInstance(reactFlowInstance);
+            }}
+            onNodeClick={(_e, node) => onNodeClick(node)}
+            onNodeContextMenu={onNodeContextMenu}
+            onNodeDrag={dragHandle}
+            onNodeDragStart={dragHandle}
+            onNodeDragStop={dragHandle}
+            onNodeMouseEnter={onNodeMouseEnter}
+            onNodeMouseLeave={onNodeMouseLeave}
+            onNodeMouseMove={onNodeMouseMove}
+            onNodesChange={onNodesChange}>
+            {getCustomControlElements()}
+            {getGraphBackGround()}
+          </ReactFlow>
+        </ReactFlowProvider>
      </div>
-    </Fragment>
+      {getEntityDrawer()}
+      <EntityLineageSidebar newAddedNode={newAddedNode} show={isEditMode} />
+      {getConfirmationModal()}
+    </div>
  );
 };

--- a/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/Entitylineage.component.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/EntityLineage/Entitylineage.component.test.tsx
@ -127,6 +127,29 @@ const mockEntityLineageProp = {
  entityLineageHandler: jest.fn(),
 };

+const mockFlowData = {
+  node: [
+    {
+      id: 'a4b21449-b03b-4527-b482-148f52f92ff2',
+      sourcePosition: 'right',
+      targetPosition: 'left',
+      type: 'default',
+      className: 'leaf-node core',
+      data: {
+        label: 'dim_address etl',
+        isEditMode: false,
+        columns: {},
+        isExpanded: false,
+      },
+      position: {
+        x: 0,
+        y: 0,
+      },
+    },
+  ],
+  edge: [],
+};
+
 jest.mock('../../utils/EntityLineageUtils', () => ({
  dragHandle: jest.fn(),
  getDataLabel: jest
@ -138,8 +161,8 @@ jest.mock('../../utils/EntityLineageUtils', () => ({
      <p>Lineage data is not available for deleted entities.</p>
    ),
  getHeaderLabel: jest.fn().mockReturnValue(<p>Header label</p>),
-  getLayoutedElementsV1: jest.fn().mockReturnValue([]),
-  getLineageDataV1: jest.fn().mockReturnValue([]),
+  getLayoutedElementsV1: jest.fn().mockImplementation(() => mockFlowData),
+  getLineageDataV1: jest.fn().mockImplementation(() => mockFlowData),
  getModalBodyText: jest.fn(),
  onLoad: jest.fn(),
  onNodeContextMenu: jest.fn(),
--- a/openmetadata-ui/src/main/resources/ui/src/components/ServiceConfig/ServiceConfig.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ServiceConfig/ServiceConfig.tsx
@ -66,6 +66,10 @@ const ServiceConfig = ({
      });
  };

+  const onCancel = () => {
+    history.goBack();
+  };
+
  const getDynamicFields = () => {
    return (
      <ConnectionConfigForm
@ -79,6 +83,7 @@ const ServiceConfig = ({
        serviceCategory={serviceCategory}
        serviceType={serviceType}
        status={status}
+        onCancel={onCancel}
        onSave={handleOnSaveClick}
      />
    );
--- a/openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/TeamDetails.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/TeamDetails.tsx
@ -606,9 +606,7 @@ const TeamDetails = ({
              blurWithBodyBG
              description={currentTeam?.description || ''}
              entityName={currentTeam?.displayName ?? currentTeam?.name}
-              hasEditAccess={isActionAllowed(
-                userPermissions[Operation.UpdateDescription]
-              )}
+              hasEditAccess={isOwner()}
              isEdit={isDescriptionEditable}
              onCancel={() => descriptionHandler(false)}
              onDescriptionEdit={() => descriptionHandler(true)}
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/description/Description.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/description/Description.tsx
@ -17,6 +17,7 @@ import { EntityFieldThreads } from 'Models';
 import React, { FC, Fragment } from 'react';
 import { useHistory } from 'react-router-dom';
 import { useAuthContext } from '../../../authentication/auth-provider/AuthProvider';
+import { TITLE_FOR_UPDATE_DESCRIPTION } from '../../../constants/constants';
 import { EntityType } from '../../../enums/entity.enum';
 import { Operation } from '../../../generated/entity/policies/accessControl/rule';
 import { useAuth } from '../../../hooks/authHooks';
@ -28,6 +29,7 @@ import {
  TASK_ENTITIES,
 } from '../../../utils/TasksUtils';
 import { ModalWithMarkdownEditor } from '../../Modals/ModalWithMarkdownEditor/ModalWithMarkdownEditor';
+import NonAdminAction from '../non-admin-action/NonAdminAction';
 import PopOver from '../popover/PopOver';
 import RichTextEditorPreviewer from '../rich-text-editor/RichTextEditorPreviewer';
 import { DescriptionProps } from './Description.interface';
@ -68,16 +70,22 @@ const Description: FC<DescriptionProps> = ({
    );
  };

+  const checkPermission = () => {
+    if (!isAuthDisabled && !isAdminUser) {
+      if (!isUndefined(hasEditAccess)) {
+        return Boolean(hasEditAccess);
+      } else {
+        return userPermissions[Operation.UpdateDescription];
+      }
+    }
+
+    return true;
+  };
+
  const handleUpdate = () => {
-    const check =
-      isAdminUser ||
-      hasEditAccess ||
-      isAuthDisabled ||
-      userPermissions[Operation.UpdateDescription] ||
-      !TASK_ENTITIES.includes(entityType as EntityType);
-    if (check) {
+    if (checkPermission()) {
      onDescriptionEdit && onDescriptionEdit();
-    } else {
+    } else if (TASK_ENTITIES.includes(entityType as EntityType)) {
      handleUpdateDescription();
    }
  };
@ -151,12 +159,19 @@ const Description: FC<DescriptionProps> = ({
          'tw-w-5 tw-min-w-max tw-flex',
          description?.trim() ? 'tw-pl-1' : ''
        )}>
-        <button
-          className="focus:tw-outline-none tw-self-baseline"
-          data-testid="edit-description"
-          onClick={handleUpdate}>
-          <SVGIcons alt="edit" icon="icon-edit" title="Edit" width="16px" />
-        </button>
+        <NonAdminAction
+          isOwner={
+            checkPermission() ||
+            TASK_ENTITIES.includes(entityType as EntityType)
+          }
+          title={TITLE_FOR_UPDATE_DESCRIPTION}>
+          <button
+            className="focus:tw-outline-none tw-self-baseline"
+            data-testid="edit-description"
+            onClick={handleUpdate}>
+            <SVGIcons alt="edit" icon="icon-edit" title="Edit" width="16px" />
+          </button>
+        </NonAdminAction>

        <RequestDescriptionEl descriptionThread={thread} />
        <DescriptionThreadEl descriptionThread={thread} />
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/title-breadcrumb/title-breadcrumb.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/title-breadcrumb/title-breadcrumb.component.tsx
@ -83,7 +83,7 @@ const TitleBreadcrumb: FunctionComponent<TitleBreadcrumbProps> = ({
                    className={classes}
                    style={{
                      maxWidth,
-                      fontSize: '14px',
+                      fontSize: '16px',
                    }}
                    to={link.url}>
                    {link.name}
--- a/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/constants/constants.ts
@ -433,6 +433,9 @@ export const TITLE_FOR_NON_ADMIN_ACTION =
 export const TITLE_FOR_UPDATE_OWNER =
  'You do not have permissions to update the owner.';

+export const TITLE_FOR_UPDATE_DESCRIPTION =
+  'You do not have permissions to update the description.';
+
 export const configOptions = {
  headers: { 'Content-type': 'application/json-patch+json' },
 };
--- a/openmetadata-ui/src/main/resources/ui/src/pages/service/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/service/index.tsx
@ -175,6 +175,7 @@ const ServicePage: FunctionComponent = () => {
      },

      isProtected: !isAdminUser && !isAuthDisabled,
+      isHidden: !isAdminUser && !isAuthDisabled,
      position: 3,
    },
    {
@ -925,6 +926,7 @@ const ServicePage: FunctionComponent = () => {
                entityFqn={serviceFQN}
                entityName={serviceFQN}
                entityType={serviceCategory.slice(0, -1)}
+                hasEditAccess={isAdminUser || isAuthDisabled}
                isEdit={isEdit}
                onCancel={onCancel}
                onDescriptionEdit={onDescriptionEdit}
@ -1033,7 +1035,7 @@ const ServicePage: FunctionComponent = () => {
                      </Button>
                    </div>
                    <ServiceConnectionDetails
-                      connectionDetails={connectionDetails as ConfigData}
+                      connectionDetails={connectionDetails || {}}
                      serviceCategory={serviceCategory}
                      serviceFQN={serviceDetails?.serviceType || ''}
                    />
--- a/openmetadata-ui/src/main/resources/ui/src/pages/services/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/services/index.tsx
@ -307,7 +307,7 @@ const ServicesPage = () => {
              <span
                className=" tw-ml-1 tw-font-normal tw-text-grey-body"
                data-testid="dashboard-url">
-                {getDashboardURL(dashboardService.connection.config)}
+                {getDashboardURL(dashboardService.connection?.config)}
              </span>
            </div>
          </>
@ -323,7 +323,7 @@ const ServicesPage = () => {
              <span
                className=" tw-ml-1 tw-font-normal tw-text-grey-body"
                data-testid="pipeline-url">
-                {pipelineService.connection.config?.hostPort}
+                {pipelineService.connection?.config?.hostPort || '--'}
              </span>
            </div>
          </>
@ -340,7 +340,7 @@ const ServicesPage = () => {
              <span
                className=" tw-ml-1 tw-font-normal tw-text-grey-body"
                data-testid="pipeline-url">
-                {mlmodel.connection.config?.registryUri}
+                {mlmodel.connection?.config?.registryUri || '--'}
              </span>
            </div>
            <div className="tw-mb-1 tw-truncate" data-testid="additional-field">
@ -348,7 +348,7 @@ const ServicesPage = () => {
              <span
                className=" tw-ml-1 tw-font-normal tw-text-grey-body"
                data-testid="pipeline-url">
-                {mlmodel.connection.config?.trackingUri}
+                {mlmodel.connection?.config?.trackingUri || '--'}
              </span>
            </div>
          </>
@ -508,7 +508,7 @@ const ServicesPage = () => {
          <p className="tw-text-lg tw-text-center">
            {noServicesText(searchText)}
          </p>
-          <p className="tw-text-lg tw-text-center">
+          <div className="tw-text-lg tw-text-center">
            <NonAdminAction
              position="bottom"
              title={TITLE_FOR_NON_ADMIN_ACTION}>
@ -522,7 +522,7 @@ const ServicesPage = () => {
              </Button>
            </NonAdminAction>{' '}
            to add new {servicesDisplayName[serviceName]}
-          </p>
+          </div>
        </div>
      </div>
    );