Migrate add_smb_share dialog to a cr_component

This is the first in a series of changes to create a freeform dialog
for adding an SMB share in addition to the dialog existing in settings.

- Moves add_smb_share dialog to cr_components
- Switches $i18n{} to i18n()
- Updates BUILD files

Bug: chromium:887135
Test: verified on test device
Change-Id: I1133d9e45ee7ac63e338e22e4e69e3e000a3ee02
Reviewed-on: https://chromium-review.googlesource.com/c/1281868
Commit-Queue: Bailey Berro <baileyberro@chromium.org>
Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#603763}

chrome/browser/resources/settings/downloads_page/BUILD.gn

@@ -6,10 +6,8 @@ import("//third_party/closure_compiler/compile_js.gni")
 
 js_type_check("closure_compile") {
   deps = [
-    ":add_smb_share_dialog",
     ":downloads_browser_proxy",
     ":downloads_page",
-    ":smb_browser_proxy",
     ":smb_shares_page",
   ]
 }
@@ -23,30 +21,15 @@ js_library("downloads_browser_proxy") {
 
 js_library("smb_shares_page") {
   deps = [
-    ":add_smb_share_dialog",
     "..:route",
+    "//ui/webui/resources/cr_components/chromeos/smb_shares:smb_browser_proxy",
     "//ui/webui/resources/js:web_ui_listener_behavior",
   ]
 }
 
-js_library("add_smb_share_dialog") {
-  deps = [
-    ":smb_browser_proxy",
-    "//ui/webui/resources/js:i18n_behavior",
-    "//ui/webui/resources/js:web_ui_listener_behavior",
-  ]
-}
-
-js_library("smb_browser_proxy") {
-  deps = [
-    "//ui/webui/resources/js:cr",
-  ]
-}
-
 js_library("downloads_page") {
   deps = [
     ":downloads_browser_proxy",
-    ":smb_browser_proxy",
     "..:page_visibility",
     "..:route",
     "../prefs:prefs_behavior",

chrome/browser/resources/settings/downloads_page/smb_shares_page.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 
+<link rel="import" href="chrome://resources/cr_components/chromeos/smb_shares/add_smb_share_dialog.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_toast/cr_toast.html">
 <link rel="import" href="chrome://resources/html/action_link.html">
 <link rel="import" href="chrome://resources/html/action_link_css.html">
@@ -10,7 +11,6 @@
 <link rel="import" href="../route.html">
 <link rel="import" href="../settings_shared_css.html">
 <link rel="import" href="../settings_vars_css.html">
-<link rel="import" href="add_smb_share_dialog.html">
 
 <dom-module id="settings-smb-shares-page">
   <template>
@@ -39,8 +39,8 @@
       </paper-button>
     </div>
     <template is="dom-if" if="[[showAddSmbDialog_]]" restamp>
-      <settings-add-smb-share-dialog on-close="onAddSmbDialogClosed_">
-      </settings-add-smb-share-dialog>
+      <add-smb-share-dialog on-close="onAddSmbDialogClosed_">
+      </add-smb-share-dialog>
     </template>
 
     <cr-toast id="errorToast" duration="3000">

chrome/browser/resources/settings/settings_resources.grd

@@ -585,24 +585,12 @@
                  type="chrome_html"
                  preprocess="true" />
       <if expr="chromeos">
-        <structure name="IDR_SETTINGS_SMB_BROWSER_PROXY_HTML"
-                   file="downloads_page/smb_browser_proxy.html"
-                   type="chrome_html" />
-        <structure name="IDR_SETTINGS_SMB_BROWSER_PROXY_JS"
-                   file="downloads_page/smb_browser_proxy.js"
-                   type="chrome_html" />
         <structure name="IDR_SETTINGS_SMB_SHARES_PAGE_HTML"
                    file="downloads_page/smb_shares_page.html"
                    type="chrome_html" />
         <structure name="IDR_SETTINGS_SMB_SHARES_PAGE_JS"
                    file="downloads_page/smb_shares_page.js"
                    type="chrome_html" />
-        <structure name="IDR_SETTINGS_ADD_SMB_SHARE_DIALOG_HTML"
-                   file="downloads_page/add_smb_share_dialog.html"
-                   type="chrome_html" />
-        <structure name="IDR_SETTINGS_ADD_SMB_SHARE_DIALOG_JS"
-                   file="downloads_page/add_smb_share_dialog.js"
-                   type="chrome_html" />
       </if>
       <structure name="IDR_SETTINGS_I18n_SETUP_HTML"
                  file="i18n_setup.html"

chrome/test/data/webui/settings/smb_shares_page_tests.js

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-/** @implements {settings.SmbBrowserProxy} */
+/** @implements {smb_shares.SmbBrowserProxy} */
 class TestSmbBrowserProxy extends TestBrowserProxy {
   constructor() {
     super([
@@ -27,12 +27,12 @@ suite('AddSmbShareDialogTests', function() {
   let page = null;
   let addDialog = null;
 
-  /** @type {?settings.TestSmbBrowserProxy} */
+  /** @type {?smb_shares.TestSmbBrowserProxy} */
   let smbBrowserProxy = null;
 
   setup(function() {
     smbBrowserProxy = new TestSmbBrowserProxy();
-    settings.SmbBrowserProxyImpl.instance_ = smbBrowserProxy;
+    smb_shares.SmbBrowserProxyImpl.instance_ = smbBrowserProxy;
 
     PolymerTest.clearBody();
 
@@ -44,7 +44,7 @@ suite('AddSmbShareDialogTests', function() {
     button.click();
     Polymer.dom.flush();
 
-    addDialog = page.$$('settings-add-smb-share-dialog');
+    addDialog = page.$$('add-smb-share-dialog');
     assertTrue(!!addDialog);
 
     Polymer.dom.flush();

ui/webui/resources/cr_components/chromeos/smb_shares/BUILD.gn

+# Copyright 2018 The Chromium Authors. All rights reserved.
+# Use of this source code is governed by a BSD-style license that can be
+# found in the LICENSE file.
+
+import("//third_party/closure_compiler/compile_js.gni")
+
+js_type_check("closure_compile") {
+  deps = [
+    ":add_smb_share_dialog",
+    ":smb_browser_proxy",
+  ]
+}
+
+js_library("smb_browser_proxy") {
+  deps = [
+    "//ui/webui/resources/js:cr",
+  ]
+}
+
+js_library("add_smb_share_dialog") {
+  deps = [
+    "//ui/webui/resources/cr_elements/cr_input:cr_input",
+    "//ui/webui/resources/js:cr",
+    "//ui/webui/resources/js:i18n_behavior",
+    "//ui/webui/resources/js:web_ui_listener_behavior",
+  ]
+}

ui/webui/resources/cr_components/chromeos/smb_shares/OWNERS

+khorimoto@chromium.org
\ No newline at end of file

chrome/browser/resources/settings/downloads_page/add_smb_share_dialog.html → ui/webui/resources/cr_components/chromeos/smb_shares/add_smb_share_dialog.html

@@ -3,17 +3,17 @@
 <link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_input/cr_input.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_searchable_drop_down/cr_searchable_drop_down.html">
+<link rel="import" href="chrome://resources/cr_elements/paper_button_style_css.html">
 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
+<link rel="import" href="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/html/md_select_css.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
-<link rel="import" href="../settings_shared_css.html">
-<link rel="import" href="../settings_vars_css.html">
 <link rel="import" href="smb_browser_proxy.html">
 
-<dom-module id="settings-add-smb-share-dialog">
+<dom-module id="add-smb-share-dialog">
   <template>
-    <style include="settings-shared md-select">
+    <style include="md-select paper-button-style">
       #dialog [slot=body] {
         height: 350px;
       }
@@ -43,47 +43,47 @@
     </style>
 
     <cr-dialog id="dialog">
-      <div slot="title">$i18n{addSmbShare}</div>
+      <div slot="title">[[i18n('addSmbShare')]]</div>
       <div slot="body" spellcheck="false">
-        <cr-searchable-drop-down id="address" label="$i18n{smbShareUrl}"
+        <cr-searchable-drop-down id="address" label="[[i18n('smbShareUrl')]]"
             value="{{mountUrl_}}" items="[[discoveredShares_]]"
             placeholder="\\server\share" on-change="onURLChanged_"
             update-value-on-input autofocus>
         </cr-searchable-drop-down>
-        <cr-input id="name" label="$i18n{smbShareName}" value="{{mountName_}}"
-            maxlength="64">
+        <cr-input id="name" label="[[i18n('smbShareName')]]"
+            value="{{mountName_}}" maxlength="64">
         </cr-input>
         <div id="authentication-method" hidden="[[!isActiveDirectory_]]">
           <div id="authentication-label" class="label">
-              $i18n{smbShareAuthenticationMethod}
+            [[i18n('smbShareAuthenticationMethod')]]
           </div>
           <select class="md-select" aria-labelledby="authentication-label"
               value="{{authenticationMethod_::change}}">
             <option value="kerberos">
-                $i18n{smbShareKerberosAuthentication}
+              [[i18n('smbShareKerberosAuthentication')]]
             </option>
             <option value="credentials">
-                $i18n{smbShareStandardAuthentication}
+              [[i18n('smbShareStandardAuthentication')]]
             </option>
           </select>
         </div>
         <div id="credentials"
             hidden="[[!shouldShowCredentialUI_(authenticationMethod_)]]">
-          <cr-input id="username" label="$i18n{smbShareUsername}"
+          <cr-input id="username" label="[[i18n('smbShareUsername')]]"
               value="{{username_}}">
           </cr-input>
           <cr-input id="password" type="password"
-              label="$i18n{smbSharePassword}" value="{{password_}}">
+              label="[[i18n('smbSharePassword')]]" value="{{password_}}">
           </cr-input>
         </div>
       </div>
       <div slot="button-container">
         <paper-button class="cancel-button" on-click="cancel_" id="cancel">
-            $i18n{cancel}</paper-button>
+          [[i18n('cancel')]]
+        </paper-button>
         <paper-button id="actionButton" class="action-button"
-          on-click="onAddButtonTap_"
-          disabled="[[!canAddShare_(mountUrl_)]]">
-            $i18n{add}
+            on-click="onAddButtonTap_" disabled="[[!canAddShare_(mountUrl_)]]">
+          [[i18n('add')]]
         </paper-button>
       </div>
     </cr-dialog>

chrome/browser/resources/settings/downloads_page/add_smb_share_dialog.js → ui/webui/resources/cr_components/chromeos/smb_shares/add_smb_share_dialog.js

@@ -3,14 +3,13 @@
 // found in the LICENSE file.
 
 /**
- * @fileoverview 'settings-add-smb-share-dialog' is a component for adding
- * an SMB Share.
+ * @fileoverview 'add-smb-share-dialog' is a component for adding an SMB Share.
  */
 
 Polymer({
-  is: 'settings-add-smb-share-dialog',
+  is: 'add-smb-share-dialog',
 
-  behaviors: [WebUIListenerBehavior],
+  behaviors: [I18nBehavior, WebUIListenerBehavior],
 
   properties: {
     /** @private {string} */
@@ -63,12 +62,12 @@ Polymer({
     },
   },
 
-  /** @private {?settings.SmbBrowserProxy} */
+  /** @private {?smb_shares.SmbBrowserProxy} */
   browserProxy_: null,
 
   /** @override */
   created: function() {
-    this.browserProxy_ = settings.SmbBrowserProxyImpl.getInstance();
+    this.browserProxy_ = smb_shares.SmbBrowserProxyImpl.getInstance();
   },
 
   /** @override */

chrome/browser/resources/settings/downloads_page/smb_browser_proxy.js → ui/webui/resources/cr_components/chromeos/smb_shares/smb_browser_proxy.js

@@ -3,7 +3,7 @@
 // found in the LICENSE file.
 
 /**
- * @fileoverview A helper object used from the "SMB Share" section to
+ * @fileoverview A helper object used from the "add SMB share" dialog to
  * interact with the browser. Used only on Chrome OS.
  */
 
@@ -28,7 +28,7 @@ const SmbAuthMethod = {
   CREDENTIALS: 'credentials',
 };
 
-cr.define('settings', function() {
+cr.define('smb_shares', function() {
   /** @interface */
   class SmbBrowserProxy {
     /**
@@ -47,7 +47,7 @@ cr.define('settings', function() {
     startDiscovery() {}
   }
 
-  /** @implements {settings.SmbBrowserProxy} */
+  /** @implements {smb_shares.SmbBrowserProxy} */
   class SmbBrowserProxyImpl {
     /** @override */
     smbMount(smbUrl, smbName, username, password, authMethod) {

ui/webui/resources/cr_components/cr_components_resources.grdp

@@ -364,5 +364,23 @@
                file="cr_components/chromeos/multidevice_setup/ui_page.js"
                type="chrome_html"
                compress="gzip" />
+
+    <!-- Shared between settings and add new share flow. -->
+    <structure name="IDR_WEBUI_CHROMEOS_SMB_SHARES_SMB_BROWSER_PROXY_HTML"
+               file="cr_components/chromeos/smb_shares/smb_browser_proxy.html"
+               type="chrome_html"
+               compress="gzip" />
+    <structure name="IDR_WEBUI_CHROMEOS_SMB_SHARES_SMB_BROWSER_PROXY_JS"
+               file="cr_components/chromeos/smb_shares/smb_browser_proxy.js"
+               type="chrome_html"
+               compress="gzip" />
+    <structure name="IDR_WEBUI_CHROMEOS_SMB_SHARES_ADD_SMB_SHARE_DIALOG_HTML"
+               file="cr_components/chromeos/smb_shares/add_smb_share_dialog.html"
+               type="chrome_html"
+               compress="gzip" />
+    <structure name="IDR_WEBUI_CHROMEOS_SMB_SHARES_ADD_SMB_SHARE_DIALOG_JS"
+               file="cr_components/chromeos/smb_shares/add_smb_share_dialog.js"
+               type="chrome_html"
+               compress="gzip" />
   </if>
 </grit-part>