diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedCardV2/FeedCardBody/OwnerFeed/OwnersFeed.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedCardV2/FeedCardBody/OwnerFeed/OwnersFeed.tsx
index 4f927f3c6cf..0c35a5fb967 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedCardV2/FeedCardBody/OwnerFeed/OwnersFeed.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedCardV2/FeedCardBody/OwnerFeed/OwnersFeed.tsx
@@ -12,19 +12,21 @@
*/
import { Col, Row, Typography } from 'antd';
+import classNames from 'classnames';
import { isEmpty } from 'lodash';
-import React, { useMemo } from 'react';
+import React, { useCallback, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
import { ReactComponent as AddIcon } from '../../../../../assets/svg/added-icon.svg';
import { ReactComponent as DeletedIcon } from '../../../../../assets/svg/deleted-icon.svg';
-
-import { useTranslation } from 'react-i18next';
import {
MAX_VISIBLE_OWNERS_FOR_FEED_CARD,
MAX_VISIBLE_OWNERS_FOR_FEED_TAB,
} from '../../../../../constants/constants';
+import { EntityType } from '../../../../../enums/entity.enum';
import { Owner } from '../../../../../generated/entity/feed/owner';
import { Thread } from '../../../../../generated/entity/feed/thread';
import { EntityReference } from '../../../../../generated/entity/type';
+import { OwnerItem } from '../../../../common/OwnerItem/OwnerItem';
import { OwnerLabel } from '../../../../common/OwnerLabel/OwnerLabel.component';
import UserPopOverCard from '../../../../common/PopOverCard/UserPopOverCard';
import ProfilePicture from '../../../../common/ProfilePicture/ProfilePicture';
@@ -50,53 +52,89 @@ function OwnersFeed({
};
}, [feed]);
- const maxVisibleOwners = isForFeedTab
- ? MAX_VISIBLE_OWNERS_FOR_FEED_TAB
- : MAX_VISIBLE_OWNERS_FOR_FEED_CARD;
+ const maxVisibleOwners = useMemo(
+ () =>
+ isForFeedTab
+ ? MAX_VISIBLE_OWNERS_FOR_FEED_TAB
+ : MAX_VISIBLE_OWNERS_FOR_FEED_CARD,
+ [isForFeedTab]
+ );
+
+ const getOwnerItems = useCallback(
+ (ownerList: EntityReference[]) => {
+ return ownerList.length <= maxVisibleOwners ? (
+
+ {ownerList.map((owner: EntityReference, index: number) =>
+ owner.type === EntityType.USER ? (
+
+
+
+
+ {owner.displayName}
+
+
+
+ ) : (
+
+
+
+ )
+ )}
+
+ ) : (
+
+ );
+ },
+ [maxVisibleOwners, showThread]
+ );
+
+ const renderUpdatedOwner = useMemo(
+ () => getOwnerItems(updatedOwner),
+ [updatedOwner, getOwnerItems]
+ );
+
+ const renderPreviousOwner = useMemo(
+ () => getOwnerItems(previousOwner),
+ [previousOwner, getOwnerItems]
+ );
return (
{!isEmpty(updatedOwner) && (
-
+
{t('label.owner-plural-with-colon')}
-
- {updatedOwner.length <= maxVisibleOwners ? (
-
- {updatedOwner.map((owner: EntityReference) => (
-
-
-
-
- {owner.displayName}
-
-
-
- ))}
-
- ) : (
-
- )}
-
+ {renderUpdatedOwner}
)}
@@ -104,44 +142,14 @@ function OwnersFeed({
-
+
{t('label.owner-plural-with-colon')}
-
- {previousOwner.length <= maxVisibleOwners ? (
-
- {previousOwner.map((owner: EntityReference) => (
-
-
-
-
- {owner.displayName}
-
-
-
- ))}
-
- ) : (
-
- )}
-
+ {renderPreviousOwner}
)}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less
index f198ee24dfc..8bd0459a71c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/activity-feed-tab.less
@@ -590,6 +590,10 @@
padding: 4px 8px;
margin-right: @margin-xs;
border: 1px solid @grey-15;
+
+ .owner-team-icon {
+ font-size: 24px !important;
+ }
}
.owner-chip-text {
@@ -597,6 +601,7 @@
font-style: normal;
font-weight: 400;
line-height: normal;
+ font-size: 14px !important;
margin-left: @margin-xss;
}