fix(deps): update ember-changeset and ember-changeset-validations

.dependabot/config.yml

@@ -14,15 +14,6 @@ update_configs:
           dependency_type: "production"
           update_type: "in_range"
     ignored_updates:
-      # ember-changeset and ember-changeset-validations v3+ require Proxy
-      # objects which do not work in IE11
-      - match:
-          dependency_name: "ember-changeset"
-          version_requirement: ">= 3"
-      - match:
-          dependency_name: "ember-changeset-validations"
-          version_requirement: ">= 3"
-
       # graphql-tools v5+ breaks generic mocking
       - match:
           dependency_name: "graphql-tools"

addon/components/cfb-form-editor/question.js

@@ -307,7 +307,7 @@ export default Component.extend({
                 slug,
                 isHidden: changeset.get("isHidden"),
                 infoText: changeset.get("infoText"),
-                meta: JSON.stringify(changeset.get("meta")),
+                meta: JSON.stringify(changeset.get("meta").unwrap()),
                 isArchived: changeset.get("isArchived"),
                 clientMutationId: v4(),
               },
@@ -397,11 +397,11 @@ export default Component.extend({
      * list if it isnt present, otherwise it will remove the slug.
      */
     toggleColumnToDisplay(value) {
-      let displayed = new Set(this.get("model.meta.columnsToDisplay"));
+      const displayed = new Set(this.changeset.get("meta.columnsToDisplay"));
 
       displayed.delete(value) || displayed.add(value);
 
-      this.set("model.meta.columnsToDisplay", [...displayed]);
+      this.changeset.set("meta.columnsToDisplay", [...displayed]);
     },
   },
 });

addon/components/cfb-form-editor/question/options.js

