feat: add sidepanel fields to CreateTeamModal

RocketChat · Aug 8, 2024 · 3dcfaaa · 3dcfaaa
1 parent 740ea0b
commit 3dcfaaa
Show file tree

Hide file tree

Showing 2 changed files with 57 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 { SidepanelItem } from '@rocket.chat/core-typings';
 import {
 	Box,
 	Button,
@@ -40,6 +41,8 @@ type CreateTeamModalInputs = {
 	encrypted: boolean;
 	broadcast: boolean;
 	members?: string[];
+	showDiscussions?: boolean;
+	showChannels?: boolean;
 };
 
 type CreateTeamModalProps = { onClose: () => void };
@@ -50,6 +53,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']);
@@ -94,6 +98,8 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 			encrypted: (e2eEnabledForPrivateByDefault as boolean) ?? false,
 			broadcast: false,
 			members: [],
+			showChannels: false,
+			showDiscussions: false,
 		},
 	});
 
@@ -123,7 +129,10 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 		topic,
 		broadcast,
 		encrypted,
+		showChannels,
+		showDiscussions,
 	}: CreateTeamModalInputs): Promise<void> => {
+		const sidepanelItem = [showChannels && 'channels', showDiscussions && 'discussions'].filter(Boolean) as [SidepanelItem, SidepanelItem?];
 		const params = {
 			name,
 			members,
@@ -136,6 +145,7 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 					encrypted,
 				},
 			},
+			...(showChannels && { sidepanel: { items: sidepanelItem } }),
 		};
 
 		try {
@@ -157,6 +167,8 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 	const encryptedId = useUniqueId();
 	const broadcastId = useUniqueId();
 	const addMembersId = useUniqueId();
+	const showChannelsId = useUniqueId();
+	const showDiscussionsId = useUniqueId();
 
 	return (
 		<Modal
@@ -237,6 +249,48 @@ const CreateTeamModal = ({ onClose }: CreateTeamModalProps) => {
 				<Accordion>
 					<AccordionItem title={t('Advanced_settings')}>
 						<FieldGroup>
+							<Box is='h5' fontScale='h5' color='titles-labels'>
+								{t('Navigation')}
+							</Box>
+							<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>
 							<Box is='h5' fontScale='h5' color='titles-labels'>
 								{t('Security_and_permissions')}
 							</Box>

diff --git a/packages/i18n/src/locales/en.i18n.json b/packages/i18n/src/locales/en.i18n.json
@@ -6501,5 +6501,7 @@
   "Advanced_settings": "Advanced settings",
   "Security_and_permissions": "Security and permissions",
   "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"
 }