settings: Improve visibility of "Enter Sends Message" setting.

Addresses user research feedback by duplicating the "Enter Sends
Message" setting in the Settings > Preferences menu, specifically within
the General section, ensuring users can easily locate and configure
this option.

server_events_dispatch: Remove break statement.
The settings page needs to be updated when
`enter_sends` property is updated.

css: Update vertical-align to middle for the checkbox element.

Co-authored-by: Akarsh Jain<akarsh.jain.790@gmail.com>.

web/src/server_events_dispatch.js

@@ -853,7 +853,6 @@ export function dispatch_normal_event(event) {
             }
             if (event.property === "enter_sends") {
                 user_settings.enter_sends = event.value;
-                break;
             }
             if (event.property === "presence_enabled") {
                 user_settings.presence_enabled = event.value;

web/src/settings_config.ts

@@ -561,6 +561,9 @@ export const preferences_settings_labels = {
     ),
     fluid_layout_width: $t({defaultMessage: "Use full width on wide screens"}),
     high_contrast_mode: $t({defaultMessage: "High contrast mode"}),
+    enter_sends: new Handlebars.SafeString(
+        $t_html({defaultMessage: "<kbd>Enter</kbd> sends when composing a message"}),
+    ),
     receives_typing_notifications: $t({defaultMessage: "Show when other users are typing"}),
     starred_message_counts: $t({defaultMessage: "Show counts for starred messages"}),
     twenty_four_hour_time: $t({defaultMessage: "Time format"}),

web/styles/components.css

@@ -50,6 +50,10 @@
         }
     }
 
+    & label.checkbox:has(.enter_sends) {
+        vertical-align: middle;
+    }
+
     & a.no-style {
         color: inherit;
     }

web/styles/dark_theme.css

@@ -89,15 +89,18 @@
         box-shadow: inset 0 1px 0 hsl(0deg 0% 0% / 20%);
     }
 
-    .enter_sends_choices {
-        color: hsl(236deg 33% 90%);
-
+    .enter_sends_choices,
+    #user_enter_sends_label {
         & kbd {
             background-color: hsl(211deg 29% 14%);
             border-color: hsl(211deg 29% 14%);
             text-shadow: none;
             color: hsl(236deg 33% 90%);
         }
+    }
+
+    .enter_sends_choices {
+        color: hsl(236deg 33% 90%);
 
         .enter_sends_minor {
             color: hsl(0deg 0% 80%);

web/styles/settings.css

@@ -518,6 +518,17 @@ input[type="checkbox"] {
     }
 }
 
+#user_enter_sends_label kbd {
+    /* 14px at 15px/1em */
+    font-size: 0.9333em;
+    font-style: normal;
+    font-weight: 500;
+    color: hsl(0deg 0% 40%);
+    position: relative;
+    bottom: 1px;
+    margin: 0 2px;
+}
+
 .edit-attachment-buttons {
     display: inline-block;
     vertical-align: middle;

web/templates/settings/organization_user_settings_defaults.hbs

@@ -49,16 +49,4 @@
             </select>
         </div>
     </div>
-
-    <div class="other_settings settings-subsection-parent">
-        <div class="subsection-header inline-block">
-            <h3 class="inline-block">{{t "Other settings" }}</h3>
-            {{> settings_save_discard_widget section_name="other-setting" show_only_indicator=false }}
-        </div>
-        {{> settings_checkbox
-          setting_name="enter_sends"
-          is_checked=settings_object.enter_sends
-          label=settings_label.realm_enter_sends
-          prefix="realm_"}}
-    </div>
 </div>

web/templates/settings/preferences_general.hbs

@@ -28,6 +28,12 @@
         </select>
     </div>
 
+    {{> settings_checkbox
+      setting_name="enter_sends"
+      is_checked=settings_object.enter_sends
+      label=settings_label.enter_sends
+      prefix=prefix}}
+
     {{> settings_checkbox
       setting_name="dense_mode"
       is_checked=settings_object.dense_mode