Tweaked logic around the lookup modal and new form lookup fields in order to support dynamic breadcrumbs and selecting applications with the same name.

awx/ui/client/features/applications/add-applications.controller.js

@@ -1,4 +1,4 @@
-function AddApplicationsController (models, $state, strings) {
+function AddApplicationsController (models, $state, strings, $scope) {
     const vm = this || {};
 
     const { application, me, organization } = models;
@@ -62,12 +62,19 @@ function AddApplicationsController (models, $state, strings) {
     vm.form.onSaveSuccess = res => {
         $state.go('applications.edit', { application_id: res.data.id }, { reload: true });
     };
+
+    $scope.$watch('organization', () => {
+        if ($scope.organization) {
+            vm.form.organization._idFromModal = $scope.organization;
+        }
+    });
 }
 
 AddApplicationsController.$inject = [
     'resolvedModels',
     '$state',
-    'ApplicationsStrings'
+    'ApplicationsStrings',
+    '$scope'
 ];
 
 export default AddApplicationsController;

awx/ui/client/features/applications/add-edit-applications.view.html

@@ -1,3 +1,4 @@
+<div ui-view="organization"></div>
 <at-panel>
     <at-panel-heading title="{{:: vm.panelTitle }}"></at-panel-heading>
 

awx/ui/client/features/applications/edit-applications.controller.js

@@ -43,6 +43,12 @@ function EditApplicationsController (models, $state, strings, $scope) {
         }
     });
 
+    $scope.$watch('organization', () => {
+        if ($scope.organization) {
+            vm.form.organization._idFromModal = $scope.organization;
+        }
+    });
+
     if (isEditable) {
         vm.form = application.createFormSchema('put', { omit });
     } else {

awx/ui/client/features/credentials/add-credentials.controller.js

@@ -115,6 +115,18 @@ function AddCredentialsController (models, $state, $scope, strings, componentsSt
 
         return { obj, error };
     };
+
+    $scope.$watch('organization', () => {
+        if ($scope.organization) {
+            vm.form.organization._idFromModal = $scope.organization;
+        }
+    });
+
+    $scope.$watch('credential_type', () => {
+        if ($scope.credential_type) {
+            vm.form.credential_type._idFromModal = $scope.credential_type;
+        }
+    });
 }
 
 AddCredentialsController.$inject = [

awx/ui/client/features/credentials/add-edit-credentials.view.html

@@ -1,3 +1,5 @@
+<div ui-view="organization"></div>
+<div ui-view="credential_type"></div>
 <at-panel ng-if="!$state.current.name.includes('permissions')">
     <at-panel-heading title="{{:: vm.panelTitle }}"></at-panel-heading>
 

awx/ui/client/features/credentials/edit-credentials.controller.js

@@ -32,6 +32,18 @@ function EditCredentialsController (models, $state, $scope, strings, componentsS
         }
     });
 
+    $scope.$watch('organization', () => {
+        if ($scope.organization) {
+            vm.form.organization._idFromModal = $scope.organization;
+        }
+    });
+
+    $scope.$watch('credential_type', () => {
+        if ($scope.credential_type) {
+            vm.form.credential_type._idFromModal = $scope.credential_type;
+        }
+    });
+
     // Only exists for permissions compatibility
     $scope.credential_obj = credential.get();
 

awx/ui/client/features/users/tokens/users-tokens-add.controller.js

@@ -1,6 +1,6 @@
 function AddTokensController (
     models, $state, strings, Rest, Alert, Wait, GetBasePath,
-    $filter, ProcessErrors
+    $filter, ProcessErrors, $scope
 ) {
     const vm = this || {};
     const { application } = models;
@@ -94,6 +94,12 @@ function AddTokensController (
     vm.form.onSaveSuccess = () => {
         $state.go('^', { user_id: $state.params.user_id }, { reload: true });
     };
+
+    $scope.$watch('application', () => {
+        if ($scope.application) {
+            vm.form.application._idFromModal = $scope.application;
+        }
+    });
 }
 
 AddTokensController.$inject = [
@@ -105,7 +111,8 @@ AddTokensController.$inject = [
     'Wait',
     'GetBasePath',
     '$filter',
-    'ProcessErrors'
+    'ProcessErrors',
+    '$scope'
 ];
 
 export default AddTokensController;

awx/ui/client/features/users/tokens/users-tokens-add.partial.html

@@ -1,3 +1,4 @@
+<div ui-view="application"></div>
 <at-panel>
     <at-panel-heading title="{{:: vm.panelTitle }}"></at-panel-heading>
 

awx/ui/client/lib/components/input/lookup.directive.js

@@ -34,23 +34,20 @@ function AtInputLookupController (baseInputController, $q, $state) {
             }
         };
 
-        scope.$watch(scope.state._resource, vm.watchResource);
+        // This should get triggered when the user selects something in the lookup modal and
+        // hits save to close the modal.  This won't get triggered when the user types in
+        // a value in the input.
+        scope.$watch('state._idFromModal', () => {
+            if (scope.state._idFromModal &&
+                (scope.state._idFromModal !== scope.state._value)
+            ) {
+                vm.search({ id: scope.state._idFromModal });
+            }
+        });
 
         vm.check();
     };
 
-    vm.watchResource = () => {
-        if (!scope[scope.state._resource]) {
-            return;
-        }
-
-        if (scope[scope.state._resource] !== scope.state._value) {
-            scope.state._displayValue = scope[`${scope.state._resource}_name`];
-
-            vm.search();
-        }
-    };
-
     vm.lookup = () => {
         const params = {};
 
@@ -62,6 +59,7 @@ function AtInputLookupController (baseInputController, $q, $state) {
     };
 
     vm.reset = () => {
+        scope.state._idFromModal = undefined;
         scope.state._value = undefined;
         scope[scope.state._resource] = undefined;
     };
@@ -80,15 +78,20 @@ function AtInputLookupController (baseInputController, $q, $state) {
         vm.searchAfterDebounce();
     };
 
-    vm.search = () => {
+    vm.search = (searchParams) => {
         scope.state._touched = true;
 
-        if (scope.state._displayValue === '' && !scope.state._required) {
+        if (!scope.state._required &&
+            scope.state._displayValue === '' &&
+            !scope.state._idFromModal
+        ) {
             scope.state._value = null;
             return vm.check({ isValid: true });
         }
 
-        return model.search({ [search.key]: scope.state._displayValue }, search.config)
+        searchParams = searchParams || { [search.key]: scope.state._displayValue };
+
+        return model.search(searchParams, search.config)
             .then(found => {
                 if (!found) {
                     vm.reset();
@@ -99,6 +102,7 @@ function AtInputLookupController (baseInputController, $q, $state) {
                 scope[scope.state._resource] = model.get('id');
                 scope.state._value = model.get('id');
                 scope.state._displayValue = model.get('name');
+                scope.state._idFromModal = undefined;
             })
             .catch(() => vm.reset())
             .finally(() => {

awx/ui/client/lib/components/input/lookup.partial.html

@@ -30,6 +30,4 @@
 
         <at-input-message></at-input-message>
     </div>
-
+</div>
-    <div ui-view="{{ state._resource }}"></div>
-    </div>