@projectcaluma/ember-form-builder 10.0.2 → 11.0.0-beta.3

package/addon/components/cfb-form-list.js

@@ -1,17 +1,16 @@
-import { action } from "@ember/object";
 import Component from "@glimmer/component";
 import { tracked } from "@glimmer/tracking";
-import { queryManager } from "ember-apollo-client";
-import { timeout } from "ember-concurrency";
-import { restartableTask } from "ember-concurrency-decorators";
+import { timeout, restartableTask } from "ember-concurrency";
 
-import calumaQuery from "@projectcaluma/ember-core/caluma-query";
+import { useCalumaQuery } from "@projectcaluma/ember-core/caluma-query";
 import { allForms } from "@projectcaluma/ember-core/caluma-query/queries";
 
 export default class ComponentsCfbFormListComponent extends Component {
-  @queryManager apollo;
-
-  @calumaQuery({ query: allForms, options: { pageSize: 20 } }) formsQuery;
+  formsQuery = useCalumaQuery(this, allForms, () => ({
+    options: { pageSize: 20 },
+    filter: this.filter,
+    order: [{ attribute: "NAME", direction: "ASC" }],
+  }));
 
   @tracked category = "active";
   @tracked search = "";
@@ -29,33 +28,11 @@ export default class ComponentsCfbFormListComponent extends Component {
     return [isArchived, search].filter(Boolean) || null;
   }
 
-  @action
-  setFilter(name, eventOrValue) {
-    this[name] =
-      eventOrValue instanceof Event ? eventOrValue.target.value : eventOrValue;
-
-    this.fetchForms.perform();
-  }
-
-  @action
-  submit(event) {
-    event.preventDefault();
-  }
-
-  @action
-  loadMoreForms(e) {
-    e.preventDefault();
-
-    this.formsQuery.fetchMore();
-  }
-
   @restartableTask
-  *fetchForms() {
+  *setFilter(name, eventOrValue) {
     yield timeout(500);
 
-    yield this.formsQuery.fetch({
-      filter: this.filter,
-      order: [{ attribute: "NAME", direction: "ASC" }],
-    });
+    this[name] =
+      eventOrValue instanceof Event ? eventOrValue.target.value : eventOrValue;
   }
 }

package/addon/components/cfb-navigation.hbs

@@ -4,7 +4,7 @@
       <LinkTo
         @route={{crumb.routeName}}
         class="uk-text-large uk-text-truncate cfb-navigation__item__link
-          {{if crumb.disabled "uk-disabled"}}"
+          {{if crumb.disabled 'uk-disabled'}}"
       >
         {{crumb.title}}
       </LinkTo>

package/addon/components/cfb-toggle-switch.hbs

@@ -1,4 +1,4 @@
-<div class="uk-flex uk-flex-column {{unless @noMargin "uk-margin"}}">
+<div class="uk-flex uk-flex-column {{unless @noMargin 'uk-margin'}}">
   <@labelComponent />
 
   <div class="uk-form-controls" ...attributes>
@@ -7,7 +7,7 @@
       @size={{@size}}
       @name={{@name}}
       @disabled={{@disabled}}
-      @on-toggle={{@update}}
+      @onToggle={{@update}}
     />
   </div>
 

package/addon/engine.js

@@ -6,16 +6,13 @@ import config from "./config/environment";
 
 const { modulePrefix } = config;
 
-/* eslint-disable ember/avoid-leaking-state-in-ember-objects */
-const Eng = Engine.extend({
-  modulePrefix,
-  Resolver,
+export default class FormBuilderEngine extends Engine {
+  modulePrefix = modulePrefix;
+  Resolver = Resolver;
 
-  dependencies: {
+  dependencies = {
     services: ["apollo", "notification", "intl", "caluma-options", "validator"],
-  },
-});
+  };
+}
 
-loadInitializers(Eng, modulePrefix);
-
-export default Eng;
+loadInitializers(FormBuilderEngine, modulePrefix);

package/addon/gql/fragments/field.graphql

@@ -1,9 +1,10 @@
 # We can not symlink this file so an exact copy exists in another package:
-# packages/form/addon/gql/fragments/field.graphql
+# packages/form-builder/addon/gql/fragments/field.graphql
 #
 # When changing this file the other must also receive the same changes.
 
 fragment SimpleQuestion on Question {
+  id
   slug
   label
   isRequired
@@ -14,6 +15,7 @@ fragment SimpleQuestion on Question {
     textMinLength: minLength
     textMaxLength: maxLength
     textDefaultAnswer: defaultAnswer {
+      id
       value
     }
     placeholder
@@ -22,6 +24,7 @@ fragment SimpleQuestion on Question {
     textareaMinLength: minLength
     textareaMaxLength: maxLength
     textareaDefaultAnswer: defaultAnswer {
+      id
       value
     }
     placeholder
@@ -30,6 +33,7 @@ fragment SimpleQuestion on Question {
     integerMinValue: minValue
     integerMaxValue: maxValue
     integerDefaultAnswer: defaultAnswer {
+      id
       value
     }
     placeholder
@@ -38,6 +42,7 @@ fragment SimpleQuestion on Question {
     floatMinValue: minValue
     floatMaxValue: maxValue
     floatDefaultAnswer: defaultAnswer {
+      id
       value
     }
     placeholder
@@ -46,6 +51,7 @@ fragment SimpleQuestion on Question {
     choiceOptions: options {
       edges {
         node {
+          id
           slug
           label
           isArchived
@@ -53,6 +59,7 @@ fragment SimpleQuestion on Question {
       }
     }
     choiceDefaultAnswer: defaultAnswer {
+      id
       value
     }
   }
@@ -60,6 +67,7 @@ fragment SimpleQuestion on Question {
     multipleChoiceOptions: options {
       edges {
         node {
+          id
           slug
           label
           isArchived
@@ -67,11 +75,13 @@ fragment SimpleQuestion on Question {
       }
     }
     multipleChoiceDefaultAnswer: defaultAnswer {
+      id
       value
     }
   }
   ... on DateQuestion {
     dateDefaultAnswer: defaultAnswer {
+      id
       value
     }
   }
@@ -89,8 +99,10 @@ fragment SimpleQuestion on Question {
 }
 
 fragment FieldTableQuestion on Question {
+  id
   ... on TableQuestion {
     rowForm {
+      id
       slug
       questions {
         edges {
@@ -101,6 +113,7 @@ fragment FieldTableQuestion on Question {
       }
     }
     tableDefaultAnswer: defaultAnswer {
+      id
       value {
         id
         answers {
@@ -108,6 +121,7 @@ fragment FieldTableQuestion on Question {
             node {
               id
               question {
+                id
                 slug
               }
               ... on StringAnswer {
@@ -134,10 +148,12 @@ fragment FieldTableQuestion on Question {
 }
 
 fragment FieldQuestion on Question {
+  id
   ...SimpleQuestion
   ...FieldTableQuestion
   ... on FormQuestion {
     subForm {
+      id
       slug
       name
       questions {
@@ -145,10 +161,12 @@ fragment FieldQuestion on Question {
           node {
             # This part here limits our query to 2 level deep nested forms. This
             # has to be solved in another way!
+            id
             ...SimpleQuestion
             ...FieldTableQuestion
             ... on FormQuestion {
               subForm {
+                id
                 slug
                 name
                 questions {
@@ -171,6 +189,7 @@ fragment FieldQuestion on Question {
 fragment SimpleAnswer on Answer {
   id
   question {
+    id
     slug
   }
   ... on StringAnswer {
@@ -187,6 +206,7 @@ fragment SimpleAnswer on Answer {
   }
   ... on FileAnswer {
     fileValue: value {
+      id
       uploadUrl
       downloadUrl
       metadata
@@ -199,11 +219,13 @@ fragment SimpleAnswer on Answer {
 }
 
 fragment FieldAnswer on Answer {
+  id
   ...SimpleAnswer
   ... on TableAnswer {
     tableValue: value {
       id
       form {
+        id
         slug
         questions {
           edges {

package/addon/gql/fragments/form-info.graphql

@@ -1,4 +1,5 @@
 fragment FormInfo on Form {
+  id
   name
   slug
   description

package/addon/gql/fragments/question-info.graphql

@@ -1,4 +1,5 @@
 fragment QuestionInfo on Question {
+  id
   slug
   label
   isRequired

package/addon/gql/mutations/add-form-question.graphql

@@ -4,10 +4,12 @@
 mutation AddFormQuestion($input: AddFormQuestionInput!, $search: String) {
   addFormQuestion(input: $input) {
     form {
+      id
       ...FormInfo
       questions(search: $search) {
         edges {
           node {
+            id
             ...QuestionInfo
           }
         }

package/addon/gql/mutations/remove-form-question.graphql

@@ -4,10 +4,12 @@
 mutation RemoveFormQuestion($input: RemoveFormQuestionInput!, $search: String) {
   removeFormQuestion(input: $input) {
     form {
+      id
       ...FormInfo
       questions(search: $search) {
         edges {
           node {
+            id
             ...QuestionInfo
           }
         }

package/addon/gql/mutations/reorder-form-questions.graphql

@@ -7,10 +7,12 @@ mutation ReorderFormQuestions(
 ) {
   reorderFormQuestions(input: $input) {
     form {
+      id
       ...FormInfo
       questions(search: $search) {
         edges {
           node {
+            id
             ...QuestionInfo
           }
         }

package/addon/gql/mutations/save-action-button-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveActionButtonQuestion($input: SaveActionButtonQuestionInput!) {
   saveActionButtonQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on ActionButtonQuestion {
         action

package/addon/gql/mutations/save-calculated-float-question.graphql

@@ -5,6 +5,7 @@ mutation SaveCalculatedFloatQuestion(
 ) {
   saveCalculatedFloatQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on CalculatedFloatQuestion {
         calcExpression

package/addon/gql/mutations/save-choice-question.graphql

@@ -3,11 +3,13 @@
 mutation SaveChoiceQuestion($input: SaveChoiceQuestionInput!) {
   saveChoiceQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on ChoiceQuestion {
         options {
           edges {
             node {
+              id
               label
               slug
             }

package/addon/gql/mutations/save-date-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveDateQuestion($input: SaveDateQuestionInput!) {
   saveDateQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
     }
     clientMutationId

package/addon/gql/mutations/save-dynamic-choice-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveDynamicChoiceQuestion($input: SaveDynamicChoiceQuestionInput!) {
   saveDynamicChoiceQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on DynamicChoiceQuestion {
         dataSource

package/addon/gql/mutations/save-dynamic-multiple-choice-question.graphql

@@ -5,6 +5,7 @@ mutation SaveDynamicMultipleChoiceQuestion(
 ) {
   saveDynamicMultipleChoiceQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on DynamicMultipleChoiceQuestion {
         dataSource

package/addon/gql/mutations/save-file-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveFileQuestion($input: SaveFileQuestionInput!) {
   saveFileQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
     }
     clientMutationId

package/addon/gql/mutations/save-float-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveFloatQuestion($input: SaveFloatQuestionInput!) {
   saveFloatQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on FloatQuestion {
         floatMinValue: minValue

package/addon/gql/mutations/save-form-question.graphql

@@ -3,9 +3,11 @@
 mutation SaveFormQuestion($input: SaveFormQuestionInput!) {
   saveFormQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on FormQuestion {
         subForm {
+          id
           slug
         }
       }

package/addon/gql/mutations/save-form.graphql

@@ -3,6 +3,7 @@
 mutation SaveForm($input: SaveFormInput!) {
   saveForm(input: $input) {
     form {
+      id
       ...FormInfo
     }
     clientMutationId

package/addon/gql/mutations/save-integer-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveIntegerQuestion($input: SaveIntegerQuestionInput!) {
   saveIntegerQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on IntegerQuestion {
         integerMinValue: minValue

package/addon/gql/mutations/save-multiple-choice-question.graphql

@@ -3,11 +3,13 @@
 mutation SaveMultipleChoiceQuestion($input: SaveMultipleChoiceQuestionInput!) {
   saveMultipleChoiceQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on MultipleChoiceQuestion {
         options {
           edges {
             node {
+              id
               label
               slug
             }

package/addon/gql/mutations/save-option.graphql

@@ -1,6 +1,7 @@
 mutation SaveOption($input: SaveOptionInput!) {
   saveOption(input: $input) {
     option {
+      id
       label
       slug
     }

package/addon/gql/mutations/save-static-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveStaticQuestion($input: SaveStaticQuestionInput!) {
   saveStaticQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on StaticQuestion {
         staticContent

package/addon/gql/mutations/save-table-question.graphql

@@ -3,9 +3,11 @@
 mutation SaveTableQuestion($input: SaveTableQuestionInput!) {
   saveTableQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on TableQuestion {
         rowForm {
+          id
           slug
         }
       }

package/addon/gql/mutations/save-text-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveTextQuestion($input: SaveTextQuestionInput!) {
   saveTextQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on TextQuestion {
         minLength

package/addon/gql/mutations/save-textarea-question.graphql

@@ -3,6 +3,7 @@
 mutation SaveTextareaQuestion($input: SaveTextareaQuestionInput!) {
   saveTextareaQuestion(input: $input) {
     question {
+      id
       ...QuestionInfo
       ... on TextareaQuestion {
         minLength

package/addon/gql/queries/check-form-slug.graphql

@@ -2,6 +2,7 @@ query CheckFormSlug($slug: String!) {
   allForms(filter: [{ slug: $slug }]) {
     edges {
       node {
+        id
         slug
       }
     }

package/addon/gql/queries/check-question-slug.graphql

@@ -2,6 +2,7 @@ query CheckQuestionSlug($slug: String!) {
   allQuestions(filter: [{ slug: $slug }]) {
     edges {
       node {
+        id
         slug
       }
     }

package/addon/gql/queries/form-editor-general.graphql

@@ -4,6 +4,7 @@ query FormEditorGeneral($slug: String!) {
   allForms(filter: [{ slug: $slug }]) {
     edges {
       node {
+        id
         ...FormInfo
       }
     }

package/addon/gql/queries/form-editor-question.graphql

@@ -5,6 +5,7 @@ query FormEditorQuestion($slug: String!) {
   allQuestions(filter: [{ slug: $slug }]) {
     edges {
       node {
+        id
         ...QuestionInfo
         ... on IntegerQuestion {
           integerMaxValue: maxValue
@@ -52,6 +53,7 @@ query FormEditorQuestion($slug: String!) {
           options {
             edges {
               node {
+                id
                 label
                 slug
                 isArchived
@@ -67,6 +69,7 @@ query FormEditorQuestion($slug: String!) {
           options {
             edges {
               node {
+                id
                 label
                 slug
                 isArchived
@@ -86,10 +89,12 @@ query FormEditorQuestion($slug: String!) {
         }
         ... on TableQuestion {
           rowForm {
+            id
             slug
             questions {
               edges {
                 node {
+                  id
                   slug
                   label
                 }
@@ -101,6 +106,7 @@ query FormEditorQuestion($slug: String!) {
             tableValue: value {
               id
               form {
+                id
                 slug
                 questions {
                   edges {
@@ -122,6 +128,7 @@ query FormEditorQuestion($slug: String!) {
         }
         ... on FormQuestion {
           subForm {
+            id
             slug
           }
         }

package/addon/gql/queries/form-list.graphql

@@ -4,6 +4,7 @@ query FormList($filter: [FormFilterSetType], $order: [FormOrderSetType]) {
   allForms(filter: $filter, order: $order) {
     edges {
       node {
+        id
         ...FormInfo
       }
     }

package/addon/gql/queries/search-form-question.graphql

@@ -4,19 +4,23 @@ query SearchFormQuestion($slug: String!, $search: String, $archived: Boolean) {
   allForms(filter: [{ slug: $slug }]) {
     edges {
       node {
+        id
         slug
         questions(search: $search, isArchived: $archived) {
           edges {
             node {
+              id
               ...QuestionInfo
               ... on FormQuestion {
                 subForm {
+                  id
                   slug
                   name
                 }
               }
               ... on TableQuestion {
                 rowForm {
+                  id
                   slug
                   name
                 }

package/addon/gql/queries/search-question.graphql

@@ -22,15 +22,18 @@ query SearchQuestion(
     totalCount
     edges {
       node {
+        id
         ...QuestionInfo
         ... on FormQuestion {
           subForm {
+            id
             slug
             name
           }
         }
         ... on TableQuestion {
           rowForm {
+            id
             slug
             name
           }

package/addon/routes/edit/questions/edit.js

@@ -1,7 +1,7 @@
 import Route from "@ember/routing/route";
 import { inject as service } from "@ember/service";
 import { queryManager } from "ember-apollo-client";
-import { lastValue, dropTask } from "ember-concurrency-decorators";
+import { lastValue, dropTask } from "ember-concurrency";
 import { gql } from "graphql-tag";
 
 import { navigationTitle } from "@projectcaluma/ember-form-builder/decorators";

package/addon/routes/edit.js

@@ -1,7 +1,7 @@
 import Route from "@ember/routing/route";
 import { inject as service } from "@ember/service";
 import { queryManager } from "ember-apollo-client";
-import { lastValue, dropTask } from "ember-concurrency-decorators";
+import { lastValue, dropTask } from "ember-concurrency";
 import { gql } from "graphql-tag";
 
 import { navigationTitle } from "@projectcaluma/ember-form-builder/decorators";

package/addon/templates/edit/questions/edit.hbs

@@ -1,5 +1,5 @@
 <CfbFormEditor::Question
   @slug={{@model.questionSlug}}
   @form={{@model.formSlug}}
-  @on-after-submit={{this.afterSubmit}}
+  @onAfterSubmit={{this.afterSubmit}}
 />

package/addon/templates/edit/questions/new.hbs

@@ -1,4 +1 @@
-<CfbFormEditor::Question
-  @form={{@model}}
-  @on-after-submit={{this.afterSubmit}}
-/>
+<CfbFormEditor::Question @form={{@model}} @onAfterSubmit={{this.afterSubmit}} />