diff --git a/.changeset/brown-singers-appear.md b/.changeset/brown-singers-appear.md new file mode 100644 index 000000000000..8a9a69f225ac --- /dev/null +++ b/.changeset/brown-singers-appear.md @@ -0,0 +1,7 @@ +--- +'@rocket.chat/ui-client': minor +'@rocket.chat/i18n': minor +'@rocket.chat/meteor': minor +--- + +added `sidepanelNavigation` to feature preview list diff --git a/apps/meteor/client/views/account/featurePreview/AccountFeaturePreviewPage.tsx b/apps/meteor/client/views/account/featurePreview/AccountFeaturePreviewPage.tsx index c8cd7138e5a6..dd9ab6a90959 100644 --- a/apps/meteor/client/views/account/featurePreview/AccountFeaturePreviewPage.tsx +++ b/apps/meteor/client/views/account/featurePreview/AccountFeaturePreviewPage.tsx @@ -24,6 +24,21 @@ import { useForm } from 'react-hook-form'; import { Page, PageHeader, PageScrollableContentWithShadow, PageFooter } from '../../../components/Page'; +const handleEnableQuery = (features: FeaturePreviewProps[]) => { + return features.map((item) => { + if (item.enableQuery) { + const expected = item.enableQuery.value; + const received = features.find((el) => el.name === item.enableQuery?.name)?.value; + if (expected !== received) { + item.disabled = true; + item.value = false; + } else { + item.disabled = false; + } + } + return item; + }); +}; const AccountFeaturePreviewPage = () => { const t = useTranslation(); const dispatchToastMessage = useToastMessageDispatch(); @@ -71,7 +86,7 @@ const AccountFeaturePreviewPage = () => { }; const grouppedFeaturesPreview = Object.entries( - featuresPreview.reduce((result, currentValue) => { + handleEnableQuery(featuresPreview).reduce((result, currentValue) => { (result[currentValue.group] = result[currentValue.group] || []).push(currentValue); return result; }, {} as Record), @@ -108,7 +123,13 @@ const AccountFeaturePreviewPage = () => { {t(feature.i18n)} - + {feature.description && {t(feature.description)}} diff --git a/packages/i18n/src/locales/en.i18n.json b/packages/i18n/src/locales/en.i18n.json index 159c1641e05e..b28b1fc2bfde 100644 --- a/packages/i18n/src/locales/en.i18n.json +++ b/packages/i18n/src/locales/en.i18n.json @@ -6533,5 +6533,9 @@ "Sidebar_Sections_Order_Description": "Select the categories in your preferred order", "Incoming_Calls": "Incoming calls", "Advanced_settings": "Advanced settings", - "Security_and_permissions": "Security and permissions" + "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.", + "Show_channels_description": "Show team channels in second sidebar", + "Show_discussions_description": "Show team discussions in second sidebar" } diff --git a/packages/ui-client/src/hooks/useFeaturePreviewList.ts b/packages/ui-client/src/hooks/useFeaturePreviewList.ts index 4e79eebbd13a..172045197f8c 100644 --- a/packages/ui-client/src/hooks/useFeaturePreviewList.ts +++ b/packages/ui-client/src/hooks/useFeaturePreviewList.ts @@ -6,7 +6,8 @@ export type FeaturesAvailable = | 'navigationBar' | 'enable-timestamp-message-parser' | 'contextualbarResizable' - | 'newNavigation'; + | 'newNavigation' + | 'sidepanelNavigation'; export type FeaturePreviewProps = { name: FeaturesAvailable; @@ -16,6 +17,11 @@ export type FeaturePreviewProps = { imageUrl?: string; value: boolean; enabled: boolean; + disabled?: boolean; + enableQuery?: { + name: FeaturesAvailable; + value: boolean; + }; }; export const defaultFeaturesPreview: FeaturePreviewProps[] = [ @@ -60,6 +66,18 @@ export const defaultFeaturesPreview: FeaturePreviewProps[] = [ value: false, enabled: true, }, + { + name: 'sidepanelNavigation', + i18n: 'Sidepanel_navigation', + description: 'Sidepanel_navigation_description', + group: 'Navigation', + value: false, + enabled: false, + enableQuery: { + name: 'newNavigation', + value: true, + }, + }, ]; export const enabledDefaultFeatures = defaultFeaturesPreview.filter((feature) => feature.enabled);