NIFI-342:

- Setting focus in filter field on add processor dialog.
- Ensuring toolbar button state is updated when adding a component.
- Clear name/URL fields when canceling add port/group dialogs.

nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-actions.js

@@ -1065,7 +1065,6 @@ nf.Actions = (function () {
 
                             // refresh the birdseye/toolbar
                             nf.Birdseye.refresh();
-                            nf.CanvasToolbar.refresh();
 
                             // remove the original snippet
                             nf.Snippet.remove(snippet.id).fail(reject);
@@ -1078,7 +1077,6 @@ nf.Actions = (function () {
 
                                 // refresh the birdseye/toolbar
                                 nf.Birdseye.refresh();
-                                nf.CanvasToolbar.refresh();
                             });
 
                             // reject the deferred

nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-canvas-toolbox.js

@@ -373,6 +373,9 @@ nf.CanvasToolbox = (function () {
 
         // show the dialog
         $('#new-processor-dialog').modal('show');
+        
+        // set the focus in the filter field
+        $('#processor-type-filter').focus();
 
         // adjust the grid canvas now that its been rendered
         grid.resizeCanvas();
@@ -427,12 +430,11 @@ nf.CanvasToolbox = (function () {
      */
     var promptForInputPortName = function (pt) {
         var addInputPort = function () {
-            // hide the dialog
-            $('#new-port-dialog').modal('hide');
-
             // get the name of the input port and clear the textfield
             var portName = $('#new-port-name').val();
-            $('#new-port-name').val('');
+            
+            // hide the dialog
+            $('#new-port-dialog').modal('hide');
 
             // create the input port
             createInputPort(portName, pt);
@@ -514,12 +516,11 @@ nf.CanvasToolbox = (function () {
      */
     var promptForOutputPortName = function (pt) {
         var addOutputPort = function () {
-            // hide the dialog
-            $('#new-port-dialog').modal('hide');
-
             // get the name of the output port and clear the textfield
             var portName = $('#new-port-name').val();
-            $('#new-port-name').val('');
+            
+            // hide the dialog
+            $('#new-port-dialog').modal('hide');
 
             // create the output port
             createOutputPort(portName, pt);
@@ -641,12 +642,11 @@ nf.CanvasToolbox = (function () {
      */
     var promptForRemoteProcessGroupUri = function (pt) {
         var addRemoteProcessGroup = function () {
-            // hide the dialog
-            $('#new-remote-process-group-dialog').modal('hide');
-
             // get the uri of the controller and clear the textfield
             var remoteProcessGroupUri = $('#new-remote-process-group-uri').val();
-            $('#new-remote-process-group-uri').val('');
+            
+            // hide the dialog
+            $('#new-remote-process-group-dialog').modal('hide');
 
             // create the remote process group
             createRemoteProcessGroup(remoteProcessGroupUri, pt);
@@ -1123,19 +1123,34 @@ nf.CanvasToolbox = (function () {
                 // configure the new port dialog
                 $('#new-port-dialog').modal({
                     headerText: 'Add Port',
-                    overlayBackground: false
+                    overlayBackground: false,
+                    handler: {
+                        close: function () {
+                            $('#new-port-name').val('');
+                        }
+                    }
                 });
 
                 // configure the new process group dialog
                 $('#new-process-group-dialog').modal({
                     headerText: 'Add Process Group',
-                    overlayBackground: false
+                    overlayBackground: false,
+                    handler: {
+                        close: function () {
+                            $('#new-process-group-name').val('');
+                        }
+                    }
                 });
 
                 // configure the new remote process group dialog
                 $('#new-remote-process-group-dialog').modal({
                     headerText: 'Add Remote Process Group',
-                    overlayBackground: false
+                    overlayBackground: false,
+                    handler: {
+                        close: function () {
+                            $('#new-remote-process-group-uri').val('');
+                        }
+                    }
                 });
 
                 // configure the instantiate template dialog
@@ -1164,12 +1179,11 @@ nf.CanvasToolbox = (function () {
         promptForGroupName: function (pt) {
             return $.Deferred(function (deferred) {
                 var addGroup = function () {
-                    // hide the dialog
-                    $('#new-process-group-dialog').modal('hide');
-
                     // get the name of the group and clear the textfield
                     var groupName = $('#new-process-group-name').val();
-                    $('#new-process-group-name').val('');
+
+                    // hide the dialog
+                    $('#new-process-group-dialog').modal('hide');
 
                     // create the group and resolve the deferred accordingly
                     createGroup(groupName, pt).done(function (response) {

nifi/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-graph.js

@@ -67,7 +67,6 @@ nf.Graph = (function () {
 
             // if we are going to select the new components, deselect the previous selection
             if (selectAll) {
-                // deselect the current selection
                 nf.CanvasUtils.getSelection().classed('selected', false);
             }
 
@@ -96,6 +95,11 @@ nf.Graph = (function () {
             if (!nf.Common.isEmpty(processGroupContents.connections)) {
                 nf.Connection.add(processGroupContents.connections, selectAll);
             }
+            
+            // trigger the toolbar to refresh if the selection is changing
+            if (selectAll) {
+                nf.CanvasToolbar.refresh();
+            }
         },
         
         /**