Apostrophe 4.5.0 UI enhancements, a new rich text tool, AI-powered docs, and fixes

[BoDonkey]

Howdy from Apostrophe Central!

As the sun blazes down on our headquarters in the city of Philadelphia, turning our city into a veritable sauna, our global team has been hard at work crafting the latest and greatest updates for our product. Did you know that the highest temperature ever recorded in Philadelphia was a scorching 106°F (41°C) back in 1936? While we haven't quite hit those highs, our dedication and passion have certainly reached new peaks! We're thrilled to unveil this month's release, packed with a plethora of enhancements, new features, and fixes to improve your Apostrophe experience. Dive in and explore the sizzling changes we've made!

Overview

ApostropheCMS.4.5.0.mov

UI enhancements

The media manager has gotten some love this cycle in the form of a new infinite scroll feature, as well as some polish on the checkbox UI for selecting images. Now if your project has hundreds of images you don't need to click through multiple pages!

Some users wanted an easy way to hide the admin bar from individuals without document editing permissions. We listened and added a new showAdminBar() method to easily toggle the visibility! You can read about it in the docs.

While the command menu provides easy keyboard shortcuts for your power users, there are times when you want to block automatic shortcut creation. You can now accomplish this at the module level by passing the shortcut: false option.

As part of our ongoing efforts to maintain Apostrophe as a truly global platform, we tracked down all untranslated strings within the Admin UI of core and our currently supported extensions. This is a next step toward achieving 100% complete translations in the 6 languages we currently support. Why yes, we do 'Parlez-vous français'!

Rich-text-widget improvement

The rich-text-widget got a new toolbar item this cycle. The color button brings the same picker used in the color schema field to the editor. You can select by options or paste values from your design file. It also has options for adding specific color swatches that the content creator can select.

Fixes

Topping our fixes for this cycle is a community contributed fix for the widget expanded preview. If you chose to have your widget displayed in a single column they would stack on top of each other. Harsh Mehta helpfully added some grid styling and Voilà! (See, told you we know French.)

There are also some fixes for issues that the community has helpfully brought to our attention. A user in the Discord wanted to know why they couldn't set the slug of a child page to the value they wanted without having the parent page slug prepended. The answer: a bug! Another user reported that some, but not all, of their embedded Vimeo videos weren't displaying correctly. The answer....nope! It wasn't a bug, but a change to how Vimeo handles oEmbed links. Both of these issues have been fixed in this release.

Improved developer experience

One final item of interest in this release cycle doesn't directly apply to the Apostrophe or extensions codebase. Instead, it is a change to our documentation site that we hope will improve the developer experience. Now, you can choose to search the documentation either by keyword as before or switch to an AI-augmented version that allows you to ask questions. This will give back not only links, but often times code to help your project over the questions you are facing! This is an experimental feature and like most AI responses it can hallucinate or make mistakes. We look forward to your feedback!

Check out the release notes below for additional fixes and improvements. Remember npm update gets you the latest and greatest right in your project!

Apostrophe 4.5.0

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. Makes the header containing the search fix.
• 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)
• 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).

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 [email protected] queries while using [email protected].

Apostrophe 3.68.0

Changes

• Update @apostrophecms/emulate-mongo-3-driver dependency to keep supporting [email protected] queries while using [email protected].

Fixes

• Prevent broken admin UI when there is a missing widget.

Apostrophe modules

@apostrophecms/ai-helper 1.0.0-beta.7

This module enhances Apostrophe with AI-driven helpers. Currently this module offers:

• A button to generate an image from a text prompt via OpenAI.
• An insert menu option to generate rich text from a prompt via OpenAI.

See the README for more info.

Changes

• Add missing UI translation keys.

@apostrophecms/favicon 1.1.0

This module allows users to edit the "favicon" (browser tab icon) of the site via the global settings of the site. As such, it pairs well with the Apostrophe palette and multisite modules.

Adds

• Add i18n support and UI translation keys.

@apostrophecms/i18n-static 1.0.1

This module makes it possible to edit the translations of static text strings found in templates through the ApostropheCMS admin UI.

Adds

• Add missing UI translation keys.

@apostrophecms/import-export 2.1.1 (2024-06-21)

This module enables import and export of pages and pieces, with or without related documents such as files, images and other related types.

Fixes

• Fix export relationship when an area has grouped widgets. Thanks to Michelin for contributing this fix.

@apostrophecms/login-totp 1.3.0

This login verification module adds a TOTP (Time-based One-Time Password) check when any user logs into the site, compatible with Google Authenticator or any TOTP app.
When activated, it will ask unregistered users to add a token to their app through a QR code. Once done, it will ask users to enter the code provided by their app after the initial login step.

Adds

• Add missing UI translation keys.

@apostrophecms/security-headers 1.0.2

This module sends the modern HTTP security headers that are expected by various security scanners.

Changes

• Add blob: to img-src directive to support Media Manager calls to URL.createObjectURL.

Pro modules

@apostrophecms-pro/advanced-permission 3.0.2

