Fix #4391 UI : Use user API to get owns and following data on home page. (#6431)

This commit is contained in:
Sachin Chaurasiya 2022-07-29 21:29:07 +05:30 committed by GitHub
parent 173b820c22
commit e11b409d70
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 71 additions and 72 deletions

View File

@ -12,7 +12,6 @@
*/
import { Button, Card, Typography } from 'antd';
import { FormattedTableData } from 'Models';
import React, { Fragment, FunctionComponent } from 'react';
import { Link } from 'react-router-dom';
import { EntityReference } from '../../generated/type/entityReference';
@ -21,14 +20,14 @@ import { getEntityIcon, getEntityLink } from '../../utils/TableUtils';
import Ellipses from '../common/Ellipses/Ellipses';
import { leftPanelAntCardStyle } from '../containers/PageLayout';
interface Prop {
entityList: Array<FormattedTableData>;
entityList: Array<EntityReference>;
headerText: string | JSX.Element;
noDataPlaceholder: JSX.Element;
testIDText: string;
}
interface AntdEntityListProp {
entityList: Array<FormattedTableData>;
entityList: Array<EntityReference>;
headerText?: string | JSX.Element;
headerTextLabel: string;
noDataPlaceholder: JSX.Element;
@ -58,12 +57,12 @@ const EntityList: FunctionComponent<Prop> = ({
)}`}
key={index}>
<div className="tw-flex">
{getEntityIcon(item.index || item.type || '')}
{getEntityIcon(item.type || '')}
<Link
className="tw-font-medium"
to={getEntityLink(
item.index || item.type || '',
item.fullyQualifiedName
item.type || '',
item.fullyQualifiedName as string
)}>
<Button
className="tw-text-grey-body hover:tw-text-primary-hover hover:tw-underline"
@ -103,12 +102,12 @@ export const EntityListWithAntd: FunctionComponent<AntdEntityListProp> = ({
)}`}
key={index}>
<div className="tw-flex">
{getEntityIcon(item.index || item.type || '')}
{getEntityIcon(item.type || '')}
<Link
className="tw-font-medium"
to={getEntityLink(
item.index || item.type || '',
item.fullyQualifiedName
item.type || '',
item.fullyQualifiedName as string
)}>
<Button
className="tw-text-grey-body hover:tw-text-primary-hover hover:tw-underline"

View File

