fix(analytics): improve alias save

auto save alias input

packages/analytics/addon/components/ca-field-selector-list.hbs

@@ -21,7 +21,7 @@
           <td>
             <CaFieldSelectorList::CaFieldAliasInput
               @value={{field.alias}}
-              @onSave={{fn update "alias"}}
+              @onInput={{fn update "alias"}}
             />
           </td>
           <td>

packages/analytics/addon/components/ca-field-selector-list/ca-field-alias-input.hbs

@@ -1,21 +1,7 @@
-<div class="uk-inline">
-  <button
-    data-test-delete-field
-    type="button"
-    class="uk-form-icon uk-form-icon-flip"
-    uk-icon="check"
-    hidden={{not this.hasChanged}}
-    name={{t "caluma.analytics.edit.delete-field"}}
-    {{on "click" this.trimAndSave}}
-  >
-    <span hidden>{{t "caluma.analytics.edit.delete-field"}}</span>
-  </button>
-
-  <input
-    data-test-field-alias-input
-    aria-label={{t "caluma.analytics.edit.display-title"}}
-    class="uk-input {{if this.hasChanged 'uk-form-success'}}"
-    value={{this.value}}
-    {{on "input" (perform this.debounceInput)}}
-  />
-</div>
+<input
+  data-test-field-alias-input
+  aria-label={{t "caluma.analytics.edit.display-title"}}
+  class="uk-input"
+  value={{@value}}
+  {{on "input" (perform this.debounceInput)}}
+/>

packages/analytics/addon/components/ca-field-selector-list/ca-field-alias-input.js

@@ -1,28 +1,10 @@
-import { action } from "@ember/object";
 import Component from "@glimmer/component";
-import { tracked } from "@glimmer/tracking";
 import { restartableTask, timeout } from "ember-concurrency";
 
 export default class CaFieldSelectorListCaFieldAliasInputComponent extends Component {
-  @tracked _value = null;
-
-  get value() {
-    return this._value ?? this.args.value;
-  }
-
-  get hasChanged() {
-    return this._value !== null && this._value !== this.args.value;
-  }
-
-  @action
-  async trimAndSave() {
-    await this.args.onSave(this._value);
-    this._value = null;
-  }
-
   @restartableTask
   *debounceInput(event) {
-    yield timeout(200);
-    this._value = event.target.value;
+    yield timeout(500);
+    yield this.args.onInput(event.target.value);
   }
 }

packages/analytics/tests/integration/components/ca-field-selector-list/ca-field-alias-input-test.js

@@ -1,4 +1,4 @@
-import { render, fillIn, click } from "@ember/test-helpers";
+import { render, fillIn } from "@ember/test-helpers";
 import { hbs } from "ember-cli-htmlbars";
 import { setupIntl } from "ember-intl/test-support";
 import { setupRenderingTest } from "ember-qunit";
@@ -11,7 +11,7 @@ module(
     setupIntl(hooks, ["en"]);
 
     test("it renders", async function (assert) {
-      assert.expect(7);
+      assert.expect(4);
 
       this.set("alias", "some-alias");
       this.set("onSave", (newAlias) => {
@@ -20,20 +20,12 @@ module(
       });
 
       await render(
-        hbs`<CaFieldSelectorList::CaFieldAliasInput @value={{this.alias}} @onSave={{this.onSave}} />`
+        hbs`<CaFieldSelectorList::CaFieldAliasInput @value={{this.alias}} @onInput={{this.onSave}} />`
       );
-      assert.dom("[data-test-delete-field]").isNotVisible();
       assert.dom("[data-test-field-alias-input]").hasValue(this.alias);
 
       await fillIn("[data-test-field-alias-input]", "changed alias");
 
-      assert.dom("[data-test-delete-field]").isVisible();
-      assert
-        .dom("[data-test-delete-field]")
-        .hasText(this.intl.t("caluma.analytics.edit.delete-field"));
-
-      await click("button[data-test-delete-field]");
-
       assert.verifySteps(["save"]);
       assert.dom("[data-test-field-alias-input]").hasValue("changed alias");
     });

packages/analytics/translations/de.yaml

@@ -15,7 +15,7 @@ caluma:
       create-error: Beim Erstellen ist ein Fehler aufgetreten.
       fetch-error: Beim Laden der Daten ist ein Fehler aufgetreten.
       filter-exists: Filter existiert bereits!!
-      field-saved: Feld gespeichert..
+      field-saved: Feld gespeichert.
     list:
       list-title: Liste aller Auswertungen
       edit: Bearbeiten