From dbda698a65305505eb04b69d2992f9f2bc4cf6da Mon Sep 17 00:00:00 2001
From: Liam Fitzgerald <liam.fitzgerald@tlon.io>
Date: Fri, 6 Nov 2020 14:20:47 +1000
Subject: [PATCH] hark: display chat mentions

---
 pkg/interface/src/logic/api/hark.ts             |  7 +++++--
 pkg/interface/src/logic/reducers/hark-update.ts |  3 ++-
 pkg/interface/src/types/hark-update.ts          |  5 ++++-
 .../src/views/apps/notifications/chat.tsx       | 17 +++++++++++------
 4 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/pkg/interface/src/logic/api/hark.ts b/pkg/interface/src/logic/api/hark.ts
index a4b5455bf0..b4706e80da 100644
--- a/pkg/interface/src/logic/api/hark.ts
+++ b/pkg/interface/src/logic/api/hark.ts
@@ -31,8 +31,11 @@ export class HarkApi extends BaseApi<StoreState> {
     });
   }
 
-  setMentions(mentions: boolean) {
-    return this.graphHookAction({
+  async setMentions(mentions: boolean) {
+    await this.graphHookAction({
+      'set-mentions': mentions
+    });
+    return this.chatHookAction({
       'set-mentions': mentions
     });
   }
diff --git a/pkg/interface/src/logic/reducers/hark-update.ts b/pkg/interface/src/logic/reducers/hark-update.ts
index 2aba37ad9c..401555a06a 100644
--- a/pkg/interface/src/logic/reducers/hark-update.ts
+++ b/pkg/interface/src/logic/reducers/hark-update.ts
@@ -209,7 +209,8 @@ function notifIdxEqual(a: NotifIndex, b: NotifIndex) {
       a.group.description === b.group.description
     );
   } else if ("chat" in a && "chat" in b) {
-    return a.chat === b.chat;
+    return a.chat.chat === b.chat.chat &&
+      a.chat.mention === b.chat.mention;
   }
   return false;
 }
diff --git a/pkg/interface/src/types/hark-update.ts b/pkg/interface/src/types/hark-update.ts
index 5549a0538a..d549ed6232 100644
--- a/pkg/interface/src/types/hark-update.ts
+++ b/pkg/interface/src/types/hark-update.ts
@@ -18,7 +18,10 @@ export interface GroupNotifIndex {
   description: string;
 }
 
-export type ChatNotifIndex = string;
+export interface ChatNotifIndex {
+  chat: string;
+  mention: boolean;
+}
 
 export type NotifIndex =
   | { graph: GraphNotifIndex }
diff --git a/pkg/interface/src/views/apps/notifications/chat.tsx b/pkg/interface/src/views/apps/notifications/chat.tsx
index d522c71b47..8c8bee0bb0 100644
--- a/pkg/interface/src/views/apps/notifications/chat.tsx
+++ b/pkg/interface/src/views/apps/notifications/chat.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback } from "react";
-import _ from 'lodash';
+import _ from "lodash";
 import { Link } from "react-router-dom";
 import GlobalApi from "~/logic/api/global";
 import {
@@ -15,8 +15,12 @@ import { Header } from "./header";
 import { pluralize } from "~/logic/lib/util";
 import ChatMessage from "../chat/components/ChatMessage";
 
-function describeNotification(lent: number) {
-  return `sent ${pluralize("message", lent !== 1)} in`;
+function describeNotification(mention: boolean, lent: number) {
+  const msg = pluralize("message", lent !== 1);
+  if (mention) {
+    return `mentioned you in ${msg} in`;
+  }
+  return `sent ${msg} in`;
 }
 
 export function ChatNotification(props: {
@@ -34,13 +38,14 @@ export function ChatNotification(props: {
   const { index, contents, read, time, api, timebox } = props;
   const authors = _.map(contents, "author");
 
-  const association = props.associations.chat[index];
+  const { chat, mention } = index;
+  const association = props.associations.chat[chat];
   const groupPath = association["group-path"];
   const appPath = association["app-path"];
 
   const group = props.groups[groupPath];
 
-  const desc = describeNotification(contents.length);
+  const desc = describeNotification(mention, contents.length);
   const groupContacts = props.contacts[groupPath];
 
   const onClick = useCallback(() => {
@@ -62,7 +67,7 @@ export function ChatNotification(props: {
         time={time}
         authors={authors}
         moduleIcon="Chat"
-        channel={index}
+        channel={chat}
         contacts={props.contacts}
         group={groupPath}
         description={desc}