fix(ui): activity feed bugs (#9864)

* Fixed issue with activity feed on homepage where onboarding placeholder was shown if no feed data is present for 'My Data' filter

* improved message shown for no feed data found

* fixed key mismatch for localization file
This commit is contained in:
Aniket Katkar 2023-01-24 09:47:04 +05:30 committed by GitHub
parent f2fb0521c2
commit 3f5277ede9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 31 additions and 13 deletions

View File

@ -28,6 +28,7 @@ export interface ActivityFeedListProp extends HTMLAttributes<HTMLDivElement> {
hideFeedFilter?: boolean;
hideThreadFilter?: boolean;
refreshFeedCount?: number;
appliedFeedFilter?: FeedFilter;
stickyFilter?: boolean;
onRefreshFeeds?: () => void;
postFeedHandler?: (value: string, id: string) => void;

View File

@ -42,6 +42,7 @@ import FeedListSeparator from './FeedListSeparator';
const ActivityFeedList: FC<ActivityFeedListProp> = ({
className,
feedList,
appliedFeedFilter,
refreshFeedCount,
onRefreshFeeds,
withSidePanel = false,
@ -69,7 +70,7 @@ const ActivityFeedList: FC<ActivityFeedListProp> = ({
const [fieldListVisible, setFieldListVisible] = useState<boolean>(false);
const [showThreadTypeList, setShowThreadTypeList] = useState<boolean>(false);
const [feedFilter, setFeedFilter] = useState<FeedFilter>(
isEntityFeed ? FeedFilter.ALL : FeedFilter.OWNER
isEntityFeed ? FeedFilter.ALL : appliedFeedFilter ?? FeedFilter.OWNER
);
const [threadType, setThreadType] = useState<ThreadType>();
@ -77,7 +78,7 @@ const ActivityFeedList: FC<ActivityFeedListProp> = ({
(_e: React.MouseEvent<HTMLElement, MouseEvent>, value?: string) => {
const feedType =
(value as FeedFilter) ||
(isEntityFeed ? FeedFilter.ALL : FeedFilter.OWNER);
(isEntityFeed ? FeedFilter.ALL : appliedFeedFilter ?? FeedFilter.OWNER);
setFeedFilter(feedType);
setFieldListVisible(false);
@ -238,12 +239,19 @@ const ActivityFeedList: FC<ActivityFeedListProp> = ({
};
}, []);
const showFilterDropdowns = useMemo(
() =>
feedList.length !== 0 ||
feedFilter !== FeedFilter.ALL ||
threadType ||
isFeedLoading,
[feedList, feedFilter, threadType, isFeedLoading]
);
return (
<div className={classNames(className, 'feed-list-container')} id="feedData">
<div className={stickyFilter ? 'filters-wrapper' : ''}>
{feedList.length === 0 && feedFilter === FeedFilter.OWNER && !threadType
? null
: getFilterDropDown()}
{showFilterDropdowns && getFilterDropDown()}
</div>
{refreshFeedCount ? (
<div className="tw-py-px tw-pt-3 tw-pb-3">
@ -297,12 +305,12 @@ const ActivityFeedList: FC<ActivityFeedListProp> = ({
</>
) : (
!isFeedLoading && (
<div className="h-min-50" data-testid="no-data-placeholder-container">
<div data-testid="no-data-placeholder-container">
{entityName && feedFilter === FeedFilter.ALL && !threadType ? (
<NoFeedPlaceholder entityName={entityName} />
) : !refreshFeedCount ? (
<ErrorPlaceHolder>
{t('message.no-data-available-for-selected-filter')}
{t('message.no-feed-available-for-selected-filter')}
</ErrorPlaceHolder>
) : null}
</div>

View File

@ -14,7 +14,6 @@
import { Card } from 'antd';
import { observer } from 'mobx-react';
import React, {
Fragment,
RefObject,
useCallback,
useEffect,
@ -218,21 +217,31 @@ const MyData: React.FC<MyDataProps> = ({
// Check if feedFilter or ThreadType filter is applied or not
const filtersApplied = useMemo(
() => feedFilter === FeedFilter.OWNER && !threadType,
() => feedFilter === FeedFilter.ALL && !threadType,
[feedFilter, threadType]
);
const showActivityFeedList = useMemo(
() =>
feedData?.length > 0 ||
!filtersApplied ||
newFeedsLength ||
isFeedLoading,
[feedData, filtersApplied, newFeedsLength, isFeedLoading]
);
return (
<PageLayoutV1 leftPanel={getLeftPanel()} rightPanel={getRightPanel()}>
{error ? (
<ErrorPlaceHolderES errorMessage={error} type="error" />
) : (
<Fragment>
{feedData?.length > 0 || !filtersApplied || newFeedsLength ? (
<>
{showActivityFeedList ? (
<>
<ActivityFeedList
stickyFilter
withSidePanel
appliedFeedFilter={feedFilter}
deletePostHandler={deletePostHandler}
feedList={feedData}
isFeedLoading={isFeedLoading}
@ -255,7 +264,7 @@ const MyData: React.FC<MyDataProps> = ({
/>
{/* Add spacer to work infinite scroll smoothly */}
<div className="tw-p-4" />
</Fragment>
</>
)}
</PageLayoutV1>
);

View File

@ -722,13 +722,13 @@
"no-announcement-message": "No Announcements, Click on add announcement to add one.",
"no-closed-task": "No Closed Tasks",
"no-data-available": "No data available.",
"no-data-available-for-selected-filter": "No data found. Try changing the filters.",
"no-entity-activity-message": "There is no activity on the {{entity}} yet. Start a conversation by clicking on the",
"no-entity-available-with-name": "No {{entity}} available with name",
"no-entity-data-available": "No {{entity}} data available.",
"no-entity-found-for-name": "No {{entity}} found for {{name}}",
"no-execution-runs-found": "No execution runs found for the pipeline.",
"no-features-data-available": "No features data available",
"no-feed-available-for-selected-filter": "No feed found. Try changing the filters.",
"no-ingestion-available": "No ingestion data available",
"no-ingestion-description": "To view Ingestion Data, run the metadata ingestion. Please refer to this doc to schedule the",
"no-inherited-roles-found": "No inherited roles found",