Oct 3rd, 2024

Apostrophe 4.8.0 Mobile Preview, rich text REST API improvements, UI refinements, and fixes

Bob Means Developer Relations Engineer

Breakpoint Preview: Responsive Design at Your Fingertips

One of the standout features in this release is the new mobile preview functionality. When enabled, this feature adds user-configurable breakpoint toggles to the admin-bar. Content managers can now easily observe how their content will appear across various devices and screen sizes, all without leaving the ApostropheCMS interface. This streamlines the content creation process and empowers content creators to ensure their work looks great on any device.

Smart Defaults for Schemas

We've introduced a powerful improvement to schema field handling that significantly reduces development overhead. Now, when you add a new schema field, ApostropheCMS automatically applies a default value to existing documents, even if the field didn't exist in those documents before. This enhancement greatly reduces the need for migrations when adding new fields, streamlining the development process as project requirements evolve. It's another step towards making ApostropheCMS more developer-friendly and adaptable, allowing teams to focus on creating great content and user experiences rather than managing database schemas.

CHANGELOG for Apostrophe 4.8.0

Adds

Apostrophe now automatically adds the appropriate default values for new properties in the schema, even for existing documents in the database. This is done automatically during the migration phase of startup.
Adds focus states for media library's Uploader tile
Adds focus states file attachment's input UI
Simplified importing rich text widgets via the REST API. If you you have HTML that contains img tags pointing to existing images, you can now import them all quickly. When supplying the rich text widget object, include an import property with an html subproperty, rather than the usual content property. You can optionally provide a baseUrl subproperty as well. Any images present in html will be imported automatically and the correct figure tags will be added to the new rich text widget, along with any other markup acceptable to the widget's configuration.
Add mobile preview feature to the admin UI. The feature can be enabled using the @apostrophecms/asset module new breakpointPreviewMode option. Once enabled, the asset build process will duplicate existing media queries as container queries. There are some limitations in the equivalence media queries / container queries. You can refer to the CSS @container at-rule documentation for more information. You can also enable breakpointPreviewMode.debug to be notified in the console when the build encounter an unsupported media query.

Changes

The various implementations of newInstance found in Apostrophe, e.g. for widgets, array items, relationship fields and documents themselves, have been consolidated in one implementation. The same code is now reused both on the front and the back end, ensuring the same result without the need to introduce additional back end API calls.

Fixes

Apostrophe's migration logic is no longer executed twice on every startup and three times in the migration task. It is executed exactly once, always at the same point in the startup process. This bug did not cause significant performance issues because migrations were only executed once, but there is a small performance improvement.
The @apostrophecms/page module APIs no longer allow a page to become a child of itself. Thanks to Maarten Marx for reporting the issue.
Uploaded SVGs now permit <use> tags granted their xlink:href property is a local reference and begins with the # character. This improves SVG support while mitigating XSS vulnerabilities.
Default properties of object fields present in a widget now populate correctly even if never focused in the editor.
Fixed the "choices" query builder to correctly support dynamic choices, ensuring compatibility with the piecesFilters feature when using dynamic choices.