Change preferences page into appearance, notifications, and other (#10977)

5 files changed, 53 insertions, 42 deletions

diff --git a/app/views/layouts/mailer.html.haml b/app/views/layouts/mailer.html.haml
index 4ffe3d79a..343bcb265 100644
--- a/app/views/layouts/mailer.html.haml
+++ b/app/views/layouts/mailer.html.haml
@@ -46,7 +46,7 @@
                             %tbody
                               %td.column-cell
                                 %p= t 'about.hosted_on', domain: site_hostname
-                                %p= link_to t('application_mailer.notification_preferences'), settings_notifications_url
+                                %p= link_to t('application_mailer.notification_preferences'), settings_preferences_notifications_url
                               %td.column-cell.text-right
                                 = link_to root_url do
                                   = image_tag full_pack_url('media/images/mailer/logo_transparent.png'), alt: 'Mastodon', height: 24
diff --git a/app/views/settings/preferences/appearance/show.html.haml b/app/views/settings/preferences/appearance/show.html.haml
new file mode 100644
index 000000000..10f009264
--- /dev/null
+++ b/app/views/settings/preferences/appearance/show.html.haml
@@ -0,0 +1,41 @@
+- content_for :page_title do
+  = t('settings.appearance')
+
+= simple_form_for current_user, url: settings_preferences_appearance_path, html: { method: :put } do |f|
+  .fields-row
+    .fields-group.fields-row__column.fields-row__column-6
+      = f.input :locale, collection: I18n.available_locales, wrapper: :with_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }, selected: I18n.locale, hint: false
+    .fields-group.fields-row__column.fields-row__column-6
+      = f.input :setting_theme, collection: Themes.instance.names, label_method: lambda { |theme| I18n.t("themes.#{theme}", default: theme) }, wrapper: :with_label, include_blank: false, hint: false
+
+  %h4= t 'appearance.advanced_web_interface'
+
+  %p.hint= t 'appearance.advanced_web_interface_hint'
+
+  .fields-group
+    = f.input :setting_advanced_layout, as: :boolean, wrapper: :with_label, hint: false
+
+  %h4= t 'appearance.animations_and_accessibility'
+
+  .fields-group
+    = f.input :setting_auto_play_gif, as: :boolean, wrapper: :with_label, recommended: true
+    = f.input :setting_reduce_motion, as: :boolean, wrapper: :with_label
+    = f.input :setting_system_font_ui, as: :boolean, wrapper: :with_label
+
+  %h4= t 'appearance.confirmation_dialogs'
+
+  .fields-group
+    = f.input :setting_unfollow_modal, as: :boolean, wrapper: :with_label
+    = f.input :setting_boost_modal, as: :boolean, wrapper: :with_label
+    = f.input :setting_delete_modal, as: :boolean, wrapper: :with_label
+
+  %h4= t 'appearance.sensitive_content'
+
+  .fields-group
+    = f.input :setting_display_media, collection: ['default', 'show_all', 'hide_all'],label_method: lambda { |item| t("simple_form.hints.defaults.setting_display_media_#{item}") }, hint: false, as: :radio_buttons, collection_wrapper_tag: 'ul', item_wrapper_tag: 'li', wrapper: :with_floating_label
+
+  .fields-group
+    = f.input :setting_expand_spoilers, as: :boolean, wrapper: :with_label
+
+  .actions
+    = f.button :button, t('generic.save_changes'), type: :submit
diff --git a/app/views/settings/notifications/show.html.haml b/app/views/settings/preferences/notifications/show.html.haml
index 6ec57b502..acc646fc3 100644
--- a/app/views/settings/notifications/show.html.haml
+++ b/app/views/settings/preferences/notifications/show.html.haml
@@ -1,7 +1,7 @@
 - content_for :page_title do
   = t('settings.notifications')
 
-= simple_form_for current_user, url: settings_notifications_path, html: { method: :put } do |f|
+= simple_form_for current_user, url: settings_preferences_notifications_path, html: { method: :put } do |f|
   = render 'shared/error_messages', object: current_user
 
   .fields-group
diff --git a/app/views/settings/preferences/show.html.haml b/app/views/settings/preferences/show.html.haml
index 35b660a68..c966a16bc 100644
--- a/app/views/settings/preferences/show.html.haml
+++ b/app/views/settings/preferences/show.html.haml
@@ -1,34 +1,9 @@
 - content_for :page_title do
   = t('settings.preferences')
 
-%ul.quick-nav
-  %li= link_to t('preferences.languages'), '#settings_languages'
-  %li= link_to t('preferences.publishing'), '#settings_publishing'
-  %li= link_to t('preferences.other'), '#settings_other'
-  %li= link_to t('preferences.web'), '#settings_web'
-  %li= link_to t('settings.notifications'), settings_notifications_path
-
 = simple_form_for current_user, url: settings_preferences_path, html: { method: :put } do |f|
   = render 'shared/error_messages', object: current_user
 
