Bug 1936379 - Add new browser layout section to about:preferences, remove Labs sidebar section. r=sidebar-reviewers,fluent-reviewers,settings-reviewers,sclements,Gijs,bolsson

Differential Revision: https://phabricator.services.mozilla.com/D235715

browser/components/preferences/main.inc.xhtml

@@ -161,6 +161,23 @@
     </vbox>
 </groupbox>
 
+<!-- Browser layout -->
+<groupbox data-category="paneGeneral"
+          hidden="true">
+  <label><html:h2 data-l10n-id="browser-layout-header"/></label>
+
+  <radiogroup id="browserLayoutRadioGroup" preference="sidebar.verticalTabs">
+    <radio id="browserLayoutHorizontalTabs" data-l10n-id="browser-layout-horizontal-tabs" value="false"/>
+    <description  class="indent" data-l10n-id="browser-layout-horizontal-tabs-desc"></description>
+
+    <radio id="browserLayoutVerticalTabs" data-l10n-id="browser-layout-vertical-tabs" value="true" />
+    <description class="indent" data-l10n-id="browser-layout-vertical-tabs-desc"></description>
+  </radiogroup>
+  <checkbox id="browserLayoutShowSidebar" data-l10n-id="browser-layout-show-sidebar"
+            preference="sidebar.revamp"/>
+  <description class="indent" data-l10n-id="browser-layout-show-sidebar-desc"></description>
+</groupbox>
+
 <hbox id="languageAndAppearanceCategory"
       class="subcategory"
       hidden="true"

browser/components/preferences/main.js

@@ -90,6 +90,9 @@ Preferences.addAll([
   { id: "browser.tabs.hoverPreview.enabled", type: "bool" },
   { id: "browser.tabs.hoverPreview.showThumbnails", type: "bool" },
 
+  { id: "sidebar.verticalTabs", type: "bool" },
+  { id: "sidebar.revamp", type: "bool" },
+
   // CFR
   {
     id: "browser.newtabpage.activity-stream.asrouter.userprefs.cfr.addons",

browser/locales/en-US/browser/preferences/preferences.ftl

@@ -251,6 +251,21 @@ settings-tabs-show-image-in-preview =
     .label = Show an image preview when you hover on a tab
     .accessKey = h
 
+
+browser-layout-header = Browser Layout
+
+browser-layout-horizontal-tabs =
+    .label = Horizontal tabs
+browser-layout-horizontal-tabs-desc = Display at top of browser
+
+browser-layout-vertical-tabs =
+    .label = Vertical tabs
+browser-layout-vertical-tabs-desc = Display on the side, in the sidebar
+
+browser-layout-show-sidebar =
+    .label = Show sidebar
+browser-layout-show-sidebar-desc = Quickly access bookmarks, tabs from your phone, AI chatbots, and more without leaving your main view.
+
 ## General Section - Language & Appearance
 
 language-and-appearance-header = Language and Appearance

toolkit/components/featuregates/Features.toml

@@ -14,30 +14,6 @@
 # based on the order of appearance in this file. Settings within
 # a group will also be determined by their order in this file.
 
-[sidebar]
-group = "experimental-features-group-customize-browsing"
-title = "sidebar-title"
-description = "sidebar-description"
-description-links = {connect= "https://connect.mozilla.org/t5/discussions/firefox-sidebar-and-vertical-tabs-try-them-out-in-nightly/m-p/63231#M22243"}
-restart-required = false
-preference = "sidebar.revamp"
-type = "boolean"
-bug-numbers = [1906140]
-is-public-jexl = "nightly_build"
-default-value-jexl = "false"
-
-[vertical-tabs]
-group = "experimental-features-group-customize-browsing"
-title = "vertical-tabs-title"
-description = "vertical-tabs-description"
-description-links = {connect= "https://connect.mozilla.org/t5/discussions/firefox-sidebar-and-vertical-tabs-try-them-out-in-nightly/m-p/63231#M22243"}
-restart-required = false
-preference = "sidebar.verticalTabs"
-type = "boolean"
-bug-numbers = [1906140]
-is-public-jexl = "nightly_build"
-default-value-jexl = "false"
-
 [genai-chat]
 group = "experimental-features-group-customize-browsing"
 title = "genai-settings-chat-title"

toolkit/locales/en-US/toolkit/featuregates/features.ftl

@@ -43,14 +43,6 @@ experimental-features-auto-pip-description = Enable Picture-in-Picture on active
 genai-settings-chat-title =
     .label = AI chatbot
 
-# Updated sidebar settings
-sidebar-title =
-    .label = Sidebar
-sidebar-description = Easily access your history, tabs from other devices, sidebar extensions, and more as you browse. <a data-l10n-name="connect">Share feedback</a>
-vertical-tabs-title =
-    .label = Vertical tabs
-vertical-tabs-description = Move your tabs from the top of the browser to the side. Requires you also try the sidebar. <a data-l10n-name="connect">Share feedback</a>
-
 experimental-features-group-developer-tools =
   .label = Developer Tools
 experimental-features-group-webpage-display =