apostrophe 4.0.0 → 4.1.0

package/CHANGELOG.md

@@ -1,12 +1,35 @@
 # Changelog
 
+## 4.1.0 (2024-03-20)
+
+### Fixes
+
+* Don't crash if a document of a type no longer corresponding to any module is present
+together with the advanced permission module.
+* AposLoginForm.js now pulls its schema from the user module rather than hardcoding it. Includes the 
+addition of `enterUsername` and `enterPassword` i18n fields for front end customization and localization.
+* Simulated Express requests returned by `apos.task.getReq` now include a `req.headers` property, for
+greater accuracy and to prevent unexpected bugs in other code.
+* Fix the missing attachment icon. The responsibility for checking whether an attachment
+actually exists before calling `attachment.url` still lies with the developer.
+
+### Adds
+
+* Add new `getChanges` method to the schema module to get an array of document changed field names instead of just a boolean like does the `isEqual` method. 
+* Add highlight class in UI when comparing documents.
+
 ## 4.0.0 (2024-03-12)
 
 ### Adds
 
 * Add translation keys used by the multisite assembly module.
 * Add side by side comparison support in AposSchema component.
+* Add `beforeLocalize` and `afterLocalize` events.
+* Add custom manager indicators support via `apos.schema.addManagerIndicator({ component, props, if })`. The component registered this way will be automatically rendered in the manager modal.
 * Add the possibility to make widget modals wider, which can be useful for widgets that contain areas taking significant space. See [documentation](https://v3.docs.apostrophecms.org/reference/modules/widget-type.html#options).
+* Temporarily add `translation` module to support document translations via the `@apostrophecms-pro/automatic-translation` module.
+**The `translation` core module may be removed or refactored to reduce overhead in the core,** so its presence should
+not be relied upon.
 
 ### Changes
 
@@ -19,6 +42,7 @@ as noted in our announcement and on the migration page of our website.
 
 * Adds `textStyle` to Tiptap types so that spans are rendered on RT initialization
 * `field.help` and `field.htmlHelp` are now correctly translated when displayed in a tooltip.
+* Bump the `he` package to most recent version.
 * Notification REST APIs should not directly return the result of MongoDB operations.
 
 ## 3.63.2 (2024-03-01)

package/defaults.js

@@ -55,6 +55,7 @@ module.exports = {
     '@apostrophecms/file-tag': {},
     '@apostrophecms/soft-redirect': {},
     '@apostrophecms/submitted-draft': {},
-    '@apostrophecms/command-menu': {}
+    '@apostrophecms/command-menu': {},
+    '@apostrophecms/translation': {}
   }
 };

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

@@ -7,75 +7,75 @@
         v-if="!foreign"
         v-bind="upButton"
         :disabled="first || disabled"
-        @click="$emit('up')"
         :tooltip="{
           content: (!disabled && !first) ? 'apostrophe:nudgeUp' : null,
           placement: 'left'
         }"
         :modifiers="[ 'inline' ]"
+        @click="$emit('up')"
       />
       <AposButton
+        v-if="!foreign && !options.contextual"
         v-bind="editButton"
         :disabled="disabled"
-        v-if="!foreign && !options.contextual"
-        @click="$emit('edit')"
         :tooltip="{
           content: 'apostrophe:editWidget',
           placement: 'left'
         }"
         :modifiers="[ 'inline' ]"
+        @click="$emit('edit')"
       />
       <AposButton
-        v-bind="cutButton"
         v-if="!foreign"
-        @click="$emit('cut')"
+        v-bind="cutButton"
         :tooltip="{
           content: 'apostrophe:cut',
           placement: 'left'
         }"
         :modifiers="[ 'inline' ]"
+        @click="$emit('cut')"
       />
       <AposButton
-        v-bind="copyButton"
         v-if="!foreign"
-        @click="$emit('copy')"
+        v-bind="copyButton"
         :tooltip="{
           content: 'apostrophe:copy',
           placement: 'left'
         }"
+        @click="$emit('copy')"
       />
       <AposButton
         v-if="!foreign"
         v-bind="cloneButton"
         :disabled="disabled || maxReached"
