Ember Upgrade to 4.4 (#17086)

* runs ember-cli-update to 4.4.0

* updates yarn.lock

* updates dependencies causing runtime errors (#17135)

* Inject Store Service When Accessed Implicitly (#17345)

* adds codemod for injecting store service

* adds custom babylon parser with decorators-legacy plugin for jscodeshift transforms

* updates inject-store-service codemod to only look for .extend object expressions and adds recast options

* runs inject-store-service codemod on js files

* replace query-params helper with hash (#17404)

* Updates/removes dependencies throwing errors in Ember 4.4 (#17396)

* updates ember-responsive to latest

* updates ember-composable-helpers to latest and uses includes helper since contains was removed

* updates ember-concurrency to latest

* updates ember-cli-clipboard to latest

* temporary workaround for toolbar-link component throwing errors for using params arg with LinkTo

* adds missing store injection to auth configure route

* fixes issue with string-list component throwing error for accessing prop in same computation

* fixes non-iterable query params issue in mfa methods controller

* refactors field-to-attrs to handle belongsTo rather than fragments

* converts mount-config fragment to belongsTo on auth-method model

* removes ember-api-actions and adds tune method to auth-method adapter

* converts cluster replication attributes from fragment to relationship

* updates ember-data, removes ember-data-fragments and updates yarn to latest

* removes fragments from secret-engine model

* removes fragment from test-form-model

* removes commented out code

* minor change to inject-store-service codemod and runs again on js files

* Remove LinkTo positional params (#17421)

* updates ember-cli-page-object to latest version

* update toolbar-link to support link-to args and not positional params

* adds replace arg to toolbar-link component

* Clean up js lint errors (#17426)

* replaces assert.equal to assert.strictEqual

* update eslint no-console to error and disables invididual intended uses of console

* cleans up hbs lint warnings (#17432)

* Upgrade bug and test fixes (#17500)

* updates inject-service codemod to take arg for service name and runs for flashMessages service

* fixes hbs lint error after merging main

* fixes flash messages

* updates more deps

* bug fixes

* test fixes

* updates ember-cli-content-security-policy and prevents default form submission throwing errors

* more bug and test fixes

* removes commented out code

* fixes issue with code-mirror modifier sending change event on setup causing same computation error

* Upgrade Clean Up (#17543)

* updates deprecation workflow and filter

* cleans up build errors, removes unused ivy-codemirror and sass and updates ember-cli-sass and node-sass to latest

* fixes control groups test that was skipped after upgrade

* updates control group service tests

* addresses review feedback

* updates control group service handleError method to use router.currentURL rather that transition.intent.url

* adds changelog entry

ui/lib/core/addon/components/autocomplete-input.hbs

@@ -11,7 +11,7 @@
       class="input"
       {{on "input" this.onInput}}
     />
-    <BasicDropdown @registerAPI={{fn (mut this.dropdownAPI)}} @renderInPlace={{true}} as |D|>
+    <BasicDropdown @registerAPI={{this.setDropdownAPI}} @renderInPlace={{true}} as |D|>
       <D.Content @defaultClass="autocomplete-input">
         {{#each @options as |option|}}
           <div class="autocomplete-input-option" role="button" {{on "click" (fn this.selectOption option.value)}}>

ui/lib/core/addon/components/autocomplete-input.js

@@ -28,6 +28,10 @@ export default class AutocompleteInput extends Component {
     this.inputElement = element.querySelector('.input');
   }
   @action
+  setDropdownAPI(dropdownAPI) {
+    this.dropdownAPI = dropdownAPI;
+  }
+  @action
   onInput(event) {
     const { options = [], optionsTrigger } = this.args;
     if (optionsTrigger && options.length) {

ui/lib/core/addon/components/form-field.hbs

@@ -3,7 +3,7 @@
   {{#unless
     (or
       (eq @attr.type "boolean")
-      (contains
+      (includes
         @attr.options.editType
         (array "boolean" "optionalText" "searchSelect" "mountAccessor" "kv" "file" "ttl" "stringArray" "json" "regex")
       )

ui/lib/core/addon/components/info-table-row.hbs

@@ -87,7 +87,7 @@
                   @clipboardText={{@tooltipText}}
                   @success={{action (set-flash-message "Data copied!")}}
                   @tagName="div"
-                  @disabled={{not @isTooltipCopyable}}
+                  disabled={{not @isTooltipCopyable}}
                   class={{if @isTooltipCopyable "has-pointer"}}
                   data-test-tooltip-copy
                 >

ui/lib/core/addon/components/replication-dashboard.js

@@ -82,7 +82,7 @@ export default Component.extend({
       // when DR and Performance is enabled on the same cluster,
       // the states should always be the same
       // we are leaving this console log statement to be sure
-      console.log('DR State: ', drState, 'Performance State: ', performanceState);
+      console.log('DR State: ', drState, 'Performance State: ', performanceState); // eslint-disable-line
     }
 
     return drState;

ui/lib/core/addon/components/secret-list-header.hbs

@@ -28,7 +28,7 @@
         {{#if this.isKV}}
           <span class="tag" data-test-kv-version-badge>
             Version
-            {{or @model.options.version "1"}}
+            {{or @model.version "1"}}
           </span>
         {{/if}}
       </h1>
@@ -77,7 +77,7 @@
     <div class="tabs-container box is-bottomless is-marginless is-fullwidth is-paddingless">
       <nav class="tabs" aria-label="tabs">
         <ul>
-          {{#if (contains @model.engineType (supported-secret-backends))}}
+          {{#if (includes @model.engineType (supported-secret-backends))}}
             <LinkTo
               @route="vault.cluster.secrets.backend.list-root"
               @current-when="vault.cluster.secrets.backend.list-root vault.cluster.secrets.backend.list"

ui/lib/core/addon/components/string-list.js

@@ -3,6 +3,7 @@ import Component from '@glimmer/component';
 import autosize from 'autosize';
 import { action } from '@ember/object';
 import { set } from '@ember/object';
+import { next } from '@ember/runloop';
 
 /**
  * @module StringList
@@ -39,8 +40,10 @@ export default class StringList extends Component {
     });
     this.type = this.args.type || 'array';
     this.setType();
-    this.toList();
-    this.addInput();
+    next(() => {
+      this.toList();
+      this.addInput();
+    });
   }
 
   setType() {
@@ -62,7 +65,7 @@ export default class StringList extends Component {
 
   toVal() {
     const inputs = this.inputList.filter((x) => x.value).mapBy('value');
-    if (this.format === 'string') {
+    if (this.args.type === 'string') {
       return inputs.join(',');
     }
     return inputs;

ui/lib/core/addon/components/toolbar-actions.js

@@ -7,7 +7,7 @@
  * ```js
  * <Toolbar>
  *   <ToolbarActions>
- *     <ToolbarLink @params={{array 'vault.cluster.policy.edit'}}>
+ *     <ToolbarLink @route="vault.cluster.policy.edit">
  *       Edit policy
  *     </ToolbarLink>
  *   </ToolbarActions>

ui/lib/core/addon/components/toolbar-link.hbs

@@ -1,22 +1,36 @@
-{{#let (component "link-to" class="toolbar-link" disabled=@disabled params=@params) as |LinkToComponent|}}
-  {{#if (and @disabled @disabledTooltip)}}
-    <ToolTip @verticalPosition="above" as |T|>
-      <T.Trigger tabindex="-1">
-        <LinkToComponent ...attributes>
-          {{yield}}
-          <Icon @name={{this.glyph}} data-test-icon={{this.glyph}} />
-        </LinkToComponent>
-      </T.Trigger>
-      <T.Content @defaultClass="tool-tip smaller-font">
-        <div class="box" data-test-disabled-tooltip>
-          {{@disabledTooltip}}
-        </div>
-      </T.Content>
-    </ToolTip>
-  {{else}}
-    <LinkToComponent ...attributes>
-      {{yield}}
-      <Icon @name={{this.glyph}} data-test-icon={{this.glyph}} />
-    </LinkToComponent>
-  {{/if}}
-{{/let}}
+{{#if (and @disabled @disabledTooltip)}}
+  <ToolTip @verticalPosition="above" as |T|>
+    <T.Trigger tabindex="-1">
+      <LinkTo
+        class="toolbar-link"
+        ...attributes
+        @route={{@route}}
+        @models={{this.models}}
+        @query={{this.query}}
+        @replace={{@replace}}
+        @disabled={{@disabled}}
+      >
+        {{yield}}
+        <Icon @name={{this.glyph}} data-test-icon={{this.glyph}} />
+      </LinkTo>
+    </T.Trigger>
+    <T.Content @defaultClass="tool-tip smaller-font">
+      <div class="box" data-test-disabled-tooltip>
+        {{@disabledTooltip}}
+      </div>
+    </T.Content>
+  </ToolTip>
+{{else}}
+  <LinkTo
+    class="toolbar-link"
+    ...attributes
+    @route={{@route}}
+    @models={{this.models}}
+    @query={{this.query}}
+    @replace={{@replace}}
+    @disabled={{@disabled}}
+  >
+    {{yield}}
+    <Icon @name={{this.glyph}} data-test-icon={{this.glyph}} />
+  </LinkTo>
+{{/if}}

ui/lib/core/addon/components/toolbar-link.js

@@ -8,14 +8,18 @@ import Component from '@glimmer/component';
  * ```js
  * <Toolbar>
  *   <ToolbarActions>
- *     <ToolbarLink @params={{array 'vault.cluster.policies.create'}} @type="add" @disabled={{true}} @disabledTooltip="This link is disabled">
+ *     <ToolbarLink @route="vault.cluster.policies.create" @type="add" @disabled={{true}} @disabledTooltip="This link is disabled">
  *       Create policy
  *     </ToolbarLink>
  *   </ToolbarActions>
  * </Toolbar>
  * ```
  *
- * @param {array} params - Array to pass to LinkTo
+ * @param {string} route - route to pass to LinkTo
+ * @param {Model} model - model to pass to LinkTo
+ * @param {Array} models - array of models to pass to LinkTo
+ * @param {Object} query - query params to pass to LinkTo
+ * @param {boolean} replace - replace arg to pass to LinkTo
  * @param {string} type - Use "add" to change icon to plus sign, or pass in your own kind of icon.
  * @param {boolean} disabled - pass true to disable link
  * @param {string} disabledTooltip - tooltip to display on hover when disabled
@@ -29,4 +33,14 @@ export default class ToolbarLinkComponent extends Component {
     if (!type) return 'chevron-right';
     return type === 'add' ? 'plus' : type;
   }
+  get models() {
+    const { model, models } = this.args;
+    if (model) {
+      return [model];
+    }
+    return models || [];
+  }
+  get query() {
+    return this.args.query || {};
+  }
 }