-  .fields-row#settings_languages
-    .fields-group.fields-row__column.fields-row__column-6
-      = f.input :locale, collection: I18n.available_locales, wrapper: :with_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }, selected: I18n.locale
-    .fields-group.fields-row__column.fields-row__column-6
-      = f.input :setting_default_language, collection: [nil] + filterable_languages.sort, wrapper: :with_label, label_method: lambda { |locale| locale.nil? ? I18n.t('statuses.language_detection') : human_locale(locale) }, required: false, include_blank: false
-
-  .fields-group
-    = f.input :chosen_languages, collection: filterable_languages.sort, wrapper: :with_block_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }, required: false, as: :check_boxes, collection_wrapper_tag: 'ul', item_wrapper_tag: 'li'
-
-  %hr#settings_publishing/
-
-  .fields-group
-    = f.input :setting_default_privacy, collection: Status.selectable_visibilities, wrapper: :with_floating_label, include_blank: false, label_method: lambda { |visibility| safe_join([I18n.t("statuses.visibilities.#{visibility}"), content_tag(:span, I18n.t("statuses.visibilities.#{visibility}_long"), class: 'hint')]) }, required: false, as: :radio_buttons, collection_wrapper_tag: 'ul', item_wrapper_tag: 'li'
-
-    = f.input :setting_default_sensitive, as: :boolean, wrapper: :with_label
-
-  %hr#settings_other/
-
   .fields-group
     = f.input :setting_noindex, as: :boolean, wrapper: :with_label
 
@@ -36,32 +11,27 @@
     = f.input :setting_hide_network, as: :boolean, wrapper: :with_label
 
   .fields-group
-    = f.input :setting_show_application, as: :boolean, wrapper: :with_label
+    = f.input :setting_aggregate_reblogs, as: :boolean, wrapper: :with_label, recommended: true
 
-  %hr#settings_web/
+  %h4= t 'preferences.posting_defaults'
 
   .fields-row
     .fields-group.fields-row__column.fields-row__column-6
-      = f.input :setting_theme, collection: Themes.instance.names, label_method: lambda { |theme| I18n.t("themes.#{theme}", default: theme) }, wrapper: :with_label, include_blank: false, hint: false
+      = f.input :setting_default_privacy, collection: Status.selectable_visibilities, wrapper: :with_label, include_blank: false, label_method: lambda { |visibility| safe_join([I18n.t("statuses.visibilities.#{visibility}"), I18n.t("statuses.visibilities.#{visibility}_long")], ' - ') }, required: false, hint: false
+
     .fields-group.fields-row__column.fields-row__column-6
-      = f.input :setting_display_media, collection: ['default', 'show_all', 'hide_all'], wrapper: :with_label, include_blank: false, label_method: lambda { |item| t("simple_form.hints.defaults.setting_display_media_#{item}") }, hint: false
+      = f.input :setting_default_language, collection: [nil] + filterable_languages.sort, wrapper: :with_label, label_method: lambda { |locale| locale.nil? ? I18n.t('statuses.language_detection') : human_locale(locale) }, required: false, include_blank: false, hint: false
 
   .fields-group
-    = f.input :setting_advanced_layout, as: :boolean, wrapper: :with_label
+    = f.input :setting_default_sensitive, as: :boolean, wrapper: :with_label
 
   .fields-group
-    = f.input :setting_unfollow_modal, as: :boolean, wrapper: :with_label
-    = f.input :setting_boost_modal, as: :boolean, wrapper: :with_label
-    = f.input :setting_delete_modal, as: :boolean, wrapper: :with_label
+    = f.input :setting_show_application, as: :boolean, wrapper: :with_label, recommended: true
 
-  .fields-group
-    = f.input :setting_aggregate_reblogs, as: :boolean, wrapper: :with_label
+  %h4= t 'preferences.public_timelines'
 
   .fields-group
-    = f.input :setting_auto_play_gif, as: :boolean, wrapper: :with_label
-    = f.input :setting_expand_spoilers, as: :boolean, wrapper: :with_label
-    = f.input :setting_reduce_motion, as: :boolean, wrapper: :with_label
-    = f.input :setting_system_font_ui, as: :boolean, wrapper: :with_label
+    = f.input :chosen_languages, collection: filterable_languages.sort, wrapper: :with_block_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }, required: false, as: :check_boxes, collection_wrapper_tag: 'ul', item_wrapper_tag: 'li'
 
   .actions
     = f.button :button, t('generic.save_changes'), type: :submit
diff --git a/app/views/settings/profiles/show.html.haml b/app/views/settings/profiles/show.html.haml
index 8ffb01824..f8a8fddd3 100644
--- a/app/views/settings/profiles/show.html.haml
+++ b/app/views/settings/profiles/show.html.haml
@@ -28,7 +28,7 @@
 
   - if Setting.profile_directory
     .fields-group
-      = f.input :discoverable, as: :boolean, wrapper: :with_label, hint: t('simple_form.hints.defaults.discoverable_html', min_followers: Account::MIN_FOLLOWERS_DISCOVERY, path: explore_path)
+      = f.input :discoverable, as: :boolean, wrapper: :with_label, hint: t('simple_form.hints.defaults.discoverable_html', min_followers: Account::MIN_FOLLOWERS_DISCOVERY, path: explore_path), recommended: true
 
   %hr.spacer/