@@ -57,7 +57,7 @@ export default RenderComponent.extend({
   _update() {
     this.update({
       edges: this.optionRows
-        .filter((row) => !get(row, "isNew") || get(row, "isDirty"))
+        .filter((row) => !row.isNew || row.isDirty)
         .map((row) => {
           const { label, slug, isArchived } = Object.assign(
             {},

addon/templates/components/cfb-form-editor/question.hbs

@@ -140,6 +140,8 @@
           placeholder=(t "caluma.form-builder.question.choose")
           required=false
           renderComponent=(component "cfb-form-editor/question/validation")
+          on-update=(changeset-set f.model "meta.formatValidators")
+          value=(changeset-get f.model "meta.formatValidators")
         }}
       {{/if}}
 
@@ -215,6 +217,8 @@
             label=(t "caluma.form-builder.question.hideLabel")
             renderComponent=(component "cfb-toggle-switch" size="small")
             class="uk-flex uk-flex-between uk-flex-column"
+            on-update=(changeset-set f.model "meta.hideLabel")
+            value=(changeset-get f.model "meta.hideLabel")
           }}
         </div>
       {{/if}}

addon/utils/and.js

@@ -1,4 +1,4 @@
-import isPromise from "ember-changeset/utils/is-promise";
+import { isPromise } from "validated-changeset";
 import { typeOf } from "@ember/utils";
 
 function notTrue(value) {

addon/utils/or.js

@@ -1,4 +1,4 @@
-import isPromise from "ember-changeset/utils/is-promise";
+import { isPromise } from "validated-changeset";
 
 function isTrue(value) {
   return value === true;

ember-cli-build.js

@@ -11,6 +11,9 @@ module.exports = function (defaults) {
     babel: {
       plugins: ["@babel/plugin-proposal-object-rest-spread"],
     },
+    "ember-cli-babel": {
+      includePolyfill: process.env.EMBER_ENV === "production",
+    },
     emberApolloClient: {
       keepGraphqlFileExtension: true,
     },

index.js

@@ -9,6 +9,7 @@ const EngineAddon = require("ember-engines/lib/engine-addon");
 
 const DEFAULT_OPTIONS = {
   includeMirageConfig: true,
+  includeProxyPolyfill: true,
 };
 
 /* eslint-disable ember/avoid-leaking-state-in-ember-objects */
@@ -22,22 +23,27 @@ module.exports = EngineAddon.extend({
     plugins: ["@babel/plugin-proposal-object-rest-spread"],
   },
 
+  _getOptions() {
+    const app = this._findHost();
+
+    return Object.assign({}, DEFAULT_OPTIONS, app.options["ember-caluma"]);
+  },
+
   included() {
     this._super.included.apply(this, arguments);
+
+    if (this._getOptions().includeProxyPolyfill) {
+      this.import("node_modules/proxy-polyfill/proxy.min.js");
+    }
   },
 
   treeForApp(appTree) {
     const trees = [appTree];
 
     const app = this._findHost();
-    const addonOptions = Object.assign(
-      {},
-      DEFAULT_OPTIONS,
-      app.options["ember-caluma"]
-    );
 
     if (
-      addonOptions.includeMirageConfig &&
+      this._getOptions().includeMirageConfig &&
       app.registry.availablePlugins["ember-cli-mirage"]
     ) {
       const mirageDir = path.join(__dirname, "addon-mirage-support");

package.json

@@ -38,8 +38,8 @@
     "broccoli-merge-trees": "^4.2.0",
     "ember-apollo-client": "^2.2.0",
     "ember-auto-import": "^1.7.0",
-    "ember-changeset": "^2.2.5",
-    "ember-changeset-validations": "^2.2.1",
+    "ember-changeset": "^3.10.1",
+    "ember-changeset-validations": "^3.10.0",
     "ember-cli-babel": "^7.23.0",
     "ember-cli-htmlbars": "^5.3.1",
     "ember-cli-sass": "^10.0.0",
@@ -53,14 +53,15 @@
     "ember-power-select": "^4.1.0",
     "ember-test-selectors": "^5.0.0",
     "ember-uikit": "^2.2.0",
-    "ember-validated-form": "^3.0.0",
+    "ember-validated-form": "^3.0.1",
     "graphql": "^15.4.0",
     "graphql-iso-date": "^3.6.1",
     "graphql-tag": "^2.11.0",
     "graphql-tools": "^4.0.8",
     "jexl": "^2.3.0",
     "lodash.clonedeep": "^4.5.0",
     "moment": "2.24.0",
+    "proxy-polyfill": "^0.3.2",
     "sass": "^1.29.0",
     "slugify": "^1.4.6",
     "uuid": "^8.3.1"
@@ -123,7 +124,6 @@
   },
   "resolutions": {
     "**/ember-test-waiters": "^2.1.3",
-    "ember-changeset-validations/ember-changeset": "^2.2.5",
     "**/ember-get-config": "^0.3.0",
     "**/ember-truth-helpers": "^3.0.0"
   },

tests/dummy/app/snippets/config/ember-cli-build.js

@@ -0,0 +1,15 @@
+"use strict";
+
+const EmberApp = require("ember-cli/lib/broccoli/ember-app");
+
+module.exports = function (defaults) {
+  let app = new EmberApp(defaults, {
+    "ember-caluma": {
+      includeProxyPolyfill: false,
+    },
+  });
+
+  // ...
+
+  return app.toTree();
+};

tests/dummy/app/templates/docs/index.md

@@ -13,8 +13,8 @@ mounted in `app/router.js`:
 {{docs-snippet name='usage/router.js'}}
 
 To make `ember-apollo-client` work, we need to pass it as dependency for our
-engine in `app/app.js`. Additionally, we need to specify `ember-intl` as a 
-dependency so that the the application has access to the addon's translations. 
+engine in `app/app.js`. Additionally, we need to specify `ember-intl` as a
+dependency so that the the application has access to the addon's translations.
 
 {{docs-snippet name='usage/app.js'}}
 
@@ -30,6 +30,16 @@ apply styling in `app/styles/app.scss`:
 
 {{docs-snippet name='usage/app.scss'}}
 
-The `$modal-z-index` variable is needed to keep the `ember-power-select` 
-dropdown above modal dialogs as the default of z-index of `1010` 
+The `$modal-z-index` variable is needed to keep the `ember-power-select`
+dropdown above modal dialogs as the default of z-index of `1010`
 (intentionally) dwarfs all other indexes.
+
+# Build time configuration
+
+`ember-caluma` relies heavily on `ember-changeset` and
+`ember-changeset-validations` that use `Proxy`. Since we support IE11+ we
+include a polyfill for `Proxy` per default. If your app doesn't need that,
+you can opt-out by configuring `ember-caluma.includeProxyPolyfill` in your
+`ember-cli-build.js` file:
+
+{{docs-snippet name='usage/ember-cli-build.js'}}

tests/dummy/config/ember-intl.js

@@ -89,6 +89,10 @@ module.exports = function (/* environment */) {
      * @default "function(key,locale) { return true }"
      */
     requiresTranslation(key, locale) {
+      if (!key.startsWith("caluma")) {
+        return false;
+      }
+
       const requiredLocales = ["en", "de"];
 
       // form builder is not yet supported in french

tests/dummy/mirage/scenarios/default.js

@@ -72,4 +72,5 @@ export default function (server) {
   server.create("document", { formId: form.id });
 
   server.createList("work-item", 20);
+  server.createList("format-validator", 3);
 }