Make GM Intro message to change based on the notification preferences. (#24634)

* Make GM Intro message to change based on the notification preferences.

* Fix test and minor refactoring

* Fix lint
This commit is contained in:
Daniel Espino García 2023-10-05 18:38:31 +02:00 committed by GitHub
parent 4409dc083b
commit def164f790
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 63 additions and 13 deletions

View File

@ -2,13 +2,15 @@
// See LICENSE.txt for license information.
import React from 'react';
import {FormattedDate, FormattedMessage} from 'react-intl';
import {FormattedDate, FormattedMessage, defineMessages} from 'react-intl';
import {BellRingOutlineIcon} from '@mattermost/compass-icons/components';
import type {Channel} from '@mattermost/types/channels';
import type {Channel, ChannelMembership} from '@mattermost/types/channels';
import type {UserProfile as UserProfileType} from '@mattermost/types/users';
import {Permissions} from 'mattermost-redux/constants';
import {NotificationLevel} from 'mattermost-redux/constants/channels';
import {isChannelMuted} from 'mattermost-redux/utils/channel_utils';
import AddGroupsToTeamModal from 'components/add_groups_to_team_modal';
import ChannelNotificationsModal from 'components/channel_notifications_modal';
@ -43,6 +45,7 @@ type Props = {
teammateName?: string;
stats: any;
usersLimit: number;
channelMember?: ChannelMembership;
actions: {
getTotalUsersStats: () => any;
};
@ -58,6 +61,7 @@ export default class ChannelIntroMessage extends React.PureComponent<Props> {
const {
currentUserId,
channel,
channelMember,
creatorName,
fullWidth,
locale,
@ -79,7 +83,7 @@ export default class ChannelIntroMessage extends React.PureComponent<Props> {
if (channel.type === Constants.DM_CHANNEL) {
return createDMIntroMessage(channel, centeredIntro, teammate, teammateName);
} else if (channel.type === Constants.GM_CHANNEL) {
return createGMIntroMessage(channel, centeredIntro, channelProfiles, currentUserId);
return createGMIntroMessage(channel, centeredIntro, channelProfiles, currentUserId, channelMember);
} else if (channel.name === Constants.DEFAULT_CHANNEL) {
return createDefaultIntroMessage(channel, centeredIntro, stats, usersLimit, enableUserCreation, isReadOnly, teamIsGroupConstrained);
} else if (channel.name === Constants.OFFTOPIC_CHANNEL) {
@ -91,7 +95,47 @@ export default class ChannelIntroMessage extends React.PureComponent<Props> {
}
}
function createGMIntroMessage(channel: Channel, centeredIntro: string, profiles: UserProfileType[], currentUserId: string) {
const gmIntroMessages = defineMessages({
muted: {id: 'intro_messages.GM.muted', defaultMessage: 'This group message is currently <b>muted</b>, so you will not be notified.'},
[NotificationLevel.ALL]: {id: 'intro_messages.GM.all', defaultMessage: 'You\'ll be notified <b>for all activity</b> in this group message.'},
[NotificationLevel.DEFAULT]: {id: 'intro_messages.GM.all', defaultMessage: 'You\'ll be notified <b>for all activity</b> in this group message.'},
[NotificationLevel.MENTION]: {id: 'intro_messages.GM.mention', defaultMessage: 'You have selected to be notified <b>only when mentioned</b> in this group message.'},
[NotificationLevel.NONE]: {id: 'intro_messages.GM.none', defaultMessage: 'You have selected to <b>never</b> be notified in this group message.'},
});
const getGMIntroMessageSpecificPart = (userProfile: UserProfileType | undefined, membership: ChannelMembership | undefined) => {
const isMuted = isChannelMuted(membership);
if (isMuted) {
return (
<FormattedMessage
{...gmIntroMessages.muted}
values={{
b: (chunks) => <b>{chunks}</b>,
}}
/>
);
}
const channelNotifyProp = membership?.notify_props?.desktop || NotificationLevel.DEFAULT;
const userNotifyProp = userProfile?.notify_props?.desktop || NotificationLevel.MENTION;
let notifyLevelToUse = channelNotifyProp;
if (notifyLevelToUse === NotificationLevel.DEFAULT) {
notifyLevelToUse = userNotifyProp;
}
if (channelNotifyProp === NotificationLevel.DEFAULT && userNotifyProp === NotificationLevel.MENTION) {
notifyLevelToUse = NotificationLevel.ALL;
}
return (
<FormattedMessage
{...gmIntroMessages[notifyLevelToUse]}
values={{
b: (chunks) => <b>{chunks}</b>,
}}
/>
);
};
function createGMIntroMessage(channel: Channel, centeredIntro: string, profiles: UserProfileType[], currentUserId: string, channelMembership?: ChannelMembership) {
const channelIntroId = 'channelIntro';
if (profiles.length > 0) {
@ -118,14 +162,14 @@ function createGMIntroMessage(channel: Channel, centeredIntro: string, profiles:
</div>
<p className='channel-intro-text'>
<FormattedMessage
id='intro_messages.GM'
defaultMessage={'This is the start of your group message history with {names}.{br}You\'ll be notified <b>for all activity</b> in this group message.'}
id='intro_messages.GM.common'
defaultMessage={'This is the start of your group message history with {names}.{br}'}
values={{
b: (chunks) => <b>{chunks}</b>,
names: channel.display_name,
br: <br/>,
}}
/>
{getGMIntroMessageSpecificPart(currentUserProfile, channelMembership)}
</p>
<div style={{display: 'flex'}}>
{createNotificationPreferencesButton(channel, currentUserProfile)}

View File

@ -6,7 +6,7 @@ import {bindActionCreators} from 'redux';
import type {Dispatch} from 'redux';
import {getTotalUsersStats} from 'mattermost-redux/actions/users';
import {getCurrentChannel, getDirectTeammate} from 'mattermost-redux/selectors/entities/channels';
import {getCurrentChannel, getDirectTeammate, getMyCurrentChannelMembership} from 'mattermost-redux/selectors/entities/channels';
import {getConfig} from 'mattermost-redux/selectors/entities/general';
import {get} from 'mattermost-redux/selectors/entities/preferences';
import {getCurrentTeam} from 'mattermost-redux/selectors/entities/teams';
@ -28,6 +28,7 @@ function mapStateToProps(state: GlobalState) {
const isReadOnly = false;
const team = getCurrentTeam(state);
const channel = getCurrentChannel(state) || {};
const channelMember = getMyCurrentChannelMembership(state);
const teammate = getDirectTeammate(state, channel.id);
const creator = getUser(state, channel.creator_id);
@ -49,6 +50,7 @@ function mapStateToProps(state: GlobalState) {
teammateName: getDisplayNameByUser(state, teammate),
stats,
usersLimit,
channelMember,
};
}

View File

@ -3764,7 +3764,11 @@
"intro_messages.creatorPrivate": "This is the start of the {name} private channel, created by {creator} on {date}.",
"intro_messages.default": "**Welcome to {display_name}!**\n \nPost messages here that you want everyone to see. Everyone automatically becomes a permanent member of this channel when they join the team.",
"intro_messages.DM": "This is the start of your direct message history with {teammate}.\nDirect messages and files shared here are not shown to people outside this area.",
"intro_messages.GM": "This is the start of your group message history with {names}.{br}You'll be notified <b>for all activity</b> in this group message.",
"intro_messages.GM.all": "You'll be notified <b>for all activity</b> in this group message.",
"intro_messages.GM.common": "This is the start of your group message history with {names}.{br}",
"intro_messages.GM.mention": "You have selected to be notified <b>only when mentioned</b> in this group message.",
"intro_messages.GM.muted": "This group message is currently <b>muted</b>, so you will not be notified.",
"intro_messages.GM.none": "You have selected to <b>never</b> be notified in this group message.",
"intro_messages.group_message": "This is the start of your group message history with these teammates. Messages and files shared here are not shown to people outside this area.",
"intro_messages.inviteGropusToChannel.button": "Add groups to this private channel",
"intro_messages.inviteMembersToChannel.button": "Add members to this channel",

View File

@ -2,10 +2,10 @@
// See LICENSE.txt for license information.
export const NotificationLevel = {
DEFAULT: 'default',
ALL: 'all',
MENTION: 'mention',
NONE: 'none',
DEFAULT: 'default' as const,
ALL: 'all' as const,
MENTION: 'mention' as const,
NONE: 'none' as const,
};
export const MarkUnread = {