apostrophe 3.6.0 → 3.9.0

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

@@ -28,7 +28,7 @@ import AposInputMixin from 'Modules/@apostrophecms/schema/mixins/AposInputMixin'
 export default {
   name: 'AposInputPassword',
   mixins: [ AposInputMixin ],
-  emits: ['return'],
+  emits: [ 'return' ],
   computed: {
     tabindex () {
       return this.field.disableFocus ? '-1' : '0';
@@ -43,12 +43,20 @@ export default {
       }
       if (this.field.min) {
         if (value.length && (value.length < this.field.min)) {
-          return { message: `Minimum of ${this.field.min} characters` };
+          return {
+            message: this.$t('apostrophe:passwordErrorMin', {
+              min: this.field.min
+            })
+          };
         }
       }
       if (this.field.max) {
         if (value.length && (value.length > this.field.max)) {
-          return { message: `Maximum of ${this.field.max} characters` };
+          return {
+            message: this.$t('apostrophe:passwordErrorMax', {
+              max: this.field.max
+            })
+          };
         }
       }
       return false;
@@ -56,4 +64,3 @@ export default {
   }
 };
 </script>
-

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

@@ -20,13 +20,13 @@
           <div class="apos-range__scale">
             <span>
               <span class="apos-sr-only">
-                Min:
+                {{ $t('apostrophe:minLabel') }}
               </span>
               {{ minLabel }}
             </span>
             <span>
               <span class="apos-sr-only">
-                Max:
+                {{ $t('apostrophe:maxLabel') }}
               </span>
               {{ maxLabel }}
             </span>

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/AposInputWrapper.vue

@@ -2,7 +2,6 @@
   <div class="apos-field__wrapper">
     <component :is="wrapEl" :class="classList">
       <div class="apos-field__info">
-        <!-- TODO i18n -->
         <component
           v-if="field.label" :class="{'apos-sr-only': field.hideLabel }"
           class="apos-field__label"
@@ -32,7 +31,6 @@
             />
           </span>
         </component>
-        <!-- TODO i18n -->
         <p
           v-if="(field.help || field.htmlHelp) && !displayOptions.helpTooltip"
           class="apos-field__help"

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

@@ -60,4 +60,4 @@
       fill="url(#triangle)"
     />
   </svg>
-</template>
+</template>

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

@@ -57,4 +57,4 @@
       fill="url(#triangle)"
     />
   </svg>
-</template>
+</template>

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

@@ -54,4 +54,4 @@
       fill="url(#triangle)"
     />
   </svg>
-</template>
+</template>

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

@@ -148,6 +148,5 @@ export default {
   &.apos-search__item--disabled {
     @include disabled;
   }
-
 }
 </style>

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

@@ -44,6 +44,7 @@
 // are edge cases not relevant enough to explicitly offer a filter for, but
 // which should nevertheless be included in results.
 
+const { stripIndent } = require('common-tags');
 const _ = require('lodash');
 
 module.exports = {
@@ -98,37 +99,7 @@ module.exports = {
       },
       '@apostrophecms/doc-type:beforeSave': {
         indexDoc(req, doc) {
-
-          const texts = self.getSearchTexts(doc);
-
-          _.each(texts, function (text) {
-            if (text.text === undefined) {
-              text.text = '';
-            }
-          });
-
-          const highTexts = _.filter(texts, function (text) {
-            return text.weight > 10;
-          });
-
-          const searchSummary = _.map(_.filter(texts, function (text) {
-            return !text.silent;
-          }), function (text) {
-            return text.text;
-          }).join(' ');
-          const highText = self.boilTexts(highTexts);
-          const lowText = self.boilTexts(texts);
-          const titleSortified = self.apos.util.sortify(doc.title);
-          const highWords = _.uniq(highText.split(/ /));
-
-          // merge our doc with its various search texts
-          _.assign(doc, {
-            titleSortified: titleSortified,
-            highSearchText: highText,
-            highSearchWords: highWords,
-            lowSearchText: lowText,
-            searchSummary: searchSummary
-          });
+          self.indexDoc(req, doc);
         }
       }
     };
@@ -261,13 +232,58 @@ module.exports = {
         self.dispatch('/', self.indexPage);
       },
 
+      indexDoc(req, doc) {
+
+        const texts = self.getSearchTexts(doc);
+
+        _.each(texts, function (text) {
+          if (text.text === undefined) {
+            text.text = '';
+          }
+        });
+
+        const highTexts = _.filter(texts, function (text) {
+          return text.weight > 10;
+        });
+
+        const searchSummary = _.map(_.filter(texts, function (text) {
+          return !text.silent;
+        }), function (text) {
+          return text.text;
+        }).join(' ');
+        const highText = self.boilTexts(highTexts);
+        const lowText = self.boilTexts(texts);
+        const titleSortified = self.apos.util.sortify(doc.title);
+        const highWords = _.uniq(highText.split(/ /));
+
+        // merge our doc with its various search texts
+        _.assign(doc, {
+          titleSortified: titleSortified,
+          highSearchText: highText,
+          highSearchWords: highWords,
+          lowSearchText: lowText,
+          searchSummary: searchSummary
+        });
+      },
+
       // Indexes just one document as part of the implementation of the
       // `@apostrophecms/search:index` task. This isn't the method you want to
       // override. See `indexDoc` and `getSearchTexts`
 
       async indexTaskOne(req, doc) {
         self.indexDoc(req, doc);
-        return self.apos.doc.db.updateOne({ _id: doc._id }, doc);
+
+        return self.apos.doc.db.updateOne({
+          _id: doc._id
+        }, {
+          $set: {
+            titleSortified: doc.titleSortified,
+            highSearchText: doc.highSearchText,
+            highSearchWords: doc.highSearchWords,
+            lowSearchText: doc.lowSearchText,
+            searchSummary: doc.searchSummary
+          }
+        });
       },
 
       // Returns texts which are a reasonable basis for
@@ -348,7 +364,11 @@ module.exports = {
   tasks(self) {
     return {
       index: {
-        usage: 'Rebuild the search index. Normally this happens automatically.\nThis should only be needed if you have changed the\n"searchable" property for various fields or types.',
+        usage: stripIndent`
+          Rebuild the search index. Normally this happens automatically.
+          This should only be needed if you have changed the"searchable" property
+          for various fields or types.
+        `,
         task(argv) {
           const req = self.apos.task.getReq();
           return self.apos.migration.eachDoc({}, _.partial(self.indexTaskOne, req));

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

@@ -190,7 +190,11 @@ module.exports = {
               role: options.role
             }
           }),
-          res: {},
+          res: {
+            redirect(url) {
+              req.res.redirectedTo = url;
+            }
+          },
           t(key, options = {}) {
             return self.apos.i18n.i18next.t(key, {
               ...options,
@@ -219,8 +223,8 @@ module.exports = {
         };
         addCloneMethod(req);
         req.res.__ = req.__;
-        const { role, ..._properties } = options || {};
-        Object.assign(req, _properties);
+        const { _role, ...properties } = options || {};
+        Object.assign(req, properties);
         self.apos.i18n.setPrefixUrls(req);
         return req;
 

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

@@ -1,5 +1,5 @@
 // Implements template rendering via Nunjucks. **You should use the
-// `self.render` and `self.partial` methods of *your own* module**,
+// `self.render` method of *your own* module**,
 // which exist courtesy of [@apostrophecms/module](../@apostrophecms/module/index.html)
 // and invoke methods of this module more conveniently for you.
 //
@@ -21,7 +21,7 @@
 // you have a custom version of Nunjucks that is compatible.
 //
 // ### `viewsFolderFallback`: specifies a folder to be checked for templates
-// if they are not found in the module that called `self.render` or `self.partial`
+// if they are not found in the module that called `self.render`
 // or those it extends. This is a handy place for project-wide macro files.
 // Often set to `__dirname + '/views'` in `app.js`.
 
@@ -203,7 +203,7 @@ module.exports = {
 
       async renderForModule(req, name, data, module) {
         if (typeof req !== 'object') {
-          throw new Error('The first argument to module.render must be req. If you are trying to implement a Nunjucks helper function, use module.partial.');
+          throw new Error('The first argument to module.render must be req.');
         }
         return self.renderBody(req, 'file', name, data, module);
       },
@@ -214,7 +214,7 @@ module.exports = {
 
       async renderStringForModule(req, s, data, module) {
         if (typeof req !== 'object') {
-          throw new Error('The first argument to module.render must be req. If you are trying to implement a Nunjucks helper function, use module.partial.');
+          throw new Error('The first argument to module.render must be req.');
         }
         return self.renderBody(req, 'string', s, data, module);
       },
@@ -289,12 +289,6 @@ module.exports = {
 
         args.data = merged;
 
-        // // Allows templates to render other templates in an independent
-        // // nunjucks environment, rather than including them
-        // args.partial = function(name, data) {
-        //   return self.partialForModule(name, data, module);
-        // };
-
         if (req.data) {
           _.defaults(merged, req.data);
         }
@@ -334,7 +328,7 @@ module.exports = {
 
       // Fetch a nunjucks environment in which `include`, `extends`, etc. search
       // the views directories of the specified module and its ancestors.
-      // Typically you will call `self.render` or `self.partial` on your module
+      // Typically you will call `self.render` on your module
       // object rather than calling this directly.
       //
       // `req` is effectively here for bc purposes only. This method
@@ -652,6 +646,8 @@ module.exports = {
           locale: req.locale,
           csrfCookieName: self.apos.csrfCookieName,
           tabId: self.apos.util.generateId(),
+          uploadsUrl: self.apos.attachment.uploadfs.getUrl(),
+          assetBaseUrl: self.apos.asset.getAssetBaseUrl(),
           scene
         };
         if (req.user) {

package/modules/@apostrophecms/ui/ui/apos/components/AposButton.vue

@@ -15,6 +15,7 @@
       :type="buttonType"
       :role="role"
       :id="attrs.id ? attrs.id : id"
+      :style="{color: textColor}"
       v-bind="attrs"
     >
       <transition name="fade">
@@ -71,6 +72,10 @@ export default {
       type: String,
       default: null
     },
+    textColor: {
+      type: String,
+      default: null
+    },
     href: {
       type: [ String, Boolean ],
       default: false

package/modules/@apostrophecms/ui/ui/apos/components/AposCellContextMenu.vue

@@ -64,7 +64,7 @@ export default {
   .apos-table__cell-field--context-menu__content {
     @include apos-transition();
     display: inline-block;
-    opacity: 0;
+    opacity: 0.3;
     &.apos-is-visible {
       opacity: 1;
     }

package/modules/@apostrophecms/ui/ui/apos/components/AposFile.vue

@@ -0,0 +1,205 @@
+<template>
+  <div>
+    <label
+      class="apos-input-wrapper apos-file-dropzone"
+      :class="{
+        'apos-file-dropzone--dragover': dragging,
+        'apos-is-disabled': disabled || fileOrAttachment
+      }"
+      @drop.prevent="uploadFile"
+      @dragover="dragHandler"
+      @dragleave="dragging = false"
+    >
+      <p class="apos-file-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-file-icon" />
+          {{ messages.primary }}&nbsp;
+          <span class="apos-file-highlight" v-if="messages.highlighted">
+            {{ messages.highlighted }}
+          </span>
+        </template>
+      </p>
+      <input
+        type="file"
+        class="apos-sr-only"
+        :disabled="disabled || fileOrAttachment"
+        @input="uploadFile"
+        :accept="allowedExtensions"
+      >
+    </label>
+    <div v-if="fileOrAttachment" class="apos-file-files">
+      <AposSlatList
+        :value="[fileOrAttachment]"
+        @input="update"
+        :disabled="readOnly"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    uploading: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    attachment: {
+      type: Object,
+      default: null
+    },
+    allowedExtensions: {
+      type: String,
+      default: '*'
+    },
+    readOnly: {
+      type: Boolean,
+      default: false
+    },
+    def: {
+      type: String,
+      default: null
+    }
+  },
+  emits: [ 'upload-file', 'update' ],
+  data () {
+    return {
+      selectedFile: null,
+      dragging: false
+    };
+  },
+  computed: {
+    fileOrAttachment () {
+      return this.selectedFile || this.attachment;
+    },
+    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.fileOrAttachment) {
+        msgs.primary = 'Attachment limit reached';
+        msgs.highlighted = '';
+      }
+      return msgs;
+    }
+  },
+  methods: {
+    async uploadFile ({ target, dataTransfer }) {
+      this.dragging = false;
+      const [ file ] = target.files ? target.files : (dataTransfer.files || []);
+
+      const extension = file.name.split('.').pop();
+      const allowedFile = await this.checkFileGroup(`.${extension}`);
+
+      if (!allowedFile) {
+        return;
+      }
+
+      this.selectedFile = {
+        _id: file.name,
+        title: file.name,
+        extension,
+        _url: URL.createObjectURL(file)
+      };
+
+      this.$emit('upload-file', file);
+    },
+    dragHandler (event) {
+      event.preventDefault();
+
+      if (!this.disabled && !this.dragging) {
+        this.dragging = true;
+      }
+    },
+    update(items) {
+      if (this.selectedFile && this.selectedFile._url) {
+        URL.revokeObjectURL(this.selectedFile._url);
+      }
+
+      this.selectedFile = null;
+      this.$emit('update', items);
+    },
+    async checkFileGroup(fileExt) {
+      const allowedExt = this.allowedExtensions.split(',');
+      const allowed = allowedExt.includes(fileExt);
+
+      if (!allowed) {
+        await apos.notify('apostrophe:fileTypeNotAccepted', {
+          type: 'warning',
+          icon: 'alert-circle-icon',
+          interpolate: {
+            extensions: this.allowedExtensions
+          }
+        });
+      }
+
+      return allowed;
+    }
+  }
+};
+</script>
+<style scoped lang='scss'>
+  .apos-file-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-file-dropzone--dragover {
+    border: 2px dashed var(--a-primary);
+    background-color: var(--a-base-10);
+  }
+
+  .apos-file-instructions {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: center;
+    pointer-events: none;
+    // v-html goofiness
+    & ::v-deep .apos-file-highlight {
+      color: var(--a-primary);
+      font-weight: var(--a-weight-bold);
+    }
+  }
+
+  .apos-file-icon {
+    transform: rotate(45deg);
+    margin-right: 5px;
+  }
+</style>

package/modules/@apostrophecms/ui/ui/apos/components/AposMinMaxCount.vue

@@ -61,7 +61,9 @@ export default {
       return maxError;
     },
     countLabel() {
-      return `${this.value.length} Added`;
+      return this.$t('apostrophe:numberAdded', {
+        count: this.value.length
+      });
     },
     // Here in the array editor we use effectiveMin to factor in the
     // required property because there is no other good place to do that,
@@ -69,14 +71,18 @@ export default {
     // representation of "required".
     minLabel() {
       if (this.effectiveMin) {
-        return `Min: ${this.effectiveMin}`;
+        return this.$t('apostrophe:minUi', {
+          number: this.effectiveMin
+        });
       } else {
         return false;
       }
     },
     maxLabel() {
       if ((typeof this.field.max) === 'number') {
-        return `Max: ${this.field.max}`;
+        return this.$t('apostrophe:maxUi', {
+          number: this.field.max
+        });
       } else {
         return false;
       }