ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-26 06:42:15 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

re: migrated selected components to useNavigation

Browse Source
This commit is contained in:
noumantahir 2022-10-19 11:23:28 +05:00
parent d496b29f44
commit eb73394d04
7 changed files with 180 additions and 182 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/postCard/container/postCardContainer.js
View File

@ -1,5 +1,4 @@
import React, { useState, useEffect, useMemo } from 'react'; import React, { useState, useEffect, useMemo } from 'react';
import { withNavigation } from '@react-navigation/compat';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import get from 'lodash/get'; import get from 'lodash/get';
@ -13,6 +12,7 @@ import PostCardView from '../view/postCardView';
import { default as ROUTES } from '../../../constants/routeNames'; import { default as ROUTES } from '../../../constants/routeNames';
import { useAppDispatch } from '../../../hooks'; import { useAppDispatch } from '../../../hooks';
import { showProfileModal } from '../../../redux/actions/uiAction'; import { showProfileModal } from '../../../redux/actions/uiAction';
import { useNavigation } from '@react-navigation/native';
/* /*
* Props Name Description Value * Props Name Description Value
*@props --> props name here description here Value Type Here *@props --> props name here description here Value Type Here
@ -20,8 +20,6 @@ import { showProfileModal } from '../../../redux/actions/uiAction';
*/ */
const PostCardContainer = ({ const PostCardContainer = ({
// isRefresh,
navigation,
currentAccount, currentAccount,
content, content,
isHideImage, isHideImage,
@ -32,6 +30,7 @@ const PostCardContainer = ({
showQuickReplyModal, showQuickReplyModal,
mutes, mutes,
}) => { }) => {
const navigation = useNavigation();
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [_content, setContent] = useState(content); const [_content, setContent] = useState(content);
@ -90,7 +89,7 @@ const PostCardContainer = ({
const _handleOnContentPress = (value) => { const _handleOnContentPress = (value) => {
if (value) { if (value) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.POST, name: ROUTES.SCREENS.POST,
params: { params: {
content: value, content: value,
}, },
@ -101,7 +100,7 @@ const PostCardContainer = ({
const _handleOnVotersPress = () => { const _handleOnVotersPress = () => {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.VOTERS, name: ROUTES.SCREENS.VOTERS,
params: { params: {
activeVotes, activeVotes,
content: _content, content: _content,
@ -112,7 +111,7 @@ const PostCardContainer = ({
const _handleOnReblogsPress = () => { const _handleOnReblogsPress = () => {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.REBLOGS, name: ROUTES.SCREENS.REBLOGS,
params: { params: {
reblogs, reblogs,
}, },
@ -154,4 +153,4 @@ const mapStateToProps = (state) => ({
nsfw: state.application.nsfw, nsfw: state.application.nsfw,
}); });
export default withNavigation(connect(mapStateToProps)(PostCardContainer)); export default connect(mapStateToProps)(PostCardContainer);

66
src/components/postDropdown/container/postDropdownContainer.tsx
View File

@ -1,6 +1,5 @@
import React, { PureComponent, Fragment } from 'react'; import React, { PureComponent, Fragment } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { withNavigation } from '@react-navigation/compat';
import { Alert, Share } from 'react-native'; import { Alert, Share } from 'react-native';
import { injectIntl } from 'react-intl'; import { injectIntl } from 'react-intl';
import get from 'lodash/get'; import get from 'lodash/get';
@ -24,8 +23,8 @@ import { OptionsModal } from '../../atoms';
import { updateCurrentAccount } from '../../../redux/actions/accountAction'; import { updateCurrentAccount } from '../../../redux/actions/accountAction';
import showLoginAlert from '../../../utils/showLoginAlert'; import showLoginAlert from '../../../utils/showLoginAlert';
import { useUserActivityMutation } from '../../../providers/queries/pointQueries'; import { useUserActivityMutation } from '../../../providers/queries/pointQueries';
import { generateRndStr } from '../../../utils/editor';
import { PointActivityIds } from '../../../providers/ecency/ecency.types'; import { PointActivityIds } from '../../../providers/ecency/ecency.types';
import { useNavigation } from '@react-navigation/native';
/* /*
* Props Name Description Value * Props Name Description Value
@ -82,11 +81,11 @@ class PostDropdownContainer extends PureComponent {
const _canUpdateCommunityPin = const _canUpdateCommunityPin =
subscribedCommunities.data && !!content && content.community subscribedCommunities.data && !!content && content.community
? subscribedCommunities.data.reduce((role, subscription) => { ? subscribedCommunities.data.reduce((role, subscription) => {
if (content.community === subscription[0]) { if (content.community === subscription[0]) {
return ['owner', 'admin', 'mod'].includes(subscription[2]); return ['owner', 'admin', 'mod'].includes(subscription[2]);
} }
return role; return role;
}, false) }, false)
: false; : false;
const _isPinnedInCommunity = !!content && content.stats?.is_pinned; const _isPinnedInCommunity = !!content && content.stats?.is_pinned;
@ -178,7 +177,7 @@ class PostDropdownContainer extends PureComponent {
break; break;
case 'edit-history': case 'edit-history':
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.EDIT_HISTORY, name: ROUTES.SCREENS.EDIT_HISTORY,
params: { params: {
author: content?.author || '', author: content?.author || '',
permlink: content?.permlink || '', permlink: content?.permlink || '',
@ -290,7 +289,7 @@ class PostDropdownContainer extends PureComponent {
buttons: [ buttons: [
{ {
text: intl.formatMessage({ id: 'alert.cancel' }), text: intl.formatMessage({ id: 'alert.cancel' }),
onPress: () => { }, onPress: () => {},
}, },
{ {
text: intl.formatMessage({ id: 'alert.confirm' }), text: intl.formatMessage({ id: 'alert.confirm' }),
@ -329,17 +328,16 @@ class PostDropdownContainer extends PureComponent {
}; };
_reblog = () => { _reblog = () => {
const { const {
content, content,
currentAccount, currentAccount,
dispatch, dispatch,
intl, intl,
isLoggedIn, isLoggedIn,
pinCode, pinCode,
navigation, navigation,
userActivityMutation userActivityMutation,
} = this } = this.props as any;
.props as any;
if (!isLoggedIn) { if (!isLoggedIn) {
showLoginAlert({ navigation, intl }); showLoginAlert({ navigation, intl });
return; return;
@ -349,9 +347,9 @@ class PostDropdownContainer extends PureComponent {
.then((response) => { .then((response) => {
//track user activity points ty=130 //track user activity points ty=130
userActivityMutation.mutate({ userActivityMutation.mutate({
pointsTy:PointActivityIds.REBLOG, pointsTy: PointActivityIds.REBLOG,
transactionId:response.id transactionId: response.id,
}) });
dispatch( dispatch(
toastNotification( toastNotification(
@ -441,7 +439,7 @@ class PostDropdownContainer extends PureComponent {
if (isLoggedIn) { if (isLoggedIn) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.EDITOR, name: ROUTES.SCREENS.EDITOR,
key: `editor_post_${content.permlink}`, key: `editor_post_${content.permlink}`,
params: { params: {
isReply: true, isReply: true,
@ -452,7 +450,7 @@ class PostDropdownContainer extends PureComponent {
} }
}; };
_redirectToPromote = (routeName, from, redeemType) => { _redirectToPromote = (name, from, redeemType) => {
const { content, isLoggedIn, navigation, isPinCodeOpen } = this.props as any; const { content, isLoggedIn, navigation, isPinCodeOpen } = this.props as any;
const params = { const params = {
from, from,
@ -462,15 +460,15 @@ class PostDropdownContainer extends PureComponent {
if (isPinCodeOpen) { if (isPinCodeOpen) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.PINCODE, name: ROUTES.SCREENS.PINCODE,
params: { params: {
navigateTo: routeName, navigateTo: name,
navigateParams: params, navigateParams: params,
}, },
}); });
} else if (isLoggedIn) { } else if (isLoggedIn) {
navigation.navigate({ navigation.navigate({
routeName, name,
params, params,
}); });
} }
@ -516,10 +514,12 @@ const mapStateToProps = (state) => ({
subscribedCommunities: state.communities.subscribedCommunities, subscribedCommunities: state.communities.subscribedCommunities,
}); });
const mapQueriesToProps = () => ({ const mapHooksToProps = () => ({
userActivityMutation: useUserActivityMutation() userActivityMutation: useUserActivityMutation(),
}) navigation:useNavigation()
});
export default withNavigation(connect(mapStateToProps)(injectIntl((props) => ( export default
<PostDropdownContainer {...props} {...mapQueriesToProps()} />))) connect(mapStateToProps)(
); injectIntl((props) => <PostDropdownContainer {...props} {...mapHooksToProps()} />),
);

16
src/components/postElements/body/view/postBodyView.js
View File

@ -1,7 +1,6 @@
import React, { Fragment, useState, useEffect, useRef } from 'react'; import React, { Fragment, useState, useEffect, useRef } from 'react';
import { Linking, Modal, PermissionsAndroid, Platform, View } from 'react-native'; import { Linking, Modal, PermissionsAndroid, Platform, View } from 'react-native';
import CameraRoll from '@react-native-community/cameraroll'; import CameraRoll from '@react-native-community/cameraroll';
import { withNavigation } from '@react-navigation/compat';
import { useIntl, injectIntl } from 'react-intl'; import { useIntl, injectIntl } from 'react-intl';
import EStyleSheet from 'react-native-extended-stylesheet'; import EStyleSheet from 'react-native-extended-stylesheet';
import ImageViewer from 'react-native-image-zoom-viewer'; import ImageViewer from 'react-native-image-zoom-viewer';
@ -20,11 +19,14 @@ import { isCommunity } from '../../../../utils/communityValidation';
import { GLOBAL_POST_FILTERS_VALUE } from '../../../../constants/options/filters'; import { GLOBAL_POST_FILTERS_VALUE } from '../../../../constants/options/filters';
import { PostHtmlRenderer, VideoPlayer } from '../../..'; import { PostHtmlRenderer, VideoPlayer } from '../../..';
import getWindowDimensions from '../../../../utils/getWindowDimensions'; import getWindowDimensions from '../../../../utils/getWindowDimensions';
import { useNavigation } from '@react-navigation/native';
const WIDTH = getWindowDimensions().width; const WIDTH = getWindowDimensions().width;
const PostBody = ({ navigation, body, dispatch, onLoadEnd, width }) => { const PostBody = ({ body, dispatch, onLoadEnd, width }) => {
console.log('body : ', body); console.log('body : ', body);
const navigation = useNavigation();
const [isImageModalOpen, setIsImageModalOpen] = useState(false); const [isImageModalOpen, setIsImageModalOpen] = useState(false);
const [postImages, setPostImages] = useState([]); const [postImages, setPostImages] = useState([]);
@ -124,10 +126,10 @@ const PostBody = ({ navigation, body, dispatch, onLoadEnd, width }) => {
const _handleTagPress = (tag, filter = GLOBAL_POST_FILTERS_VALUE[0]) => { const _handleTagPress = (tag, filter = GLOBAL_POST_FILTERS_VALUE[0]) => {
if (tag) { if (tag) {
const routeName = isCommunity(tag) ? ROUTES.SCREENS.COMMUNITY : ROUTES.SCREENS.TAG_RESULT; const name = isCommunity(tag) ? ROUTES.SCREENS.COMMUNITY : ROUTES.SCREENS.TAG_RESULT;
const key = `${filter}/${tag}`; const key = `${filter}/${tag}`;
navigation.navigate({ navigation.navigate({
routeName, name,
params: { params: {
tag, tag,
filter, filter,
@ -154,7 +156,7 @@ const PostBody = ({ navigation, body, dispatch, onLoadEnd, width }) => {
} }
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.POST, name: ROUTES.SCREENS.POST,
params: { params: {
author, author,
permlink, permlink,
@ -167,7 +169,7 @@ const PostBody = ({ navigation, body, dispatch, onLoadEnd, width }) => {
const _handleOnUserPress = (username) => { const _handleOnUserPress = (username) => {
if (username) { if (username) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.PROFILE, name: ROUTES.SCREENS.PROFILE,
params: { params: {
username, username,
}, },
@ -353,4 +355,4 @@ const areEqual = (prevProps, nextProps) => {
const mapStateToProps = (state) => ({}); const mapStateToProps = (state) => ({});
export default React.memo(injectIntl(withNavigation(connect(mapStateToProps)(PostBody))), areEqual); export default React.memo(injectIntl(connect(mapStateToProps)(PostBody)), areEqual);

16
src/components/postElements/headerDescription/view/postHeaderDescription.js
View File

@ -1,7 +1,6 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { View, Text, TouchableOpacity } from 'react-native'; import { View, Text, TouchableOpacity } from 'react-native';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { withNavigation } from '@react-navigation/compat';
import { injectIntl } from 'react-intl'; import { injectIntl } from 'react-intl';
// Components // Components
@ -14,6 +13,7 @@ import styles from './postHeaderDescriptionStyles';
import { default as ROUTES } from '../../../../constants/routeNames'; import { default as ROUTES } from '../../../../constants/routeNames';
import { IconButton } from '../../..'; import { IconButton } from '../../..';
import { showProfileModal } from '../../../../redux/actions/uiAction'; import { showProfileModal } from '../../../../redux/actions/uiAction';
import { useNavigation } from '@react-navigation/native';
// Constants // Constants
const DEFAULT_IMAGE = require('../../../../assets/ecency.png'); const DEFAULT_IMAGE = require('../../../../assets/ecency.png');
@ -37,7 +37,7 @@ class PostHeaderDescription extends PureComponent {
if (content && content.category && /hive-[1-3]\d{4,6}$/.test(content.category)) { if (content && content.category && /hive-[1-3]\d{4,6}$/.test(content.category)) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.COMMUNITY, name: ROUTES.SCREENS.COMMUNITY,
params: { params: {
tag: content.category, tag: content.category,
}, },
@ -45,7 +45,7 @@ class PostHeaderDescription extends PureComponent {
} }
if (content && content.category && !/hive-[1-3]\d{4,6}$/.test(content.category)) { if (content && content.category && !/hive-[1-3]\d{4,6}$/.test(content.category)) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.TAG_RESULT, name: ROUTES.SCREENS.TAG_RESULT,
params: { params: {
tag: content.category, tag: content.category,
}, },
@ -53,7 +53,7 @@ class PostHeaderDescription extends PureComponent {
} }
if (content && typeof content === 'string' && /hive-[1-3]\d{4,6}$/.test(content)) { if (content && typeof content === 'string' && /hive-[1-3]\d{4,6}$/.test(content)) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.COMMUNITY, name: ROUTES.SCREENS.COMMUNITY,
params: { params: {
tag: content, tag: content,
}, },
@ -61,7 +61,7 @@ class PostHeaderDescription extends PureComponent {
} }
if (content && typeof content === 'string' && !/hive-[1-3]\d{4,6}$/.test(content)) { if (content && typeof content === 'string' && !/hive-[1-3]\d{4,6}$/.test(content)) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.TAG_RESULT, name: ROUTES.SCREENS.TAG_RESULT,
params: { params: {
tag: content, tag: content,
}, },
@ -179,4 +179,8 @@ class PostHeaderDescription extends PureComponent {
const mapStateToProps = () => ({}); const mapStateToProps = () => ({});
export default connect(mapStateToProps)(withNavigation(injectIntl(PostHeaderDescription))); const mapHookToProps = () => ({
navigation:useNavigation()
})
export default connect(mapStateToProps)(injectIntl((props)=><PostHeaderDescription {...props} {...mapHookToProps()} />));

15
src/components/postView/container/postDisplayContainer.js
View File

@ -1,5 +1,4 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { withNavigation } from '@react-navigation/compat';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { injectIntl } from 'react-intl'; import { injectIntl } from 'react-intl';
import get from 'lodash/get'; import get from 'lodash/get';
@ -16,9 +15,9 @@ import { default as ROUTES } from '../../../constants/routeNames';
// Component // Component
import PostDisplayView from '../view/postDisplayView'; import PostDisplayView from '../view/postDisplayView';
import { useNavigation } from '@react-navigation/native';
const PostDisplayContainer = ({ const PostDisplayContainer = ({
navigation,
post, post,
fetchPost, fetchPost,
isFetchPost, isFetchPost,
@ -33,6 +32,8 @@ const PostDisplayContainer = ({
isPostUnavailable, isPostUnavailable,
author, author,
}) => { }) => {
const navigation = useNavigation();
const [activeVotes, setActiveVotes] = useState([]); const [activeVotes, setActiveVotes] = useState([]);
const [activeVotesCount, setActiveVotesCount] = useState(0); const [activeVotesCount, setActiveVotesCount] = useState(0);
const [reblogs, setReblogs] = useState([]); const [reblogs, setReblogs] = useState([]);
@ -56,7 +57,7 @@ const PostDisplayContainer = ({
// Component Functions // Component Functions
const _handleOnVotersPress = () => { const _handleOnVotersPress = () => {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.VOTERS, name: ROUTES.SCREENS.VOTERS,
params: { params: {
activeVotes, activeVotes,
content: post, content: post,
@ -69,7 +70,7 @@ const PostDisplayContainer = ({
const _handleOnReblogsPress = () => { const _handleOnReblogsPress = () => {
if (reblogs.length > 0) { if (reblogs.length > 0) {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.REBLOGS, name: ROUTES.SCREENS.REBLOGS,
params: { params: {
reblogs, reblogs,
}, },
@ -80,7 +81,7 @@ const PostDisplayContainer = ({
const _handleOnReplyPress = () => { const _handleOnReplyPress = () => {
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.EDITOR, name: ROUTES.SCREENS.EDITOR,
key: 'editor_replay', key: 'editor_replay',
params: { params: {
isReply: true, isReply: true,
@ -95,7 +96,7 @@ const PostDisplayContainer = ({
const isReply = post.parent_author; const isReply = post.parent_author;
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.EDITOR, name: ROUTES.SCREENS.EDITOR,
key: `editor_post_${post.permlink}`, key: `editor_post_${post.permlink}`,
params: { params: {
isEdit: true, isEdit: true,
@ -154,4 +155,4 @@ const mapStateToProps = (state) => ({
isLoggedIn: state.application.isLoggedIn, isLoggedIn: state.application.isLoggedIn,
}); });
export default withNavigation(connect(mapStateToProps)(injectIntl(PostDisplayContainer))); export default connect(mapStateToProps)(injectIntl(PostDisplayContainer));

13
src/components/posts/view/postsView.js
View File

@ -10,7 +10,6 @@ import {
Button, Button,
} from 'react-native'; } from 'react-native';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
import { withNavigation } from '@react-navigation/compat';
import { get } from 'lodash'; import { get } from 'lodash';
// COMPONENTS // COMPONENTS
@ -33,6 +32,7 @@ import { default as ROUTES } from '../../../constants/routeNames';
import globalStyles from '../../../globalStyles'; import globalStyles from '../../../globalStyles';
import PostsList from '../../postsList'; import PostsList from '../../postsList';
import { isDarkTheme } from '../../../redux/actions/applicationActions'; import { isDarkTheme } from '../../../redux/actions/applicationActions';
import { useNavigation } from '@react-navigation/native';
let _onEndReachedCalledDuringMomentum = true; let _onEndReachedCalledDuringMomentum = true;
@ -42,7 +42,6 @@ const PostsView = ({
handleImagesHide, handleImagesHide,
isLoggedIn, isLoggedIn,
handleOnScroll, handleOnScroll,
navigation,
isLoading, isLoading,
refreshing, refreshing,
selectedFilterIndex, selectedFilterIndex,
@ -72,6 +71,8 @@ const PostsView = ({
newPostsPopupPictures, newPostsPopupPictures,
setNewPostsPopupPictures, setNewPostsPopupPictures,
}) => { }) => {
const navigation = useNavigation();
const intl = useIntl(); const intl = useIntl();
const postsList = useRef(null); const postsList = useRef(null);
@ -176,7 +177,7 @@ const PostsView = ({
onPressRightText={handleFollowUserButtonPress} onPressRightText={handleFollowUserButtonPress}
handleOnPress={(username) => handleOnPress={(username) =>
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.PROFILE, name: ROUTES.SCREENS.PROFILE,
params: { params: {
username, username,
}, },
@ -211,7 +212,7 @@ const PostsView = ({
name={item.name} name={item.name}
handleOnPress={(name) => handleOnPress={(name) =>
navigation.navigate({ navigation.navigate({
routeName: ROUTES.SCREENS.COMMUNITY, name: ROUTES.SCREENS.COMMUNITY,
params: { params: {
tag: name, tag: name,
}, },
@ -393,5 +394,5 @@ const PostsView = ({
); );
}; };
export default withNavigation(PostsView); export default PostsView;
/* eslint-enable */ /* eslint-enable */

223
src/components/tabbedPosts/view/listEmptyView.tsx
View File

@ -1,32 +1,32 @@
import React, {useEffect, useState} from 'react'; import React, { useEffect, useState } from 'react';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
import { get } from 'lodash'; import { get } from 'lodash';
import { Text, View, FlatList } from 'react-native'; import { Text, View, FlatList } from 'react-native';
import { useSelector, useDispatch } from 'react-redux';
import { NoPost, PostCardPlaceHolder, UserListItem } from '../..'; import { NoPost, PostCardPlaceHolder, UserListItem } from '../..';
import globalStyles from '../../../globalStyles'; import globalStyles from '../../../globalStyles';
import { CommunityListItem, EmptyScreen } from '../../basicUIElements'; import { CommunityListItem, EmptyScreen } from '../../basicUIElements';
import styles from './tabbedPostsStyles'; import styles from './tabbedPostsStyles';
import { default as ROUTES } from '../../../constants/routeNames'; import { default as ROUTES } from '../../../constants/routeNames';
import { withNavigation } from '@react-navigation/compat'; import {
import {useSelector, useDispatch } from 'react-redux'; fetchCommunities,
import { fetchCommunities, leaveCommunity, subscribeCommunity } from '../../../redux/actions/communitiesAction'; leaveCommunity,
subscribeCommunity,
} from '../../../redux/actions/communitiesAction';
import { fetchLeaderboard, followUser, unfollowUser } from '../../../redux/actions/userAction'; import { fetchLeaderboard, followUser, unfollowUser } from '../../../redux/actions/userAction';
import { getCommunity } from '../../../providers/hive/dhive'; import { getCommunity } from '../../../providers/hive/dhive';
import { useNavigation } from '@react-navigation/native';
interface TabEmptyViewProps { interface TabEmptyViewProps {
filterKey:string, filterKey: string;
isNoPost:boolean, isNoPost: boolean;
navigation:any,
} }
const TabEmptyView = ({ const TabEmptyView = ({ filterKey, isNoPost }: TabEmptyViewProps) => {
filterKey,
isNoPost,
navigation,
}: TabEmptyViewProps) => {
const intl = useIntl(); const intl = useIntl();
const dispatch = useDispatch(); const dispatch = useDispatch();
const navigation = useNavigation();
//redux properties //redux properties
const isLoggedIn = useSelector((state) => state.application.isLoggedIn); const isLoggedIn = useSelector((state) => state.application.isLoggedIn);
const subscribingCommunities = useSelector( const subscribingCommunities = useSelector(
@ -43,23 +43,22 @@ const TabEmptyView = ({
//hooks //hooks
useEffect(()=>{ useEffect(() => {
if (isNoPost) { if (isNoPost) {
if (filterKey === 'friends') { if (filterKey === 'friends') {
if (recommendedUsers.length === 0) { if (recommendedUsers.length === 0) {
_getRecommendedUsers(); _getRecommendedUsers();
} }
} else if(filterKey === 'communities') { } else if (filterKey === 'communities') {
if (recommendedCommunities.length === 0) { if (recommendedCommunities.length === 0) {
_getRecommendedCommunities(); _getRecommendedCommunities();
} }
} }
} }
}, [isNoPost]) }, [isNoPost]);
useEffect(() => { useEffect(() => {
const {loading, error, data} = leaderboard; const { loading, error, data } = leaderboard;
if (!loading) { if (!loading) {
if (!error && data && data.length > 0) { if (!error && data && data.length > 0) {
_formatRecommendedUsers(data); _formatRecommendedUsers(data);
@ -68,7 +67,7 @@ const TabEmptyView = ({
}, [leaderboard]); }, [leaderboard]);
useEffect(() => { useEffect(() => {
const {loading, error, data} = communities; const { loading, error, data } = communities;
if (!loading) { if (!loading) {
if (!error && data && data?.length > 0) { if (!error && data && data?.length > 0) {
_formatRecommendedCommunities(data); _formatRecommendedCommunities(data);
@ -76,7 +75,6 @@ const TabEmptyView = ({
} }
}, [communities]); }, [communities]);
useEffect(() => { useEffect(() => {
const recommendeds = [...recommendedCommunities]; const recommendeds = [...recommendedCommunities];
@ -103,8 +101,6 @@ const TabEmptyView = ({
setRecommendedCommunities(recommendeds); setRecommendedCommunities(recommendeds);
}, [subscribingCommunities]); }, [subscribingCommunities]);
useEffect(() => { useEffect(() => {
const recommendeds = [...recommendedUsers]; const recommendeds = [...recommendedUsers];
@ -130,13 +126,12 @@ const TabEmptyView = ({
setRecommendedUsers(recommendeds); setRecommendedUsers(recommendeds);
}, [followingUsers]); }, [followingUsers]);
//fetching //fetching
const _getRecommendedUsers = () => dispatch(fetchLeaderboard()); const _getRecommendedUsers = () => dispatch(fetchLeaderboard());
const _getRecommendedCommunities = () => dispatch(fetchCommunities('', 10)); const _getRecommendedCommunities = () => dispatch(fetchCommunities('', 10));
//formating //formating
const _formatRecommendedCommunities = async (communitiesArray) => { const _formatRecommendedCommunities = async (communitiesArray) => {
try { try {
const ecency = await getCommunity('hive-125125'); const ecency = await getCommunity('hive-125125');
@ -192,7 +187,6 @@ const TabEmptyView = ({
); );
}; };
const _handleFollowUserButtonPress = (data, isFollowing) => { const _handleFollowUserButtonPress = (data, isFollowing) => {
let followAction; let followAction;
let successToastText = ''; let successToastText = '';
@ -223,14 +217,15 @@ const TabEmptyView = ({
dispatch(followAction(currentAccount, pinCode, data, successToastText, failToastText)); dispatch(followAction(currentAccount, pinCode, data, successToastText, failToastText));
}; };
const _handleOnPressLogin = () => { const _handleOnPressLogin = () => {
navigation.navigate(ROUTES.SCREENS.LOGIN); navigation.navigate(ROUTES.SCREENS.LOGIN);
}; };
//render related operations
//render related operations if (
if ((filterKey === 'feed' || filterKey === 'friends' || filterKey === 'communities') && !isLoggedIn) { (filterKey === 'feed' || filterKey === 'friends' || filterKey === 'communities') &&
!isLoggedIn
) {
return ( return (
<NoPost <NoPost
imageStyle={styles.noImage} imageStyle={styles.noImage}
@ -245,92 +240,89 @@ const TabEmptyView = ({
if (isNoPost) { if (isNoPost) {
if (filterKey === 'friends') { if (filterKey === 'friends') {
return (
<>
<Text style={[globalStyles.subTitle, styles.noPostTitle]}>
{intl.formatMessage({ id: 'profile.follow_people' })}
</Text>
<FlatList
data={recommendedUsers}
extraData={recommendedUsers}
keyExtractor={(item, index) => `${item._id || item.id}${index}`}
renderItem={({ item, index }) => (
<UserListItem
index={index}
username={item._id}
isHasRightItem
rightText={
item.isFollowing
? intl.formatMessage({ id: 'user.unfollow' })
: intl.formatMessage({ id: 'user.follow' })
}
rightTextStyle={[styles.followText, item.isFollowing && styles.unfollowText]}
isLoggedIn={isLoggedIn}
isFollowing={item.isFollowing}
isLoadingRightAction={
followingUsers.hasOwnProperty(item._id) && followingUsers[item._id].loading
}
onPressRightText={_handleFollowUserButtonPress}
handleOnPress={(username) =>
navigation.navigate({
routeName: ROUTES.SCREENS.PROFILE,
params: {
username,
},
key: username,
})
}
/>
)}
/>
</>
);
} else if (filterKey === 'communities') {
return (
<>
<Text style={[globalStyles.subTitle, styles.noPostTitle]}>
{intl.formatMessage({ id: 'profile.follow_communities' })}
</Text>
<FlatList
data={recommendedCommunities}
keyExtractor={(item, index) => `${item.id || item.title}${index}`}
renderItem={({ item, index }) => (
<CommunityListItem
index={index}
title={item.title}
about={item.about}
admins={item.admins}
id={item.id}
authors={item.num_authors}
posts={item.num_pending}
subscribers={item.subscribers}
isNsfw={item.is_nsfw}
name={item.name}
handleOnPress={(name) =>
navigation.navigate({
routeName: ROUTES.SCREENS.COMMUNITY,
params: {
tag: name,
},
})
}
handleSubscribeButtonPress={_handleSubscribeCommunityButtonPress}
isSubscribed={item.isSubscribed}
isLoadingRightAction={
subscribingCommunities.hasOwnProperty(item.name) &&
subscribingCommunities[item.name].loading
}
isLoggedIn={isLoggedIn}
/>
)}
/>
</>
);
} else {
return ( return (
<EmptyScreen style={styles.emptyAnimationContainer} /> <>
) <Text style={[globalStyles.subTitle, styles.noPostTitle]}>
{intl.formatMessage({ id: 'profile.follow_people' })}
</Text>
<FlatList
data={recommendedUsers}
extraData={recommendedUsers}
keyExtractor={(item, index) => `${item._id || item.id}${index}`}
renderItem={({ item, index }) => (
<UserListItem
index={index}
username={item._id}
isHasRightItem
rightText={
item.isFollowing
? intl.formatMessage({ id: 'user.unfollow' })
: intl.formatMessage({ id: 'user.follow' })
}
rightTextStyle={[styles.followText, item.isFollowing && styles.unfollowText]}
isLoggedIn={isLoggedIn}
isFollowing={item.isFollowing}
isLoadingRightAction={
followingUsers.hasOwnProperty(item._id) && followingUsers[item._id].loading
}
onPressRightText={_handleFollowUserButtonPress}
handleOnPress={(username) =>
navigation.navigate({
name: ROUTES.SCREENS.PROFILE,
params: {
username,
},
key: username,
})
}
/>
)}
/>
</>
);
} else if (filterKey === 'communities') {
return (
<>
<Text style={[globalStyles.subTitle, styles.noPostTitle]}>
{intl.formatMessage({ id: 'profile.follow_communities' })}
</Text>
<FlatList
data={recommendedCommunities}
keyExtractor={(item, index) => `${item.id || item.title}${index}`}
renderItem={({ item, index }) => (
<CommunityListItem
index={index}
title={item.title}
about={item.about}
admins={item.admins}
id={item.id}
authors={item.num_authors}
posts={item.num_pending}
subscribers={item.subscribers}
isNsfw={item.is_nsfw}
name={item.name}
handleOnPress={(name) =>
navigation.navigate({
name: ROUTES.SCREENS.COMMUNITY,
params: {
tag: name,
},
})
}
handleSubscribeButtonPress={_handleSubscribeCommunityButtonPress}
isSubscribed={item.isSubscribed}
isLoadingRightAction={
subscribingCommunities.hasOwnProperty(item.name) &&
subscribingCommunities[item.name].loading
}
isLoggedIn={isLoggedIn}
/>
)}
/>
</>
);
} else {
return <EmptyScreen style={styles.emptyAnimationContainer} />;
} }
} }
@ -341,5 +333,4 @@ const TabEmptyView = ({
); );
}; };
export default withNavigation(TabEmptyView); export default TabEmptyView;