Fixes getStoryView selector

stylesheets/components/MyStories.scss

@@ -7,6 +7,7 @@
 
     &__title {
       @include font-body-1-bold;
+      color: $color-gray-05;
       margin: 24px 0 8px 0;
     }
   }
@@ -18,6 +19,7 @@
 
     &__details {
       @include font-body-1-bold;
+      color: $color-gray-05;
       display: flex;
       flex-direction: column;
       flex: 1;

ts/state/selectors/stories.ts

@@ -113,13 +113,51 @@ export function getStoryView(
 
   const { attachment, timestamp } = pick(story, ['attachment', 'timestamp']);
 
+  const { sendStateByConversationId } = story;
+  let sendState: Array<StorySendStateType> | undefined;
+  let views: number | undefined;
+
+  if (sendStateByConversationId) {
+    const innerSendState: Array<StorySendStateType> = [];
+    let innerViews = 0;
+
+    Object.keys(sendStateByConversationId).forEach(recipientId => {
+      const recipient = conversationSelector(recipientId);
+
+      const recipientSendState = sendStateByConversationId[recipient.id];
+      if (recipientSendState.status === SendStatus.Viewed) {
+        innerViews += 1;
+      }
+
+      innerSendState.push({
+        ...recipientSendState,
+        recipient: pick(recipient, [
+          'acceptedMessageRequest',
+          'avatarPath',
+          'color',
+          'id',
+          'isMe',
+          'name',
+          'profileName',
+          'sharedGroupNames',
+          'title',
+        ]),
+      });
+    });
+
+    sendState = innerSendState;
+    views = innerViews;
+  }
+
   return {
     attachment,
     canReply: canReply(story, undefined, conversationSelector),
     isUnread: story.readStatus === ReadStatus.Unread,
     messageId: story.messageId,
     sender,
+    sendState,
     timestamp,
+    views,
   };
 }
 
@@ -260,47 +298,12 @@ export const getStories = createSelector(
 
         const storyView = getStoryView(conversationSelector, story);
 
-        const sendState: Array<StorySendStateType> = [];
-        const { sendStateByConversationId } = story;
-
-        let views = 0;
-        Object.keys(story.sendStateByConversationId).forEach(recipientId => {
-          const recipient = conversationSelector(recipientId);
-
-          const recipientSendState = sendStateByConversationId[recipient.id];
-          if (recipientSendState.status === SendStatus.Viewed) {
-            views += 1;
-          }
-
-          sendState.push({
-            ...recipientSendState,
-            recipient: pick(recipient, [
-              'acceptedMessageRequest',
-              'avatarPath',
-              'color',
-              'id',
-              'isMe',
-              'name',
-              'profileName',
-              'sharedGroupNames',
-              'title',
-            ]),
-          });
-        });
-
         const existingMyStory = myStoriesById.get(list.id) || { stories: [] };
 
         myStoriesById.set(list.id, {
           distributionId: list.id,
           distributionName: list.name,
-          stories: [
+          stories: [...existingMyStory.stories, storyView],
-            ...existingMyStory.stories,
-            {
-              ...storyView,
-              sendState,
-              views,
-            },
-          ],
         });
 
         return;