Minor fix for follow button feature in non-secure mode (#491)

This commit is contained in:
darth-coder00 2021-09-14 19:00:21 +05:30 committed by GitHub
parent 0fafc00f97
commit 96729e49e3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 75 additions and 25 deletions

View File

@ -1,9 +1,10 @@
import { AxiosPromise, AxiosResponse } from 'axios';
import classNames from 'classnames';
import { compare } from 'fast-json-patch';
import { ColumnTags, TableDetail } from 'Models';
import { ColumnTags, TableDetail, User } from 'Models';
import React, { useEffect, useState } from 'react';
import { Link, useParams } from 'react-router-dom';
import AppState from '../../AppState';
import { getChartById, updateChart } from '../../axiosAPIs/chartAPI';
import {
addFollower,
@ -27,6 +28,7 @@ import { getServiceDetailsPath } from '../../constants/constants';
import { EntityType } from '../../enums/entity.enum';
import { Chart } from '../../generated/entity/data/chart';
import { Dashboard, TagLabel } from '../../generated/entity/data/dashboard';
import { useAuth } from '../../hooks/authHooks';
import {
addToRecentViewed,
getCurrentUserId,
@ -46,6 +48,9 @@ type ChartType = {
} & Chart;
const MyDashBoardPage = () => {
const USERId = getCurrentUserId();
const { isAuthDisabled } = useAuth();
const [tagList, setTagList] = useState<Array<string>>([]);
const { dashboardFQN } = useParams() as Record<string, string>;
const [dashboardDetails, setDashboardDetails] = useState<Dashboard>(
@ -54,7 +59,8 @@ const MyDashBoardPage = () => {
const [dashboardId, setDashboardId] = useState<string>('');
const [isLoading, setLoading] = useState<boolean>(false);
const [description, setDescription] = useState<string>('');
const [followers, setFollowers] = useState<number>(0);
const [followers, setFollowers] = useState<Array<User>>([]);
const [followersCount, setFollowersCount] = useState<number>(0);
const [isFollowing, setIsFollowing] = useState(false);
const [owner, setOwner] = useState<TableDetail['owner']>();
const [tier, setTier] = useState<string>();
@ -142,6 +148,12 @@ const MyDashBoardPage = () => {
return chartsData;
};
const setFollowersData = (followers: Array<User>) => {
// need to check if already following or not with logedIn user id
setIsFollowing(followers.some(({ id }: { id: string }) => id === USERId));
setFollowersCount(followers?.length);
};
const fetchDashboardDetail = (dashboardFQN: string) => {
setLoading(true);
getDashboardByFqn(dashboardFQN, [
@ -166,11 +178,11 @@ const MyDashBoardPage = () => {
setDashboardDetails(res.data);
setDashboardId(id);
setDescription(description ?? '');
setFollowers(followers?.length);
setFollowers(followers);
setFollowersData(followers);
setOwner(getOwnerFromId(owner?.id));
setTier(getTierFromTableTags(tags));
setTags(getTagsWithoutTier(tags));
setIsFollowing(followers.some(({ id }: { id: string }) => id === USERId));
getServiceById('dashboardServices', service?.id).then(
(serviceRes: AxiosResponse) => {
setSlashedDashboardName([
@ -210,12 +222,12 @@ const MyDashBoardPage = () => {
const followDashboard = (): void => {
if (isFollowing) {
removeFollower(dashboardId, USERId).then(() => {
setFollowers((preValu) => preValu - 1);
setFollowersCount((preValu) => preValu - 1);
setIsFollowing(false);
});
} else {
addFollower(dashboardId, USERId).then(() => {
setFollowers((preValu) => preValu + 1);
setFollowersCount((preValu) => preValu + 1);
setIsFollowing(true);
});
}
@ -377,6 +389,12 @@ const MyDashBoardPage = () => {
fetchDashboardDetail(dashboardFQN);
}, [dashboardFQN]);
useEffect(() => {
if (isAuthDisabled && AppState.users.length && followers.length) {
setFollowersData(followers);
}
}, [AppState.users, followers]);
useEffect(() => {
fetchTags();
}, []);
@ -390,7 +408,7 @@ const MyDashBoardPage = () => {
<EntityPageInfo
isTagEditable
extraInfo={extraInfo}
followers={followers}
followers={followersCount}
followHandler={followDashboard}
isFollowing={isFollowing}
tagList={tagList}

View File

@ -25,9 +25,11 @@ import {
TableColumn,
TableDetail,
TableJoinsData,
User,
} from 'Models';
import React, { useEffect, useState } from 'react';
import { useParams } from 'react-router-dom';
import AppState from '../../AppState';
import { getDatabase } from '../../axiosAPIs/databaseAPI';
import { postFeed } from '../../axiosAPIs/feedsAPI';
import { getServiceById } from '../../axiosAPIs/serviceAPI';
@ -53,6 +55,7 @@ import {
} from '../../constants/constants';
import { EntityType } from '../../enums/entity.enum';
import { Table } from '../../generated/entity/data/table';
import { useAuth } from '../../hooks/authHooks';
import useToastContext from '../../hooks/useToastContext';
import {
addToRecentViewed,
@ -95,10 +98,13 @@ const MyDataDetailsPage = () => {
const USERId = getCurrentUserId();
const { isAuthDisabled } = useAuth();
const [tableId, setTableId] = useState('');
const [tier, setTier] = useState<string>();
const [name, setName] = useState('');
const [followers, setFollowers] = useState(0);
const [followers, setFollowers] = useState<Array<User>>([]);
const [followersCount, setFollowersCount] = useState(0);
const [isFollowing, setIsFollowing] = useState(false);
const [slashedTableName, setSlashedTableName] = useState<
TitleBreadcrumbProps['titleLinks']
@ -296,12 +302,12 @@ const MyDataDetailsPage = () => {
const followTable = (): void => {
if (isFollowing) {
removeFollower(tableId, USERId).then(() => {
setFollowers((preValu) => preValu - 1);
setFollowersCount((preValu) => preValu - 1);
setIsFollowing(false);
});
} else {
addFollower(tableId, USERId).then(() => {
setFollowers((preValu) => preValu + 1);
setFollowersCount((preValu) => preValu + 1);
setIsFollowing(true);
});
}
@ -339,6 +345,12 @@ const MyDataDetailsPage = () => {
return freqJoin;
};
const setFollowersData = (followers: Array<User>) => {
// need to check if already following or not with logedIn user id
setIsFollowing(followers.some(({ id }: { id: string }) => id === USERId));
setFollowersCount(followers?.length);
};
useEffect(() => {
getTableDetailsByFQN(
getPartialNameFromFQN(tableFQN, ['service', 'database', 'table'], '.'),
@ -364,11 +376,8 @@ const MyDataDetailsPage = () => {
setTableId(id);
setTier(getTierFromTableTags(tags));
setOwner(getOwnerFromId(owner?.id));
// need to check if already following or not with logedIn user id
setIsFollowing(
!!followers.filter(({ id }: { id: string }) => id === USERId).length
);
setFollowers(followers?.length);
setFollowers(followers);
setFollowersData(followers);
getDatabase(database.id, 'service').then((resDB: AxiosResponse) => {
getServiceById('databaseServices', resDB.data.service?.id).then(
(resService: AxiosResponse) => {
@ -429,12 +438,18 @@ const MyDataDetailsPage = () => {
});
}, [tableFQN]);
useEffect(() => {
if (isAuthDisabled && AppState.users.length && followers.length) {
setFollowersData(followers);
}
}, [AppState.users, followers]);
return (
<PageContainer>
<div className="tw-px-4 w-full">
<EntityPageInfo
extraInfo={extraInfo}
followers={followers}
followers={followersCount}
followHandler={followTable}
isFollowing={isFollowing}
tags={tableTags}

View File

@ -1,8 +1,9 @@
import { AxiosResponse } from 'axios';
import { compare } from 'fast-json-patch';
import { ColumnTags, TableDetail, Topic } from 'Models';
import { ColumnTags, TableDetail, Topic, User } from 'Models';
import React, { useEffect, useState } from 'react';
import { useParams } from 'react-router-dom';
import AppState from '../../AppState';
import { getServiceById } from '../../axiosAPIs/serviceAPI';
import {
addFollower,
@ -20,6 +21,7 @@ import ManageTab from '../../components/my-data-details/ManageTab';
import SchemaEditor from '../../components/schema-editor/SchemaEditor';
import { getServiceDetailsPath } from '../../constants/constants';
import { EntityType } from '../../enums/entity.enum';
import { useAuth } from '../../hooks/authHooks';
import {
addToRecentViewed,
getCurrentUserId,
@ -36,13 +38,17 @@ import { getTagCategories, getTaglist } from '../../utils/TagsUtils';
const MyTopicDetailPage = () => {
const USERId = getCurrentUserId();
const { isAuthDisabled } = useAuth();
const [tagList, setTagList] = useState<Array<string>>([]);
const { topicFQN } = useParams() as Record<string, string>;
const [topicDetails, setTopicDetails] = useState<Topic>({} as Topic);
const [topicId, setTopicId] = useState<string>('');
const [isLoading, setLoading] = useState<boolean>(false);
const [description, setDescription] = useState<string>('');
const [followers, setFollowers] = useState<number>(0);
const [followers, setFollowers] = useState<Array<User>>([]);
const [followersCount, setFollowersCount] = useState<number>(0);
const [isFollowing, setIsFollowing] = useState(false);
const [owner, setOwner] = useState<TableDetail['owner']>();
const [tier, setTier] = useState<string>();
@ -108,6 +114,13 @@ const MyTopicDetailPage = () => {
}
});
};
const setFollowersData = (followers: Array<User>) => {
// need to check if already following or not with logedIn user id
setIsFollowing(followers.some(({ id }: { id: string }) => id === USERId));
setFollowersCount(followers?.length);
};
const fetchTopicDetail = (topicFQN: string) => {
setLoading(true);
getTopicByFqn(topicFQN, ['owner', 'service', 'followers', 'tags']).then(
@ -133,7 +146,8 @@ const MyTopicDetailPage = () => {
setTopicId(id);
setDescription(description ?? '');
setSchemaType(schemaType);
setFollowers(followers?.length);
setFollowers(followers);
setFollowersData(followers);
setOwner(getOwnerFromId(owner?.id));
setTier(getTierFromTableTags(tags));
setTags(getTagsWithoutTier(tags));
@ -143,9 +157,6 @@ const MyTopicDetailPage = () => {
setMaximumMessageSize(maximumMessageSize);
setReplicationFactor(replicationFactor);
setRetentionSize(retentionSize);
setIsFollowing(
followers.some(({ id }: { id: string }) => id === USERId)
);
getServiceById('messagingServices', service?.id).then(
(serviceRes: AxiosResponse) => {
setSlashedTopicName([
@ -184,12 +195,12 @@ const MyTopicDetailPage = () => {
const followTopic = (): void => {
if (isFollowing) {
removeFollower(topicId, USERId).then(() => {
setFollowers((preValu) => preValu - 1);
setFollowersCount((preValu) => preValu - 1);
setIsFollowing(false);
});
} else {
addFollower(topicId, USERId).then(() => {
setFollowers((preValu) => preValu + 1);
setFollowersCount((preValu) => preValu + 1);
setIsFollowing(true);
});
}
@ -313,6 +324,12 @@ const MyTopicDetailPage = () => {
fetchTopicDetail(topicFQN);
}, [topicFQN]);
useEffect(() => {
if (isAuthDisabled && AppState.users.length && followers.length) {
setFollowersData(followers);
}
}, [AppState.users, followers]);
useEffect(() => {
fetchTags();
}, []);
@ -330,7 +347,7 @@ const MyTopicDetailPage = () => {
{ key: 'Tier', value: tier ? tier.split('.')[1] : '' },
...getConfigDetails(),
]}
followers={followers}
followers={followersCount}
followHandler={followTopic}
isFollowing={isFollowing}
tagList={tagList}