Update the search scope selector after Quicksand navigation

Summary:
Fixes T7900.

  - Update the hidden form input so the current application is searched.
  - Update the menu icon.
  - Update the button icon, if "Search Current Application" is selected.

Test Plan:
  - Navigated between applications with Quicksand.
    - Observed button icon update.
    - Observed menu icon update.
    - Observed results being scoped to the correct application.

Reviewers: btrahan

Reviewed By: btrahan

Subscribers: epriestley

Maniphest Tasks: T7900

Differential Revision: https://secure.phabricator.com/D12540

resources/celerity/map.php

@@ -8,7 +8,7 @@
 return array(
   'names' => array(
     'core.pkg.css' => '9a9b59ca',
-    'core.pkg.js' => '493cc6e6',
+    'core.pkg.js' => '6f7446de',
     'darkconsole.pkg.js' => '8ab24e01',
     'differential.pkg.css' => '3500921f',
     'differential.pkg.js' => '890046d3',
@@ -468,7 +468,7 @@ return array(
     'rsrc/js/core/behavior-file-tree.js' => '88236f00',
     'rsrc/js/core/behavior-form.js' => '5c54cbf3',
     'rsrc/js/core/behavior-gesture.js' => '3ab51e2c',
-    'rsrc/js/core/behavior-global-drag-and-drop.js' => '3f6075ff',
+    'rsrc/js/core/behavior-global-drag-and-drop.js' => 'c203e6ee',
     'rsrc/js/core/behavior-high-security-warning.js' => 'a464fe03',
     'rsrc/js/core/behavior-history-install.js' => '7ee2b591',
     'rsrc/js/core/behavior-hovercard.js' => 'f36e01af',
@@ -486,7 +486,7 @@ return array(
     'rsrc/js/core/behavior-reorder-applications.js' => '76b9fc3e',
     'rsrc/js/core/behavior-reveal-content.js' => '60821bc7',
     'rsrc/js/core/behavior-scrollbar.js' => '834a1173',
-    'rsrc/js/core/behavior-search-typeahead.js' => 'c5172d25',
+    'rsrc/js/core/behavior-search-typeahead.js' => '048330fa',
     'rsrc/js/core/behavior-select-on-click.js' => '4e3e79a6',
     'rsrc/js/core/behavior-toggle-class.js' => 'e566f52c',
     'rsrc/js/core/behavior-tokenizer.js' => 'b3a4b884',
@@ -593,7 +593,7 @@ return array(
     'javelin-behavior-durable-column' => '657c2b50',
     'javelin-behavior-error-log' => '6882e80a',
     'javelin-behavior-fancy-datepicker' => 'c51ae228',
-    'javelin-behavior-global-drag-and-drop' => '3f6075ff',
+    'javelin-behavior-global-drag-and-drop' => 'c203e6ee',
     'javelin-behavior-herald-rule-editor' => '7ebaeed3',
     'javelin-behavior-high-security-warning' => 'a464fe03',
     'javelin-behavior-history-install' => '7ee2b591',
@@ -628,7 +628,7 @@ return array(
     'javelin-behavior-phabricator-oncopy' => '2926fff2',
     'javelin-behavior-phabricator-remarkup-assist' => 'e32d14ab',
     'javelin-behavior-phabricator-reveal-content' => '60821bc7',
-    'javelin-behavior-phabricator-search-typeahead' => 'c5172d25',
+    'javelin-behavior-phabricator-search-typeahead' => '048330fa',
     'javelin-behavior-phabricator-show-older-transactions' => 'dbbf48b6',
     'javelin-behavior-phabricator-tooltips' => '3ee3408b',
     'javelin-behavior-phabricator-transaction-comment-form' => '9f7309fb',
@@ -845,6 +845,16 @@ return array(
     '029a133d' => array(
       'aphront-dialog-view-css',
     ),
+    '048330fa' => array(
+      'javelin-behavior',
+      'javelin-typeahead-ondemand-source',
+      'javelin-typeahead',
+      'javelin-dom',
+      'javelin-uri',
+      'javelin-util',
+      'javelin-stratcom',
+      'phabricator-prefab',
+    ),
     '05270951' => array(
       'javelin-util',
       'javelin-magical-init',
@@ -1088,13 +1098,6 @@ return array(
       'javelin-dom',
       'phortune-credit-card-form',
     ),
-    '3f6075ff' => array(
-      'javelin-behavior',
-      'javelin-dom',
-      'javelin-uri',
-      'javelin-mask',
-      'phabricator-drag-and-drop-file-upload',
-    ),
     '40a6a403' => array(
       'javelin-install',
       'javelin-dom',
@@ -1755,15 +1758,12 @@ return array(
       'javelin-dom',
       'javelin-vector',
     ),
-    'c5172d25' => array(
+    'c203e6ee' => array(
       'javelin-behavior',
-      'javelin-typeahead-ondemand-source',
-      'javelin-typeahead',
       'javelin-dom',
       'javelin-uri',
-      'javelin-util',
-      'javelin-stratcom',
-      'phabricator-prefab',
+      'javelin-mask',
+      'phabricator-drag-and-drop-file-upload',
     ),
     'c51ae228' => array(
       'javelin-behavior',

src/view/page/PhabricatorStandardPageView.php

@@ -649,6 +649,19 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView {
       $upload_enabled = $controller->isGlobalDragAndDropUploadEnabled();
     }
 
+    $application_class = null;
+    $application_search_icon = null;
+    $controller = $this->getController();
+    if ($controller) {
+      $application = $controller->getCurrentApplication();
+      if ($application) {
+        $application_class = get_class($application);
+        if ($application->getApplicationSearchDocumentTypes()) {
+          $application_search_icon = $application->getFontIcon();
+        }
+      }
+    }
+
     return array(
       'title' => $this->getTitle(),
       'aphlictDropdownData' => array(
@@ -659,6 +672,8 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView {
       'aphlictDropdowns' => $rendered_dropdowns,
       'hisecWarningConfig' => $hisec_warning_config,
       'consoleConfig' => $console_config,
+      'applicationClass' => $application_class,
+      'applicationSearchIcon' => $application_search_icon,
     ) + $this->buildAphlictListenConfigData();
   }
 

src/view/page/menu/PhabricatorMainMenuSearchView.php

@@ -2,6 +2,8 @@
 
 final class PhabricatorMainMenuSearchView extends AphrontView {
 
+  const DEFAULT_APPLICATION_ICON = 'fa-dot-circle-o';
+
   private $id;
   private $application;
 
@@ -27,6 +29,8 @@ final class PhabricatorMainMenuSearchView extends AphrontView {
     $target_id = celerity_generate_unique_node_id();
     $search_id = $this->getID();
     $button_id = celerity_generate_unique_node_id();
+    $selector_id = celerity_generate_unique_node_id();
+    $application_id = celerity_generate_unique_node_id();
 
     $input = phutil_tag(
       'input',
@@ -51,11 +55,15 @@ final class PhabricatorMainMenuSearchView extends AphrontView {
     Javelin::initBehavior(
       'phabricator-search-typeahead',
       array(
-        'id'          => $target_id,
-        'input'       => $search_id,
-        'button'      => $button_id,
-        'src'         => $search_datasource->getDatasourceURI(),
-        'limit'       => 10,
+        'id' => $target_id,
+        'input' => $search_id,
+        'button' => $button_id,
+        'selectorID' => $selector_id,
+        'applicationID' => $application_id,
+        'defaultApplicationIcon' => self::DEFAULT_APPLICATION_ICON,
+        'appScope' => PhabricatorSearchController::SCOPE_CURRENT_APPLICATION,
+        'src' => $search_datasource->getDatasourceURI(),
+        'limit' => 10,
         'placeholder' => pht('Search'),
         'scopeUpdateURI' => '/settings/adjust/?key='.$scope_key,
       ));
@@ -75,7 +83,7 @@ final class PhabricatorMainMenuSearchView extends AphrontView {
       ),
       pht('Search'));
 
-    $selector = $this->buildModeSelector();
+    $selector = $this->buildModeSelector($selector_id, $application_id);
 
     $form = phabricator_form(
       $user,
@@ -100,7 +108,7 @@ final class PhabricatorMainMenuSearchView extends AphrontView {
     return $form;
   }
 
-  private function buildModeSelector() {
+  private function buildModeSelector($selector_id, $application_id) {
     $viewer = $this->getUser();
 
     $items = array();
@@ -115,7 +123,7 @@ final class PhabricatorMainMenuSearchView extends AphrontView {
     );
 
     $application_value = null;
-    $application_icon = 'fa-dot-circle-o';
+    $application_icon = self::DEFAULT_APPLICATION_ICON;
     $application = $this->getApplication();
     if ($application) {
       $application_value = get_class($application);
@@ -183,6 +191,7 @@ final class PhabricatorMainMenuSearchView extends AphrontView {
     }
 
     $selector = id(new PHUIButtonView())
+      ->setID($selector_id)
       ->addClass('phabricator-main-menu-search-dropdown')
       ->addSigil('global-search-dropdown')
       ->setMetadata(
@@ -210,6 +219,7 @@ final class PhabricatorMainMenuSearchView extends AphrontView {
       'input',
       array(
         'type' => 'hidden',
+        'id' => $application_id,
         'sigil' => 'global-search-dropdown-app',
         'name' => 'search:application',
         'value' => $application_value,

webroot/rsrc/js/core/behavior-global-drag-and-drop.js

@@ -98,8 +98,6 @@ JX.behavior('global-drag-and-drop', function(config, statics) {
     'quicksand-redraw',
     null,
     function (e) {
-      e.kill();
-
       var data = e.getData();
       var toggle = data.newResponse.globalDragAndDrop;
       statics.enabled = toggle;

webroot/rsrc/js/core/behavior-search-typeahead.js

@@ -144,10 +144,39 @@ JX.behavior('phabricator-search-typeahead', function(config) {
     typeahead.updatePlaceHolder();
   });
 
-  // TODO: Quicksand needs to update the application search input as we change
-  // applications; we should register a listener.
-  // TODO: Quicksand also needs to update the application search icon on the
-  // button itself and in the menu.
+
+  // When the user navigates between applications, we need to update the
+  // input in the document, the icon on the button, and the icon in the
+  // menu.
+  JX.Stratcom.listen(
+    'quicksand-redraw',
+    null,
+    function(e) {
+      var r = e.getData().newResponse;
+      updateCurrentApplication(r.applicationClass, r.applicationSearchIcon);
+    });
+
+  var current_app_icon;
+  function updateCurrentApplication(app_class, app_icon) {
+    current_app_icon = app_icon || config.defaultApplicationIcon;
+
+    // Update the icon on the button.
+    var button = JX.$(config.selectorID);
+    var data = JX.Stratcom.getData(button);
+    if (data.value == config.appScope) {
+      updateIcon(button, data, current_app_icon);
+    }
+
+    // Set the hidden input to the new value.
+    JX.$(config.applicationID).value = app_class;
+  }
+
+  function updateIcon(button, data, new_icon) {
+    var icon = JX.DOM.find(button, 'span', 'global-search-dropdown-icon');
+    JX.DOM.alterClass(icon, data.icon, false);
+    data.icon = new_icon;
+    JX.DOM.alterClass(icon, data.icon, true);
+  }
 
   // Implement the scope selector menu for the global search.
   JX.Stratcom.listen('click', 'global-search-dropdown', function(e) {
@@ -165,10 +194,7 @@ JX.behavior('phabricator-search-typeahead', function(config) {
       }
 
       // Swap out the icon.
-      var icon = JX.DOM.find(button, 'span', 'global-search-dropdown-icon');
-      JX.DOM.alterClass(icon, data.icon, false);
-      data.icon = spec.icon;
-      JX.DOM.alterClass(icon, data.icon, true);
+      updateIcon(button, data, spec.icon);
 
       // Update the value.
       data.value = spec.value;
@@ -192,6 +218,17 @@ JX.behavior('phabricator-search-typeahead', function(config) {
 
       for (var ii = 0; ii < data.items.length; ii++) {
         var spec = data.items[ii];
+
+        // If this is the "Search Current Application" item and we've
+        // navigated to a page which sent us new information about the
+        // icon, update the icon so the menu reflects the icon for the
+        // current application.
+        if (spec.value == config.appScope) {
+          if (current_app_icon !== undefined) {
+            spec.icon = current_app_icon;
+          }
+        }
+
         var item = new JX.PHUIXActionView()
           .setName(spec.name)
           .setIcon(spec.icon);