Added reblogs screen

src/components/postView/container/postDisplayContainer.js

@@ -51,6 +51,18 @@ class PostDisplayContainer extends Component {
     });
   };
 
+  _handleOnReblogsPress = reblogs => {
+    const { navigation, post } = this.props;
+
+    navigation.navigate({
+      routeName: ROUTES.SCREENS.REBLOGS,
+      params: {
+        reblogs,
+      },
+      key: post.permlink + Math.random(),
+    });
+  };
+
   _handleOnReplyPress = () => {
     const { post, navigation } = this.props;
 
@@ -123,6 +135,7 @@ class PostDisplayContainer extends Component {
         handleOnRemovePress={this._handleDeleteComment}
         handleOnReplyPress={this._handleOnReplyPress}
         handleOnVotersPress={this._handleOnVotersPress}
+        handleOnReblogsPress={this._handleOnReblogsPress}
         isLoggedIn={isLoggedIn}
         isNewPost={isNewPost}
         isPostUnavailable={isPostUnavailable}

src/components/postView/view/postDisplayView.js

@@ -71,6 +71,7 @@ class PostDisplayView extends PureComponent {
       handleOnEditPress,
       handleOnReplyPress,
       handleOnVotersPress,
+      handleOnReblogsPress,
       isLoggedIn,
       post,
     } = this.props;
@@ -101,6 +102,7 @@ class PostDisplayView extends PureComponent {
             iconStyle={styles.barIcons}
             iconType="MaterialIcons"
             isClickable
+            onPress={() => handleOnReblogsPress && handleOnReblogsPress(get(post, 'reblogs'))}
             text={get(post, 'reblogCount', 0)}
             textMarginLeft={20}
           />

src/config/locales/en-US.json

@@ -326,5 +326,8 @@
     "rewards": "REWARDS",
     "percent": "PERCENT",
     "time": "TIME"
+  },
+  "reblog": {
+    "title": "Reblog Info"
   }
 }

src/constants/routeNames.js

@@ -23,6 +23,7 @@ export default {
     BOOST_POST: `BoostPost${SCREEN_SUFFIX}`,
     PROMOTE: `Promote${SCREEN_SUFFIX}`,
     FREE_ESTM: `FreeEstm${SCREEN_SUFFIX}`,
+    REBLOGS: `Reblogs${SCREEN_SUFFIX}`,
   },
   DRAWER: {
     MAIN: `Main${DRAWER_SUFFIX}`,

src/containers/accountListContainer.js

@@ -2,6 +2,8 @@ import { PureComponent } from 'react';
 
 import { isBefore } from '../utils/time';
 
+import ROUTES from '../constants/routeNames';
+
 class AccountListContainer extends PureComponent {
   /* Props
    * ------------------------------------------------
@@ -54,6 +56,18 @@ class AccountListContainer extends PureComponent {
     this.setState({ filterResult: _data });
   };
 
+  _handleOnUserPress = username => {
+    const { navigation } = this.props;
+
+    navigation.navigate({
+      routeName: ROUTES.SCREENS.PROFILE,
+      params: {
+        username,
+      },
+      key: username,
+    });
+  };
+
   render() {
     const { data, filterResult } = this.state;
     const { children } = this.props;
@@ -65,6 +79,7 @@ class AccountListContainer extends PureComponent {
         filterResult,
         handleOnVotersDropdownSelect: this._handleOnVotersDropdownSelect,
         handleSearch: this._handleSearch,
+        handleOnUserPress: this._handleOnUserPress,
       })
     );
   }

src/navigation/routes.js

@@ -24,6 +24,7 @@ import {
   Boost,
   Promote,
   BoostPost,
+  Reblogs,
 } from '../screens';
 
 // Components
@@ -126,6 +127,12 @@ const stackNavigatior = createStackNavigator(
         header: () => null,
       },
     },
+    [ROUTES.SCREENS.REBLOGS]: {
+      screen: Reblogs,
+      navigationOptions: {
+        header: () => null,
+      },
+    },
   },
   {
     headerMode: 'none',

src/screens/index.js

@@ -18,6 +18,7 @@ import BoostPost from './boostPost/screen/boostPostScreen';
 import Promote from './promote/screen/promoteScreen';
 import SteemConnect from './steem-connect/steemConnect';
 import Transfer from './transfer';
+import Reblogs from './reblogs';
 
 export {
   Bookmarks,
@@ -40,4 +41,5 @@ export {
   SteemConnect,
   Transfer,
   Voters,
+  Reblogs,
 };

src/screens/reblogs/index.js

@@ -0,0 +1 @@
+export { default } from './screen/reblogScreen';

src/screens/reblogs/screen/reblogScreen.js

@@ -1,50 +1,59 @@
-import React, { PureComponent } from 'react';
-import { View } from 'react-native';
-import { injectIntl } from 'react-intl';
+import React from 'react';
+import { View, FlatList } from 'react-native';
+import { useIntl } from 'react-intl';
 
 // Constants
 
 // Components
 import { BasicHeader } from '../../../components/basicHeader';
-import { FilterBar } from '../../../components/filterBar';
-import { VotersDisplay } from '../../../components/votersDisplay';
+import { UserListItem } from '../../../components/basicUIElements';
 
 import AccountListContainer from '../../../containers/accountListContainer';
 
 // Utils
 import globalStyles from '../../../globalStyles';
+import { getTimeFromNow } from '../../../utils/time';
 
-class ReblogScreen extends PureComponent {
-  render() {
-    const { intl, navigation } = this.props;
-    const headerTitle = intl.formatMessage({
-      id: 'voters.voters_info',
-    });
+const renderUserListItem = (item, index, handleOnUserPress) => {
+  return (
+    <UserListItem
+      index={index}
+      username={item.account}
+      description={getTimeFromNow(item.timestamp)}
+      handleOnPress={() => handleOnUserPress(item.account)}
+      isClickable
+    />
+  );
+};
 
-    const activeVotes =
-      navigation.state && navigation.state.params && navigation.state.params.activeVotes;
+const ReblogScreen = ({ navigation }) => {
+  const intl = useIntl();
+  const headerTitle = intl.formatMessage({
+    id: 'reblog.title',
+  });
 
-    return (
-      <AccountListContainer data={activeVotes}>
-        {({ data, filterResult, handleOnVotersDropdownSelect, handleSearch }) => (
-          <View style={globalStyles.container}>
-            <BasicHeader
-              title={`${headerTitle} (${data && data.length})`}
-              isHasSearch
-              handleOnSearch={text => handleSearch(text, 'voter')}
-            />
-            <FilterBar
-              dropdownIconName="arrow-drop-down"
-              options={['REWARDS', 'PERCENT', 'TIME']}
-              defaultText="REWARDS"
-              onDropdownSelect={handleOnVotersDropdownSelect}
-            />
-            <VotersDisplay key={Math.random()} votes={filterResult || data} />
-          </View>
-        )}
-      </AccountListContainer>
-    );
-  }
-}
+  const activeVotes =
+    navigation.state && navigation.state.params && navigation.state.params.reblogs;
 
-export default injectIntl(ReblogScreen);
+  return (
+    <AccountListContainer data={activeVotes} navigation={navigation}>
+      {({ data, filterResult, handleSearch, handleOnUserPress }) => (
+        <View style={globalStyles.container}>
+          <BasicHeader
+            title={`${headerTitle} (${data && data.length})`}
+            isHasSearch
+            handleOnSearch={text => handleSearch(text, 'account')}
+          />
+          <FlatList
+            data={filterResult || data}
+            keyExtractor={item => item.account}
+            removeClippedSubviews={false}
+            renderItem={({ item, index }) => renderUserListItem(item, index, handleOnUserPress)}
+          />
+        </View>
+      )}
+    </AccountListContainer>
+  );
+};
+
+export default ReblogScreen;

src/utils/postParser.js

@@ -67,8 +67,8 @@ export const parsePost = async (post, currentUserName, isPromoted) => {
     });
   }
 
-  const postReblogs = await getPostReblogs(post);
-  post.reblogCount = postReblogs.length;
+  post.reblogs = await getPostReblogs(post);
+  post.reblogCount = post.reblogs.length;
 
   return post;
 };