apostrophe 3.51.0 → 3.52.0

package/.eslintrc

@@ -12,6 +12,7 @@
   "rules": {
     "no-var": "error",
     "no-console": 0,
+    "vue/no-deprecated-v-on-native-modifier": 0,
     "multiline-ternary": "off",
     "no-unused-vars": [
       "error",

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # Changelog
 
+## 3.52.0 (2023-07-06)
+
+### Changes
+* Foreign widget UI no longer uses inverted theme styles.
+
+### Adds
+* Allows users to double-click a nested widget's breadcrumb entry and open its editor.
+* Adds support for a new `conditions` property in `addContextOperation` and validation of `addContextOperation` configuration.
+
+### Fixes
+
+* The API now allows the user to create a page without defining the page target ID. By default it takes the Home page.
+* Users are no longer blocked from saving documents when a field is hidden
+by an `if` condition fails to satisfy a condition such as `min` or `max`
+or is otherwise invalid. Instead the invalid value is discarded for safety.
+Note that `required` has always been ignored when an `if` condition is not
+satisfied.
+
+## 3.51.1 (2023-06-23)
+
+## Fixes
+
+* Fix a regression introduced in 3.51.0 - conditional fields work again in the array editor dialog box.
+
 ## 3.51.0 (2023-06-21)
 
 ### Adds

package/modules/@apostrophecms/area/ui/apos/components/AposAreaWidget.vue

@@ -41,13 +41,13 @@
           <li class="apos-area-widget__breadcrumb" data-apos-widget-breadcrumb="0">
             <AposButton
               type="quiet"
-              @click="foreign ? $emit('edit', i) : false"
+              @click="foreign ? $emit('edit', i) : null"
+              @dblclick.native="(!foreign && !isContextual) ? $emit('edit', i) : null"
               :label="foreign ? {
                 key: 'apostrophe:editWidgetType',
                 label: $t(widgetLabel)
               } : widgetLabel"
-              tooltip="apostrophe:editWidgetForeignTooltip"
-              :icon="foreign ? 'earth-icon' : null"
+              :tooltip="!isContextual && 'apostrophe:editWidgetForeignTooltip'"
               :icon-size="11"
               :modifiers="['no-motion']"
             />
@@ -76,6 +76,7 @@
         :class="ui.controls"
       >
         <AposWidgetControls
+          v-if="!foreign"
           :first="i === 0"
           :last="i === next.length - 1"
           :options="{ contextual: isContextual }"
@@ -272,7 +273,8 @@ export default {
       };
     },
     widgetIcon() {
-      return this.contextMenuOptions.menu.filter(item => item.name === this.widget.type)[0]?.icon || 'shape-icon';
+      const natural = this.contextMenuOptions.menu.filter(item => item.name === this.widget.type)[0]?.icon || 'shape-icon';
+      return this.foreign ? 'earth-icon' : natural;
     },
     widgetLabel() {
       const moduleName = `${this.widget.type}-widget`;
@@ -694,7 +696,7 @@ export default {
 
   .apos-area-widget__label {
     position: absolute;
-    top: -8px;
+    top: 0;
     right: 0;
     display: flex;
     transform: translateY(-100%);
@@ -709,20 +711,13 @@ export default {
     @include apos-list-reset();
     display: flex;
     align-items: center;
-    margin: 0;
+    margin: 0 0 8px;
     padding: 4px 6px;
     background-color: var(--a-background-primary);
     border: 1px solid var(--a-primary-transparent-50);
     border-radius: 8px;
   }
 
-  .apos-area-widget-wrapper--foreign .apos-area-widget-inner .apos-area-widget__breadcrumbs {
-    background-color: var(--a-background-inverted);
-    & ::v-deep .apos-button__content {
-      color: var(--a-text-inverted);
-    }
-  }
-
   .apos-area-widget__breadcrumb,
   .apos-area-widget__breadcrumb ::v-deep .apos-button__content {
     @include type-help;
@@ -730,9 +725,6 @@ export default {
     white-space: nowrap;
     color: var(--a-base-1);
     transition: background-color 0.3s var(--a-transition-timing-bounce);
-    &:hover {
-      cursor: pointer;
-    }
   }
 
   .apos-area-widget__breadcrumbs:hover .apos-area-widget__breadcrumb,

package/modules/@apostrophecms/area/ui/apos/components/AposWidgetControls.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="apos-area-modify-controls">
     <AposButtonGroup
-      :modifiers="groupModifiers"
+      :modifiers="[ 'vertical' ]"
     >
       <AposButton
         v-if="!foreign"
@@ -124,15 +124,6 @@ export default {
     };
   },
   computed: {
-    groupModifiers() {
-      const mods = [ 'vertical' ];
-
-      if (this.foreign) {
-        mods.push('invert');
-      }
-
-      return mods;
-    },
     upButton() {
       return {
         ...this.buttonDefaults,

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

@@ -1153,9 +1153,10 @@ module.exports = {
       //   context: 'update',
       //   action: 'someAction',
       //   modal: 'ModalComponent',
-      //   label: 'Context Menu Label'
+      //   label: 'Context Menu Label',
+      //   conditions: ['canEdit']
       // }
-      // All properties are required.
+      // All properties are required except conditions.
       // The only supported `context` for now is `update`.
       // `action` is the operation identifier and should be globally unique.
       // Overriding existing custom actions is possible (the last wins).
@@ -1166,7 +1167,13 @@ module.exports = {
       // An optional `manuallyPublished` boolean property is supported - if true
       // the menu will be shown only for docs which have `autopublish: false` and
       // `localized: true` options.
+      // `conditions` defines the needed permission actions to be run on the current doc
+      // in order to display the operation.
+      // It must be an array containing one or multiple of these available values:
+      // 'canPublish', 'canEdit', 'canDismissSubmission', 'canDiscardDraft',
+      // 'canLocalize', 'canArchive', 'canUnpublish', 'canCopy', 'canRestore'.
       addContextOperation(moduleName, operation) {
+        validate(operation);
         self.contextOperations = [
           ...self.contextOperations
             .filter(op => op.action !== operation.action),
@@ -1175,6 +1182,39 @@ module.exports = {
             moduleName
           }
         ];
+
+        function validate ({
+          action, context, label, modal, conditions
+        }) {
+          const allowedConditions = [
+            'canPublish',
+            'canEdit',
+            'canDismissSubmission',
+            'canDiscardDraft',
+            'canLocalize',
+            'canArchive',
+            'canUnpublish',
+            'canCopy',
+            'canRestore'
+          ];
+
+          if (!action || !context || !label || !modal) {
+            throw self.apos.error('invalid', 'addContextOperation requires action, context, label and modal properties');
+          }
+
+          if (!conditions) {
+            return;
+          }
+
+          if (
+            !Array.isArray(conditions) ||
+            conditions.some((perm) => !allowedConditions.includes(perm))
+          ) {
+            throw self.apos.error(
+              'invalid', `The conditions property in addContextOperation must be an array containing one or multiple of these values:\n\t${allowedConditions.join('\n\t')}.`
+            );
+          }
+        }
       },
       getBrowserData(req) {
         return {

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

@@ -195,15 +195,26 @@ export default {
       return menus;
     },
     customOperationsByContext() {
-      return this.customOperations.filter(op => {
-        if (typeof op.manuallyPublished === 'boolean' && op.manuallyPublished !== this.manuallyPublished) {
+      return this.customOperations.filter(({
+        manuallyPublished, hasUrl, conditions, context
+      }) => {
+        if (typeof manuallyPublished === 'boolean' && manuallyPublished !== this.manuallyPublished) {
           return false;
         }
-        if (typeof op.hasUrl === 'boolean' && op.hasUrl !== this.hasUrl) {
+
+        if (typeof hasUrl === 'boolean' && hasUrl !== this.hasUrl) {
           return false;
         }
 
-        return op.context === 'update' && this.isUpdateOperation;
+        if (conditions) {
+          const notAllowed = conditions.some((action) => !this[action]);
+
+          if (notAllowed) {
+            return false;
+          }
+        }
+
+        return context === 'update' && this.isUpdateOperation;
       });
     },
     moduleName() {

package/modules/@apostrophecms/modal/ui/apos/mixins/AposEditorMixin.js

@@ -133,7 +133,8 @@ export default {
       return conditionalFields(
         this.schema,
         this.getFieldsByCategory(followedByCategory),
-        this.docFields.data,
+        // currentDoc for arrays, docFields for all other editors
+        this.currentDoc ? this.currentDoc.data : this.docFields.data,
         this.externalConditionsResults
       );
     },

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

@@ -254,14 +254,13 @@ module.exports = {
       // This call is atomic with respect to other REST write operations on pages.
       async post(req) {
         self.publicApiCheck(req);
-        req.body._position = req.body._position || 'lastChild';
         let targetId = self.apos.launder.string(req.body._targetId);
-        let position = self.apos.launder.string(req.body._position);
+        let position = self.apos.launder.string(req.body._position || 'lastChild');
         // Here we have to normalize before calling insert because we
         // need the parent page to call newChild(). insert calls again but
         // sees there's no work to be done, so no performance hit
         const normalized = await self.getTargetIdAndPosition(req, null, targetId, position);
-        targetId = normalized.targetId;
+        targetId = normalized.targetId || '_home';
         position = normalized.position;
         const copyingId = self.apos.launder.id(req.body._copyingId);
         const input = _.omit(req.body, '_targetId', '_position', '_copyingId');
@@ -273,7 +272,7 @@ module.exports = {
         if (req.body._newInstance) {
           // If we're looking for a fresh page instance and aren't saving yet,
           // simply get a new page doc and return it
-          const parentPage = await self.findForEditing(req, { _id: targetId })
+          const parentPage = await self.findForEditing(req, self.getIdCriteria(targetId))
             .permission('edit', '@apostrophecms/any-page-type').toObject();
           const newChild = self.newChild(parentPage);
           newChild._previewable = true;
@@ -281,7 +280,12 @@ module.exports = {
         }
 
         return self.withLock(req, async () => {
-          const targetPage = await self.findForEditing(req, targetId ? self.getIdCriteria(targetId) : { level: 0 }).ancestors(true).permission('edit').toObject();
+          const targetPage = await self
+            .findForEditing(req, self.getIdCriteria(targetId))
+            .ancestors(true)
+            .permission('edit')
+            .toObject();
+
           if (!targetPage) {
             throw self.apos.error('notfound');
           }

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

@@ -523,15 +523,29 @@ module.exports = {
         const errorsList = [];
 
         for (const error of errors) {
-          if ((error.name === 'required' || error.name === 'mandatory')) {
+          if (error.path) {
             // `self.isVisible` will only throw for required fields that have
             // an external condition containing an unknown module or method:
             const isVisible = await self.isVisible(req, schema, destination, error.path);
 
             if (!isVisible) {
-              // It is not reasonable to enforce required for
-              // fields hidden via conditional fields
-              continue;
+              // It is not reasonable to enforce required,
+              // min, max or anything else for fields
+              // hidden via "if" as the user cannot correct it
+              // and it will not be used. If the user changes
+              // the conditional field later then they won't
+              // be able to save until the erroneous field
+              // is corrected
+              const name = error.path;
+              const field = schema.find(field => field.name === name);
+              if (field) {
+                // To protect against security issues, an invalid value
+                // for a field that is not visible should be quietly discarded.
+                // We only worry about this if the value is not valid, as otherwise
+                // it's a kindness to save the work so the user can toggle back to it
+                destination[field.name] = klona((field.def !== undefined) ? field.def : self.fieldTypes[field.type]?.def);
+                continue;
+              }
             }
           }
 

package/package.json

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