fixes from code review

e2e-tests/cypress/tests/integration/channels/keyboard_shortcuts/keyboard_shortcuts_1_spec.js

@@ -59,13 +59,13 @@ describe('Keyboard Shortcuts', () => {
             });
 
             // # Verify that we are in the test channel
-            cy.get('#channelIntro').contains('.channel-intro__title', `Beginning of ${testChannel.display_name}`).should('be.visible');
+            cy.get('#channelIntro').contains('.channel-intro__title', `${testChannel.display_name}`).should('be.visible');
 
             // # Verify that the right channel is displayed in LHS
             cy.uiGetLhsSection('CHANNELS').findByText(testChannel.display_name).should('be.visible');
 
             // # Verify that the current user(sysadmin) created the channel
-            cy.get('#channelIntro').contains('.channel-intro__content', `This is the start of the ${testChannel.display_name} channel, created by sysadmin`).should('be.visible');
+            cy.get('#channelIntro').contains('.channel-intro__created', `Public channel created by sysadmin`).should('be.visible');
         });
     });
 

e2e-tests/cypress/tests/integration/channels/messaging/ctrl_cmd_k_open_dm_with_mouse_spec.js

@@ -51,10 +51,10 @@ describe('Messaging', () => {
 
         // # Verify that we are in a DM channel
         cy.get('#channelIntro').should('be.visible').within(() => {
-            cy.get('.channel-intro-profile').
+            cy.get('.channel-intro__title').
                 should('be.visible').
                 and('have.text', secondUser.username);
-            cy.get('.channel-intro-text').
+            cy.get('.channel-intro__text').
                 should('be.visible').
                 and('contain', `This is the start of your direct message history with ${secondUser.username}.`).
                 and('contain', 'Direct messages and files shared here are not shown to people outside this area.');

e2e-tests/cypress/tests/integration/channels/messaging/group_message_spec.js

@@ -137,8 +137,8 @@ describe('Group Message', () => {
         });
 
         // * Assert that intro message includes the right copy
-        const expectedChannelInfo = `This is the start of your group message history with ${sortedParticipants[0].username}, ${sortedParticipants[1].username}.Messages and files shared here are not shown to people outside this area.`;
+        const expectedChannelInfo = `This is the start of your group message history with these teammates.`;
-        cy.get('#channelIntro p.channel-intro-text').first().should('contain', expectedChannelInfo);
+        cy.get('#channelIntro p.channel-intro__text').first().should('contain', expectedChannelInfo);
         cy.get('#channelIntro .profile-icon').should('have.length', '2');
 
         cy.location().then((loc) => {

e2e-tests/cypress/tests/integration/channels/messaging/send_message_via_profile_popover_spec.js

@@ -95,12 +95,12 @@ function verifyDMChannelViaSendMessage(postId, team, channel, profileSelector, u
     // * Verify that it redirects into the DM channel and matches channel intro
     cy.get('#channelIntro').should('be.visible').within(() => {
         cy.url().should('include', `/${team.name}/messages/@${user.username}`);
-        cy.get('.channel-intro-profile').
+        cy.get('.channel-intro__title').
             should('be.visible').
             and('have.text', user.username);
-        cy.get('.channel-intro-text').
+        cy.get('.channel-intro__text').
             should('be.visible').
             and('contain', `This is the start of your direct message history with ${user.username}.`).
-            and('contain', 'Direct messages and files shared here are not shown to people outside this area.');
+            and('contain', 'Messages and files shared here are not shown to anyone else.');
     });
 }

e2e-tests/cypress/tests/integration/channels/multi_team_and_dm/gm_add_user_spec.js

@@ -136,7 +136,7 @@ describe('Multi-user group messages', () => {
         // * Original messages does not exist
         cy.contains('.post-message__text', 'historical').should('not.exist');
 
-        cy.contains('p.channel-intro-text span', 'This is the start of your group message history with');
+        cy.contains('p.channel-intro__text', 'This is the start of your group message history with');
 
         // * New user is added to the GM
         cy.get('.member-rhs__trigger').click();

webapp/channels/src/components/post_view/channel_intro_message/add_members_button.tsx

@@ -118,17 +118,12 @@ const MoreThanMaxFreeUsers = ({channel, pluginButtons}: {channel: Channel; plugi
                             className='icon-account-plus-outline'
                             title={formatMessage({id: 'generic_icons.add', defaultMessage: 'Add Icon'})}
                         />
-                        {isPrivate && channel.group_constrained &&
+                        {channel.group_constrained &&
                             <FormattedMessage
                                 id='intro_messages.inviteGropusToChannel.button'
                                 defaultMessage='Add groups'
                             />}
-                        {isPrivate && !channel.group_constrained &&
+                        {!channel.group_constrained &&
-                            <FormattedMessage
-                                id='intro_messages.inviteMembersToChannel.button'
-                                defaultMessage='Add people'
-                            />}
-                        {!isPrivate &&
                             <FormattedMessage
                                 id='intro_messages.inviteMembersToChannel.button'
                                 defaultMessage='Add people'

webapp/channels/src/components/post_view/channel_intro_message/channel_intro_message.test.tsx

@@ -100,8 +100,7 @@ describe('components/post_view/ChannelIntroMessages', () => {
             expect(beginningHeading).toBeInTheDocument();
             expect(beginningHeading).toHaveClass('channel-intro__title');
 
-            expect(screen.getByText(`This is the start of the test channel channel, created by ${baseProps.creatorName} on October 17, 2017.`));
+            expect(screen.getByText('This is the start of test channel. Any team member can join and read this channel.')).toBeInTheDocument();
-            expect(screen.getByText('Any member can join and read this channel.')).toBeInTheDocument();
         });
     });
 

webapp/channels/src/components/post_view/channel_intro_message/channel_intro_message.tsx

@@ -201,13 +201,13 @@ function createGMIntroMessage(
                 <h2 className='channel-intro__title'>
                     {channel.display_name}
                 </h2>
-                <div className='channel-intro__text'>
+                <p className='channel-intro__text'>
                     <FormattedMessage
                         id='intro_messages.group_message'
                         defaultMessage={'This is the start of your group message history with these teammates. '}
                     />
                     {getGMIntroMessageSpecificPart(currentUserProfile, channelMembership)}
-                </div>
+                </p>
                 {actionButtons}
             </div>
         );
@@ -218,12 +218,12 @@ function createGMIntroMessage(
             id={channelIntroId}
             className={'channel-intro ' + centeredIntro}
         >
-            <div className='channel-intro__text'>
+            <p className='channel-intro__text'>
                 <FormattedMessage
                     id='intro_messages.group_message'
                     defaultMessage='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.'
                 />
-            </div>
+            </p>
         </div>
     );
 }
@@ -278,7 +278,7 @@ function createDMIntroMessage(
                         disablePopover={false}
                     />
                 </h2>
-                <div className='channel-intro__text'>
+                <p className='channel-intro__text'>
                     <FormattedMarkdownMessage
                         id='intro_messages.DM'
                         defaultMessage='This is the start of your direct message history with {teammate}. Messages and files shared here are not shown to anyone else.'
@@ -286,7 +286,7 @@ function createDMIntroMessage(
                             teammate: teammateName,
                         }}
                     />
-                </div>
+                </p>
                 {actionButtons}
             </div>
         );
@@ -297,12 +297,12 @@ function createDMIntroMessage(
             id={channelIntroId}
             className={'channel-intro ' + centeredIntro}
         >
-            <div className='channel-intro__text'>
+            <p className='channel-intro__text'>
                 <FormattedMessage
                     id='intro_messages.teammate'
                     defaultMessage='This is the start of your direct message history with this teammate. Messages and files shared here are not shown to anyone else.'
                 />
-            </div>
+            </p>
         </div>
     );
 }
@@ -371,7 +371,7 @@ function createOffTopicIntroMessage(
             <h2 className='channel-intro__title'>
                 {channel.display_name}
             </h2>
-            <div className='channel-intro__text'>
+            <p className='channel-intro__text'>
                 <FormattedMessage
                     id='intro_messages.offTopic'
                     defaultMessage='This is the start of {display_name}, a channel for non-work-related conversations.'
@@ -379,7 +379,7 @@ function createOffTopicIntroMessage(
                         display_name: channel.display_name,
                     }}
                 />
-            </div>
+            </p>
             {actionButtons}
         </div>
     );
@@ -488,7 +488,7 @@ function createDefaultIntroMessage(
             <h2 className='channel-intro__title'>
                 {channel.display_name}
             </h2>
-            <div className='channel-intro__text'>
+            <p className='channel-intro__text'>
                 {!isReadOnly &&
                     <FormattedMessage
                         id='intro_messages.default'
@@ -507,7 +507,7 @@ function createDefaultIntroMessage(
                         }}
                     />
                 }
-            </div>
+            </p>
             {actionButtons}
         </div>
     );
@@ -538,14 +538,20 @@ function createStandardIntroMessage(
         memberMessage = (
             <FormattedMessage
                 id='intro_messages.onlyInvited'
-                defaultMessage=' Only invited members can see this private channel.'
+                defaultMessage='This is the start of {display_name}. Only invited members can see this private channel.'
+                values={{
+                    display_name: channel.display_name,
+                }}
             />
         );
     } else {
         memberMessage = (
             <FormattedMessage
                 id='intro_messages.anyMember'
-                defaultMessage=' Any member can join and read this channel.'
+                defaultMessage='This is the start of {display_name}. Any team member can join and read this channel.'
+                values={{
+                    display_name: channel.display_name,
+                }}
             />
         );
     }
@@ -565,7 +571,7 @@ function createStandardIntroMessage(
             createMessage = (
                 <FormattedMessage
                     id='intro_messages.noCreatorPrivate'
-                    defaultMessage='This is the start of the {name} private channel, created on {date}.'
+                    defaultMessage='Private channel created on {date}.'
                     values={{name: (uiName), date}}
                 />
             );
@@ -573,7 +579,7 @@ function createStandardIntroMessage(
             createMessage = (
                 <FormattedMessage
                     id='intro_messages.noCreator'
-                    defaultMessage='This is the start of the {name} channel, created on {date}.'
+                    defaultMessage='Public channel created on {date}.'
                     values={{name: (uiName), date}}
                 />
             );
@@ -583,7 +589,7 @@ function createStandardIntroMessage(
             <span>
                 <FormattedMessage
                     id='intro_messages.creatorPrivate'
-                    defaultMessage='This is the start of the {name} private channel, created by {creator} on {date}.'
+                    defaultMessage='Private channel created by {creator} on {date}.'
                     values={{
                         name: (uiName),
                         creator: (creatorName),
@@ -597,7 +603,7 @@ function createStandardIntroMessage(
             <span>
                 <FormattedMessage
                     id='intro_messages.creator'
-                    defaultMessage='This is the start of the {name} channel, created by {creator} on {date}.'
+                    defaultMessage='Public channel created by {creator} on {date}.'
                     values={{
                         name: (uiName),
                         creator: (creatorName),
@@ -610,17 +616,6 @@ function createStandardIntroMessage(
 
     let purposeMessage;
     if (channel.purpose && channel.purpose !== '') {
-        if (channel.type === Constants.PRIVATE_CHANNEL) {
-            purposeMessage = (
-                <span>
-                    <FormattedMessage
-                        id='intro_messages.purposePrivate'
-                        defaultMessage=" This private channel's purpose is: {purpose}"
-                        values={{purpose: channel.purpose}}
-                    />
-                </span>
-            );
-        } else if (channel.type === Constants.OPEN_CHANNEL) {
         purposeMessage = (
             <span>
                 <FormattedMessage
@@ -631,7 +626,6 @@ function createStandardIntroMessage(
             </span>
         );
     }
-    }
 
     const isPrivate = channel.type === Constants.PRIVATE_CHANNEL;
     let setHeaderButton = null;
@@ -689,10 +683,10 @@ function createStandardIntroMessage(
                 {isPrivate ? <LockOutlineIcon size={14}/> : <GlobeIcon size={14}/>}
                 {createMessage}
             </div>
-            <div className='channel-intro__text'>
+            <p className='channel-intro__text'>
                 {memberMessage}
                 {purposeMessage}
-            </div>
+            </p>
             {actionButtons}
         </div>
     );

webapp/channels/src/i18n/en.json

@@ -3968,7 +3968,7 @@
   "interactive_dialog.submit": "Submit",
   "interactive_dialog.submitting": "Submitting...",
   "intro_messages.addGroupsToTeam": "Add other groups to this team",
-  "intro_messages.anyMember": " Any member can join and read this channel.",
+  "intro_messages.anyMember": "This is the start of {display_name}. Any team member can join and read this channel.",
   "intro_messages.creator": "Public channel created by {creator} on {date}.",
   "intro_messages.creatorPrivate": "Private channel created by {creator} on {date}.",
   "intro_messages.default": "Welcome to {display_name}. Post messages here that you want everyone to see. Everyone automatically becomes a member of this channel when they join the team.",
@@ -3982,13 +3982,12 @@
   "intro_messages.inviteMembersToChannel.button": "Add people",
   "intro_messages.inviteOthers": "Invite others to this team",
   "intro_messages.inviteOthersToWorkspace.button": "Invite others to the workspace",
-  "intro_messages.noCreator": "This is the start of the {name} channel, created on {date}.",
+  "intro_messages.noCreator": "Public channel created on {date}.",
-  "intro_messages.noCreatorPrivate": "This is the start of the {name} private channel, created on {date}.",
+  "intro_messages.noCreatorPrivate": "Private channel created on {date}.",
   "intro_messages.notificationPreferences": "Notifications",
   "intro_messages.offTopic": "This is the start of {display_name}, a channel for non-work-related conversations.",
-  "intro_messages.onlyInvited": " Only invited members can see this private channel.",
+  "intro_messages.onlyInvited": "This is the start of {display_name}. Only invited members can see this private channel.",
   "intro_messages.purpose": " This channel's purpose is: {purpose}",
-  "intro_messages.purposePrivate": " This private channel's purpose is: {purpose}",
   "intro_messages.readonly.default": "Welcome to {display_name}. Messages can only be posted by admins. Everyone automatically becomes a permanent member of this channel when they join the team.",
   "intro_messages.setHeader": "Set header",
   "intro_messages.teammate": "This is the start of your direct message history with this teammate. Messages and files shared here are not shown to anyone else.",