Update asset types in curated assets list (#22976)

* Update asset types in curated assets list * add knowledge page in asset type list
2025-10-31 02:29:03 +00:00 · 2025-08-21 09:12:09 +05:30 · 2025-08-21 09:12:09 +05:30 · a24281d110
commit a24281d110
parent 378ace104c
5 changed files with 136 additions and 73 deletions
--- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedCardNew/ActivityFeedcardNew.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedCardNew/ActivityFeedcardNew.component.tsx
@ -245,7 +245,7 @@ const ActivityFeedCardNew = ({
              {/* Horizontal line connecting popover to end of container */}
              <div className="horizontal-line " />

-              <div className="d-flex flex-col w-full">
+              <div className="d-flex flex-col w-full min-w-0 overflow-hidden">
                <div className="d-flex flex-col align-start">
                  <div
                    className={classNames(
--- a/openmetadata-ui/src/main/resources/ui/src/components/MyData/Widgets/KPIWidget/KPILegend/KPILegend.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/Widgets/KPIWidget/KPILegend/KPILegend.tsx
@ -11,7 +11,7 @@
 *  limitations under the License.
 */
 import { InfoCircleOutlined, WarningOutlined } from '@ant-design/icons';
-import { Col, Progress, Row, Tooltip, Typography } from 'antd';
+import { Progress, Tooltip, Typography } from 'antd';
 import { toNumber } from 'lodash';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
@ -37,7 +37,7 @@ const KPILegend: React.FC<KPILegendProps> = ({

  const GoalCompleted = () => {
    return (
-      <div className="goal-completed-container d-flex items-center gap-1">
+      <div className="goal-completed-container">
        <CheckIcon />
        <Typography.Text>{t('label.goal-completed')}</Typography.Text>
      </div>
@ -46,7 +46,7 @@ const KPILegend: React.FC<KPILegendProps> = ({

  const GoalMissed = () => {
    return (
-      <div className="goal-missed-container d-flex items-center gap-1">
+      <div className="goal-missed-container">
        <WarningOutlined />
        <Typography.Text>{t('label.goal-missed')}</Typography.Text>
      </div>
@ -74,59 +74,58 @@ const KPILegend: React.FC<KPILegendProps> = ({

        if (isFullSize) {
          return (
-            <div className="kpi-full-legend p-xs m-b-sm" key={key}>
-              <Row className="items-center" gutter={8}>
-                <Col span={24}>
-                  <div className="d-flex justify-between">
-                    <Typography.Text
-                      className="kpi-legend-title"
-                      ellipsis={{ tooltip: true }}>
-                      {resultData.displayName}
-                    </Typography.Text>
+            <div className="kpi-full-legend" key={key}>
+              <div className="kpi-legend-header">
+                <Typography.Text
+                  className="kpi-legend-title"
+                  ellipsis={{ tooltip: true }}>
+                  {resultData.displayName}
+                </Typography.Text>

-                    {daysLeft <= 0 || isTargetMet ? (
-                      <Tooltip
-                        placement="bottom"
-                        title={getKpiResultFeedback(
-                          daysLeft,
-                          Boolean(isTargetMet)
-                        )}
-                        trigger="hover">
-                        <InfoCircleOutlined className="kpi-legend-info-icon" />
-                      </Tooltip>
-                    ) : null}
-                  </div>
+                {daysLeft <= 0 || isTargetMet ? (
+                  <Tooltip
+                    placement="bottom"
+                    title={getKpiResultFeedback(daysLeft, Boolean(isTargetMet))}
+                    trigger="hover">
+                    <InfoCircleOutlined className="kpi-legend-info-icon" />
+                  </Tooltip>
+                ) : null}
+              </div>

-                  <Progress
-                    percent={Number(currentProgress)}
-                    showInfo={false}
-                    size="small"
-                    strokeColor={color}
-                    strokeWidth={4}
-                  />
+              <Progress
+                percent={Number(currentProgress)}
+                showInfo={false}
+                size="small"
+                strokeColor={color}
+                strokeWidth={4}
+              />

-                  <div className="d-flex justify-between m-t-xxs">
-                    <Typography.Text className="text-xss kpi-legend-value">
-                      {current.toFixed(0)}
-                      {suffix}
+              <div className="kpi-legend-bottom-row">
+                <div className="kpi-legend-value-section">
+                  <Typography.Text className="text-xss kpi-legend-value">
+                    {current.toFixed(0)}
+                    {suffix}
+                  </Typography.Text>
+                </div>
+                <div className="kpi-legend-center-section">
+                  {isTargetMet ? (
+                    <GoalCompleted />
+                  ) : isTargetMissed ? (
+                    <GoalMissed />
+                  ) : (
+                    <Typography.Text className="text-xss font-semibold kpi-legend-days-left text-center">
+                      {daysLeft <= 0 ? 0 : daysLeft}{' '}
+                      {t('label.days-left').toUpperCase()}
                    </Typography.Text>
-                    {isTargetMet ? (
-                      <GoalCompleted />
-                    ) : isTargetMissed ? (
-                      <GoalMissed />
-                    ) : (
-                      <Typography.Text className="text-xss font-semibold kpi-legend-days-left">
-                        {daysLeft <= 0 ? 0 : daysLeft}{' '}
-                        {t('label.days-left').toUpperCase()}
-                      </Typography.Text>
-                    )}
-                    <Typography.Text className="text-xss kpi-legend-value">
-                      {target.toFixed(0)}
-                      {suffix}
-                    </Typography.Text>
-                  </div>
-                </Col>
-              </Row>
+                  )}
+                </div>
+                <div className="kpi-legend-value-section">
+                  <Typography.Text className="text-xss kpi-legend-value">
+                    {target.toFixed(0)}
+                    {suffix}
+                  </Typography.Text>
+                </div>
+              </div>
            </div>
          );
        }
--- a/openmetadata-ui/src/main/resources/ui/src/components/MyData/Widgets/KPIWidget/KPILegend/kpi-legend.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/MyData/Widgets/KPIWidget/KPILegend/kpi-legend.less
@ -14,10 +14,13 @@
@import (reference) url('../../../../../styles/variables.less');

 .kpi-legend {
-  border: 1px solid @grey-15;
  border-radius: @border-rad-sm;
-  overflow-y: auto;
+  border: 1px solid @grey-15;
+  display: flex;
+  flex-direction: column;
+  gap: @size-xs;
  max-height: 350px;
+  overflow-y: auto;

  .legend-dot {
    border-radius: 50%;
@ -26,19 +29,28 @@
  }

  .kpi-full-legend {
-    min-width: 235px;
-    background-color: @purple-4;
-    border: 1px solid @grey-16;
-    border-radius: @border-rad-sm;
    background-color: @grey-26;
+    border-radius: @border-rad-sm;
+    border: 1px solid @grey-16;
+    display: flex;
+    flex-direction: column;
+    gap: @size-xxs;
+    margin-bottom: @size-xs;
+    min-width: 0;
+    padding: @size-xs;
+    width: 100%;
  }

  .kpi-legend-title {
    color: @grey-700;
+    flex: 1;
    font-size: @size-sm;
-    line-height: 1.2;
    font-weight: @font-regular;
-    max-width: 180px;
+    line-height: 1.2;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
  }

  .kpi-legend-info-icon {
@ -60,41 +72,90 @@
  }

  .goal-completed-container {
-    padding: @size-xxs @size-xs;
-    border-radius: @border-rad-xs;
+    align-items: center;
    background-color: @green-9;
+    border-radius: @border-rad-xs;
+    display: flex;
+    flex-shrink: 1;
    font-size: 10px;
-    max-width: 115px;
+    gap: @size-xxs;
+    min-width: 0;
+    padding: @size-xxs @size-xs;
+    width: fit-content;

    .ant-typography {
      color: @green-10;
-      margin-left: @size-xxs;
+      margin: 0;
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
    }

    svg {
-      width: @size-sm;
-      height: @size-sm;
      color: @green-10;
+      flex-shrink: 0;
+      height: @size-sm;
+      width: @size-sm;
    }
  }

  .goal-missed-container {
-    padding: @size-xxs @size-xs;
-    border-radius: @border-rad-xs;
+    align-items: center;
    background-color: @yellow-10;
+    border-radius: @border-rad-xs;
    color: @yellow-11;
+    display: flex;
+    flex-shrink: 1;
    font-size: 10px;
-    max-width: 100px;
+    gap: @size-xxs;
+    min-width: 0;
+    padding: @size-xxs @size-xs;
+    width: fit-content;

    .ant-typography {
      color: @yellow-11;
-      margin-left: @size-xxs;
+      margin: 0;
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
    }

    svg {
-      width: @size-sm;
-      height: @size-sm;
      color: @yellow-11;
+      flex-shrink: 0;
+      height: @size-sm;
+      width: @size-sm;
    }
  }
+
+  .kpi-legend-header {
+    align-items: center;
+    display: flex;
+    gap: @size-xs;
+    justify-content: space-between;
+    min-width: 0;
+  }
+
+  .kpi-legend-bottom-row {
+    align-items: center;
+    display: flex;
+    gap: @size-xxs;
+    justify-content: space-between;
+    min-width: 0;
+  }
+
+  .kpi-legend-center-section {
+    align-items: center;
+    display: flex;
+    flex: 1;
+    justify-content: center;
+    min-width: 0;
+  }
+
+  .kpi-legend-value-section {
+    flex-shrink: 0;
+    min-width: fit-content;
+  }
 }
--- a/openmetadata-ui/src/main/resources/ui/src/constants/AdvancedSearch.constants.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/constants/AdvancedSearch.constants.ts
@ -338,7 +338,9 @@ export const CURATED_ASSETS_LIST = [
  EntityType.DASHBOARD_DATA_MODEL,
  EntityType.DATABASE,
  EntityType.DATABASE_SCHEMA,
+  EntityType.DATA_PRODUCT,
  EntityType.GLOSSARY_TERM,
+  EntityType.KNOWLEDGE_PAGE,
  EntityType.METRIC,
  EntityType.MLMODEL,
  EntityType.PIPELINE,
--- a/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
@ -2452,6 +2452,7 @@ export const getEntityNameLabel = (entityName?: string) => {
    apiCollection: t('label.api-collection'),
    apiEndpoint: t('label.api-endpoint'),
    metric: t('label.metric'),
+    page: t('label.knowledge-page'),
  };

  return (