-        @click="$emit('clone')"
         :tooltip="{
           content: 'apostrophe:duplicate',
           placement: 'left'
         }"
         :modifiers="[ 'inline' ]"
+        @click="$emit('clone')"
       />
       <AposButton
         v-if="!foreign"
         v-bind="removeButton"
         :disabled="disabled"
-        @click="$emit('remove')"
         :tooltip="{
           content: 'apostrophe:delete',
           placement: 'left'
         }"
         :modifiers="[ 'inline' ]"
+        @click="$emit('remove')"
       />
       <AposButton
         v-if="!foreign"
         v-bind="downButton"
         :disabled="last || disabled"
-        @click="$emit('down')"
         :tooltip="{
           content: (!disabled && !last) ? 'apostrophe:nudgeDown' : null,
           placement: 'left'
         }"
         :modifiers="[ 'inline' ]"
+        @click="$emit('down')"
       />
     </AposButtonGroup>
   </div>

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

@@ -592,7 +592,8 @@ module.exports = {
       getMissingAttachmentUrl() {
         const defaultIconUrl = '/modules/@apostrophecms/attachment/img/missing-icon.svg';
         self.apos.util.warn('Template warning: Impossible to retrieve the attachment url since it is missing, a default icon has been set. Please fix this ASAP!');
-        return defaultIconUrl;
+        // Convert static asset path to full URL, which matters when static assets are in uploadfs
+        return self.apos.asset.url(defaultIconUrl);
       },
       // This method is available as a template helper: apos.attachment.url
       //

package/modules/@apostrophecms/attachment/public/img/missing-icon.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 29.536 29.536" style="enable-background:new 0 0 29.536 29.536; fill: red;" xml:space="preserve">
+	<g>
+		<path d="M14.768,0C6.611,0,0,6.609,0,14.768c0,8.155,6.611,14.767,14.768,14.767s14.768-6.612,14.768-14.767
+			C29.535,6.609,22.924,0,14.768,0z M14.768,27.126c-6.828,0-12.361-5.532-12.361-12.359c0-6.828,5.533-12.362,12.361-12.362
+			c6.826,0,12.359,5.535,12.359,12.362C27.127,21.594,21.594,27.126,14.768,27.126z"/>
+		<path d="M14.385,19.337c-1.338,0-2.289,0.951-2.289,2.34c0,1.336,0.926,2.339,2.289,2.339c1.414,0,2.314-1.003,2.314-2.339
+			C16.672,20.288,15.771,19.337,14.385,19.337z"/>
+		<path d="M14.742,6.092c-1.824,0-3.34,0.513-4.293,1.053l0.875,2.804c0.668-0.462,1.697-0.772,2.545-0.772
+			c1.285,0.027,1.879,0.644,1.879,1.543c0,0.85-0.67,1.697-1.494,2.701c-1.156,1.364-1.594,2.701-1.516,4.012l0.025,0.669h3.42
+			v-0.463c-0.025-1.158,0.387-2.162,1.311-3.215c0.979-1.08,2.211-2.366,2.211-4.321C19.705,7.968,18.139,6.092,14.742,6.092z"/>
+	</g>
+</svg>

package/modules/@apostrophecms/command-menu/ui/apos/components/AposCommandMenuKey.vue

@@ -7,7 +7,7 @@
       class="apos-button__icon"
       fill-color="color"
     />
-    <slot name="label" v-if="label">
+    <slot v-if="label" name="label">
       {{ $t(label ) }}
     </slot>
   </span>

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

@@ -1047,6 +1047,7 @@ module.exports = {
           locale: toLocale,
           mode: 'draft'
         });
+
         const toId = draft._id.replace(`:${draft.aposLocale}`, `:${toLocale}:draft`);
         const actionModule = self.apos.page.isPage(draft) ? self.apos.page : self;
         // Use findForEditing so that we are successful even for edge cases
