[b4p/Settings] Prepare for chrome://settings/passwords/device

This CL prepares for the introduction of the new page, in order to make
the diff smaller when the page functionality is actually added. It adds
the necessary strings, the new '/device' route and the settings-subpage
component where the new page will be injected.

The route only exists for users with the kEnablePasswordsAccountStorage
feature enabled. The page is not searchable from settings. This is to
avoid users who are not eligible/opted-in to b4p accessing it by
mistake. The page can still be accessed by those users if they type the
URL on the omnibar, as happens for other pages in Settings.

Bug: 1049141
Change-Id: I726549953b28abf9da0d764629d0fab529d9b877
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2228618
Commit-Queue: Victor Vianna <victorvianna@google.com>
Reviewed-by: Jan Wilken Dörrie <jdoerrie@chromium.org>
Reviewed-by: Marc Treib <treib@chromium.org>
Cr-Commit-Position: refs/heads/master@{#774848}

chrome/app/settings_strings.grdp

@@ -295,6 +295,22 @@
   <message name="IDS_SETTINGS_PASSWORDS" desc="Name for the password section and settings entry used for managing passwords.">
     Passwords
   </message>
+  <!-- TODO(crbug.com/1062344): Make it translateable once final strings are available. Also add screenshot file. -->
+  <message name="IDS_SETTINGS_DEVICE_PASSWORDS" translateable="false" desc="Name for the passwords section used for managing passwords/exceptions stored on the device.">
+    Passwords on this device
+  </message>
+  <!-- TODO(crbug.com/1062344): Make it translateable once final strings are available. Also add screenshot file. -->
+  <message name="IDS_SETTINGS_DEVICE_PASSWORDS_EMPTY_SUBSECTION_TEXT" translateable="false" desc="Fallback text displayed under a subsection of the 'device passwords' page, in case that subsection is empty.">
+    No passwords
+  </message>
+  <!-- TODO(crbug.com/1062344): Make it translateable once final strings are available. Also add screenshot file. -->
+  <message name="IDS_SETTINGS_DEVICE_PASSWORDS_ON_DEVICE_ONLY_HEADING" translateable="false" desc="Title of a subsection in the 'device passwords' page displaying passwords/exceptions that are stored only on the device.">
+    On this device only
+  </message>
+  <!-- TODO(crbug.com/1062344): Make it translateable once final strings are available. Also add screenshot file. -->
+  <message name="IDS_SETTINGS_DEVICE_PASSWORDS_ON_DEVICE_AND_ACCOUNT_HEADING" translateable="false" desc="Title of a subsection in the 'device passwords' page displaying passwords/exceptions that are stored both on the device and in the account.">
+    On this device and in your Google Account
+  </message>
   <message name="IDS_SETTINGS_CHECK_PASSWORDS" desc="Name for the check passwords subsection and settings entry used to perform a password bulk check.">
     Check passwords
   </message>

chrome/browser/resources/settings/autofill_page/autofill_page.html

@@ -37,6 +37,15 @@
           </passwords-section>
         </settings-subpage>
       </template>
+      <!-- TODO(crbug.com/1049141): Add a learn-more-url, which will cause the
+      (?) button to appear. -->
+      <template is="dom-if" route-path="/passwords/device" no-search>
+        <settings-subpage
+            page-title="$i18n{passwordsDevice}"
+            search-label="$i18n{searchPasswords}"
+            search-term="{{passwordFilter_}}">
+        </settings-subpage>
+      </template>
       <template is="dom-if" route-path="/passwords/check"
           no-search="[[!enablePasswordCheck_]]">
         <settings-subpage

chrome/browser/resources/settings/route.js

@@ -138,6 +138,10 @@ function createBrowserSettingsRoutes() {
     r.AUTOFILL = r.BASIC.createSection('/autofill', 'autofill');
     r.PASSWORDS = r.AUTOFILL.createChild('/passwords');
 
+    if (loadTimeData.getBoolean('enableAccountStorage')) {
+      r.DEVICE_PASSWORDS = r.PASSWORDS.createChild('device');
+    }
+
     if (loadTimeData.getBoolean('enablePasswordCheck')) {
       r.CHECK_PASSWORDS = r.PASSWORDS.createChild('check');
     }

chrome/browser/resources/settings/settings_routes.js

@@ -33,6 +33,7 @@ import {Route} from './router.m.js';
  *   MANAGE_PROFILE: !Route,
  *   ON_STARTUP: !Route,
  *   PASSWORDS: !Route,
+ *   DEVICE_PASSWORDS: !Route,
  *   PAYMENTS: !Route,
  *   PEOPLE: !Route,
  *   PRINTING: !Route,

chrome/browser/ui/webui/settings/settings_localized_strings_provider.cc

@@ -772,6 +772,7 @@ void AddAutofillStrings(content::WebUIDataSource* html_source,
   static constexpr webui::LocalizedString kLocalizedStrings[] = {
       {"autofillPageTitle", IDS_SETTINGS_AUTOFILL},
       {"passwords", IDS_SETTINGS_PASSWORDS},
+      {"passwordsDevice", IDS_SETTINGS_DEVICE_PASSWORDS},
       {"checkPasswords", IDS_SETTINGS_CHECK_PASSWORDS},
       {"checkPasswordsCanceled", IDS_SETTINGS_CHECK_PASSWORDS_CANCELED},
       {"checkedPasswords", IDS_SETTINGS_CHECKED_PASSWORDS},
@@ -878,6 +879,10 @@ void AddAutofillStrings(content::WebUIDataSource* html_source,
        IDS_SETTINGS_PASSWORDS_LEAK_DETECTION_SIGNED_OUT_ENABLED_DESC},
       {"savedPasswordsHeading", IDS_SETTINGS_PASSWORDS_SAVED_HEADING},
       {"passwordExceptionsHeading", IDS_SETTINGS_PASSWORDS_EXCEPTIONS_HEADING},
+      {"deviceOnlyPasswordsHeading",
+       IDS_SETTINGS_DEVICE_PASSWORDS_ON_DEVICE_ONLY_HEADING},
+      {"deviceAndAccountPasswordsHeading",
+       IDS_SETTINGS_DEVICE_PASSWORDS_ON_DEVICE_AND_ACCOUNT_HEADING},
       {"deletePasswordException", IDS_SETTINGS_PASSWORDS_DELETE_EXCEPTION},
       {"removePassword", IDS_SETTINGS_PASSWORD_REMOVE},
       {"searchPasswords", IDS_SETTINGS_PASSWORD_SEARCH},
@@ -895,6 +900,8 @@ void AddAutofillStrings(content::WebUIDataSource* html_source,
       {"editPasswordPasswordLabel", IDS_SETTINGS_PASSWORDS_PASSWORD},
       {"noAddressesFound", IDS_SETTINGS_ADDRESS_NONE},
       {"noPasswordsFound", IDS_SETTINGS_PASSWORDS_NONE},
+      {"devicePasswordsEmptySubsectionText",
+       IDS_SETTINGS_DEVICE_PASSWORDS_EMPTY_SUBSECTION_TEXT},
       {"noExceptionsFound", IDS_SETTINGS_PASSWORDS_EXCEPTIONS_NONE},
       {"import", IDS_PASSWORD_MANAGER_IMPORT_BUTTON},
       {"exportMenuItem", IDS_SETTINGS_PASSWORDS_EXPORT_MENU_ITEM},