Fixed #2407, #2303, Entity name in versions (#2451)

* Fix: #2407 and Entity name in versions

* Fix: #2303 Login page changes

openmetadata-ui/src/main/resources/ui/src/components/DashboardVersion/DashboardVersion.component.tsx

@@ -156,7 +156,8 @@ const DashboardVersion: FC<DashboardVersionProp> = ({
       {
         key: `${currentVersionData.serviceType} Url`,
         value: currentVersionData.dashboardUrl,
-        placeholderText: currentVersionData.name,
+        placeholderText:
+          currentVersionData.displayName ?? currentVersionData.name,
         isLink: true,
         openInNewTab: true,
       },
@@ -221,7 +222,9 @@ const DashboardVersion: FC<DashboardVersionProp> = ({
             <EntityPageInfo
               isVersionSelected
               deleted={deleted}
-              entityName={currentVersionData.name ?? ''}
+              entityName={
+                currentVersionData.displayName ?? currentVersionData.name ?? ''
+              }
               extraInfo={getExtraInfo()}
               followersList={[]}
               tags={getTags()}

openmetadata-ui/src/main/resources/ui/src/components/PipelineVersion/PipelineVersion.component.tsx

@@ -156,7 +156,8 @@ const PipelineVersion: FC<PipelineVersionProp> = ({
       {
         key: `${currentVersionData.serviceType} Url`,
         value: currentVersionData.pipelineUrl,
-        placeholderText: currentVersionData.name,
+        placeholderText:
+          currentVersionData.displayName ?? currentVersionData.name,
         isLink: true,
         openInNewTab: true,
       },
@@ -221,7 +222,9 @@ const PipelineVersion: FC<PipelineVersionProp> = ({
             <EntityPageInfo
               isVersionSelected
               deleted={deleted}
-              entityName={currentVersionData.name ?? ''}
+              entityName={
+                currentVersionData.displayName ?? currentVersionData.name ?? ''
+              }
               extraInfo={getExtraInfo()}
               followersList={[]}
               tags={getTags()}

openmetadata-ui/src/main/resources/ui/src/pages/EntityVersionPage/EntityVersionPage.component.tsx

@@ -250,7 +250,8 @@ const EntityVersionPage: FunctionComponent = () => {
           ['owner', 'tags', 'charts']
         )
           .then((res: AxiosResponse) => {
-            const { id, owner, tags, name, service, serviceType } = res.data;
+            const { id, owner, tags, displayName, service, serviceType } =
+              res.data;
             setEntityState(tags, owner, res.data, [
               {
                 name: service.name,
@@ -264,7 +265,7 @@ const EntityVersionPage: FunctionComponent = () => {
                 imgSrc: serviceType ? serviceTypeLogo(serviceType) : undefined,
               },
               {
-                name: name,
+                name: displayName,
                 url: '',
                 activeTitle: true,
               },
@@ -299,7 +300,8 @@ const EntityVersionPage: FunctionComponent = () => {
           ['owner', 'tags', 'tasks']
         )
           .then((res: AxiosResponse) => {
-            const { id, owner, tags, name, service, serviceType } = res.data;
+            const { id, owner, tags, displayName, service, serviceType } =
+              res.data;
             setEntityState(tags, owner, res.data, [
               {
                 name: service.name,
@@ -313,7 +315,7 @@ const EntityVersionPage: FunctionComponent = () => {
                 imgSrc: serviceType ? serviceTypeLogo(serviceType) : undefined,
               },
               {
-                name: name,
+                name: displayName,
                 url: '',
                 activeTitle: true,
               },
@@ -469,7 +471,7 @@ const EntityVersionPage: FunctionComponent = () => {
           getPartialNameFromFQN(entityFQN, ['service', 'database'], '.')
         )
           .then((res: AxiosResponse) => {
-            const { id, name, service, serviceType } = res.data;
+            const { id, displayName, service, serviceType } = res.data;
             getDashboardVersion(id, version)
               .then((vRes: AxiosResponse) => {
                 const { owner, tags } = vRes.data;
@@ -488,7 +490,7 @@ const EntityVersionPage: FunctionComponent = () => {
                       : undefined,
                   },
                   {
-                    name: name,
+                    name: displayName,
                     url: '',
                     activeTitle: true,
                   },
@@ -521,7 +523,7 @@ const EntityVersionPage: FunctionComponent = () => {
           getPartialNameFromFQN(entityFQN, ['service', 'database'], '.')
         )
           .then((res: AxiosResponse) => {
-            const { id, name, service, serviceType } = res.data;
+            const { id, displayName, service, serviceType } = res.data;
             getPipelineVersion(id, version)
               .then((vRes: AxiosResponse) => {
                 const { owner, tags } = vRes.data;
@@ -540,7 +542,7 @@ const EntityVersionPage: FunctionComponent = () => {
                       : undefined,
                   },
                   {
-                    name: name,
+                    name: displayName,
                     url: '',
                     activeTitle: true,
                   },

openmetadata-ui/src/main/resources/ui/src/pages/login/index.tsx

@@ -58,7 +58,7 @@ const SigninPage = () => {
     }
 
     return ssoBrandName ? (
-      <button className="tw-signin-button">
+      <button className="tw-signin-button tw-mx-auto">
         <SVGIcons alt={`${ssoBrandName} Logo`} icon={ssoBrandLogo} width="30" />
         <span className="tw-ml-3 tw-font-medium tw-text-grey-muted tw-text-xl">
           Sign in with {ssoBrandName}
@@ -75,13 +75,10 @@ const SigninPage = () => {
 
   return (
     <div className="tw-flex tw-bg-body-main tw-h-screen">
-      <div className="tw-w-5/12 tw-ml-14">
+      <div className="tw-w-5/12">
-        <div className="tw-mt-10">
+        <div className="tw-mt-52 tw-text-center">
           <SVGIcons alt="OpenMetadata Logo" icon={Icons.LOGO} width="152" />
-        </div>
+          <p className="tw-mt-24 tw-mx-auto tw-text-xl tw-text-grey-muted tw-font-medium tw-w-10/12">
-        <div className="tw-mt-44">
-          <p className="tw-text-3xl tw-font-bold tw-text-grey-muted">Log In</p>
-          <p className="tw-mt-10 tw-text-xl tw-text-grey-muted tw-font-medium tw-w-10/12">
             Centralized Metadata Store, Discover, Collaborate and get your Data
             Right
           </p>

openmetadata-ui/src/main/resources/ui/src/utils/ServiceUtils.ts

@@ -24,6 +24,7 @@ import { getServiceDetails, getServices } from '../axiosAPIs/serviceAPI';
 import { ServiceDataObj } from '../components/Modals/AddServiceModal/AddServiceModal';
 import {
   AIRFLOW,
+  arrServiceTypes,
   ATHENA,
   BIGQUERY,
   GLUE,
@@ -198,17 +199,28 @@ const getAllServiceList = (
   });
 };
 
-export const getAllServices = (): Promise<Array<ServiceDataObj>> => {
+export const getAllServices = (
+  onlyVisibleServices = true
+): Promise<Array<ServiceDataObj>> => {
   return new Promise<Array<ServiceDataObj>>((resolve, reject) => {
     getServiceDetails().then((res: AxiosResponse) => {
       let allServiceCollectionArr: Array<ServiceCollection> = [];
       if (res.data.data?.length) {
-        allServiceCollectionArr = res.data.data.map((service: ServiceData) => {
+        const arrServiceCat: Array<{ name: string; value: string }> =
-          return {
+          res.data.data.map((service: ServiceData) => {
-            name: service.collection.name,
+            return {
-            value: service.collection.name,
+              name: service.collection.name,
-          };
+              value: service.collection.name,
-        });
+            };
+          });
+
+        if (onlyVisibleServices) {
+          allServiceCollectionArr = arrServiceCat.filter((service) =>
+            arrServiceTypes.includes(service.name as ServiceTypes)
+          );
+        } else {
+          allServiceCollectionArr = arrServiceCat;
+        }
       }
       getAllServiceList(allServiceCollectionArr)
         .then((res) => resolve(res))