@@ -1059,17 +1060,26 @@ module.exports = {
         const existing = await actionModule.findForEditing(toReq, {
           _id: toId
         }).permission('view').toObject();
+
+        const eventOptions = {
+          source: draft.aposLocale.split(':')[0],
+          target: toLocale,
+          existing: Boolean(existing)
+        };
+
         // We only want to copy schema properties, leave non-schema
         // properties of the source document alone
-        const data = Object.fromEntries(Object.entries(draft).filter(([ key, value ]) => self.schema.find(field => field.name === key)));
+        const data = Object.fromEntries(Object.entries(draft)
+          .filter(
+            ([ key, value ]) => key === 'type' || self.schema.find(field => field.name === key)
+          ));
         // We need a slug even if removed from the schema for editing purposes
         data.slug = draft.slug;
         let result;
         if (!existing) {
           if (self.apos.page.isPage(draft)) {
             if (!draft.level) {
-              // Replicating the home page for the first time
-              result = await self.apos.doc.insert(toReq, {
+              const insert = {
                 ...data,
                 aposDocId: draft.aposDocId,
                 aposLocale: `${toLocale}:draft`,
@@ -1079,7 +1089,10 @@ module.exports = {
                 rank: draft.rank,
                 parked: draft.parked,
                 parkedId: draft.parkedId
-              });
+              };
+              await self.emit('beforeLocalize', req, insert, eventOptions);
+              // Replicating the home page for the first time
+              result = await self.apos.doc.insert(toReq, insert);
             } else {
               // A page that is not the home page, being replicated for the first time
               let { lastTargetId, lastPosition } = await self.apos.page.inferLastTargetIdAndPosition(draft);
@@ -1137,25 +1150,29 @@ module.exports = {
                   lastPosition = 'lastChild';
                 }
               }
+              const insert = {
+                ...data,
+                aposLocale: `${toLocale}:draft`,
+                _id: toId,
+                parked: draft.parked,
+                parkedId: draft.parkedId
+              };
+              await self.emit('beforeLocalize', req, insert, eventOptions);
               result = await actionModule.insert(toReq,
                 localizedTargetId,
                 lastPosition,
-                {
-                  ...data,
-                  aposLocale: `${toLocale}:draft`,
-                  _id: toId,
-                  parked: draft.parked,
-                  parkedId: draft.parkedId
-                }
+                insert
               );
             }
           } else {
-            result = await actionModule.insert(toReq, {
+            const insert = {
               ...data,
               aposDocId: draft.aposDocId,
               aposLocale: `${toLocale}:draft`,
               _id: toId
-            });
+            };
+            await self.emit('beforeLocalize', req, insert, eventOptions);
+            result = await actionModule.insert(toReq, insert);
           }
         } else {
           if (!options.update) {
@@ -1169,8 +1186,12 @@ module.exports = {
             aposLocale: `${toLocale}:draft`,
             metaType: 'doc'
           };
+          await self.emit('beforeLocalize', req, update, eventOptions);
           result = await actionModule.update(toReq, update);
         }
+
+        await self.emit('afterLocalize', req, draft, result, eventOptions);
+
         return result;
       },
       // Reverts the given draft to the most recent publication.

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

@@ -4,9 +4,6 @@
     :menu="menu"
     :disabled="disabled || (menu.length === 0)"
     menu-placement="bottom-end"
-    @item-clicked="menuHandler"
-    @open="$emit('menu-open')"
-    @close="$emit('menu-close')"
     :button="{
       tooltip: { content: 'apostrophe:moreOptions', placement: 'bottom' },
       label: 'apostrophe:moreOptions',
@@ -15,6 +12,9 @@
       type: 'subtle',
       modifiers: ['small', 'no-motion']
     }"
+    @item-clicked="menuHandler"
+    @open="$emit('menu-open')"
+    @close="$emit('menu-close')"
   />
 </template>
 

package/modules/@apostrophecms/i18n/i18n/en.json

@@ -45,6 +45,15 @@
   "assetWebpackCacheCleared": "Build cache cleared.",
   "assetWebpackConfigWarning": "⚠️ In the module {{ module }}, your webpack config is incorrect. It must be an object and should contain only the properties: {{ properties }}.",
   "at": "at",
