Make GM Intro message to change based on the notification preferences (…

…#7563) (#7580) (cherry picked from commit 385461a) Co-authored-by: Daniel Espino García <[email protected]>
mattermost · Oct 3, 2023 · 57aaee9 · 57aaee9
1 parent 45b5de9
commit 57aaee9
Show file tree

Hide file tree

Showing 3 changed files with 71 additions and 14 deletions.
diff --git a/app/screens/channel/channel_post_list/intro/direct_channel/direct_channel.tsx b/app/screens/channel/channel_post_list/intro/direct_channel/direct_channel.tsx
@@ -2,12 +2,13 @@
 // See LICENSE.txt for license information.
 
 import React, {useEffect, useMemo} from 'react';
-import {Text, View} from 'react-native';
+import {defineMessages} from 'react-intl';
+import {Text, View, type TextStyle} from 'react-native';
 
 import {fetchProfilesInChannel} from '@actions/remote/user';
 import FormattedText from '@components/formatted_text';
 import {BotTag} from '@components/tag';
-import {General} from '@constants';
+import {General, NotificationLevel} from '@constants';
 import {useServerUrl} from '@context/server';
 import {makeStyleSheetFromTheme} from '@utils/theme';
 import {typography} from '@utils/typography';
@@ -28,6 +29,8 @@ type Props = {
     members?: ChannelMembershipModel[];
     theme: Theme;
     hasGMasDMFeature: boolean;
+    channelNotifyProps?: Partial<ChannelNotifyProps>;
+    userNotifyProps?: Partial<UserNotifyProps> | null;
 }
 
 const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => ({
@@ -71,13 +74,55 @@ const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => ({
     },
 }));
 
+const gmIntroMessages = defineMessages({
+    muted: {id: 'intro.group_message.muted', defaultMessage: 'This group message is currently <b>muted</b>, so you will not be notified.'},
+    [NotificationLevel.ALL]: {id: 'intro.group_message.all', defaultMessage: 'You\'ll be notified <b>for all activity</b> in this group message.'},
+    [NotificationLevel.DEFAULT]: {id: 'intro.group_message.all', defaultMessage: 'You\'ll be notified <b>for all activity</b> in this group message.'},
+    [NotificationLevel.MENTION]: {id: 'intro.group_message.mention', defaultMessage: 'You have selected to be notified <b>only when mentioned</b> in this group message.'},
+    [NotificationLevel.NONE]: {id: 'intro.group_message.none', defaultMessage: 'You have selected to <b>never</b> be notified in this group message.'},
+});
+
+const getGMIntroMessageSpecificPart = (userNotifyProps: Partial<UserNotifyProps> | undefined | null, channelNotifyProps: Partial<ChannelNotifyProps> | undefined, boldStyle: TextStyle) => {
+    const isMuted = channelNotifyProps?.mark_unread === 'mention';
+    if (isMuted) {
+        return (
+            <FormattedText
+                {...gmIntroMessages.muted}
+                values={{
+                    b: (chunk: string) => <Text style={boldStyle}>{chunk}</Text>,
+                }}
+            />
+        );
+    }
+    const channelNotifyProp = channelNotifyProps?.push || NotificationLevel.DEFAULT;
+    const userNotifyProp = userNotifyProps?.push || NotificationLevel.MENTION;
+    let notifyLevelToUse = channelNotifyProp;
+    if (notifyLevelToUse === NotificationLevel.DEFAULT) {
+        notifyLevelToUse = userNotifyProp;
+    }
+    if (channelNotifyProp === NotificationLevel.DEFAULT && userNotifyProp === NotificationLevel.MENTION) {
+        notifyLevelToUse = NotificationLevel.ALL;
+    }
+
+    return (
+        <FormattedText
+            {...gmIntroMessages[notifyLevelToUse]}
+            values={{
+                b: (chunk: string) => <Text style={boldStyle}>{chunk}</Text>,
+            }}
+        />
+    );
+};
+
 const DirectChannel = ({
     channel,
     currentUserId,
     isBot,
     members,
     theme,
     hasGMasDMFeature,
+    channelNotifyProps,
+    userNotifyProps,
 }: Props) => {
     const serverUrl = useServerUrl();
     const styles = getStyleSheet(theme);
@@ -110,16 +155,16 @@ const DirectChannel = ({
             );
         }
         return (
-            <FormattedText
-                defaultMessage={'This is the start of your conversation with this group. You\'ll be notified for <b>all activity</b> in this group message.'}
-                id='intro.group_message'
-                style={styles.message}
-                values={{
-                    b: (chunk: string) => <Text style={styles.boldText}>{chunk}</Text>,
-                }}
-            />
+            <Text style={styles.message}>
+                <FormattedText
+                    defaultMessage={'This is the start of your conversation with this group.'}
+                    id='intro.group_message.common'
+                />
+                <Text> </Text>
+                {getGMIntroMessageSpecificPart(userNotifyProps, channelNotifyProps, styles.boldText)}
+            </Text>
         );
-    }, [channel.displayName, theme]);
+    }, [channel.displayName, theme, channelNotifyProps, userNotifyProps]);
 
     const profiles = useMemo(() => {
         if (channel.type === General.DM_CHANNEL) {

diff --git a/app/screens/channel/channel_post_list/intro/direct_channel/index.ts b/app/screens/channel/channel_post_list/intro/direct_channel/index.ts
@@ -7,10 +7,10 @@ import {of as of$} from 'rxjs';
 import {switchMap} from 'rxjs/operators';
 
 import {General} from '@constants';
-import {observeChannelMembers} from '@queries/servers/channel';
+import {observeChannelMembers, observeNotifyPropsByChannels} from '@queries/servers/channel';
 import {observeHasGMasDMFeature} from '@queries/servers/features';
 import {observeCurrentUserId} from '@queries/servers/system';
-import {observeUser} from '@queries/servers/user';
+import {observeCurrentUser, observeUser} from '@queries/servers/user';
 import {getUserIdFromChannelName} from '@utils/user';
 
 import DirectChannel from './direct_channel';
@@ -25,6 +25,12 @@ const enhanced = withObservables([], ({channel, database}: {channel: ChannelMode
     const currentUserId = observeCurrentUserId(database);
     const members = observeChannelMembers(database, channel.id);
     const hasGMasDMFeature = observeHasGMasDMFeature(database);
+    const channelNotifyProps = observeNotifyPropsByChannels(database, [channel]).pipe(
+        switchMap((v) => of$(v[channel.id])),
+    );
+    const userNotifyProps = observeCurrentUser(database).pipe(
+        switchMap((v) => of$(v?.notifyProps)),
+    );
     let isBot = of$(false);
 
     if (channel.type === General.DM_CHANNEL) {
@@ -43,6 +49,8 @@ const enhanced = withObservables([], ({channel, database}: {channel: ChannelMode
         isBot,
         members,
         hasGMasDMFeature,
+        channelNotifyProps,
+        userNotifyProps,
     };
 });
 

diff --git a/assets/base/i18n/en.json b/assets/base/i18n/en.json
@@ -340,8 +340,12 @@
   "intro.channel_info": "Info",
   "intro.created_by": "created by {creator} on {date}.",
   "intro.direct_message": "This is the start of your conversation with {teammate}. Messages and files shared here are not shown to anyone else.",
-  "intro.group_message": "This is the start of your conversation with this group. Messages and files shared here are not shown to anyone else outside of the group.",
   "intro.group_message.after_gm_as_dm": "This is the start of your conversation with this group. Messages and files shared here are not shown to anyone else outside of the group.",
+  "intro.group_message.all": "You'll be notified <b>for all activity</b> in this group message.",
+  "intro.group_message.common": "This is the start of your conversation with this group.",
+  "intro.group_message.mention": "You have selected to be notified <b>only when mentioned</b> in this group message.",
+  "intro.group_message.muted": "This group message is currently <b>muted</b>, so you will not be notified.",
+  "intro.group_message.none": "You have selected to <b>never</b> be notified in this group message.",
   "intro.private_channel": "Private Channel",
   "intro.public_channel": "Public Channel",
   "intro.townsquare": "Welcome to {name}. Everyone automatically becomes a member of this channel when they join the team.",