519 connect news feature to api 3 (#729)

* Seperate ActivityStreamItem component in seperate file

* Add ActivityStreamItemAvatar component

* Add images assets and update icon asset

* Update translations

* Add news module

* Update Activity related components

* Create wysiwyg styles, update icons

* Update TabNavigationAction component

* Update actions and reducers

* Update ActivityItem shadow

* Update padding of Container and footer and ActivityList container

* Correct loading behaviour while pressing load more button

src/components/ActivityIcon.js

@@ -3,38 +3,35 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { Link } from 'react-router-dom';
 
-import core from '~/services/core';
 import { CATEGORIES } from '~/store/activity/reducers';
 import { IconNotification } from '~/styles/icons';
-const newsItems = core.news;
 
 const DashboardActivityIcon = () => {
-  const { categories, lastSeenAt } = useSelector((state) => {
+  const { categories, lastSeenAt, news } = useSelector((state) => {
     return state.activity;
   });
 
-  const NEWS = Symbol.for('NEWS');
-  const categoriesWithNews = { ...categories, ...{ [NEWS]: newsItems } };
-  let CATEGORIES_WITH_NEWS = [...CATEGORIES];
-  CATEGORIES_WITH_NEWS.push(NEWS);
-
   // Is there any pending transactions?
-  const isPending = CATEGORIES_WITH_NEWS.find((category) => {
-    return !!categoriesWithNews[category].activities.find((activity) => {
+  const isPending = CATEGORIES.find((category) => {
+    return !!categories[category].activities.find((activity) => {
       return activity.isPending;
     });
   });
 
   // Count how many activities we haven't seen yet
-  const count = CATEGORIES_WITH_NEWS.reduce((acc, category) => {
+  const count = CATEGORIES.reduce((acc, category) => {
     return (
       acc +
-      categoriesWithNews[category].activities.reduce((itemAcc, activity) => {
+      categories[category].activities.reduce((itemAcc, activity) => {
         return activity.createdAt > lastSeenAt ? itemAcc + 1 : itemAcc;
       }, 0)
     );
   }, 0);
 
+  const countNews = news.activities.reduce((itemAcc, activity) => {
+    return activity.createdAt > lastSeenAt ? itemAcc + 1 : itemAcc;
+  }, 0);
+
   return (
     <IconButton
       aria-label="Activities"
@@ -47,7 +44,7 @@ const DashboardActivityIcon = () => {
         <CircularProgress size={28} />
       ) : (
         <Badge
-          badgeContent={count}
+          badgeContent={count + countNews}
           color="primary"
           max={99}
           overlap="rectangular"