Skip to content

Moving from Magewire to CmsConnect

Available since Hyvä CMS 1.3.0

CmsConnect and the migration tools are available from Hyvä CMS 1.3.0.

Magewire helped us get Hyvä CMS up and running. It let us build a dynamic Magento admin experience while concentrating on the editor itself, and gave us room to learn what the product needed to become. Moving to CmsConnect does not diminish that contribution or mean there is a problem with Magewire.

What Changes

As the editor has developed, more of its work belongs in the browser. Typing, moving components, changing visibility and undoing edits change an unsaved document. They do not all need a server round trip.

The browser now owns that working document. Magento still supplies trusted data and PHP-rendered previews, checks permissions, validates content and saves the complete document. Some preview changes can happen locally; others still ask Magento to render the component. Saving and publishing remain server operations.

CmsConnect, registered as Hyva_CmsConnect in the package's src/liveview-connect directory, provides the connection between them. It exposes explicitly approved server actions while the editor keeps local editing state. This reduces the effect of network latency and Magento response times on everyday editing, including on development and staging systems.

Compatibility

The old Magewire runtime has been removed. A temporary compatibility module, Hyva_CmsMagewire, keeps selected classes, module dependencies and entry points available so existing integrations have time to migrate.

Existing integration What to expect
Component declarations, provider integrations and ordinary component templates These remain the main extension points. Review copied editor templates and test custom behavior after upgrading.
Dependencies on the Hyva_CmsMagewire module and selected old PHP classes Deprecated fallbacks remain, including component, form and pagination classes. They do not provide Magewire hydration or interactive requests.
Hyva\CmsLiveviewEditor\Magewire composer classes Moved to Hyva\CmsLiveviewEditor\Composer; update imports and subclasses. These are distinct from the retained Hyva\CmsMagewire stubs.
$magewire template variable A deprecated alias/static-render fallback remains. Use $composer in updated editor templates.
magewire:update, magewire:available and loader events A deprecated bridge still emits these aliases. Move listeners to the corresponding connect:* events.
window.Magewire, window.Livewire and window.magewire Limited warning shims remain. Lifecycle hooks and directive registration do not recreate the old runtime.
wire:model, wire:click and other wire:* directives Inert. Replace them with Alpine bindings and editor commands or approved Connect actions.
Old transport endpoints Return HTTP 410 with migration guidance. They no longer process Magewire requests.

The compatibility layer will be removed in a future release; no removal version is specified yet. An integration appearing to work is not proof that it has finished migrating.

Check a Customized Installation

Run the supplied scanner even if the upgraded editor appears to work. From the Magento project root, with Node.js 18 or later:

node vendor/hyva-themes/commerce-module-cms/tools/connect-upgrade-scan.mjs app/code app/design

If the package lives elsewhere, adjust the scanner path. Pass additional extension directories explicitly; vendor is excluded by default, and --include-vendor enables scanning it. The scanner reports known old namespaces, events, directives and endpoint calls. Exit code 1 means findings remain; 2 indicates a usage error.

The optional --fix flag applies mechanical renames. Review that diff and rerun the scanner: it cannot rewrite an integration's state or lifecycle behavior for you.

Test custom field editing, preview updates, undo/redo, saving, publishing and any custom content types. Check browser deprecation warnings as well as scanner findings. Integrations that depended directly on Magewire request payloads, hydration or lifecycle hooks need to move to the new APIs.

Editor Commands

For browser editing, use window.liveview.editor. It exposes named commands and events without coupling an extension to the transport:

await window.liveview.editor.run('field.update', {
    uid: componentUid,
    field: 'title',
    value: 'Our summer collection',
});

await window.liveview.editor.run('panel.open', { uid: componentUid });

Other commands include component.add, component.remove, component.reorder, component.toggleVisibility, fields.update, tree.get and document.save. Observe completed changes through events such as editor:field:updated and editor:document:saved. liveview.editor.on(name, handler) returns an unsubscribe function for cleanup.

The preview can call approved editing commands through liveviewBridge.command(name, payload). The editor verifies the sending iframe and allows only the supported component, field and panel commands. Saving is not exposed to the preview command channel.

Server Actions

For an integration that needs a server action, extend Hyva\CmsConnect\Component, register it in Hyva\CmsConnect\Model\ComponentPool through di.xml, and mark callable methods with #[Hyva\CmsConnect\Api\Action]. A component definition fixes its render handle and block on the server and can add an aclResource permission.

Connect posts to liveview-connect/api/call with a signed identity state and the admin form key in X-Csrf-Token. Its client handles this protocol. Each action receives its complete input; arbitrary property writes do not synchronize a server document.

The Alpine $wire facade remains available for approved actions and refreshes, but removed mutation methods such as updateField and doSave are not restored. Use editor commands for local changes. Saving submits the document with its base version; a conflicting save returns HTTP 409.

Use the package’s src/liveview-connect/etc/adminhtml/di.xml and editor registrations as implementation references. The standalone magewirephp/validation dependency is still used for validation; it is separate from the removed Magewire runtime.

Save Errors and Deployment Tokens

A provider can refuse a save/publish with Hyva\CmsConnect\Exception\UnprocessableContentException, passing an optional map of messages keyed by component UID and then field name. Connect returns HTTP 422; the editor highlights those fields and retains the error toast until dismissed. A version conflict is a separate HTTP 409 response. Extensions should handle these as actionable save failures and preserve the user's draft.

The editor token generators now use HMAC. Reload open editors after deployment and create fresh draft-preview links. Previously issued preview links can fall back to published content without an error. See the CMS upgrade guide.