+  "automaticTranslationCheckbox": "Translate text content",
+  "automaticTranslationErrMsg": "An error happened while getting available languages for translation. Translation will be skipped.",
+  "automaticTranslationErrorNoProvider": "Translation provider not found. Page \"{{ title }}\" was not translated.",
+  "automaticTranslationErrorTargets": "Badly formatted translation targets.",
+  "automaticTranslationLngCheckNoProvider": "Translation provider not found.",
+  "automaticTranslationSettings": "Automatic translation settings",
+  "automaticTranslationSourceErrMsg": "The current locale <strong>{{ source }}</strong> is not suitable for translation. Translation will be skipped.",
+  "automaticTranslationTargetErrMsg": "Could not find a suitable language for the locale <strong>{{ targets }}</strong>. Translation will be skipped for this locale.",
+  "automaticTranslationTargetErrMsg_plural": "Could not find a suitable language for the locales <strong>{{ targets }}</strong>. Translation will be skipped for these locales.",
   "back": "Back",
   "backToHome": "Back to Home",
   "basics": "Basics",
@@ -149,6 +158,8 @@
   "email": "Email",
   "emptyRichTextWidget": "Empty Rich Text Widget",
   "enabled": "Enabled",
+  "enterPassword": "Enter password",
+  "enterUsername": "Enter username",
   "error": "An error occurred",
   "errorBatchOperationNoti": "Batch operation {{ operation }} failed.",
   "errorCount": "{{ count }} error remaining",
@@ -281,6 +292,7 @@
   "noNewRelatedDocuments": "Although this document has related documents, none of them are new to the locales you have selected.",
   "noTypeFound": "No {{ type }} Found",
   "none": "None",
+  "notAvailable": "n/a",
   "notFound": "Not found.",
   "notFoundPageMessage": "We can't seem to find the page you're looking for.",
   "notFoundPageStatusCode": "404",
@@ -366,6 +378,7 @@
   "restoredPrevious": "Restored previously published version.",
   "resumeEditing": "Resume Editing",
   "retryingSaveDocument": "Retrying save document...",
+  "retry": "Retry",
   "returnToPage": "Return to {{ label }}",
   "richText": "Rich Text",
   "richTextAlignCenter": "Align Center",

package/modules/@apostrophecms/i18n/ui/apos/components/AposI18nLocalize.vue

@@ -215,6 +215,46 @@
                   {{ $t('apostrophe:noNewRelatedDocuments') }}
                 </p>
               </div>
+              <div v-if="translationEnabled" class="apos-wizard__translation">
+                <p class="apos-wizard__translation-title">
+                  <AposTranslationIndicator :size="18" />
+                  <span class="apos-wizard__translation-title-text">
+                    {{ $t('apostrophe:automaticTranslationSettings') }}
+                  </span>
+                </p>
+                <AposCheckbox
+                  v-model="wizard.values.translateContent.data"
+                  :field="{ name: 'translate' }"
+                  :choice="{
+                    value: wizard.values.translateContent.data,
+                    label: $t('apostrophe:automaticTranslationCheckbox')
+                  }"
+                  data-apos-test="localizationTranslationCheck"
+                />
+
+                <div v-if="translationErrMsg">
+                  <!-- eslint-disable vue/no-v-html -->
+                  <p
+                    class="apos-wizard__translation-error"
+                    data-apos-test="localizationTranslationErr"
+                    v-html="translationErrMsg"
+                  />
+                  <!-- eslint-disable vue/no-v-html -->
+                  <AposButton
+                    v-if="translationShowRetry"
+                    label="apostrophe:retry"
+                    :modifiers="['quiet', 'no-motion']"
+                    data-apos-test="localizationTranslationRetry"
+                    @click="retryTranslationCheck()"
+                  />
+                </div>
+                <div
+                  v-else-if="translationShowLoader"
+                  class="apos-wizard__translation-spinner"
+                >
+                  <AposSpinner />
+                </div>
+              </div>
             </fieldset>
           </form>
         </template>
@@ -338,7 +378,10 @@ export default {
           toLocalize: { data: 'thisDocAndRelated' },
           toLocales: { data: this.locale ? [ this.locale ] : [] },
           relatedDocSettings: { data: 'localizeNewRelated' },
-          relatedDocTypesToLocalize: { data: [] }
+          relatedDocTypesToLocalize: { data: [] },
+          translateContent: { data: false },
+          translateTargets: { data: [] },
+          translateProvider: { data: apos.translation.providers[0]?.name || null }
         }
       },
       fullDoc: this.doc,