@ -11,7 +11,7 @@
* limitations under the License.
*/
import { FormattedTableData, SearchDataFunctionType } from 'Models';
import { EntityReference, SearchDataFunctionType } from 'Models';
import { FeedFilter } from '../../enums/mydata.enum';
import { Thread, ThreadType } from '../../generated/entity/feed/thread';
import { User } from '../../generated/entity/teams/user';
@ -34,8 +34,8 @@ export interface MyDataProps {
ownedDataCount: number;
countPipelines: number;
userDetails?: User;
ownedData: Array<FormattedTableData>;
followedData: Array<FormattedTableData>;
ownedData: Array<EntityReference>;
followedData: Array<EntityReference>;
feedData: Thread[];
paging: Paging;
isFeedLoading: boolean;

View File

@ -19,6 +19,7 @@ import {
findByText,
render,
} from '@testing-library/react';
import { EntityReference } from 'Models';
import React, { ReactNode } from 'react';
import { MemoryRouter } from 'react-router-dom';
import { User } from '../../generated/entity/teams/user';
@ -233,6 +234,16 @@ const mockUserDetails = {
},
};
const currentUserMockData = {
id: '7b26a534-25e8-4112-ae08-ee059f8918c4',
type: 'table',
name: 'test_dim_staff',
fullyQualifiedName: 'test_sample.test_db.test_dim_staff',
description: 'test test_dim_staff',
deleted: false,
href: 'http://localhost:8585/api/v1/tables/7b26a534-25e8-4112-ae08-ee059f8918c4',
} as EntityReference;
jest.mock('../../axiosAPIs/miscAPI', () => ({
searchData: jest
.fn()
@ -333,14 +344,14 @@ const mockProp: MyDataProps = {
feedData: formatDataResponse(mockData.data.hits.hits),
fetchData: fetchData,
fetchFeedHandler: mockFetchFeedHandler,
followedData: formatDataResponse(mockData.data.hits.hits),
followedData: currentUserMockData,
isFeedLoading: false,
ownedData: formatDataResponse(mockData.data.hits.hits),
ownedData: currentUserMockData,
paging: mockPaging,
postFeedHandler: postFeed,
userDetails: mockUserDetails as unknown as User,
updateThreadHandler: jest.fn(),
};
} as unknown as MyDataProps;
const mockObserve = jest.fn();
const mockunObserve = jest.fn();

View File

@ -11,7 +11,7 @@
* limitations under the License.
*/
import { FormattedTableData } from 'Models';
import { EntityReference } from 'Models';
import React, { Fragment, FunctionComponent, useEffect, useState } from 'react';
import { getRecentlyViewedData, prepareLabel } from '../../utils/CommonUtils';
import { EntityListWithAntd } from '../EntityList/EntityList';
@ -19,7 +19,7 @@ import Loader from '../Loader/Loader';
const RecentlyViewed: FunctionComponent = () => {
const recentlyViewedData = getRecentlyViewedData();
const [data, setData] = useState<Array<FormattedTableData>>([]);
const [data, setData] = useState<Array<EntityReference>>([]);
const [isLoading, setIsloading] = useState<boolean>(false);
const prepareData = () => {
@ -31,11 +31,11 @@ const RecentlyViewed: FunctionComponent = () => {
serviceType: item.serviceType,
name: item.displayName || prepareLabel(item.entityType, item.fqn),
fullyQualifiedName: item.fqn,
index: item.entityType,
type: item.entityType,
};
})
.filter((item) => item.name);
setData(formattedData as unknown as FormattedTableData[]);
setData(formattedData as unknown as EntityReference[]);
setIsloading(false);
}
};

View File

@ -491,6 +491,7 @@ declare module 'Models' {
fqn: string;
serviceType?: string;
timestamp: number;
id: number;
}
interface RecentlySearchedData {

View File

@ -376,6 +376,7 @@ const DashboardDetailsPage = () => {
fqn: fullyQualifiedName,
serviceType: serviceType,
timestamp: 0,
id: id,
});
fetchServiceDetails(service.type, service.name)

View File

@ -369,6 +369,7 @@ const DatasetDetailsPage: FunctionComponent = () => {
fqn: fullyQualifiedName,
serviceType: serviceType,
timestamp: 0,
id: id,
});
setName(name);

View File

