Merge remote-tracking branch 'upstream/master' into fix/9182/support-…

…views-with-dots-in-name
datahub-project · Nov 7, 2023 · 0b81032 · 0b81032
2 parents a191a65 + 88cde08
commit 0b81032
Show file tree

Hide file tree

Showing 24 changed files with 418 additions and 94 deletions.
diff --git a/.github/workflows/docker-ingestion-smoke.yml b/.github/workflows/docker-ingestion-smoke.yml
@@ -47,6 +47,7 @@ jobs:
     name: Build and Push Docker Image to Docker Hub
     runs-on: ubuntu-latest
     needs: setup
+    if: ${{ needs.setup.outputs.publish == 'true' }}
     steps:
       - name: Check out the repo
         uses: actions/checkout@v3

diff --git a/build.gradle b/build.gradle
@@ -1,7 +1,7 @@
 buildscript {
   ext.junitJupiterVersion = '5.6.1'
   // Releases: https://github.com/linkedin/rest.li/blob/master/CHANGELOG.md
-  ext.pegasusVersion = '29.45.0'
+  ext.pegasusVersion = '29.46.8'
   ext.mavenVersion = '3.6.3'
   ext.springVersion = '5.3.29'
   ext.springBootVersion = '2.7.14'
@@ -212,7 +212,7 @@ project.ext.externalDependency = [
     'testContainersOpenSearch': 'org.opensearch:opensearch-testcontainers:2.0.0',
     'typesafeConfig':'com.typesafe:config:1.4.1',
     'wiremock':'com.github.tomakehurst:wiremock:2.10.0',
-    'zookeeper': 'org.apache.zookeeper:zookeeper:3.4.14',
+    'zookeeper': 'org.apache.zookeeper:zookeeper:3.7.2',
     'wire': 'com.squareup.wire:wire-compiler:3.7.1',
     'charle':  'com.charleskorn.kaml:kaml:0.53.0',
     'common': 'commons-io:commons-io:2.7',

diff --git a/datahub-web-react/codegen.yml b/datahub-web-react/codegen.yml
@@ -20,6 +20,9 @@ generates:
     src/types.generated.ts:
         plugins:
             - 'typescript'
+    src/possibleTypes.generated.ts:
+        plugins:
+            - 'fragment-matcher'
     src/:
         preset: near-operation-file
         presetConfig:

diff --git a/datahub-web-react/package.json b/datahub-web-react/package.json
@@ -11,6 +11,7 @@
         "@apollo/client": "^3.3.19",
         "@craco/craco": "^6.1.1",
         "@data-ui/xy-chart": "^0.0.84",
+        "@graphql-codegen/fragment-matcher": "^5.0.0",
         "@miragejs/graphql": "^0.1.11",
         "@monaco-editor/react": "^4.3.1",
         "@react-hook/window-size": "^3.0.7",

diff --git a/datahub-web-react/src/App.tsx b/datahub-web-react/src/App.tsx
@@ -36,6 +36,7 @@ import { DataPlatformEntity } from './app/entity/dataPlatform/DataPlatformEntity
 import { DataProductEntity } from './app/entity/dataProduct/DataProductEntity';
 import { DataPlatformInstanceEntity } from './app/entity/dataPlatformInstance/DataPlatformInstanceEntity';
 import { RoleEntity } from './app/entity/Access/RoleEntity';
+import possibleTypesResult from './possibleTypes.generated';
 
 /*
     Construct Apollo Client
@@ -77,6 +78,8 @@ const client = new ApolloClient({
                 },
             },
         },
+        // need to define possibleTypes to allow us to use Apollo cache with union types
+        possibleTypes: possibleTypesResult.possibleTypes,
     }),
     credentials: 'include',
     defaultOptions: {

diff --git a/datahub-web-react/src/app/entity/EntityPage.tsx b/datahub-web-react/src/app/entity/EntityPage.tsx
@@ -8,7 +8,6 @@ import { useEntityRegistry } from '../useEntityRegistry';
 import analytics, { EventType } from '../analytics';
 import { decodeUrn } from './shared/utils';
 import { useGetGrantedPrivilegesQuery } from '../../graphql/policy.generated';
-import { Message } from '../shared/Message';
 import { UnauthorizedPage } from '../authorization/UnauthorizedPage';
 import { ErrorSection } from '../shared/error/ErrorSection';
 import { VIEW_ENTITY_PAGE } from './shared/constants';
@@ -34,7 +33,7 @@ export const EntityPage = ({ entityType }: Props) => {
     const isLineageSupported = entity.isLineageEnabled();
     const isLineageMode = useIsLineageMode();
     const authenticatedUserUrn = useUserContext()?.user?.urn;
-    const { loading, error, data } = useGetGrantedPrivilegesQuery({
+    const { error, data } = useGetGrantedPrivilegesQuery({
         variables: {
             input: {
                 actorUrn: authenticatedUserUrn as string,
@@ -71,7 +70,6 @@ export const EntityPage = ({ entityType }: Props) => {
 
     return (
         <>
-            {loading && <Message type="loading" content="Loading..." style={{ marginTop: '10%' }} />}
             {error && <ErrorSection />}
             {data && !canViewEntityPage && <UnauthorizedPage />}
             {canViewEntityPage &&

diff --git a/datahub-web-react/src/app/entity/shared/containers/profile/EntityProfile.tsx b/datahub-web-react/src/app/entity/shared/containers/profile/EntityProfile.tsx
@@ -4,7 +4,6 @@ import { MutationHookOptions, MutationTuple, QueryHookOptions, QueryResult } fro
 import styled from 'styled-components/macro';
 import { useHistory } from 'react-router';
 import { EntityType, Exact } from '../../../../../types.generated';
-import { Message } from '../../../../shared/Message';
 import {
     getEntityPath,
     getOnboardingStepIdsForEntityType,
@@ -274,7 +273,6 @@ export const EntityProfile = <T, U>({
                 }}
             >
                 <>
-                    {loading && <Message type="loading" content="Loading..." style={{ marginTop: '10%' }} />}
                     {(error && <ErrorSection />) ||
                         (!loading && (
                             <CompactProfile>
@@ -323,7 +321,6 @@ export const EntityProfile = <T, U>({
                         banner
                     />
                 )}
-                {loading && <Message type="loading" content="Loading..." style={{ marginTop: '10%' }} />}
                 {(error && <ErrorSection />) || (
                     <ContentContainer>
                         {isLineageMode ? (

diff --git a/datahub-web-react/src/app/entity/shared/containers/profile/header/EntityHeader.tsx b/datahub-web-react/src/app/entity/shared/containers/profile/header/EntityHeader.tsx
@@ -16,6 +16,7 @@ import ShareButton from '../../../../../shared/share/ShareButton';
 import { capitalizeFirstLetterOnly } from '../../../../../shared/textUtil';
 import { useUserContext } from '../../../../../context/useUserContext';
 import { useEntityRegistry } from '../../../../../useEntityRegistry';
+import EntityHeaderLoadingSection from './EntityHeaderLoadingSection';
 
 const TitleWrapper = styled.div`
     display: flex;
@@ -81,7 +82,7 @@ type Props = {
 };
 
 export const EntityHeader = ({ headerDropdownItems, headerActionItems, isNameEditable, subHeader }: Props) => {
-    const { urn, entityType, entityData } = useEntityData();
+    const { urn, entityType, entityData, loading } = useEntityData();
     const refetch = useRefetch();
     const me = useUserContext();
     const platformName = getPlatformName(entityData);
@@ -99,25 +100,32 @@ export const EntityHeader = ({ headerDropdownItems, headerActionItems, isNameEdi
         <>
             <HeaderContainer data-testid="entity-header-test-id">
                 <MainHeaderContent>
-                    <PlatformContent />
-                    <TitleWrapper>
-                        <EntityName isNameEditable={canEditName} />
-                        {entityData?.deprecation?.deprecated && (
-                            <DeprecationPill
-                                urn={urn}
-                                deprecation={entityData?.deprecation}
-                                showUndeprecate
-                                refetch={refetch}
-                            />
-                        )}
-                        {entityData?.health && (
-                            <EntityHealth
-                                health={entityData.health}
-                                baseUrl={entityRegistry.getEntityUrl(entityType, urn)}
+                    {(loading && <EntityHeaderLoadingSection />) || (
+                        <>
+                            <PlatformContent />
+                            <TitleWrapper>
+                                <EntityName isNameEditable={canEditName} />
+                                {entityData?.deprecation?.deprecated && (
+                                    <DeprecationPill
+                                        urn={urn}
+                                        deprecation={entityData?.deprecation}
+                                        showUndeprecate
+                                        refetch={refetch}
+                                    />
+                                )}
+                                {entityData?.health && (
+                                    <EntityHealth
+                                        health={entityData.health}
+                                        baseUrl={entityRegistry.getEntityUrl(entityType, urn)}
+                                    />
+                                )}
+                            </TitleWrapper>
+                            <EntityCount
+                                entityCount={entityCount}
+                                displayAssetsText={entityType === EntityType.DataProduct}
                             />
-                        )}
-                    </TitleWrapper>
-                    <EntityCount entityCount={entityCount} displayAssetsText={entityType === EntityType.DataProduct} />
+                        </>
+                    )}
                 </MainHeaderContent>
                 <SideHeaderContent>
                     <TopButtonsWrapper>

diff --git a/...-web-react/src/app/entity/shared/containers/profile/header/EntityHeaderLoadingSection.tsx b/...-web-react/src/app/entity/shared/containers/profile/header/EntityHeaderLoadingSection.tsx
@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { Skeleton, Space } from 'antd';
+import styled from 'styled-components';
+import { ANTD_GRAY } from '../../../constants';
+
+const ContextSkeleton = styled(Skeleton.Input)`
+    && {
+        width: 320px;
+        border-radius: 4px;
+        background-color: ${ANTD_GRAY[3]};
+    }
+`;
+
+const NameSkeleton = styled(Skeleton.Input)`
+    && {
+        width: 240px;
+        border-radius: 4px;
+        background-color: ${ANTD_GRAY[3]};
+    }
+`;
+
+export default function EntityHeaderLoadingSection() {
+    return (
+        <Space direction="vertical">
+            <ContextSkeleton active size="small" />
+            <NameSkeleton active size="default" />
+        </Space>
+    );
+}
diff --git a/datahub-web-react/src/app/home/HomePageHeader.tsx b/datahub-web-react/src/app/home/HomePageHeader.tsx
@@ -276,6 +276,7 @@ export const HomePageHeader = () => {
                         combineSiblings
                         showQuickFilters
                         showViewAllResults
+                        showCommandK
                     />
                     {searchResultsToShow && searchResultsToShow.length > 0 && (
                         <SuggestionsContainer>

diff --git a/datahub-web-react/src/app/lineage/LineageExplorer.tsx b/datahub-web-react/src/app/lineage/LineageExplorer.tsx
@@ -3,7 +3,6 @@ import { useHistory } from 'react-router';
 import { Button, Drawer } from 'antd';
 import { InfoCircleOutlined } from '@ant-design/icons';
 import styled from 'styled-components';
-import { Message } from '../shared/Message';
 import { useEntityRegistry } from '../useEntityRegistry';
 import CompactContext from '../shared/CompactContext';
 import { EntityAndType, EntitySelectParams, FetchedEntities } from './types';
@@ -18,12 +17,10 @@ import { ErrorSection } from '../shared/error/ErrorSection';
 import usePrevious from '../shared/usePrevious';
 import { useGetLineageTimeParams } from './utils/useGetLineageTimeParams';
 import analytics, { EventType } from '../analytics';
+import LineageLoadingSection from './LineageLoadingSection';
 
 const DEFAULT_DISTANCE_FROM_TOP = 106;
 
-const LoadingMessage = styled(Message)`
-    margin-top: 10%;
-`;
 const FooterButtonGroup = styled.div`
     display: flex;
     justify-content: space-between;
@@ -167,7 +164,7 @@ export default function LineageExplorer({ urn, type }: Props) {
     return (
         <>
             {error && <ErrorSection />}
-            {loading && <LoadingMessage type="loading" content="Loading..." />}
+            {loading && <LineageLoadingSection />}
             {!!data && (
                 <div>
                     <LineageViz
@@ -220,7 +217,7 @@ export default function LineageExplorer({ urn, type }: Props) {
                                 Close
                             </Button>
                             <Button href={entityRegistry.getEntityUrl(selectedEntity.type, selectedEntity.urn)}>
-                                <InfoCircleOutlined /> {entityRegistry.getEntityName(selectedEntity.type)} Details
+                                <InfoCircleOutlined /> View details
                             </Button>
                         </FooterButtonGroup>
                     )

diff --git a/datahub-web-react/src/app/lineage/LineageLoadingSection.tsx b/datahub-web-react/src/app/lineage/LineageLoadingSection.tsx
@@ -0,0 +1,27 @@
+import * as React from 'react';
+import styled from 'styled-components';
+import { LoadingOutlined } from '@ant-design/icons';
+import { ANTD_GRAY } from '../entity/shared/constants';
+
+const Container = styled.div`
+    height: auto;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: rgb(250, 250, 250);
+`;
+
+const StyledLoading = styled(LoadingOutlined)`
+    font-size: 36px;
+    color: ${ANTD_GRAY[7]};
+    padding-bottom: 18px;
+]`;
+
+export default function LineageLoadingSection() {
+    return (
+        <Container>
+            <StyledLoading />
+        </Container>
+    );
+}
diff --git a/datahub-web-react/src/app/search/CommandK.tsx b/datahub-web-react/src/app/search/CommandK.tsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import styled from 'styled-components';
+import { ANTD_GRAY } from '../entity/shared/constants';
+
+const Container = styled.div`
+    color: ${ANTD_GRAY[6]};
+    background-color: #ffffff;
+    opacity: 0.9;
+    border-color: black;
+    border-radius: 6px;
+    border: 1px solid ${ANTD_GRAY[6]};
+    padding-right: 6px;
+    padding-left: 6px;
+    margin-right: 4px;
+    margin-left: 4px;
+`;
+
+const Letter = styled.span`
+    padding: 2px;
+`;
+
+export const CommandK = () => {
+    return (
+        <Container>
+            <Letter>⌘</Letter>
+            <Letter>K</Letter>
+        </Container>
+    );
+};