@@ -369,7 +412,11 @@ export default {
           value: 'relatedDocsOnly',
           label: 'apostrophe:relatedDocsOnly'
         }
-      ]
+      ],
+      translationEnabled: apos.modules['@apostrophecms/translation'].enabled,
+      translationErrMsg: null,
+      translationShowRetry: false,
+      translationShowLoader: false
     };
   },
   computed: {
@@ -428,7 +475,7 @@ export default {
     },
     visibleSections() {
       const self = this;
-      const result = Object.entries(this.wizard.sections).filter(([ name, section ]) => {
+      const result = Object.entries(this.wizard.sections).filter(([ _, section ]) => {
         return section.if ? section.if.bind(self)() : true;
       }).map(([ name, section ]) => {
         return {
@@ -463,6 +510,9 @@ export default {
     'wizard.values.toLocalize.data'() {
       this.updateRelatedDocs();
     },
+    async 'wizard.values.translateContent.data'(value) {
+      await this.checkAvailableTranslations(value);
+    },
     selectedLocales() {
       this.updateRelatedDocs();
     },
@@ -516,6 +566,13 @@ export default {
     },
     goToPrevious() {
       this.wizard.step = this.previousStepName;
+      this.uncheckTranslate();
+    },
+    uncheckTranslate() {
+      this.wizard.values.translateContent.data = false;
+      this.wizard.values.translateTargets.data = [];
+      this.translationErrMsg = null;
+      this.translationShowRetry = false;
     },
     goToNext() {
       this.goTo(this.nextStepName);
@@ -661,6 +718,10 @@ export default {
                 toLocale: locale.name,
                 update: (doc._id === this.fullDoc._id) || !(this.wizard.values.relatedDocSettings.data === 'localizeNewRelated')
               },
+              qs: {
+                aposTranslateTargets: this.wizard.values.translateTargets.data,
+                aposTranslateProvider: this.wizard.values.translateProvider.data
+              },
               busy: true
             });
 
@@ -797,7 +858,11 @@ export default {
         // never be considered "related" to other pages simply because
         // of navigation links, the feature is meant for pieces that feel more like
         // part of the document being localized)
-        return related.filter(doc => apos.modules[doc.type].relatedDocument !== false);
+        // We also remove non localized content like users
+        return related.filter(doc => {
+          return apos.modules[doc.type].relatedDocument !== false &&
+            apos.modules[doc.type].localized !== false;
+        });
       }
     },
     async updateRelatedDocs() {
@@ -831,6 +896,77 @@ export default {
       }
       this.relatedDocs = relatedDocs;
       this.wizard.busy = status;
+    },
+    wait(time) {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          resolve();
+        }, time);
+      });
+    },
+    async retryTranslationCheck() {
+      await this.checkAvailableTranslations(false);
+      this.translationShowLoader = true;
+      await this.wait(500);
+      await this.checkAvailableTranslations(true);
+      this.translationShowLoader = false;
+    },
+    async checkAvailableTranslations(value) {
+      if (!value) {
+        this.translationErrMsg = null;
+        this.translationShowRetry = false;
+        this.wizard.values.translateTargets.data = [];
+        return;
+      }
+      const [ sourceLocale ] = this.doc.aposLocale.split(':');
+      const targets = this.wizard.values.toLocales.data;
+
+      let response;
+      try {
+        response = await apos.http.get(`${apos.translation.action}/languages`, {
+          qs: {
+            provider: this.wizard.values.translateProvider.data,
+            source: [ sourceLocale ],
+            target: targets.map(({ name }) => name)
+          }
+        });
+      } catch (err) {
+        console.error('An error happened while getting available languages: ', err);
+        this.wizard.values.translateTargets.data = [];
+        this.translationErrMsg = this.$t('apostrophe:automaticTranslationErrMsg');
+        this.translationShowRetry = true;
+        return;
+      }
+
+      const unavailableSource = !response.source[0].supported;
+      const unavailableTargetsLabels = response.target
+        .filter(({ supported }) => !supported)
+        .map(({ code }) => targets.find((locale) => locale.name === code)?.label || code);
+
+      if (unavailableSource) {
+        const sourceLabel = this.moduleOptions.locales[sourceLocale]?.label;
+        this.translationErrMsg = this.$t('apostrophe:automaticTranslationSourceErrMsg', { source: sourceLabel });
+        this.wizard.values.translateTargets.data = [];
+        return;
+      }
+
+      if (unavailableTargetsLabels.length) {
+        const isPlural = unavailableTargetsLabels.length > 1;
+        this.translationErrMsg = this.$t(
+          `apostrophe:automaticTranslationTargetErrMsg${isPlural ? '_plural' : ''}`,
+          { targets: unavailableTargetsLabels.join(', ') }
+        );
+      }
+
+      if (unavailableTargetsLabels.length >= targets.length) {
+        this.wizard.values.translateTargets.data = [];
+        return;
+      }
+
+      this.wizard.values.translateTargets.data = response.target
+        .filter(({ supported }) => supported)
+        .map(({ code }) => code);
+
     }
   }
 };
