From 510136a1921701470f8b23269d697ee996f27beb Mon Sep 17 00:00:00 2001
From: Harshil Sharma <18575143+harshilsharma63@users.noreply.github.com>
Date: Fri, 6 Oct 2023 01:09:12 +0530
Subject: [PATCH] Fixed a bug where channel URL preview used incorrect team
 (#24705)

---
 .../channel_name_form_field.tsx                   |  6 +++++-
 .../convert_gm_to_channel_modal.test.tsx          | 15 ++++++++-------
 .../convert_gm_to_channel_modal.tsx               |  1 +
 3 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/webapp/channels/src/components/channel_name_form_field/channel_name_form_field.tsx b/webapp/channels/src/components/channel_name_form_field/channel_name_form_field.tsx
index c691236d22..508dd40f07 100644
--- a/webapp/channels/src/components/channel_name_form_field/channel_name_form_field.tsx
+++ b/webapp/channels/src/components/channel_name_form_field/channel_name_form_field.tsx
@@ -5,6 +5,8 @@ import React, {useCallback, useEffect, useRef, useState} from 'react';
 import {useIntl} from 'react-intl';
 import {useSelector} from 'react-redux';
 
+import type {Team} from '@mattermost/types/teams';
+
 import {getCurrentTeam} from 'mattermost-redux/selectors/entities/teams';
 
 import type {CustomMessageInputType} from 'components/widgets/inputs/input/input';
@@ -23,6 +25,7 @@ export type Props = {
     onURLChange: (url: string) => void;
     autoFocus?: boolean;
     onErrorStateChange?: (isError: boolean) => void;
+    team?: Team;
 }
 
 import './channel_name_form_field.scss';
@@ -58,6 +61,7 @@ const ChannelNameFormField = (props: Props): JSX.Element => {
     const [inputCustomMessage, setInputCustomMessage] = useState<CustomMessageInputType | null>(null);
 
     const {name: currentTeamName} = useSelector(getCurrentTeam);
+    const teamName = props.team ? props.team.name : currentTeamName;
 
     const handleOnDisplayNameChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
         e.preventDefault();
@@ -131,7 +135,7 @@ const ChannelNameFormField = (props: Props): JSX.Element => {
             <URLInput
                 className='new-channel-modal__url'
                 base={getSiteURL()}
-                path={`${currentTeamName}/channels`}
+                path={`${teamName}/channels`}
                 pathInfo={url}
                 limit={Constants.MAX_CHANNELNAME_LENGTH}
                 shortenLength={Constants.DEFAULT_CHANNELURL_SHORTEN_LENGTH}
diff --git a/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.test.tsx b/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.test.tsx
index ce1378cda3..4f4d680909 100644
--- a/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.test.tsx
+++ b/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.test.tsx
@@ -44,8 +44,8 @@ describe('component/ConvertGmToChannelModal', () => {
         entities: {
             teams: {
                 teams: {
-                    team_id_1: {id: 'team_id_1', display_name: 'Team 1'} as Team,
-                    team_id_2: {id: 'team_id_2', display_name: 'Team 2'} as Team,
+                    team_id_1: {id: 'team_id_1', display_name: 'Team 1', name: 'team_1'} as Team,
+                    team_id_2: {id: 'team_id_2', display_name: 'Team 2', name: 'team_2'} as Team,
                 },
                 currentTeamId: 'team_id_1',
             },
@@ -57,8 +57,8 @@ describe('component/ConvertGmToChannelModal', () => {
         nock(Client4.getBaseRoute()).
             get('/channels/channel_id_1/common_teams').
             reply(200, [
-                {id: 'team_id_1', display_name: 'Team 1'},
-                {id: 'team_id_2', display_name: 'Team 2'},
+                {id: 'team_id_1', display_name: 'Team 1', name: 'team_1'},
+                {id: 'team_id_2', display_name: 'Team 2', name: 'team_2'},
             ]);
 
         renderWithFullContext(
@@ -76,6 +76,7 @@ describe('component/ConvertGmToChannelModal', () => {
         expect(screen.queryByText('Select Team')).toBeInTheDocument();
         expect(screen.queryByPlaceholderText('Channel name')).toBeInTheDocument();
         expect(screen.queryByText('Edit')).toBeInTheDocument();
+        expect(screen.queryByText('URL: http://localhost:8065/team_1/channels/')).toBeInTheDocument();
     });
 
     test('members part of single common teams', async () => {
@@ -83,7 +84,7 @@ describe('component/ConvertGmToChannelModal', () => {
         nock(Client4.getBaseRoute()).
             get('/channels/channel_id_1/common_teams').
             reply(200, [
-                {id: 'team_id_1', display_name: 'Team 1'},
+                {id: 'team_id_1', display_name: 'Team 1', name: 'team_1'},
             ]);
 
         renderWithFullContext(
@@ -131,8 +132,8 @@ describe('component/ConvertGmToChannelModal', () => {
         nock(Client4.getBaseRoute()).
             get('/channels/channel_id_1/common_teams').
             reply(200, [
-                {id: 'team_id_1', display_name: 'Team 1'},
-                {id: 'team_id_2', display_name: 'Team 2'},
+                {id: 'team_id_1', display_name: 'Team 1', name: 'team_1'},
+                {id: 'team_id_2', display_name: 'Team 2', name: 'team_2'},
             ]);
 
         baseProps.actions.convertGroupMessageToPrivateChannel.mockResolvedValueOnce({});
diff --git a/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.tsx b/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.tsx
index 801af1630d..8a53832e4e 100644
--- a/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.tsx
+++ b/webapp/channels/src/components/convert_gm_to_channel_modal/convert_gm_to_channel_modal.tsx
@@ -170,6 +170,7 @@ const ConvertGmToChannelModal = (props: Props) => {
                         onDisplayNameChange={setChannelName}
                         onURLChange={handleChannelURLChange}
                         onErrorStateChange={setNameError}
+                        team={selectedTeamId ? commonTeamsById[selectedTeamId] : undefined}
                     />
 
                     {