apostrophe 3.27.0 → 3.28.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # Changelog
 
+## 3.28.1 (2022-09-15)
+
+### Fixes
+
+* `AposInputBoolean` can now be `required` and have the value `false`.
+* Schema fields containing boolean filters can now list both `yes` and `no` choices according to available values in the database.
+* Fix attachment `getHeight()` and `getWidth()` template helpers by changing the assignment of the `attachment._crop` property.
+* Change assignment of `attachment._focalPoint` for consistency.
+
+## 3.28.0 (2022-08-31)
+
+### Fixes
+
+* Fix UI bug when creating a document via a relationship.
+
+### Adds
+
+* Support for uploading `webp` files for display as images. This is supported by all current browsers now that Microsoft has removed IE11. For best results, you should run `npm update` on your project to make sure you are receiving the latest release of `uploadfs` which uses `sharp` for image processing. Thanks to [Isaac Preston](https://github.com/ixc7) for this addition.
+* Clicking outside a modal now closes it, the same way the `Escape` key does when pressed.
+* `checkboxes` fields now support `min` and `max` properties. Thanks to [Gabe Flores](https://github.com/gabeflores-appstem).
+
 ## 3.27.0 (2022-08-18)
 
 ### Adds

package/modules/@apostrophecms/attachment/index.js

@@ -54,7 +54,8 @@ module.exports = {
           'gif',
           'jpg',
           'png',
-          'svg'
+          'svg',
+          'webp'
         ],
         extensionMaps: { jpeg: 'jpg' },
         // uploadfs should treat this as an image and create scaled versions
@@ -90,14 +91,16 @@ module.exports = {
     self.croppable = {
       gif: true,
       jpg: true,
-      png: true
+      png: true,
+      webp: true
     };
 
     // Do NOT add keys here unless they have the value `true`
     self.sized = {
       gif: true,
       jpg: true,
-      png: true
+      png: true,
+      webp: true
     };
 
     self.sizeAvailableInArchive = self.options.sizeAvailableInArchive || 'one-sixth';
@@ -705,8 +708,8 @@ module.exports = {
               if (ancestorFields) {
                 value = _.clone(value);
                 o.attachment = value;
-                value._crop = _.pick(ancestorFields, 'width', 'height', 'top', 'left');
-                value._focalPoint = _.pick(ancestorFields, 'x', 'y');
+                value._crop = ancestorFields.width ? _.pick(ancestorFields, 'width', 'height', 'top', 'left') : undefined;
+                value._focalPoint = (typeof ancestorFields.x === 'number') ? _.pick(ancestorFields, 'x', 'y') : undefined;
                 break;
               }
             }
@@ -1018,7 +1021,7 @@ module.exports = {
             return;
           }
           let sizes;
-          if (![ 'gif', 'jpg', 'png' ].includes(self.resolveExtension(attachment.extension))) {
+          if (![ 'gif', 'jpg', 'png', 'webp' ].includes(self.resolveExtension(attachment.extension))) {
             sizes = [ { name: 'original' } ];
           } else {
             sizes = self.imageSizes.concat([ { name: 'original' } ]);

package/modules/@apostrophecms/attachment/lib/tasks/rescale.js

@@ -12,7 +12,7 @@ module.exports = function(self) {
     const total = await self.db.count();
     let n = 0;
     await self.each({}, argv.parallel || 1, async function(file) {
-      if (!_.includes([ 'jpg', 'png', 'gif' ], file.extension)) {
+      if (!_.includes([ 'jpg', 'png', 'gif', 'webp' ], file.extension)) {
         n++;
         console.log('Skipping a non-image attachment: ' + file.name + '.' + file.extension);
         return;

package/modules/@apostrophecms/doc-type/ui/apos/components/AposDocEditor.vue

@@ -727,6 +727,9 @@ export default {
       window.localStorage.setItem(this.savePreferenceName, pref);
     },
     onContentChanged(e) {
+      if (this.original?._id !== e.doc._id) {
+        return;
+      }
       if (e.doc.type !== this.docType) {
         this.docType = e.doc.type;
       }

package/modules/@apostrophecms/modal/ui/apos/components/AposModal.vue

@@ -1,8 +1,8 @@
 <template>
   <transition
     :name="transitionType"
-    @enter="finishEnter"
-    @leave="finishExit"
+    @enter="onEnter"
+    @leave="onLeave"
     :duration="250"
   >
     <section
@@ -14,12 +14,18 @@
       ref="modalEl"
     >
       <transition :name="transitionType">
-        <div class="apos-modal__overlay" v-if="modal.showModal" />
+        <div
+          @click="close"
+          v-if="modal.showModal"
+          class="apos-modal__overlay"
+        />
       </transition>
       <transition :name="transitionType" @after-leave="$emit('inactive')">
         <div
-          v-if="modal.showModal" :class="innerClasses"
-          class="apos-modal__inner" data-apos-modal-inner
+          v-if="modal.showModal"
+          :class="innerClasses"
+          class="apos-modal__inner"
+          data-apos-modal-inner
         >
           <template v-if="modal.busy">
             <div class="apos-modal__busy">
@@ -180,16 +186,13 @@ export default {
     }
   },
   methods: {
-    esc (e) {
-      if (apos.modal.stack[apos.modal.stack.length - 1] !== this) {
-        return;
-      }
-      if (e.keyCode === 27) {
-        e.stopPropagation();
-        this.$emit('esc');
+    onKeydown (e) {
+      const hasPressedEsc = e.keyCode === 27;
+      if (hasPressedEsc) {
+        this.close(e);
       }
     },
-    finishEnter () {
+    onEnter () {
       this.$emit('show-modal');
       this.bindEventListeners();
       apos.modal.stack = apos.modal.stack || [];
@@ -198,7 +201,7 @@ export default {
         this.$emit('ready');
       });
     },
-    finishExit () {
+    onLeave () {
       this.removeEventListeners();
       this.$emit('no-modal');
       // pop doesn't quite suffice because of race conditions when
@@ -206,10 +209,17 @@ export default {
       apos.modal.stack = apos.modal.stack.filter(modal => modal !== this);
     },
     bindEventListeners () {
-      window.addEventListener('keydown', this.esc);
+      window.addEventListener('keydown', this.onKeydown);
     },
     removeEventListeners () {
-      window.removeEventListener('keydown', this.esc);
+      window.removeEventListener('keydown', this.onKeydown);
+    },
+    close (e) {
+      if (apos.modal.stack[apos.modal.stack.length - 1] !== this) {
+        return;
+      }
+      e.stopPropagation();
+      this.$emit('esc');
     },
     trapFocus () {
       // Adapted from https://uxdesign.cc/how-to-trap-focus-inside-modal-to-make-it-ada-compliant-6a50f9a70700

package/modules/@apostrophecms/module/index.js

@@ -753,7 +753,7 @@ module.exports = {
       isShareDraftRequest(req) {
         const { aposShareId, aposShareKey } = req.query;
 
-        return (
+        return Boolean(
           typeof aposShareId === 'string' &&
           aposShareId.length &&
           typeof aposShareKey === 'string' &&

package/modules/@apostrophecms/schema/lib/addFieldTypes.js

@@ -165,7 +165,7 @@ module.exports = (self) => {
       destination[field.name] = self.apos.launder.boolean(data[field.name], field.def);
     },
     isEmpty: function (field, value) {
-      return !value;
+      return !value && value !== false;
     },
     exporters: {
       string: function (req, field, object, output) {
@@ -190,7 +190,7 @@ module.exports = (self) => {
           return self.apos.launder.booleanOrNull(b);
         },
         choices: async function () {
-          const values = query.toDistinct(field.name);
+          const values = await query.toDistinct(field.name);
           const choices = [];
           if (_.includes(values, true)) {
             choices.push({
@@ -198,7 +198,7 @@ module.exports = (self) => {
               label: 'apostrophe:yes'
             });
           }
-          if (_.includes(values, true)) {
+          if (_.includes(values, false)) {
             choices.push({
               value: '0',
               label: 'apostrophe:no'
@@ -254,6 +254,13 @@ module.exports = (self) => {
           });
         }
       }
+
+      if ((field.min !== undefined) && (destination[field.name].length < field.min)) {
+        throw self.apos.error('min');
+      }
+      if ((field.max !== undefined) && (destination[field.name].length > field.max)) {
+        throw self.apos.error('max');
+      }
     },
     index: function (value, field, texts) {
       const silent = field.silent === undefined ? true : field.silent;
@@ -300,6 +307,14 @@ module.exports = (self) => {
           return choices;
         }
       });
+    },
+    validate: function (field, options, warn, fail) {
+      if (field.max && typeof field.max !== 'number') {
+        fail('Property "max" must be a number');
+      }
+      if (field.min && typeof field.min !== 'number') {
+        fail('Property "min" must be a number');
+      }
     }
   });
 

package/modules/@apostrophecms/schema/ui/apos/components/AposInputBoolean.vue

@@ -81,7 +81,7 @@ export default {
     },
     validate(value) {
       if (this.field.required) {
-        if (!value) {
+        if (!value && value !== false) {
           return 'required';
         }
       }

package/modules/@apostrophecms/schema/ui/apos/components/AposInputCheckboxes.vue

@@ -47,6 +47,17 @@ export default {
         return 'required';
       }
 
+      if (this.field.min) {
+        if ((values != null) && (values.length < this.field.min)) {
+          return 'min';
+        }
+      }
+      if (this.field.max) {
+        if ((values != null) && (values.length > this.field.max)) {
+          return 'max';
+        }
+      }
+
       if (Array.isArray(values)) {
         values.forEach(chosen => {
           if (!this.choices.map(choice => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "apostrophe",
-  "version": "3.27.0",
+  "version": "3.28.1",
   "description": "The Apostrophe Content Management System.",
   "main": "index.js",
   "scripts": {

package/test/areas.js

@@ -336,11 +336,29 @@ describe('Areas', function() {
       }, true)
     );
     assert(
-      apos.schema.fieldTypes.boolean.isEmpty({
+      !apos.schema.fieldTypes.boolean.isEmpty({
         type: 'boolean',
         name: 'test'
       }, false)
     );
+    assert(
+      apos.schema.fieldTypes.boolean.isEmpty({
+        type: 'boolean',
+        name: 'test'
+      }, null)
+    );
+    assert(
+      apos.schema.fieldTypes.boolean.isEmpty({
+        type: 'boolean',
+        name: 'test'
+      }, undefined)
+    );
+    assert(
+      apos.schema.fieldTypes.boolean.isEmpty({
+        type: 'boolean',
+        name: 'test'
+      }, 0)
+    );
     assert(
       !apos.schema.fieldTypes.boolean.empty({
         type: 'boolean',
@@ -348,11 +366,29 @@ describe('Areas', function() {
       }, true)
     );
     assert(
-      apos.schema.fieldTypes.boolean.empty({
+      !apos.schema.fieldTypes.boolean.empty({
         type: 'boolean',
         name: 'test'
       }, false)
     );
+    assert(
+      apos.schema.fieldTypes.boolean.empty({
+        type: 'boolean',
+        name: 'test'
+      }, null)
+    );
+    assert(
+      apos.schema.fieldTypes.boolean.empty({
+        type: 'boolean',
+        name: 'test'
+      }, undefined)
+    );
+    assert(
+      apos.schema.fieldTypes.boolean.empty({
+        type: 'boolean',
+        name: 'test'
+      }, 0)
+    );
   });
 });
 

package/test/schemaBuilders.js

@@ -73,6 +73,11 @@ describe('Schema builders', function() {
                 idsStorage: 'favoriteIds',
                 label: 'Favorites',
                 withType: 'cat'
+              },
+              isACatPerson: {
+                type: 'boolean',
+                label: 'Is a cat person?',
+                required: true
               }
             }
           }
@@ -102,9 +107,11 @@ describe('Schema builders', function() {
     }
     for (i = 0; (i < people.length); i++) {
       const person = people[i];
+      person.isACatPerson = true;
       // person 10 has no favorite cat
       if (i < 10) {
         person.favoriteIds = [ cats[i].aposDocId ];
+        person.isACatPerson = false;
       }
       person.catsIds = [];
       let j;
@@ -299,6 +306,23 @@ describe('Schema builders', function() {
     assert(cats[0].label);
     assert(cats[0].slug);
   });
+  it('can obtain choices for isACatPerson', async function() {
+    const req = apos.task.getReq();
+    const query = apos.people.find(req);
+    const isACatPerson = await query.toChoices('isACatPerson');
+    const actual = isACatPerson;
+    const expected = [
+      {
+        value: '1',
+        label: 'apostrophe:yes'
+      },
+      {
+        value: '0',
+        label: 'apostrophe:no'
+      }
+    ];
+    assert.deepEqual(actual, expected);
+  });
 
   it('builder for favorite (by slug) exists', function() {
     const req = apos.task.getReq();