This module provides more granular control over content permission. It allows the creation of custom groups with proscribed abilities and the ability to assign users to as few or as many groups as desired. Users and groups can also be assigned per-document and per-locale permissions allowing for fine control of who can edit and publish any document. Dive into our extension documentation to learn how this extension can contribute to your project. Explore our documentation to discover how this extension can enhance your project. Then, effortlessly integrate it through our new Apostrophe Workspaces. For further details or inquiries, feel free to contact us or visit our pricing page.

Fixes

• Handle manager.permissions as null.

Legacy Apostrophe 3.x.x version 2.1.2

Fixes

• Handle manager.permissions as null.

@apostrophecms-pro/basics 1.5.0

This module adds a range of basic widgets and their configurations to @apostrophecms-pro/multisite. Explore our documentation to discover how this extension can enhance your project. Then, effortlessly integrate it through our new Apostrophe Workspaces. For further details or inquiries, feel free to contact us or visit our pricing page.

Adds

• Add i18n support and UI translation keys.

@apostrophecms-pro/cypress-tools 1.0.0-beta.13

Automated functional browser tests are an important part of quality assurance for enterprise websites and web applications. Cypress is an industry-standard, open-source library for carrying out automated functional browser tests. This module provides a collection of conveniences for testing ApostropheCMS sites and applications within Cypress. Contact us or visit our new pricing page to learn more.

Changes

• Add a selector to the wrapper element of the edit relation button.

1.0.0-beta.12 (2024-05-16)

Changes

• Adds nsInclude option when restoring databases
• Use valid URLs for loginUrl and apiUrl
• Allow Cypress 12+

@apostrophecms-pro/doc-template-library 2.2.0

This module solves the "blank page problem" for developers and product managers, and makes it faster for editors to create content. doc-template-library allows for the configuration of default widgets and pre-populated content on piece or page templates, and to re-use existing layouts. Explore our documentation to discover how this extension can enhance your project. Then, effortlessly integrate it through our new Apostrophe Workspaces. For further details or inquiries, feel free to contact us or visit our pricing page.

Adds

• Add missing UI translation key.

Fixes

• Rollbacks checked ids being watched.

@apostrophecms-pro/multisite 4.1.0

This module lets you have many ApostropheCMS websites running on a single codebase in a single Node.js process. Each has its own database, users, media uploads, etc. Sites can be created and managed via a dashboard site. Explore our documentation to discover how this extension can enhance your project. For further details or inquiries, feel free to contact us or visit our pricing page.

Adds

• Add missing UI translation keys.

Changes

• Bump @apostrophecms/emulate-mongo-3-driver dependency to keep supporting [email protected] queries while using [email protected].

@apostrophecms-pro/multisite-dashboard 1.2.0

This extension creates the new default multisite dashboard with infinite scroll, search functionality, and the ability to save templates. This extension requires that the project also have the @apostrophecms-pro/multisite extension installed and configured. Explore our documentation to discover how this extension can enhance your project. For further details or inquiries, feel free to contact us or visit our pricing page.

Adds

• The admin password is now a required field, but only when the site is new. This is more elegant than the old workaround.
• Add missing UI translation keys.

@apostrophecms-pro/palette 4.3.0

An in-context interface for changing CSS. @apostrophecms-pro/palette is a module that provides an in-context interface for changing the values of developer-set CSS properties. The values are stored in an Apostrophe piece singleton (like @apostrophecms/global) and applied to the site whenever the stylesheet link is included in a template. Adjusting values via the palette interface renders changes to the site instantly. Explore our documentation to discover how this extension can enhance your project. Then, effortlessly integrate it through our new Apostrophe Workspaces. For further details or inquiries, feel free to contact us or visit our pricing page.

Adds

• Add i18n support and UI translation keys.

Legacy modules

emulate-mongo-2-driver 1.3.5 (2024-07-09)

emulate-mongo-2-driver aims to be a highly compatible emulation of the 2.x version of the MongoDB Node.js driver, implemented as a wrapper for the 3.x driver.

Changes

• Use @apostrophecms/emulate-mongo-3-driver 1.0.5.

emulate-mongo-3-driver 1.0.5 (2024-07-09)

@apostrophecms/emulate-mongo-3-driver aims to be a compatible emulation of the 3.x version of the MongoDB Node.js driver, implemented as a wrapper for the 6.x driver.

Add

• Add integration test for collection.count, find-cursor.count and find-cursor.sort.
• Add support for the [email protected] driver and up.

Changes

• Use a projection to count documents.

Utilities

@apostrophecms/apostrophe-astro 1.0.8 (2024-07-02)

This module integrates ApostropheCMS into your Astro application.

Fixes

• The renderWidget route will no longer crash if there was an issue getting the render-widget route from Apostrophe (like a mandatory field missing), it will respond with a 500 only, with a log message in the console. Thanks to Michelin for contributing this fix.

oembetter 1.1.2

oembetter is a modern oembed client which allows you to add filters that provide or improve oembed support for services that either don't have it or don't do it very well.

Changes

• Removes path regex check on the vimeo endpoint to allow urls with and without /video.

uploadfs 1.22.5

uploadfs copies files to a web-accessible location and provides a consistent way to get the URLs that correspond to those files. uploadfs can also resize, crop and autorotate uploaded images. uploadfs includes S3-based, Azure-based, GCS-based and local filesystem-based backends and you may supply others.

Changes

• Updates documentation to include the bucketObjectsACL option.