apostrophe 4.4.2 → 4.5.0

package/CHANGELOG.md

@@ -1,5 +1,58 @@
 # Changelog
 
+## 4.5.0 (2024-07-10)
+
+### Adds
+
+* Allow to disable shortcut by setting the option `shortcut: false`
+* Adds a new color picker tool for the rich-text-widget toolbar that matches the existing `color` schema field. This also adds the same `pickerOptions` and `format` options to the rich-text-widget configuration that exist in the `color` schema field.
+* Add missing UI translation keys.
+* Infite scroll in media manager instead of pagination and related search fixes.
+* Improves loaders by using new `AposLoadingBlock` that uses `AposLoading` instead of the purple screen in media manager.
+* Select the configured aspect ratio and add `data-apos-field` attributes to the fields inside `AposImageRelationshipEditor.vue`.
+* Add `getShowAdminBar` method. This method can be overriden in projects to drive the admin bar visibility for logged-in users.
+
+### Fixes
+
+* Remove double GET request when saving image update.
+* Fix filter menu forgetting selecting filters and not instantiating them.
+* Remove blur emit for filter buttons and search bar to avoid re requesting when clicking outside…
+* `this.modified` was not working properly (set to false when saving). We can now avoid to reload images when saving no changes.
+* In media manager images checkboxes are disabled when max is reached.
+* In media manager when updating an image or archiving, update the list instead of fetching and update checked documents to see changes in the right panel selected list.
+* The `password` field type now has a proper fallback default, the empty string, just like the string field type
+and its derivatives. This resolves bugs in which the unexpected `null` caused problems during validation. This bug
+was old, but was masked in some situations until the release of version `4.4.3`.
+* Identify and mark server validation errors in the admin UI. This helps editors identify already existing data fields, having validation errors when schema changes (e.g. optional field becomes required).
+* Removes `menu-offset` props that were causing `AposContextMenu` to not display properly. 
+* Allows to pass a number or an array to `AposContextMenu` to set the offset of the context menu (main and cross axis see `floating-ui` documentation).
+* Fixes the relationship fields not having the data when coming from the relationship modal.
+* Fixes watch on `checkedDocs` passed to `AposSlatList` not being reactive and not seeing updated relationship fields.
+* Adds styles for 1 column expanded area ([#4608](https://github.com/apostrophecms/apostrophe/issues/4608))
+* Fixes weird slug computations based on followed values like title. Simplifies based on the new tech design.
+* Prevent broken admin UI when there is a missing widget.
+* Fixes media manager not loading images when last infinite scroll page have been reached (when uploading image for example).
+* Upgrade oembetter versions to allow all vimeo urls.
+
+### Changes
+
+* Update `Choose Images` selection behavior. When choosing images as part of a relationship, you click on the image or checkbox to add the image to the selection.
+If a max is set to allow only one image, clicking on the selected image will remove it from the selection. Clicking on another image will update the selection with the newly clicked image. 
+If a max is set to allow multiple images, you can remove images from the selection by using the checkbox. Clicking on the image will bring the image schema in the right panel.
+You can upload images even if the max has been reached. We will append the uploaded images to the existing selection up to the max if any.
+* Update `@apostrophecms/emulate-mongo-3-driver` dependency to keep supporting `mongodb@3.x` queries while using `mongodb@6.x`.
+
+## 4.4.3 (2024-06-17)
+
+### Fixes
+
+* Do not use schema `field.def` when calling `convert`. Applying defaults to new documents is the job of `newInstance()` and similar code.
+If you wish a field to be mandatory use `required: true`.
+* As a convenience, using `POST` for pieces and pages with `_newInstance: true` keeps any additional `req.body` properties in the API response.
+This feature unofficially existed before, it is now supported.
+* Rollbacks watcher on `checked` array. Fixes, checked docs not being properly updated.
+
+
 ## 4.4.2 (2024-06-14)
 
 ### Fixes
@@ -58,13 +111,19 @@ We will now end up with page B slug as `/peer/page` and not `/peer/peer/page` as
 * Detect shortcut conflicts when using multiple shortcuts.
 * Updating schema fields as read-only no longer reset the value when updating the document.
 * Fixes stylelint config file, uses config from our shared configuration, fixes all lint errors. 
-* Removes `$nextTick` use to re render schema in `AposArrayEditor` because it was triggering weird vue error in production.
-Instead, makes the AposSchema for loop keys more unique using `modelValue.data._id`, 
-if document changes it re-renders schema fields.
 * Fixes `TheAposCommandMenu` modals not computing shortcuts from the current opened modal.
 * Fixes select boxes of relationships, we can now check manually published relationships, and `AposSlatList` renders properly checked relationships.
 * Fixes issues in `AposInputArray` on production build to be able to add, remove and edit array items after `required` error.
 * Relationships browse button isn't disabled when max is reached.
+* In media manager images checkboxes are disabled when max is reached.
+
+## 4.3.3 (2024-06-04)
+
+### Fixes
+
+* Removes `$nextTick` use to re render schema in `AposArrayEditor` because it was triggering weird vue error in production.
+Instead, makes the AposSchema for loop keys more unique using `modelValue.data._id`, 
+if document changes it re-renders schema fields.
 * In media manager image checkboxes are disabled when max is reached.
 * Fixes tiptap bubble menu jumping on Firefox when clicking on buttons. Also fixes the fact that 
 double clicking on bubble menu out of buttons would prevent it from closing when unfocusing the rich text area.

package/index.js

@@ -9,8 +9,7 @@ const cluster = require('cluster');
 const { cpus } = require('os');
 const process = require('process');
 const npmResolve = require('resolve');
-const glob = require('glob');
-
+const glob = require('./lib/glob.js');
 let defaults = require('./defaults.js');
 
 // ## Top-level options
@@ -389,7 +388,7 @@ async function apostrophe(options, telemetry, rootSpan) {
     if (!options.nestedModuleSubdirs) {
       return;
     }
-    const configs = glob.sync(self.localModules + '/**/modules.js', { follow: true });
+    const configs = glob(self.localModules + '/**/modules.js', { follow: true });
     _.each(configs, function(config) {
       try {
         _.merge(self.options.modules, require(config));

package/lib/glob.js

@@ -0,0 +1,12 @@
+const { globSync } = require('glob');
+
+// synchronous glob 10 but with the sorting semantics of glob 8,
+// to ease backwards compatibility in Apostrophe startup logic
+
+module.exports = (pattern, options) => {
+  const result = globSync(pattern, options);
+  if (!options.nosort) {
+    result.sort((a, b) => a.localeCompare(b, 'en'));
+  }
+  return result;
+};

package/lib/moog-require.js

@@ -2,7 +2,7 @@ const _ = require('lodash');
 const fs = require('fs');
 const npmResolve = require('resolve');
 const path = require('path');
-const glob = require('glob');
+const glob = require('./glob.js');
 const importFresh = require('import-fresh');
 const resolveFrom = require('resolve-from');
 const regExpQuote = require('regexp-quote');
@@ -60,7 +60,7 @@ module.exports = function(options) {
         // Fetching a list of index.js files on the first call and then searching it each time for
         // one that refers to the right type name shaves as much as 60 seconds off the startup
         // time in a large project, compared to using the glob cache feature
-        self._indexes = glob.sync(self.options.localModules + '/**/index.js', { follow: true });
+        self._indexes = glob(self.options.localModules + '/**/index.js', { follow: true });
       }
       const matches = self._indexes.filter(function(index) {
         // Double-check that we're not confusing "@apostrophecms/asset" with "asset" by
@@ -255,7 +255,7 @@ module.exports = function(options) {
       // Ternary is required because glob expects at least 2 entries when using curly braces
       const pattern = workspaces.length === 1 ? workspaces[0] : `{${workspaces.join(',')}}`;
       const packagePath = path.resolve(folder, pattern, 'package.json');
-      const workspacePackages = glob.sync(packagePath, { follow: true });
+      const workspacePackages = glob(packagePath, { follow: true });
 
       return workspacePackages.flatMap(packagePath => {
         const info = JSON.parse(fs.readFileSync(packagePath, 'utf8'));

package/modules/@apostrophecms/admin-bar/index.js

@@ -5,7 +5,7 @@
 // takes advantage of this module.
 
 const _ = require('lodash');
-const cuid = require('cuid');
+const { createId } = require('@paralleldrive/cuid2');
 
 module.exports = {
   options: {
@@ -310,6 +310,12 @@ module.exports = {
         return self.apos.permission.can(req, item.permission.action, item.permission.type, 'draft');
       },
 
+      // Show admin bar for logged-in user only
+
+      getShowAdminBar(req) {
+        return !!req.user;
+      },
+
       getBrowserData(req) {
         if (!req.user) {
           return false;
@@ -351,9 +357,10 @@ module.exports = {
           },
           // Base API URL appropriate to the context document
           contextBar: context && self.apos.doc.getManager(context.type).options.contextBar,
+          showAdminBar: self.getShowAdminBar(req),
           // Simplifies frontend logic
           contextId: context && context._id,
-          tabId: cuid(),
+          tabId: createId(),
           contextEditorName,
           pageTree: self.options.pageTree && self.apos.permission.can(req, 'edit', '@apostrophecms/any-page-type', 'draft'),
           bars: self.bars,

package/modules/@apostrophecms/admin-bar/ui/apos/apps/AposAdminBar.js

@@ -4,7 +4,7 @@ export default function() {
   const component = apos.vueComponents.TheAposAdminBar;
   // Careful, login page is in user scene but has no admin bar
   const el = document.querySelector('#apos-admin-bar');
-  if (!apos.adminBar || !el) {
+  if (!apos.adminBar || !el || apos?.adminBar.showAdminBar === false) {
     return;
   }
   const app = createApp(component, { items: apos.adminBar.items || [] });

package/modules/@apostrophecms/admin-bar/ui/apos/components/TheAposContextBar.vue

@@ -35,7 +35,7 @@
 
 <script>
 import { klona } from 'klona';
-import cuid from 'cuid';
+import { createId } from '@paralleldrive/cuid2';
 import AposPublishMixin from 'Modules/@apostrophecms/ui/mixins/AposPublishMixin';
 import AposAdvisoryLockMixin from 'Modules/@apostrophecms/ui/mixins/AposAdvisoryLockMixin';
 
@@ -159,7 +159,7 @@ export default {
     // sessionStorage because it is deliberately browser-tab specific
     let tabId = sessionStorage.getItem('aposTabId');
     if (!tabId) {
-      tabId = cuid();
+      tabId = createId();
       sessionStorage.setItem('aposTabId', tabId);
     }
     window.apos.adminBar.tabId = tabId;

package/modules/@apostrophecms/admin-bar/ui/apos/components/TheAposContextTitle.vue

@@ -31,7 +31,6 @@
           :button="draftButton"
           :menu="draftMenu"
           :disabled="hasCustomUi || isUnpublished"
-          menu-offset="13, 10"
           menu-placement="bottom-end"
           @item-clicked="switchDraftMode"
         />

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

@@ -82,7 +82,7 @@
 </template>
 
 <script>
-import cuid from 'cuid';
+import { createId } from '@paralleldrive/cuid2';
 
 export default {
   name: 'AposAreaContextualMenu',
@@ -184,7 +184,7 @@ export default {
       }
     },
     menuId() {
-      return `areaMenu-${cuid()}`;
+      return `areaMenu-${createId()}`;
     }
   },
   mounted() {

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

@@ -70,7 +70,7 @@
 </template>
 
 <script>
-import cuid from 'cuid';
+import { createId } from '@paralleldrive/cuid2';
 import { klona } from 'klona';
 import AposThemeMixin from 'Modules/@apostrophecms/ui/mixins/AposThemeMixin';
 
@@ -148,7 +148,7 @@ export default {
       addWidgetEditor: null,
       addWidgetOptions: null,
       addWidgetType: null,
-      areaId: cuid(),
+      areaId: createId(),
       next: this.getValidItems(),
       hoveredWidget: null,
       hoveredNonForeignWidget: null,
@@ -406,7 +406,7 @@ export default {
     // Regenerate all array item, area, object and widget ids so they are considered
     // new. Useful when copying a widget with nested content.
     regenerateIds(schema, object) {
-      object._id = cuid();
+      object._id = createId();
       for (const field of schema) {
         if (field.type === 'array') {
           for (const item of (object[field.name] || [])) {
@@ -416,7 +416,7 @@ export default {
           this.regenerateIds(field.schema, object[field.name] || {});
         } else if (field.type === 'area') {
           if (object[field.name]) {
-            object[field.name]._id = cuid();
+            object[field.name]._id = createId();
             for (const item of (object[field.name].items || [])) {
               const schema = apos.modules[apos.area.widgetManagers[item.type]].schema;
               this.regenerateIds(schema, item);
@@ -513,7 +513,7 @@ export default {
     },
     async insert({ index, widget }) {
       if (!widget._id) {
-        widget._id = cuid();
+        widget._id = createId();
       }
       if (!widget.metaType) {
         widget.metaType = 'widget';
@@ -600,7 +600,7 @@ export default {
       schema.forEach(field => {
         if (field.type === 'area') {
           widget[field.name] = {
-            _id: cuid(),
+            _id: createId(),
             metaType: 'area',
             items: []
           };

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

@@ -140,7 +140,7 @@ export default {
       }
 
       const group = {
-        label: 'Clipboard',
+        label: this.$t('apostrophe:areaExpandedMenuClipboard'),
         widgets: [
           {
             type: 'clipboard',
@@ -220,6 +220,12 @@ export default {
     background-color: var(--a-base-10);
   }
 
+  &--1-column {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: 15px;
+  }
+
   &--2-columns {
     display: grid;
     grid-template-columns: repeat(2, 1fr);

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

@@ -1,4 +1,3 @@
-const glob = require('glob');
 const fs = require('fs-extra');
 const Promise = require('bluebird');
 const webpackModule = require('webpack');
@@ -8,7 +7,7 @@ const util = require('util');
 const express = require('express');
 const { stripIndent } = require('common-tags');
 const { mergeWithCustomize: webpackMerge } = require('webpack-merge');
-const cuid = require('cuid');
+const { createId } = require('@paralleldrive/cuid2');
 const chokidar = require('chokidar');
 const _ = require('lodash');
 const {
@@ -110,7 +109,7 @@ module.exports = {
   components(self) {
     return {
       scripts(req, data) {
-        const placeholder = `[scripts-placeholder:${cuid()}]`;
+        const placeholder = `[scripts-placeholder:${createId()}]`;
 
         req.scriptsPlaceholder = placeholder;
 
@@ -119,7 +118,7 @@ module.exports = {
         };
       },
       stylesheets(req, data) {
-        const placeholder = `[stylesheets-placeholder:${cuid()}]`;
+        const placeholder = `[stylesheets-placeholder:${createId()}]`;
 
         req.stylesheetsPlaceholder = placeholder;
 
@@ -247,7 +246,7 @@ module.exports = {
           const scenes = [ ...new Set(Object.values(self.builds).map(options => options.scenes).flat()) ];
 
           // enumerate public assets and include them in deployment if appropriate
-          const publicAssets = glob.sync('modules/**/*', {
+          const publicAssets = self.apos.util.glob('modules/**/*', {
             cwd: bundleDir,
             mark: true
           }).filter(match => !match.endsWith('/'));
@@ -702,7 +701,7 @@ module.exports = {
                 if (seen[entry.dirname]) {
                   continue;
                 }
-                components = components.concat(glob.sync(`${entry.dirname}/ui/${folder}/${pattern}`));
+                components = components.concat(self.apos.util.glob(`${entry.dirname}/ui/${folder}/${pattern}`));
                 seen[entry.dirname] = true;
               }
             }

package/modules/@apostrophecms/command-menu/index.js

@@ -205,7 +205,8 @@ module.exports = {
           );
           command.modal &&
             assert.equal(typeof command.modal, 'string', `Invalid command modal for ${name}`);
-          assert.equal(typeof command.shortcut, 'string', `Invalid command shortcut, must be a string, for ${name}`);
+          command.shortcut !== false &&
+            assert.equal(typeof command.shortcut, 'string', `Invalid command shortcut, must be a string, for ${name}`);
 
           return [ true, null ];
         } catch (error) {
@@ -246,9 +247,13 @@ module.exports = {
         }
       },
       buildCommands(initialState) {
+        const additionalRemoves = Object.entries(initialState.composed.commands)
+          .filter(([ , field ]) => field.shortcut === false)
+          .map(([ name ]) => name);
+
         const concatenate = self.apos.util.omit(
           initialState.composed.commands,
-          initialState.composed.removes
+          initialState.composed.removes.concat(additionalRemoves)
         );
 
         return {

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

@@ -1,5 +1,5 @@
 const _ = require('lodash');
-const cuid = require('cuid');
+const { createId } = require('@paralleldrive/cuid2');
 const { SemanticAttributes } = require('@opentelemetry/semantic-conventions');
 const { klona } = require('klona');
 
@@ -1696,7 +1696,7 @@ module.exports = {
           }
           for (const widget of area.items || []) {
             if ((!widget._id) || seen.has(widget._id)) {
-              widget._id = cuid();
+              widget._id = createId();
             } else {
               seen.add(widget._id);
             }

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

@@ -1554,7 +1554,7 @@ module.exports = {
           } else {
             // Dynamic choices from the REST API, but
             // we need a label for "no opinion"
-            filter.nullLabel = 'Choose One';
+            filter.nullLabel = 'apostrophe:filterMenuChooseOne';
           }
         });
       },

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

@@ -33,6 +33,7 @@
   "archivingWillDeleteDraftChildren": "Child pages that have never been published will be permanently deleted.",
   "archivingWillLoseDraftChanges": "Unpublished draft changes to this {{ type }} will be permanently deleted.",
   "archivingWillUnpublish": "This will also un-publish the {{ type }}.",
+  "areaExpandedMenuClipboard": "Clipboard",
   "areYouSure": "Are You Sure?",
   "arrayCancelDescription": "Do you want to discard changes to this list?",
   "aspectRatio": "Aspect Ratio",
@@ -195,8 +196,14 @@
   "fileTypeCannotBeCropped": "{{ extension }} files cannot be cropped, do not present the cropping UI for this type",
   "fileTypeNotAccepted": "File type was not accepted. Allowed extensions: {{ extensions }}",
   "files": "Files",
+  "fileUploaderAttachmentLimitReached": "Attachment limit reached",
+  "fileUploaderDropFile": "Drop a file here or",
+  "fileUploaderFieldIsDisabled": "Field is disabled",
+  "fileUploaderOpenExplorer": "click to open the file explorer",
   "filter": "Filter",
   "filterByTag": "Filter by Tag",
+  "filterMenuChooseOne": "Choose One",
+  "filterMenuLoadingChoices": "Loading Choices...",
   "filterResultsByType": "Filter Results By Type",
   "findOrAddTag": "Find an existing tag or add a new one",
   "focalPoint": "Select a focal point for this image",
@@ -205,6 +212,9 @@
   "guest": "Guest",
   "hideInNavigation": "Hide in Navigation",
   "home": "Home",
+  "i18nCurrentLocale": "Current Locale",
+  "i18nCurrentlySelectedLocale": "Currently selected locale",
+  "i18nDefaultLocale": "Default locale",
   "image": "Image",
   "imageOnReplaceAutocropMessage": "The replaced image has been autocropped for \"{{ title }}\".",
   "imageOnReplaceAutocropError": "An error occurred while autocropping the replaced image for {{ title }}",
@@ -214,10 +224,12 @@
   "imageTag": "Image Tag",
   "imageTags": "Image Tags",
   "images": "Images",
+  "inputFieldIsDisabled": "This field is disabled",
   "insertAndNew": "{{ saveLabel }} {{ typeLabel }} and create a new one.",
   "insertAndRedirect": "{{ saveLabel }} {{ typeLabel }} and be redirected to the {{ typeLabel }}.",
   "insertAndReturn": "{{ saveLabel }} and return to the {{ typeLabel }} listing.",
   "insertTable": "Insert Table",
+  "invalid": "invalid",
   "lastEdited": "Last Edited",
   "lastUpdatedBy": "Last saved on {{ updatedAt }} <br /> by {{ updatedBy }}",
   "leavePageDescription": "The content you're trying to edit belongs to another document and must be edited there.\nChanges made to {{ oldTitle }} are saved automatically.",
@@ -231,7 +243,9 @@
   "localize": "Localize...",
   "localizeAllRelated": "Localize all related documents and overwrite existing documents",
   "localizeContent": "Localize Content",
+  "localizeLocalized": "Localized",
   "localizeNewRelated": "Localize new related documents",
+  "localizeNotYetLocalized": "Not Yet Localized",
   "localized": "Localized the {{ type }} {{ title }} to {{ locale }}",
   "localizingBusy": "Localizing Content",
   "logOut": "Log Out",
@@ -266,13 +280,19 @@
   "mediaDimensions": "Dimensions: {{ width }} 𝗑 {{ height }}",
   "mediaFileSize": "File Size: {{ fileSize }}",
   "mediaKB": "{{ size }}KB",
+  "mediaLibraryEndReached": "You've reached the end of the media library.",
   "mediaMB": "{{ size }}MB",
+  "mediaManagerErrorRestoring": "Error Restoring",
+  "mediaManagerErrorSaving": "Error Saving",
   "mediaUploadViaDrop": "Drop ’em when you’re ready",
   "mediaUploadViaExplorer": "Or click to open the file explorer",
   "mergeCells": "Merge Cells",
   "minLabel": "Min:",
   "minSize": "Min size of {{ width }}x{{ height }}",
   "minUi": "Min: {{ number }}",
+  "modalBreadcrumbsDefaultLabel": "Set a label",
+  "modalTabsError": "Error",
+  "modalTabsErrors": "Errors",
   "modernBuild": "Public-facing modern JavaScript and Sass",
   "modify": "Modify",
   "modifyOrDelete": "Modify / Delete",
@@ -306,6 +326,9 @@
   "nudgeDown": "Nudge Down",
   "nudgeUp": "Nudge Up",
   "numberAdded": "{{ count }} Added",
+  "oembedInvalidEmbedUrl": "Invalid embed URL",
+  "oembedTypeNotSupported": "Embed type not supported",
+  "oembedVideoUrlInvalid": "Video URL invalid",
   "office": "Office",
   "openGlobal": "Open Global Site Settings",
   "openLinkInNewTab": "Open link in new tab",
@@ -341,10 +364,11 @@
   "public": "Public",
   "publish": "Publish",
   "publishBeforeUsingTooltip": "Publish this content before using it in a relationship",
-  "publishType": "Publish {{ type }}",
+  "publishType": "Publish {{ type }}",
   "published": "Published",
   "publishingBatchConfirmation": "Are you sure you want to publish {{ count }} {{ type }}?",
   "publishingBatchConfirmationButton": "Yes, publish content.",
+  "required": "required",
   "rawCssAndJs": "Raw CSS and JS",
   "rawHtml": "Raw HTML",
   "rawHtmlCode": "Raw HTML (Code)",
@@ -393,6 +417,7 @@
   "richTextBold": "Bold",
   "richTextBulletedList": "Bulleted List",
   "richTextCodeBlock": "Code Block",
+  "richTextColor": "Color",
   "richTextH2": "Heading 2 (H2)",
   "richTextH3": "Heading 3 (H3)",
   "richTextH4": "Heading 4 (H4)",
@@ -415,6 +440,7 @@
   "richTextStyleConfigWarning": "Misconfigured rich text style: label: {{ label }}, {{ tag }}",
   "richTextUnderline": "Underline",
   "richTextUndo": "Undo",
+  "role": "Role",
   "safeModeActive": "Running in safe mode, not showing raw HTML.",
   "save": "Save",
   "saveDraft": "Save Draft",
@@ -444,6 +470,7 @@
   "selectManyLabel": "Select {{ typeLabel }}",
   "selectOneLabel": "Select {{ typeLabel }}",
   "selectPage": "Select Page",
+  "selectPages": "Select Pages",
   "selectedMenuItem": "✓ {{ label }}",
   "sentenceJoiner": " ",
   "settings": "Personal Settings",
@@ -463,6 +490,7 @@
   "submitUpdate": "Submit Update",
   "submitted": "Submitted",
   "submittedDraft": "Submitted Draft",
+  "submittedDrafts": "Submitted Drafts",
   "submittedForReview": "Submitted to Admins and Editors for review",
   "subscript": "Subscript",
   "suggestionsHeader": "Try one of these suggestions:",
@@ -470,6 +498,14 @@
   "switchLocalesAndLocalizePage": "Switch locales and localize page to {{ label }}?",
   "table": "Table",
   "tableDescription": "Add tabular content to your page",
+  "tagAddTag": "Add Tag",
+  "tagSearchApplyTags": "Apply Tags",
+  "tagSearchPlaceholder": "Tags...",
+  "tagCreateTag": "Create tag \"{{ tag }}\"",
+  "tagCreateNewTag": "Create new tag",
+  "tagNewTag": "New Tag",
+  "tagNoTagsFoundCreateOne": "create {{ tag }}?",
+  "tagNoTagsFoundPerhaps": "We couldn't find any matching tags. Perhaps",
   "tagYourImages": "Tag your images to make searching and filtering the media manager easier",
   "tags": "Tags",
   "takeActionAndCreateNew": "{{ saveLabel }} and Create New",

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

@@ -595,7 +595,7 @@ module.exports = {
       // if the appropriate query parameters were set, rewrite
       // `_id` accordingly. Returns `_id`, after rewriting if appropriate.
       inferIdLocaleAndMode(req, _id) {
-        let [ cuid, locale, mode ] = _id.split(':');
+        let [ id, locale, mode ] = _id.split(':');
         if (locale && mode) {
           if (!req.query.aposLocale) {
             req.locale = locale;
@@ -621,7 +621,7 @@ module.exports = {
           // will be interpreted later
           return _id;
         } else {
-          return `${cuid}:${locale}:${mode}`;
+          return `${id}:${locale}:${mode}`;
         }
       },
       getBrowserData(req) {

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

@@ -120,15 +120,15 @@
                       icon="map-marker-icon"
                       class="apos-current-locale-icon"
                       :icon-size="14"
-                      title="Default locale"
-                      tooltip="Current Locale"
+                      :title="$t('apostrophe:i18nDefaultLocale')"
+                      tooltip="apostrophe:i18nCurrentLocale"
                     />
                     <AposIndicator
                       v-if="isSelected(loc)"
                       icon="check-bold-icon"
                       class="apos-check-icon"
                       :icon-size="10"
-                      title="Currently selected locale"
+                      :title="$t('apostrophe:i18nCurrentlySelectedLocale')"
                     />
                     {{ loc.label }}
                     <span class="apos-locale-name">
@@ -136,8 +136,8 @@
                     </span>
                     <span
                       v-apos-tooltip="isLocalized(loc)
-                        ? 'Localized'
-                        : 'Not Yet Localized'"
+                        ? 'apostrophe:localizeLocalized'
+                        : 'apostrophe:localizeNotYetLocalized'"
                       class="apos-locale-localized"
                       :class="{
                         'apos-state-is-localized': isLocalized(loc),

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

@@ -17,7 +17,7 @@ module.exports = {
     label: 'apostrophe:image',
     pluralLabel: 'apostrophe:images',
     alias: 'image',
-    perPage: 31,
+    perPage: 50,
     sort: { createdAt: -1 },
     quickCreate: false,
     insertViaUpload: true,

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

@@ -25,7 +25,7 @@
     <template #leftRail>
       <AposModalRail>
         <div class="apos-schema">
-          <div class="apos-field">
+          <div class="apos-field" data-apos-field="aspectRatio">
             <label class="apos-field__label">
               {{ $t('apostrophe:aspectRatio') }}
               <AposIndicator
@@ -37,6 +37,7 @@
               />
             </label>
             <AposSelect
+              :selected="aspectRatio"
               :choices="aspectRatios"
               :disabled="disableAspectRatio"
               @change="updateAspectRatio"
@@ -58,7 +59,7 @@
             }}
           </div>
           <div class="apos-schema__aligned-fields">
-            <div class="apos-field">
+            <div class="apos-field" data-apos-field="width">
               <label class="apos-field__label apos-field__label--aligned">
                 W
               </label>
@@ -72,7 +73,7 @@
                 @blur="blurInput"
               >
             </div>
-            <div class="apos-field">
+            <div class="apos-field" data-apos-field="height">
               <label class="apos-field__label apos-field__label--aligned">
                 H
               </label>