Fix delete role issue on transform (#10417) (#10545)

* Fix bug where adding and then removing a new role on a transformation when no other roles have been created causes an error

* Update test on search-select to reflect new behavior which does not add created options to list on delete

* Add changelog

changelog/10417.txt

@@ -0,0 +1,4 @@
+```release-note:bug
+ui: Fix bug in Transform secret engine when a new role is added and then removed from a transformation
+```
+

ui/lib/core/addon/components/search-select.js

@@ -136,7 +136,7 @@ export default Component.extend({
       this.onChange(val);
     },
     createOption(optionId) {
-      let newOption = { name: optionId, id: optionId };
+      let newOption = { name: optionId, id: optionId, new: true };
       this.selectedOptions.pushObject(newOption);
       this.handleChange();
     },
@@ -147,7 +147,9 @@ export default Component.extend({
     },
     discardSelection(selected) {
       this.selectedOptions.removeObject(selected);
-      this.options.pushObject(selected);
+      if (!selected.new) {
+        this.options.pushObject(selected);
+      }
       this.handleChange();
     },
     constructSuggestion(id) {

ui/tests/integration/components/search-select-test.js

@@ -162,7 +162,7 @@ module('Integration | Component | search select', function(hooks) {
     assert.equal(component.options.length, 3, 'shows all options');
   });
 
-  test('it adds created item to list items on create and reinserts into drop down on delete', async function(assert) {
+  test('it adds created item to list items on create and removes without adding back to options on delete', async function(assert) {
     const models = ['identity/entity'];
     this.set('models', models);
     this.set('onChange', sinon.spy());
@@ -180,7 +180,7 @@ module('Integration | Component | search select', function(hooks) {
     assert.equal(component.selectedOptions.length, 0, 'there are no selected options');
     assert.ok(this.onChange.calledWith([]));
     await clickTrigger();
-    assert.equal(component.options.length, 4, 'shows all options, including created option');
+    assert.equal(component.options.length, 3, 'does not add deleted option back to list');
   });
 
   test('it uses fallback component if endpoint 403s', async function(assert) {