feat: add sidepanel fields to CreateTeamModal

RocketChat · Jul 29, 2024 · ffb81e8 · ffb81e8
1 parent df70c06
commit ffb81e8
Show file tree

Hide file tree

Showing 2 changed files with 59 additions and 1 deletion.
diff --git a/apps/meteor/client/sidebarv2/header/CreateTeamModal.tsx b/apps/meteor/client/sidebarv2/header/CreateTeamModal.tsx
@@ -1,3 +1,4 @@
+import type { SidepanelItems } from '@rocket.chat/core-typings';
 import {
 	Box,
 	Button,
@@ -38,6 +39,8 @@ type CreateTeamModalInputs = {
 	encrypted: boolean;
 	broadcast: boolean;
 	members?: string[];
+	showDiscussions?: boolean;
+	showChannels?: boolean;
 };
 
 type CreateTeamModalProps = { onClose: () => void };
@@ -48,6 +51,7 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 	const e2eEnabledForPrivateByDefault = useSetting('E2E_Enabled_Default_PrivateRooms');
 	const namesValidation = useSetting('UTF8_Channel_Names_Validation');
 	const allowSpecialNames = useSetting('UI_Allow_room_names_with_special_chars');
+
 	const dispatchToastMessage = useToastMessageDispatch();
 	const canCreateTeam = usePermission('create-team');
 	const canSetReadOnly = usePermissionWithScopedRoles('set-readonly', ['owner']);
@@ -92,6 +96,8 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 			encrypted: (e2eEnabledForPrivateByDefault as boolean) ?? false,
 			broadcast: false,
 			members: [],
+			showChannels: false,
+			showDiscussions: false,
 		},
 	});
 
@@ -121,7 +127,13 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 		topic,
 		broadcast,
 		encrypted,
+		showChannels,
+		showDiscussions,
 	}: CreateTeamModalInputs): Promise<void> => {
+		const sidepanelItems = [showChannels && 'channel', showDiscussions && 'discussion'].filter(Boolean) as [
+			SidepanelItems,
+			SidepanelItems?,
+		];
 		const params = {
 			name,
 			members,
@@ -134,6 +146,7 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 					encrypted,
 				},
 			},
+			...(showChannels && { sidepanel: { items: sidepanelItems } }),
 		};
 
 		try {
@@ -155,6 +168,8 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 	const encryptedId = useUniqueId();
 	const broadcastId = useUniqueId();
 	const addMembersId = useUniqueId();
+	const showChannelsId = useUniqueId();
+	const showDiscussionsId = useUniqueId();
 
 	return (
 		<Modal
@@ -286,6 +301,46 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 						</FieldRow>
 						{broadcast && <FieldDescription id={`${broadcastId}-hint`}>{t('Teams_New_Broadcast_Description')}</FieldDescription>}
 					</Field>
+
+					<Field>
+						<FieldRow>
+							<FieldLabel htmlFor={showChannelsId}>{t('Channels')}</FieldLabel>
+							<Controller
+								control={control}
+								name='showChannels'
+								render={({ field: { onChange, value, ref } }): ReactElement => (
+									<ToggleSwitch
+										aria-describedby={`${showChannelsId}-hint`}
+										id={showChannelsId}
+										onChange={onChange}
+										checked={value}
+										ref={ref}
+									/>
+								)}
+							/>
+						</FieldRow>
+						<FieldDescription id={`${showChannelsId}-hint`}>{t('Show_channels_description')}</FieldDescription>
+					</Field>
+
+					<Field>
+						<FieldRow>
+							<FieldLabel htmlFor={showDiscussionsId}>{t('Discussions')}</FieldLabel>
+							<Controller
+								control={control}
+								name='showDiscussions'
+								render={({ field: { onChange, value, ref } }): ReactElement => (
+									<ToggleSwitch
+										aria-describedby={`${showDiscussionsId}-hint`}
+										id={showDiscussionsId}
+										onChange={onChange}
+										checked={value}
+										ref={ref}
+									/>
+								)}
+							/>
+						</FieldRow>
+						<FieldDescription id={`${showDiscussionsId}-hint`}>{t('Show_discussions_description')}</FieldDescription>
+					</Field>
 				</FieldGroup>
 			</Modal.Content>
 			<Modal.Footer>

diff --git a/packages/i18n/src/locales/en.i18n.json b/packages/i18n/src/locales/en.i18n.json
@@ -6485,5 +6485,8 @@
   "Sidebar_Sections_Order_Description": "Select the categories in your preferred order",
   "Incoming_Calls": "Incoming calls",
   "Sidepanel_navigation": "Sidepanel navigation for teams",
-  "Sidepanel_navigation_description": "Option to open a sidepanel with channels and/or discussions associated with the team. This allows team owners to customize communication methods to best meet their team’s needs. This feature is only available when Enhanced navigation experience is enabled."
+  "Sidepanel_navigation_description": "Option to open a sidepanel with channels and/or discussions associated with the team. This allows team owners to customize communication methods to best meet their team’s needs. This feature is only available when Enhanced navigation experience is enabled.",
+  "Show_channels_description": "Show team channels in second sidebar",
+  "Show_discussions_description": "Show team discussions in second sidebar",
+  "Security_and_permissions": "Security and permissions"
 }