@ -15,7 +15,7 @@ import { AxiosError, AxiosResponse } from 'axios';
import { Operation } from 'fast-json-patch';
import { isEmpty, isNil, isUndefined } from 'lodash';
import { observer } from 'mobx-react';
import { FormattedTableData } from 'Models';
import { EntityReference } from 'Models';
import React, {
Fragment,
useCallback,
@ -27,13 +27,13 @@ import { useLocation } from 'react-router-dom';
import AppState from '../../AppState';
import { getAllDashboards } from '../../axiosAPIs/dashboardAPI';
import { getFeedsWithFilter, postFeedById } from '../../axiosAPIs/feedsAPI';
import { fetchSandboxConfig, searchData } from '../../axiosAPIs/miscAPI';
import { fetchSandboxConfig } from '../../axiosAPIs/miscAPI';
import { getAllMlModal } from '../../axiosAPIs/mlModelAPI';
import { getAllPipelines } from '../../axiosAPIs/pipelineAPI';
import { getAllTables } from '../../axiosAPIs/tableAPI';
import { getTeams } from '../../axiosAPIs/teamsAPI';
import { getAllTopics } from '../../axiosAPIs/topicsAPI';
import { getUsers } from '../../axiosAPIs/userAPI';
import { getUserById, getUsers } from '../../axiosAPIs/userAPI';
import PageContainerV1 from '../../components/containers/PageContainerV1';
import GithubStarButton from '../../components/GithubStarButton/GithubStarButton';
import Loader from '../../components/Loader/Loader';
@ -44,19 +44,17 @@ import {
onErrorText,
onUpdatedConversastionError,
} from '../../constants/feed.constants';
import { myDataSearchIndex } from '../../constants/Mydata.constants';
import { FeedFilter, Ownership } from '../../enums/mydata.enum';
import { AssetsType } from '../../enums/entity.enum';
import { FeedFilter } from '../../enums/mydata.enum';
import { Thread, ThreadType } from '../../generated/entity/feed/thread';
import { Paging } from '../../generated/type/paging';
import { useAuth } from '../../hooks/authHooks';
import jsonData from '../../jsons/en';
import { formatDataResponse } from '../../utils/APIUtils';
import {
deletePost,
getUpdatedThread,
updateThreadData,
} from '../../utils/FeedUtils';
import { getMyDataFilters } from '../../utils/MyDataUtils';
import { getAllServices } from '../../utils/ServiceUtils';
import { showErrorToast } from '../../utils/ToastUtils';
@ -73,8 +71,8 @@ const MyDataPage = () => {
const [countUsers, setCountUsers] = useState<number>();
const [countTeams, setCountTeams] = useState<number>();
const [ownedData, setOwnedData] = useState<Array<FormattedTableData>>();
const [followedData, setFollowedData] = useState<Array<FormattedTableData>>();
const [ownedData, setOwnedData] = useState<Array<EntityReference>>();
const [followedData, setFollowedData] = useState<Array<EntityReference>>();
const [ownedDataCount, setOwnedDataCount] = useState(0);
const [followedDataCount, setFollowedDataCount] = useState(0);
const [pendingTaskCount, setPendingTaskCount] = useState(0);
@ -263,52 +261,38 @@ const MyDataPage = () => {
}
};
const fetchMyData = () => {
const ownedEntity = searchData(
'',
1,
8,
getMyDataFilters(
Ownership.OWNER,
AppState.userDetails,
AppState.nonSecureUserDetails
),
'',
'',
myDataSearchIndex
const fetchMyData = async () => {
if (!currentUser || !currentUser.id) {
return;
}
try {
const { data: userData } = await getUserById(
currentUser?.id,
'follows, owns'
);
const followedEntity = searchData(
'',
1,
8,
getMyDataFilters(
Ownership.FOLLOWERS,
AppState.userDetails,
AppState.nonSecureUserDetails
),
'',
'',
myDataSearchIndex
if (userData) {
const includeData = Object.values(AssetsType);
const owns: EntityReference[] = userData.owns ?? [];
const follows: EntityReference[] = userData.follows ?? [];
setFollowedDataCount(follows.length);
setOwnedDataCount(owns.length);
const includedOwnsData = owns.filter((data) =>
includeData.includes(data.type as AssetsType)
);
const includedFollowsData = follows.filter((data) =>
includeData.includes(data.type as AssetsType)
);
Promise.allSettled([ownedEntity, followedEntity])
.then(([resOwnedEntity, resFollowedEntity]) => {
if (resOwnedEntity.status === 'fulfilled') {
setOwnedData(formatDataResponse(resOwnedEntity.value.data.hits.hits));
setOwnedDataCount(resOwnedEntity.value.data.hits.total.value);
setFollowedData(includedFollowsData.slice(0, 8));
setOwnedData(includedOwnsData.slice(0, 8));
}
if (resFollowedEntity.status === 'fulfilled') {
setFollowedDataCount(resFollowedEntity.value.data.hits.total.value);
setFollowedData(
formatDataResponse(resFollowedEntity.value.data.hits.hits)
);
}
})
.catch(() => {
} catch (err) {
setOwnedData([]);
setFollowedData([]);
});
}
};
const getFeedData = (

View File

@ -317,6 +317,7 @@ const PipelineDetailsPage = () => {
fqn: fullyQualifiedName,
serviceType: serviceType,
timestamp: 0,
id: id,
});
setPipelineUrl(pipelineUrl);

View File

@ -428,6 +428,7 @@ const TopicDetailsPage: FunctionComponent = () => {
fqn: fullyQualifiedName,
serviceType: serviceType,
timestamp: 0,
id: id,
});
} else {
showErrorToast(