feat: added settings to swap between conversation and message visuali…

…zation
zextras · Mar 28, 2022 · 3d9d11a · 3d9d11a
1 parent 55b8292
commit 3d9d11a
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 2 deletions.
diff --git a/src/views/settings/displaying-messages-settings.jsx b/src/views/settings/displaying-messages-settings.jsx
@@ -10,7 +10,9 @@ import {
 	FormSubSection,
 	Select,
 	Input,
-	Checkbox
+	Checkbox,
+	RadioGroup,
+	Radio
 } from '@zextras/carbonio-design-system';
 import Heading from './components/settings-heading';
 import {
@@ -132,6 +134,24 @@ export default function DisplayingMessagesSettings({ t, settingsObj, updateSetti
 					}
 				/>
 			</Container>
+			<Container crossAlignment="baseline" padding={{ all: 'small' }}>
+				<Heading title={t('settings.label.visualization_options', 'Visualization Options')} />
+				<RadioGroup
+					style={{ width: '100%' }}
+					value={settingsObj.zimbraPrefGroupMailBy}
+					mainAlignment="flex-start"
+					onChange={(newValue) => {
+						updateSettings({ target: { name: 'zimbraPrefGroupMailBy', value: newValue } });
+					}}
+				>
+					<Radio
+						width="100%"
+						label={t('label.by_conversation', 'By Conversation')}
+						value="conversation"
+					/>
+					<Radio width="100%" label={t('label.by_message', 'By Message')} value="message" />
+				</RadioGroup>
+			</Container>
 			<Container crossAlignment="baseline" padding={{ all: 'small' }}>
 				<Heading title={t('settings.label.default_mail_search', 'Default Mail Search')} />
 				<Input

diff --git a/translations/en.json b/translations/en.json
@@ -189,6 +189,8 @@
         "automatically_delete_duplicates": "Automatically delete duplicate copies of the same message when received",
         "back": "Back",
         "bcc": "Bcc",
+        "by_conversation": "By Conversation",
+        "by_message": "By Message",
         "calendar_color": "Item color",
         "cancel": "Cancel",
         "cc": "Cc",
@@ -441,7 +443,8 @@
             "message_color": "Message Color",
             "message_selection": "Message Selection",
             "search_query": "Default query",
-            "set_message_color": "Set color of messages and conversations according to tag color."
+            "set_message_color": "Set color of messages and conversations according to tag color.",
+            "visualization_options": "Visualization Options"
         },
         "linkedin_msg": "LinkedIn messages and connections",
         "localpart": "localpart",