From 3ba0248e6a103e3474943388fec85c8867cfb968 Mon Sep 17 00:00:00 2001 From: Falk Date: Mon, 18 Dec 2023 22:41:52 +0100 Subject: [PATCH] feat(cfb-radio-input): add reset button --- .../addon/components/cf-field/input/radio.hbs | 7 ++- .../addon/components/cf-field/input/radio.js | 26 ----------- packages/form/package.json | 1 + .../components/cf-field/input/radio-test.js | 44 +++++++++---------- pnpm-lock.yaml | 4 ++ 5 files changed, 30 insertions(+), 52 deletions(-) delete mode 100644 packages/form/addon/components/cf-field/input/radio.js diff --git a/packages/form/addon/components/cf-field/input/radio.hbs b/packages/form/addon/components/cf-field/input/radio.hbs index bc701b88a6..997d075c40 100644 --- a/packages/form/addon/components/cf-field/input/radio.hbs +++ b/packages/form/addon/components/cf-field/input/radio.hbs @@ -6,13 +6,12 @@ > {{#if (and option.disabled (not @disabled))}} {{/each}} -{{#if (and (eq @field.question.raw.isRequired "false") this.checkedValue)}} +{{#if (and (eq @field.question.raw.isRequired "false") @field.answer.value)}}
- {{t + {{t "caluma.form.power-select.reset" }} diff --git a/packages/form/addon/components/cf-field/input/radio.js b/packages/form/addon/components/cf-field/input/radio.js deleted file mode 100644 index 2e058cab25..0000000000 --- a/packages/form/addon/components/cf-field/input/radio.js +++ /dev/null @@ -1,26 +0,0 @@ -import { action } from "@ember/object"; -import Component from "@glimmer/component"; -import { tracked } from "@glimmer/tracking"; - -export default class CfFieldInputRadioComponent extends Component { - @tracked checkedValue = this.args.field.answer.value; - - @action - updatSelection({ target: { value, checked } }) { - if (this.args.field.question.raw.isRequired === "false" && checked) { - this.checkedValue = value; - } else if (this.args.field.question.raw.isRequired === "true") { - this.args.onSave(value); - } else { - this.args.onSave(null); - } - } - - @action - resetSelected() { - const select = document.getElementById(this.checkedValue); - select.checked = false; - this.checkedValue = null; - this.args.onSave(null); - } -} diff --git a/packages/form/package.json b/packages/form/package.json index 25c3926f29..390896ad41 100644 --- a/packages/form/package.json +++ b/packages/form/package.json @@ -35,6 +35,7 @@ "ember-math-helpers": "^4.0.0", "ember-power-select": "^7.2.0", "ember-resources": "^6.4.2", + "ember-truth-helpers": "^4.0.3", "ember-uikit": "^9.0.0", "ember-validators": "^4.1.2", "graphql": "^15.8.0", diff --git a/packages/form/tests/integration/components/cf-field/input/radio-test.js b/packages/form/tests/integration/components/cf-field/input/radio-test.js index e29398a91f..9bf75e98b0 100644 --- a/packages/form/tests/integration/components/cf-field/input/radio-test.js +++ b/packages/form/tests/integration/components/cf-field/input/radio-test.js @@ -86,32 +86,32 @@ module("Integration | Component | cf-field/input/radio", function (hooks) { }); test("it triggers save on click", async function (assert) { - assert.expect(1); - this.set("field", { - question: { - raw: { - isRequired: "false", - }, - __typename: "ChoiceQuestion", - }, - answer: { - value: "", - }, - options: [ - { - slug: "option-1", - label: "Option 1", - }, - ], + this.set("value", false); + this.set("raw", { isRequired: "false" }); + this.set("onSave", (value) => { + this.set("value", value); + assert.step("save"); }); - this.set("save", (value) => assert.strictEqual(value, "option-1")); - await render( - hbs``, - ); + await render(hbs``); + + await click("label:nth-of-type(1) input"); + await click("[data-test-radio-reset]"); + + assert.verifySteps(["save", "save"]); + this.set("raw", { isRequired: "true" }); await click("label:nth-of-type(1) input"); - assert.equal(true, true); + + assert.verifySteps(["save"]); + assert.dom("[data-test-radio-reset]").isNotVisible(); }); test("it renders disabled options", async function (assert) { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4dd75ced19..8a90988825 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -874,6 +874,9 @@ importers: ember-resources: specifier: ^6.4.2 version: 6.4.2(@ember/test-waiters@3.1.0)(@glimmer/component@1.1.2)(@glimmer/tracking@1.1.2)(@glint/template@1.2.1)(ember-concurrency@3.1.1)(ember-source@5.5.0) + ember-truth-helpers: + specifier: ^4.0.3 + version: 4.0.3(ember-source@5.5.0) ember-uikit: specifier: ^9.0.0 version: 9.0.0(@glint/template@1.2.1)(ember-source@5.5.0)(webpack@5.89.0) @@ -19676,6 +19679,7 @@ packages: ember-power-select: 7.2.0(@babel/core@7.23.6)(@glint/template@1.2.1)(ember-source@5.5.0)(webpack@5.89.0) ember-resources: 6.4.2(@ember/test-waiters@3.1.0)(@glimmer/component@1.1.2)(@glimmer/tracking@1.1.2)(@glint/template@1.2.1)(ember-concurrency@3.1.1)(ember-source@5.5.0) ember-source: 5.5.0(@babel/core@7.23.6)(@glimmer/component@1.1.2)(@glint/template@1.2.1)(rsvp@4.8.5)(webpack@5.89.0) + ember-truth-helpers: 4.0.3(ember-source@5.5.0) ember-uikit: 9.0.0(@glint/template@1.2.1)(ember-source@5.5.0)(webpack@5.89.0) ember-validators: 4.1.2(@glint/template@1.2.1) graphql: 15.8.0