feat(float): add step configuration

projectcaluma · Jan 21, 2025 · faa50f6 · faa50f6
1 parent e7d1d1c
commit faa50f6
Show file tree

Hide file tree

Showing 15 changed files with 39 additions and 2 deletions.
diff --git a/packages/form-builder/addon/components/cfb-form-editor/question.hbs b/packages/form-builder/addon/components/cfb-form-editor/question.hbs
@@ -212,6 +212,14 @@
               step="any"
             />
           </div>
+          <div>
+            <f.input
+              @type="number"
+              @name="floatStep"
+              @label={{t "caluma.form-builder.question.step"}}
+              step="any"
+            />
+          </div>
         </div>
       {{/if}}
 

diff --git a/packages/form-builder/addon/components/cfb-form-editor/question.js b/packages/form-builder/addon/components/cfb-form-editor/question.js
@@ -97,6 +97,7 @@ export default class CfbFormEditorQuestion extends Component {
             integerMaxValue: null,
             floatMinValue: null,
             floatMaxValue: null,
+            floatStep: null,
             minLength: null,
             maxLength: null,
             defaultAnswer: null,
@@ -253,6 +254,7 @@ export default class CfbFormEditorQuestion extends Component {
     return {
       minValue: parseFloat(changeset.get("floatMinValue")),
       maxValue: parseFloat(changeset.get("floatMaxValue")),
+      step: parseFloat(changeset.get("floatStep")),
       placeholder: changeset.get("placeholder"),
       hintText: changeset.get("hintText"),
     };

diff --git a/packages/form-builder/addon/gql/mutations/save-float-question.graphql b/packages/form-builder/addon/gql/mutations/save-float-question.graphql
@@ -8,6 +8,7 @@ mutation SaveFloatQuestion($input: SaveFloatQuestionInput!) {
       ... on FloatQuestion {
         floatMinValue: minValue
         floatMaxValue: maxValue
+        floatStep: step
         hintText
       }
     }

diff --git a/packages/form-builder/addon/gql/queries/form-editor-question.graphql b/packages/form-builder/addon/gql/queries/form-editor-question.graphql
@@ -20,6 +20,7 @@ query FormEditorQuestion($slug: String!) {
         ... on FloatQuestion {
           floatMaxValue: maxValue
           floatMinValue: minValue
+          floatStep: step
           placeholder
           hintText
           defaultAnswer {

diff --git a/packages/form-builder/addon/validations/question.js b/packages/form-builder/addon/validations/question.js
@@ -53,6 +53,10 @@ export default {
       validateGtLt({ gt: "floatMinValue", allowNone: true }),
     ),
   ),
+  floatStep: or(
+    validateType("FloatQuestion", false),
+    validateNumber({ gt: 0, allowBlank: true }),
+  ),
 
   minLength: or(
     and(

diff --git a/packages/form-builder/tests/integration/components/cfb-form-editor/question-test.js b/packages/form-builder/tests/integration/components/cfb-form-editor/question-test.js
@@ -303,7 +303,7 @@ module("Integration | Component | cfb-form-editor/question", function (hooks) {
   });
 
   test("it can create a float question", async function (assert) {
-    assert.expect(7);
+    assert.expect(8);
 
     this.server.create("form", { slug: "test-form" });
 
@@ -313,6 +313,7 @@ module("Integration | Component | cfb-form-editor/question", function (hooks) {
       assert.strictEqual(question.slug, "slug");
       assert.strictEqual(question.floatMinValue, -20);
       assert.strictEqual(question.floatMaxValue, 20);
+      assert.strictEqual(question.floatStep, 0.5);
 
       assert.step("after-submit");
     });
@@ -330,6 +331,7 @@ module("Integration | Component | cfb-form-editor/question", function (hooks) {
     await fillIn("[name=slug]", "slug");
     await fillIn("[name=floatMinValue]", -20);
     await fillIn("[name=floatMaxValue]", 20);
+    await fillIn("[name=floatStep]", 0.5);
 
     await click("button[type=submit]");
 

diff --git a/packages/form-builder/translations/de.yaml b/packages/form-builder/translations/de.yaml
@@ -72,6 +72,7 @@ caluma:
       max-value: "Maximaler Wert"
       min-length: "Minimale Länge"
       max-length: "Maximale Länge"
+      step: "Schritte"
       rowForm: "Formular für Tabelleneinträge"
       subForm: "Formular für Einträge"
       no-selection: "Keine Auswahl"

diff --git a/packages/form-builder/translations/en.yaml b/packages/form-builder/translations/en.yaml
@@ -72,6 +72,7 @@ caluma:
       max-value: "Maximum value"
       min-length: "Minimum length"
       max-length: "Maximum length"
+      step: "Steps"
       rowForm: "Form to use for rows"
       subForm: "Form to use for entries"
       no-selection: "No selection"

diff --git a/packages/form-builder/translations/fr.yaml b/packages/form-builder/translations/fr.yaml
@@ -72,6 +72,7 @@ caluma:
       max-value: "Valeur maximale"
       min-length: "Longueur minimale"
       max-length: "Longueur maximale"
+      step: "Étapes"
       rowForm: "Formulaire pour les entrées de tableau"
       subForm: "Formulaire pour les entrées"
       no-selection: "Aucune sélection"

diff --git a/packages/form-builder/translations/it.yaml b/packages/form-builder/translations/it.yaml
@@ -72,6 +72,7 @@ caluma:
       max-value: "Valore massimo"
       min-length: "Lunghezza minima"
       max-length: "Lunghezza massima"
+      step: "Passi"
       rowForm: "Modulo per righe delle tabelle"
       subForm: "Modulo per voci"
       no-selection: "Nessuna selezione"

diff --git a/packages/form/addon/components/cf-field/input/float.hbs b/packages/form/addon/components/cf-field/input/float.hbs
@@ -1,6 +1,6 @@
 <input
   type="number"
-  step="0.001"
+  step={{this.floatStep}}
   class="uk-input
     {{if @field.isInvalid 'uk-form-danger'}}
     {{if this.disabled 'uk-disabled'}}"

diff --git a/packages/form/addon/components/cf-field/input/float.js b/packages/form/addon/components/cf-field/input/float.js
@@ -1,3 +1,4 @@
+import { getOwner } from "@ember/application";
 import { action } from "@ember/object";
 import Component from "@glimmer/component";
 
@@ -6,6 +7,16 @@ export default class CfFieldInputFloatComponent extends Component {
     return this.args.disabled || this.args.field?.question.isCalculated;
   }
 
+  get floatStep() {
+    if (this.args.field?.question?.raw?.floatStep) {
+      return this.args.field.question.raw.floatStep;
+    }
+
+    const config = getOwner(this).resolveRegistration("config:environment");
+    const { floatStep = 0.001 } = config["ember-caluma"] || {};
+    return floatStep;
+  }
+
   /**
    * Trigger save on input
    *

diff --git a/packages/form/addon/gql/fragments/field.graphql b/packages/form/addon/gql/fragments/field.graphql
@@ -57,6 +57,7 @@ fragment SimpleQuestion on Question {
   ... on FloatQuestion {
     floatMinValue: minValue
     floatMaxValue: maxValue
+    floatStep: step
     floatDefaultAnswer: defaultAnswer {
       id
       value

diff --git a/packages/form/tests/integration/components/cf-field/input/float-test.js b/packages/form/tests/integration/components/cf-field/input/float-test.js
@@ -16,6 +16,7 @@ module("Integration | Component | cf-field/input/float", function (hooks) {
           isCalculated: false,
           floatMinValue: 0.4,
           floatMaxValue: 1.4,
+          floatStep: 0.001,
         },
       },
     });

diff --git a/packages/testing/addon/mirage-graphql/schema.graphql b/packages/testing/addon/mirage-graphql/schema.graphql
@@ -1559,6 +1559,7 @@ type FloatQuestion implements Question & Node {
   id: ID!
   minValue: Float
   maxValue: Float
+  step: Float
 }
 
 type Flow implements Node {
@@ -3153,6 +3154,7 @@ input SaveFloatQuestionInput {
   isArchived: Boolean
   minValue: Float
   maxValue: Float
+  step: Float
   placeholder: String
   hintText: String
   clientMutationId: String