Added filter feature for notifications

src/components/notification/view/notificationView.js

@@ -30,28 +30,14 @@ class NotificationView extends Component {
           // date: 'today',
           isNew: true,
         },
-        // {
-        //   name: 'esteemapp',
-        //   title: '25% likes your post:',
-        //   description: 'My own Top 5 eSteem Surfer Features',
-        //   image: 'https://steemitimages.com/u/feruz/avatar/small',
-        //   date: 'yesterday',
-        // },
-        // {
-        //   name: 'esteemapp',
-        //   title: '25% likes your post:',
-        //   avatar: 'https://steemitimages.com/u/feruz/avatar/small',
-        //   description: 'My own Top 5 eSteem Surfer Featuresasassasasaasas',
-        //   date: 'yesterday',
-        // },
-        // {
-        //   name: 'esteemapp',
-        //   title: '25% likes your post:',
-        //   avatar: 'https://steemitimages.com/u/feruz/avatar/small',
-        //   description: 'My own Top 5 eSteem Surfer Features',
-        //   image: 'https://steemitimages.com/u/feruz/avatar/small',
-        //   date: 'yesterday',
-        // },
+      ],
+      filters: [
+        { key: 'activities', value: 'ALL ACTIVITIES' },
+        { key: 'votes', value: 'VOTES' },
+        { key: 'replies', value: 'REPLIES' },
+        { key: 'mentions', value: 'MENTIONS' },
+        { key: 'follows', value: 'FOLLOWS' },
+        { key: 'reblogs', value: 'REBLOGS' },
       ],
     };
   }
@@ -61,18 +47,22 @@ class NotificationView extends Component {
   // Component Functions
 
   _handleOnDropdownSelect = (index) => {
-    console.log(`selected index is:${index}`);
+    const { getActivities } = this.props;
+    const { filters } = this.state;
+
+    getActivities(filters[index].key);
   };
 
   render() {
     const { notifications } = this.props;
+    const { filters } = this.state;
 
     return (
       <View style={styles.container}>
         <FilterBar
           dropdownIconName="md-arrow-dropdown"
-          options={['ALL ACTIVITIES', 'VOTES', 'REPLIES', 'MENTIONS', 'FOLLOWS', 'REBLOGS']}
-          defaultText="ALL NOTIFICATION"
+          options={filters.map(item => item.value)}
+          defaultText="ALL ACTIVITIES"
           onDropdownSelect={this._handleOnDropdownSelect}
           rightIconName="ios-checkmark"
         />
@@ -81,7 +71,7 @@ class NotificationView extends Component {
           <FlatList
             data={notifications}
             renderItem={({ item }) => <NotificationLine notification={item} />}
-            keyExtractor={item => item.email}
+            keyExtractor={item => item.id}
           />
           {/* Will remove follow lines */}
           {/* <ContainerHeader hasSeperator isBoldTitle title="Yesterday" />

src/providers/esteem/esteem.js

@@ -223,8 +223,32 @@ export const updateDraft = data => new Promise((resolve, reject) => {
 
 export const getActivities = data => new Promise((resolve, reject) => {
   resolve(testData);
+  let url = null;
+  switch (data.type) {
+    case 'activities':
+      url = `/activities/${data.user}`;
+      break;
+    case 'votes':
+      url = `/rvotes/${data.user}`;
+      break;
+    case 'replies':
+      url = `/replies/${data.user}`;
+      break;
+    case 'mentions':
+      url = `/mentions/${data.user}`;
+      break;
+    case 'follows':
+      url = `/follows/${data.user}`;
+      break;
+    case 'reblogs':
+      url = `/reblogs/${data.user}`;
+      break;
+    default:
+      url = `/activities/${data.user}`;
+      break;
+  }
   api
-    .get(`/activities/${data.user}`, {
+    .get(url, {
       params: {
         since: data.since,
       },

src/screens/notification/container/notificationContainer.js

@@ -15,16 +15,26 @@ class NotificationContainer extends Component {
   }
 
   componentWillMount() {
-    getActivities({ user: 'mistikk' }).then((res) => {
+    this._getAvtivities();
+  }
+
+  _getAvtivities = (type = null) => {
+    getActivities({ user: 'mistikk', type }).then((res) => {
       console.log('res :', res);
       this.setState({ notifications: res });
     });
-  }
+  };
 
   render() {
     const { notifications } = this.state;
 
-    return <NotificationScreen notifications={notifications} {...this.props} />;
+    return (
+      <NotificationScreen
+        getActivities={this._getAvtivities}
+        notifications={notifications}
+        {...this.props}
+      />
+    );
   }
 }
 

src/screens/notification/screen/notificationScreen.js

@@ -19,7 +19,7 @@ class NotificationScreen extends PureComponent {
   }
 
   render() {
-    const { notifications } = this.props;
+    const { notifications, getActivities } = this.props;
     console.log('notifications :', notifications);
     return (
       <Fragment>
@@ -37,7 +37,7 @@ class NotificationScreen extends PureComponent {
           )}
         >
           <View tabLabel="Notification" style={styles.notificationTab}>
-            <Notification notifications={notifications} />
+            <Notification getActivities={getActivities} notifications={notifications} />
           </View>
           <View tabLabel="Leaderboard" style={styles.leaderboardTab}>
             <NoPost