fix: incorporate review feedback

projectcaluma · Dec 19, 2023 · 2a29cfd · 2a29cfd
1 parent fcf947e
commit 2a29cfd
Show file tree

Hide file tree

Showing 11 changed files with 54 additions and 37 deletions.
diff --git a/...n/components/cfb-form-list/copy-modal.hbs → ...components/cfb-form-editor/copy-modal.hbs b/...n/components/cfb-form-list/copy-modal.hbs → ...components/cfb-form-editor/copy-modal.hbs
@@ -1,10 +1,10 @@
-{{#if this.visible}}
-  <UkModal
-    @visible={{this.visible}}
-    @onHide={{fn (mut this.visible) false}}
-    data-test-copy-form-modal
-    as |modal|
-  >
+<UkModal
+  @visible={{this.visible}}
+  @onHide={{fn (mut this.visible) false}}
+  data-test-copy-form-modal
+  as |modal|
+>
+  {{#if this.visible}}
     <ValidatedForm
       @model={{this.changeset}}
       @on-submit={{perform this.submit}}
@@ -26,6 +26,7 @@
           @name="slug"
           @label={{t "caluma.form-builder.copy-modal.slug.label"}}
           @hint={{t "caluma.form-builder.copy-modal.slug.hint" slug=@item.slug}}
+          @renderComponent={{component "cfb-slug-input" hidePrefix=false}}
           data-test-copy-modal-input-slug
         />
       </modal.body>
@@ -43,7 +44,7 @@
         </f.submit>
       </modal.footer>
     </ValidatedForm>
-  </UkModal>
-{{/if}}
+  {{/if}}
+</UkModal>
 
 {{yield (hash toggle=this.toggle)}}
diff --git a/...on/components/cfb-form-list/copy-modal.js → .../components/cfb-form-editor/copy-modal.js b/...on/components/cfb-form-list/copy-modal.js → .../components/cfb-form-editor/copy-modal.js
@@ -10,7 +10,7 @@ import { dropTask } from "ember-concurrency";
 import copyFormMutation from "@projectcaluma/ember-form-builder/gql/mutations/copy-form.graphql";
 import validations from "@projectcaluma/ember-form-builder/validations/form";
 
-export default class componentsCfbFormItemListCopyModal extends Component {
+export default class CfbFormEditorCopyModal extends Component {
   @queryManager apollo;
   @service notification;
   @service router;
@@ -49,21 +49,13 @@ export default class componentsCfbFormItemListCopyModal extends Component {
       );
 
       this.notification.success(
-        this.intl.t(
-          `caluma.form-builder.notification.form.${
-            this.args.slug ? "save" : "create"
-          }.success`,
-        ),
+        this.intl.t("caluma.form-builder.notification.form.create.success"),
       );
 
       this.router.transitionTo("edit", form.slug);
     } catch (e) {
       this.notification.danger(
-        this.intl.t(
-          `caluma.form-builder.notification.form.${
-            this.args.slug ? "save" : "create"
-          }.error`,
-        ),
+        this.intl.t("caluma.form-builder.notification.form.create.error"),
       );
     }
   }

diff --git a/packages/form-builder/addon/components/cfb-form-editor/general.hbs b/packages/form-builder/addon/components/cfb-form-editor/general.hbs
@@ -50,6 +50,15 @@
     />
 
     <div class="uk-text-right">
+      <CfbFormEditor::CopyModal @item={{this.data}} as |modal|>
+        <f.button
+          @disabled={{f.loading}}
+          @label={{t "caluma.form-builder.copy-modal.submit"}}
+          {{on "click" modal.toggle}}
+          data-test-copy-form-button={{@slug}}
+        />
+      </CfbFormEditor::CopyModal>
+
       <f.submit
         @disabled={{f.loading}}
         @label={{t "caluma.form-builder.global.save"}}

diff --git a/packages/form-builder/addon/components/cfb-form-editor/question-list.hbs b/packages/form-builder/addon/components/cfb-form-editor/question-list.hbs
@@ -10,7 +10,7 @@
         type="button"
         class="uk-icon-button uk-animation-slide-top"
         uk-icon="close"
-        title={{t "caluma.form-builder.global.ca    ncel"}}
+        title={{t "caluma.form-builder.global.cancel"}}
         {{on "click" (fn this.setMode "reorder")}}
       >
       </button>

diff --git a/packages/form-builder/addon/components/cfb-form-list/item.hbs b/packages/form-builder/addon/components/cfb-form-list/item.hbs
@@ -7,17 +7,6 @@
   </span>
   <span class="uk-label {{this.labelClass}}">{{this.labelName}}</span>
   <span class="uk-width-auto uk-margin-small-left">
-    <CfbFormList::CopyModal @item={{@item}} as |modal|>
-      <button
-        type="button"
-        uk-icon="copy"
-        class="uk-icon-button"
-        data-test-copy-form-button={{@item.slug}}
-        {{on "click" modal.toggle}}
-      >
-      </button>
-    </CfbFormList::CopyModal>
-
     <button
       data-test-edit-form
       type="button"

diff --git a/packages/form-builder/addon/components/cfb-slug-input.hbs b/packages/form-builder/addon/components/cfb-slug-input.hbs
@@ -14,6 +14,7 @@
         </span>
       {{/if}}
       <input
+        ...attributes
         id={{@inputId}}
         name={{or @inputName @name}}
         type="text"

diff --git a/packages/form-builder/addon/components/cfb-slug-input.js b/packages/form-builder/addon/components/cfb-slug-input.js
@@ -1,4 +1,5 @@
 import { action } from "@ember/object";
+import { scheduleOnce } from "@ember/runloop";
 import { inject as service } from "@ember/service";
 import { htmlSafe } from "@ember/template";
 import Component from "@glimmer/component";
@@ -30,6 +31,16 @@ export default class CfbSlugInputComponent extends Component {
 
   @action
   calculatePadding(element) {
+    // Ensures that the element is already visible in combined use
+    // with modal dialogs.
+    scheduleOnce(
+      "afterRender",
+      this,
+      this._calculatePadding.bind(this, element),
+    );
+  }
+
+  _calculatePadding(element) {
     const prefixWidth = element.clientWidth;
     const prefixMargin = window.getComputedStyle(element).marginLeft;
 

diff --git a/packages/form-builder/tests/acceptance/form-copy-test.js b/packages/form-builder/tests/acceptance/form-copy-test.js
@@ -17,12 +17,15 @@ module("Acceptance | form copy", function (hooks) {
 
     await visit("/");
 
-    assert.dom("[data-test-copy-form-modal]").isNotVisible();
+    await click(
+      `[data-test-form-list-item=${form.slug}] [data-test-edit-form]`,
+    );
 
-    await click(`[data-test-copy-form-button=${form.slug}]`);
+    assert.dom("[data-test-copy-form-modal] form").isNotVisible();
 
-    assert.dom("[data-test-copy-form-modal]").isVisible();
+    await click(`[data-test-copy-form-button=${form.slug}]`);
 
+    assert.dom("[data-test-copy-form-modal] form").isVisible();
     assert.dom("[data-test-copy-modal-input-name]").hasValue(form.name);
     assert.dom("[data-test-copy-modal-input-slug]").hasValue(form.slug);
 

diff --git a/packages/form-builder/translations/de.yaml b/packages/form-builder/translations/de.yaml
@@ -183,7 +183,8 @@ caluma:
       slug:
         label: "Slug"
         hint: "Original: {slug}"
-      submit: "Formular kopieren"
+      submit: "Kopieren"
+
     validations:
       form:
         slug: "Ein Formular mit diesem Slug existiert bereits"

diff --git a/packages/form-builder/translations/en.yaml b/packages/form-builder/translations/en.yaml
@@ -183,7 +183,7 @@ caluma:
       slug:
         label: "Slug"
         hint: "Original: {slug}"
-      submit: "Copy form"
+      submit: "Copy"
 
     validations:
       form:

diff --git a/packages/form-builder/translations/fr.yaml b/packages/form-builder/translations/fr.yaml
@@ -175,6 +175,16 @@ caluma:
           success: "Votre question a été enregistrée avec succès !"
           error: "Oups, quelque chose s'est mal passé lors de l'enregistrement de la question..."
 
+    copy-modal:
+      title: 'Copier "{form}"'
+      name:
+        label: "Nom"
+        hint: "Original : {name}"
+      slug:
+        label: "Slug"
+        hint: "Original : {slug}"
+      submit: "Copier"
+
     validations:
       form:
         slug: "Un formulaire avec ce slug existe déjà"