apostrophe 3.5.0 → 3.8.1

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

@@ -18,6 +18,7 @@ const _ = require('lodash');
 const dayjs = require('dayjs');
 const tinycolor = require('tinycolor2');
 const { klona } = require('klona');
+const { stripIndent } = require('common-tags');
 
 module.exports = {
   options: {
@@ -323,7 +324,13 @@ module.exports = {
     self.addFieldType({
       name: 'select',
       async convert(req, field, data, destination) {
-        destination[field.name] = self.apos.launder.select(data[field.name], field.choices, field.def);
+        let choices;
+        if ((typeof field.choices) === 'string') {
+          choices = await self.apos.modules[field.moduleName][field.choices](req);
+        } else {
+          choices = field.choices;
+        }
+        destination[field.name] = self.apos.launder.select(data[field.name], choices, field.def);
       },
       index: function (value, field, texts) {
         const silent = field.silent === undefined ? true : field.silent;
@@ -354,7 +361,9 @@ module.exports = {
                 return self.apos.launder.select(v, field.choices, null);
               });
             } else {
-              value = self.apos.launder.select(value, field.choices, null);
+              value = (typeof field.choices) === 'string'
+                ? self.apos.launder.string(value)
+                : self.apos.launder.select(value, field.choices, null);
               if (value === null) {
                 return null;
               }
@@ -362,9 +371,16 @@ module.exports = {
             }
           },
           choices: async function () {
+            let allChoices;
             const values = await query.toDistinct(field.name);
+            if ((typeof field.choices) === 'string') {
+              const req = self.apos.task.getReq();
+              allChoices = await self.apos.modules[field.moduleName][field.choices](req);
+            } else {
+              allChoices = field.choices;
+            }
             const choices = _.map(values, function (value) {
-              const choice = _.find(field.choices, { value: value });
+              const choice = _.find(allChoices, { value: value });
               return {
                 value: value,
                 label: choice && (choice.label || value)
@@ -980,6 +996,12 @@ module.exports = {
         if (field.schema && !Array.isArray(field.schema)) {
           fail('schema property should be an array if present at this stage');
         }
+        if (field.filters) {
+          fail('"filters" property should be changed to "builders" for 3.x');
+        }
+        if (field.builders && field.builders.projection) {
+          fail('"projection" sub-property should be changed to "project" for 3.x');
+        }
         function lintType(type) {
           type = self.apos.doc.normalizeType(type);
           if (!_.find(self.apos.doc.managers, { name: type })) {
@@ -988,11 +1010,15 @@ module.exports = {
         }
       },
       isEqual(req, field, one, two) {
-        if (!_.isEqual(one[field.idsStorage], two[field.idsStorage])) {
+        const ids1 = one[field.idsStorage] || [];
+        const ids2 = two[field.idsStorage] || [];
+        if (!_.isEqual(ids1, ids2)) {
           return false;
         }
         if (field.fieldsStorage) {
-          if (!_.isEqual(one[field.fieldsStorage], two[field.fieldsStorage])) {
+          const fields1 = one[field.fieldsStorage] || {};
+          const fields2 = two[field.fieldsStorage] || {};
+          if (!_.isEqual(fields1, fields2)) {
             return false;
           }
         }
@@ -1098,7 +1124,7 @@ module.exports = {
       // alterFields option should be avoided if your needs can be met
       // via another option.
 
-      compose(options) {
+      compose(options, module) {
         let schema = [];
 
         // Useful for finding good unit test cases
@@ -1288,9 +1314,29 @@ module.exports = {
         // like workflow to patch schema fields of various modules
         // without inadvertently impacting other apos instances
         // when running with @apostrophecms/multisite
-        return _.map(schema, function (field) {
+        schema = _.map(schema, function (field) {
           return _.clone(field);
         });
+
+        _.each(schema, function(field) {
+          // For use in resolving options like "choices" when they
+          // contain a method name. For bc don't mess with possible
+          // existing usages in custom schema field types predating
+          // this feature
+          self.setModuleName(field, module);
+        });
+        return schema;
+      },
+
+      // Recursively set moduleName property of the field and any subfields,
+      // as might be found in array or object fields. `module` is an actual module
+      setModuleName(field, module) {
+        field.moduleName = field.moduleName || (module && module.__meta.name);
+        if ((field.type === 'array') || (field.type === 'object')) {
+          _.each(field.schema || [], function(subfield) {
+            self.setModuleName(subfield, module);
+          });
+        }
       },
 
       // refine is like compose, but it starts with an existing schema array
@@ -1473,10 +1519,8 @@ module.exports = {
         for (const field of schema) {
           const fieldType = self.fieldTypes[field.type];
           if (!fieldType.isEqual) {
-            if ((one[field.name] == null) && (two[field.name] == null)) {
-              return true;
-            }
-            if (!_.isEqual(one[field.name], two[field.name])) {
+            if ((!_.isEqual(one[field.name], two[field.name])) &&
+              !((one[field.name] == null) && (two[field.name] == null))) {
               return false;
             }
           } else {
@@ -1928,6 +1972,7 @@ module.exports = {
             } else if (field.type === 'array') {
               if (doc[field.name]) {
                 doc[field.name].forEach(item => {
+                  item._id = item._id || self.apos.util.generateId();
                   item.metaType = 'arrayItem';
                   item.scopedArrayName = field.scopedArrayName;
                   forSchema(field.schema, item);
@@ -2179,13 +2224,14 @@ module.exports = {
       // of a `relationship` field, or the `label` property of anything.
 
       validate(schema, options) {
-        // Infinite recursion prevention
-        if (self.validatedSchemas[options.type + ':' + options.subtype]) {
-          return;
-        }
-        self.validatedSchemas[options.type + ':' + options.subtype] = true;
-
-        schema.forEach(field => self.validateField(field, options));
+        schema.forEach(field => {
+          // Infinite recursion prevention
+          const key = `${options.type}:${options.subtype}.${field.name}`;
+          if (!self.validatedSchemas[key]) {
+            self.validatedSchemas[key] = true;
+            self.validateField(field, options);
+          }
+        });
       },
 
       // Validates a single schema field. See `validate`.
@@ -2213,7 +2259,12 @@ module.exports = {
           self.apos.util.error(format(s));
         }
         function format(s) {
-          return '\n' + options.type + ' ' + options.subtype + ', field name ' + field.name + ':\n\n' + s + '\n';
+          return stripIndent`
+            ${options.type} ${options.subtype}, ${field.type} field "${field.name}":
+
+            ${s}
+
+          `;
         }
       },
 
@@ -2526,6 +2577,32 @@ module.exports = {
 
     };
   },
+  apiRoutes(self) {
+    return {
+      get: {
+        async choices(req) {
+          const id = self.apos.launder.string(req.query.fieldId);
+          const field = self.getFieldById(id);
+          let choices = [];
+          if (
+            !field ||
+            field.type !== 'select' ||
+            !(field.choices && typeof field.choices === 'string')
+          ) {
+            throw self.apos.error('invalid');
+          }
+          choices = await self.apos.modules[field.moduleName][field.choices](req);
+          if (Array.isArray(choices)) {
+            return {
+              choices
+            };
+          } else {
+            throw self.apos.error('invalid', `The method ${field.choices} from the module ${field.moduleName} did not return an array`);
+          }
+        }
+      }
+    };
+  },
   extendMethods(self) {
     return {
       getBrowserData(_super, req) {
@@ -2540,7 +2617,7 @@ module.exports = {
           }
           fields[name] = component;
         }
-
+        browserOptions.action = self.action;
         browserOptions.components = { fields: fields };
         return browserOptions;
       }

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

@@ -69,6 +69,7 @@
                     :conditional-fields="conditionalFields()"
                     :value="currentDoc"
                     @input="currentDocUpdate"
+                    @validate="triggerValidate"
                     :server-errors="currentDocServerErrors"
                     ref="schema"
                   />

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

@@ -40,7 +40,10 @@ export default {
   },
   computed: {
     editLabel () {
-      return `Edit ${this.field.label}`;
+      return {
+        key: 'apostrophe:editType',
+        type: this.$t(this.field.label)
+      };
     }
   },
   methods: {

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

@@ -6,44 +6,15 @@
   >
     <template #body>
       <div class="apos-attachment">
-        <label
-          class="apos-input-wrapper apos-attachment-dropzone"
-          :class="{
-            'apos-attachment-dropzone--dragover': dragging,
-            'apos-is-disabled': disabled || limitReached
-          }"
-          @drop.prevent="uploadMedia"
-          @dragover="dragHandler"
-          @dragleave="dragging = false"
-        >
-          <p class="apos-attachment-instructions">
-            <template v-if="dragging">
-              <cloud-upload-icon :size="38" />
-            </template>
-            <AposSpinner v-else-if="uploading" />
-            <template v-else>
-              <paperclip-icon :size="14" class="apos-attachment-icon" />
-              {{ messages.primary }}&nbsp;
-              <span class="apos-attachment-highlight" v-if="messages.highlighted">
-                {{ messages.highlighted }}
-              </span>
-            </template>
-          </p>
-          <input
-            type="file"
-            class="apos-sr-only"
-            :disabled="disabled || limitReached"
-            @input="uploadMedia"
-            :accept="field.accept"
-          >
-        </label>
-        <div v-if="next && next._id" class="apos-attachment-files">
-          <AposSlatList
-            :value="next ? [ next ] : []"
-            @input="updated"
-            :disabled="field.readOnly"
-          />
-        </div>
+        <AposFile
+          :allowed-extensions="field.accept"
+          :uploading="uploading"
+          :disabled="disabled"
+          :attachment="next"
+          :def="field.def"
+          @upload-file="uploadMedia"
+          @update="updated"
+        />
       </div>
     </template>
   </AposInputWrapper>
@@ -51,13 +22,9 @@
 
 <script>
 import AposInputMixin from 'Modules/@apostrophecms/schema/mixins/AposInputMixin.js';
-import AposSlatList from 'Modules/@apostrophecms/ui/components/AposSlatList';
 
 export default {
   name: 'AposInputAttachment',
-  components: {
-    AposSlatList
-  },
   mixins: [ AposInputMixin ],
   emits: [ 'upload-started', 'upload-complete' ],
   data () {
@@ -67,46 +34,13 @@ export default {
       next: (this.value && (typeof this.value.data === 'object'))
         ? this.value.data : (this.field.def || null),
       disabled: false,
-      dragging: false,
-      uploading: false,
-      allowedExtensions: [ '*' ]
+      uploading: false
     };
   },
-  computed: {
-    messages () {
-      const msgs = {
-        primary: 'Drop a file here or',
-        highlighted: 'click to open the file explorer'
-      };
-      if (this.disabled) {
-        msgs.primary = 'Field is disabled';
-        msgs.highlighted = '';
-      }
-      if (this.limitReached) {
-        msgs.primary = 'Attachment limit reached';
-        msgs.highlighted = '';
-      }
-      return msgs;
-    },
-    limitReached () {
-      return !!(this.value.data && this.value.data._id);
-    }
-  },
   async mounted () {
     this.disabled = this.field.readOnly;
-
-    const groups = apos.modules['@apostrophecms/attachment'].fileGroups;
-    const groupInfo = groups.find(group => {
-      return group.name === this.field.fileGroup;
-    });
-    if (groupInfo && groupInfo.extensions) {
-      this.allowedExtensions = groupInfo.extensions;
-    }
   },
   methods: {
-    watchNext () {
-      this.validateAndEmit();
-    },
     updated (items) {
       // NOTE: This is limited to a single item.
       this.next = items.length > 0 ? items[0] : null;
@@ -118,31 +52,12 @@ export default {
 
       return false;
     },
-    async uploadMedia (event) {
+    async uploadMedia (file) {
       if (!this.disabled || !this.limitReached) {
         try {
-          this.dragging = false;
           this.disabled = true;
           this.uploading = true;
 
-          const file = event.target.files ? event.target.files[0] : event.dataTransfer.files[0];
-
-          if (!this.checkFileGroup(file.name)) {
-            const joined = this.allowedExtensions.join(this.$t('apostrophe:listJoiner'));
-            await apos.notify('apostrophe:fileTypeNotAccepted', {
-              type: 'warning',
-              icon: 'alert-circle-icon',
-              interpolate: {
-                extensions: joined
-              }
-            });
-
-            this.disabled = false;
-            this.uploading = false;
-
-            return;
-          }
-
           await apos.notify('apostrophe:uploading', {
             dismiss: true,
             icon: 'cloud-upload-icon',
@@ -183,71 +98,7 @@ export default {
           this.uploading = false;
         }
       }
-    },
-    checkFileGroup(filename) {
-      const fileExt = filename.split('.').pop();
-      return this.allowedExtensions[0] === '*' ||
-        this.allowedExtensions.includes(fileExt);
-    },
-    dragHandler (event) {
-      event.preventDefault();
-      if (!this.disabled && !this.dragging) {
-        this.dragging = true;
-      }
     }
   }
 };
 </script>
-
-<style lang="scss" scoped>
-  .apos-attachment-dropzone {
-    @include apos-button-reset();
-    @include type-base;
-    display: block;
-    margin: 10px 0;
-    padding: 20px;
-    border: 2px dashed var(--a-base-8);
-    border-radius: var(--a-border-radius);
-    transition: all 0.2s ease;
-    &:hover {
-      border-color: var(--a-primary);
-      background-color: var(--a-base-10);
-    }
-    &:active,
-    &:focus {
-      border: 2px solid var(--a-primary);
-    }
-    &.apos-is-disabled {
-      color: var(--a-base-4);
-      background-color: var(--a-base-7);
-      border-color: var(--a-base-4);
-
-      &:hover {
-        cursor: not-allowed;
-      }
-    }
-  }
-
-  .apos-attachment-dropzone--dragover {
-    border: 2px dashed var(--a-primary);
-    background-color: var(--a-base-10);
-  }
-
-  .apos-attachment-instructions {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: center;
-    pointer-events: none;
-    // v-html goofiness
-    & ::v-deep .apos-attachment-highlight {
-      color: var(--a-primary);
-      font-weight: var(--a-weight-bold);
-    }
-  }
-
-  .apos-attachment-icon {
-    transform: rotate(45deg);
-    margin-right: 5px;
-  }
-</style>

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

@@ -3,6 +3,7 @@
     :field="field" :error="effectiveError"
     :uid="uid" :items="next"
     :display-options="displayOptions"
+    :modifiers="modifiers"
   >
     <template #additional>
       <AposMinMaxCount
@@ -14,6 +15,7 @@
       <div class="apos-input-wrapper apos-input-relationship">
         <div class="apos-input-relationship__input-wrapper">
           <input
+            v-if="!modifiers.includes('no-search')"
             class="apos-input apos-input--text apos-input--relationship"
             v-model="searchTerm" type="text"
             :placeholder="$t(placeholder)"
@@ -28,7 +30,7 @@
             class="apos-input-relationship__button"
             :disabled="field.readOnly || limitReached"
             :label="browseLabel"
-            :modifiers="['small']"
+            :modifiers="buttonModifiers"
             type="input"
             @click="choose"
           />
@@ -106,6 +108,13 @@ export default {
     },
     disableUnpublished() {
       return apos.modules[this.field.withType].localized;
+    },
+    buttonModifiers() {
+      const modifiers = [ 'small' ];
+      if (this.modifiers.includes('no-search')) {
+        modifiers.push('block');
+      }
+      return modifiers;
     }
   },
   watch: {
@@ -225,6 +234,19 @@ export default {
 
   .apos-input-relationship__items {
     padding: relative;
-    margin-top: 10px;
+    margin-top: $spacing-base;
+  }
+
+  .apos-field--small {
+    .apos-input-relationship__button {
+      padding: $spacing-half;
+    }
+  }
+  .apos-field--no-search {
+    .apos-input-relationship__button {
+      position: relative;
+      width: 100%;
+      padding: 0;
+    }
   }
 </style>

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

@@ -49,9 +49,27 @@ export default {
       choices: []
     };
   },
-  mounted() {
+  async mounted() {
+    let choices;
+    if (typeof this.field.choices === 'string') {
+      const action = this.options.action;
+      const response = await apos.http.get(
+        `${action}/choices`,
+        {
+          qs: {
+            fieldId: this.field._id
+          },
+          busy: true
+        }
+      );
+      if (response.choices) {
+        choices = response.choices;
+      }
+    } else {
+      choices = this.field.choices;
+    }
     // Add an null option if there isn't one already
-    if (!this.field.required && !this.field.choices.find(choice => {
+    if (!this.field.required && !choices.find(choice => {
       return choice.value === null;
     })) {
       this.choices.push({
@@ -59,12 +77,12 @@ export default {
         value: null
       });
     }
-    this.choices = this.choices.concat(this.field.choices);
+    this.choices = this.choices.concat(choices);
     this.$nextTick(() => {
       // this has to happen on nextTick to avoid emitting before schemaReady is
       // set in AposSchema
-      if (this.field.required && (this.next == null) && (this.field.choices[0] != null)) {
-        this.next = this.field.choices[0].value;
+      if (this.field.required && (this.next == null) && (this.choices[0] != null)) {
+        this.next = this.choices[0].value;
       }
     });
   },
@@ -74,7 +92,7 @@ export default {
         return 'required';
       }
 
-      if (value && !this.field.choices.find(choice => choice.value === value)) {
+      if (value && !this.choices.find(choice => choice.value === value)) {
         return 'invalid';
       }
 

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

@@ -73,10 +73,6 @@ export default {
     icon () {
       if (this.error) {
         return 'circle-medium-icon';
-      } else if (this.field.type === 'date') {
-        return 'calendar-icon';
-      } else if (this.field.type === 'time') {
-        return 'clock-icon';
       } else if (this.field.icon) {
         return this.field.icon;
       } else {

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

@@ -71,10 +71,6 @@ export default {
     icon () {
       if (this.error) {
         return 'circle-medium-icon';
-      } else if (this.field.type === 'date') {
-        return 'calendar-icon';
-      } else if (this.field.type === 'time') {
-        return 'clock-icon';
       } else if (this.field.icon) {
         return this.field.icon;
       } else {
@@ -207,9 +203,6 @@ export default {
     // height of date/time input is slightly larger than others due to the browser spinner ui
     height: 46px;
     padding-right: 40px;
-    &::-webkit-calendar-picker-indicator {
-      background: none;
-    }
   }
   .apos-input--date {
     &::-webkit-clear-button {

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

@@ -10,8 +10,9 @@
       <component
         v-show="displayComponent(field.name)"
         v-model="fieldState[field.name]"
-        :following-values="followingValues[field.name]"
         :is="fieldComponentMap[field.type]"
+        :following-values="followingValues[field.name]"
+        :condition-met="conditionalFields[field.name]"
         :field="fields[field.name].field"
         :modifiers="fields[field.name].modifiers"
         :display-options="getDisplayOptions(field.name)"
@@ -89,7 +90,11 @@ export default {
       }
     }
   },
-  emits: [ 'input', 'reset' ],
+  emits: [
+    'input',
+    'reset',
+    'validate'
+  ],
   data() {
     return {
       schemaReady: false,
@@ -112,7 +117,10 @@ export default {
           data: this.value[item.name]
         };
         fields[item.name].serverError = this.serverErrors && this.serverErrors[item.name];
-        fields[item.name].modifiers = this.modifiers;
+        fields[item.name].modifiers = [
+          ...(this.modifiers || []),
+          ...(item.modifiers || [])
+        ];
       });
       return fields;
     }
@@ -142,6 +150,20 @@ export default {
           this.populateDocData();
         }
       }
+    },
+    conditionalFields(newVal, oldVal) {
+      for (const field in oldVal) {
+        if (!this.fieldState[field] || (newVal[field] === oldVal[field]) || !this.fieldState[field].ranValidation) {
+          continue;
+        }
+
+        if (
+          (newVal[field] === false) ||
+          (newVal[field] && this.fieldState[field].ranValidation)
+        ) {
+          this.$emit('validate');
+        }
+      }
     }
   },
   created() {

package/modules/@apostrophecms/schema/ui/apos/mixins/AposInputMixin.js

@@ -22,6 +22,10 @@ export default {
       type: Object,
       required: false
     },
+    conditionMet: {
+      type: Boolean,
+      required: false
+    },
     triggerValidation: {
       type: Boolean,
       default: false
@@ -117,10 +121,14 @@ export default {
     // You must supply the validate method. It receives the
     // internal representation used for editing (a string, for instance)
     validateAndEmit () {
-      const error = this.validate(this.next);
+      // If the field is conditional and isn't shown, disregard any errors.
+      const error = this.conditionMet === false ? false
+        : this.validate(this.next);
       this.$emit('input', {
         data: error ? this.next : this.convert(this.next),
-        error: this.validate(this.next)
+        error,
+        ranValidation: this.conditionMet === false ? this.value.ranValidation
+          : true
       });
     },
     watchValue () {