@@ -1020,9 +1156,12 @@ export default {
   }
 }
 
+.apos-wizard__step  :deep(.apos-field--relatedDocTypesToLocalize) {
+  margin-top: $spacing-triple;
+}
 .apos-wizard__step {
-  .apos-field__wrapper:not(:last-of-type) {
-    margin-bottom: $spacing-triple;
+  .apos-field__wrapper {
+    margin-bottom: $spacing-double;
   }
 }
 
@@ -1065,4 +1204,32 @@ export default {
 .apos-locale-name {
   text-transform: uppercase;
 }
+
+.apos-wizard__translation {
+  margin-top: 30px;
+}
+
+.apos-wizard__translation-title {
+  @include type-label;
+
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid var(--a-base-8);
+  padding-bottom: 8px;
+}
+
+.apos-wizard__translation-title-text {
+  margin-left: 7px;
+}
+
+.apos-wizard__translation-error {
+  @include type-label;
+  color: var(--a-danger);
+}
+
+.apos-wizard__translation-spinner {
+  margin-top: 20px;
+  display: flex;
+  justify-content: center;
+}
 </style>

package/modules/@apostrophecms/image/ui/apos/components/AposMediaManagerSelections.vue

@@ -6,14 +6,15 @@
         <AposButton
           label="apostrophe:clear"
           type="quiet"
-          @click="clear"
           :modifiers="['no-motion']"
+          @click="clear"
         />
       </div>
       <ol class="apos-media-manager-selections__items">
         <li
           v-for="item in items"
-          :key="item._id" class="apos-media-manager-selections__item"
+          :key="item._id"
+          class="apos-media-manager-selections__item"
         >
           <div
             v-if="item.attachment && item.attachment._urls"

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

@@ -51,6 +51,10 @@ module.exports = {
   cascades: [ 'requirements' ],
   options: {
     alias: 'login',
+    placeholder: {
+      username: 'apostrophe:enterUsername',
+      password: 'apostrophe:enterPassword'
+    },
     localLogin: true,
     passwordReset: false,
     passwordResetHours: 48,
@@ -539,6 +543,7 @@ module.exports = {
 
       getBrowserData(req) {
         return {
+          schema: self.getSchema(),
           action: self.action,
           passwordResetEnabled: self.isPasswordResetEnabled(),
           ...(req.user ? {
@@ -909,8 +914,20 @@ module.exports = {
             last: true
           }
         );
-      }
+      },
 
+      getSchema() {
+        return self.apos.user.schema
+          .filter(({ name }) => [ 'username', 'password' ].includes(name))
+          .map(field => ({
+            name: field.name,
+            label: field.label,
+            placeholder: self.options.placeholder[field.name],
+            type: field.type,
+            required: true
+          })
+          );
+      }
     };
   },
 

package/modules/@apostrophecms/login/ui/apos/components/AposResetPasswordForm.vue

@@ -1,7 +1,7 @@
 <template>
   <div
-    class="apos-login-form"
     v-if="passwordResetEnabled && ready"
+    class="apos-login-form"
   >
     <TheAposLoginHeader
       :env="context.env"
@@ -27,8 +27,8 @@
         @submit.prevent="submit"
       >
         <AposSchema
-          :schema="schema"
           v-model="doc"
+          :schema="schema"
         />
         <AposButton
           data-apos-test="pwdResetSubmit"