Hybridly v0.7.0

Hybridly v0.7.0 is mainly a maintenance update that removes a few utilities that are no longer needed.

Upgrading

You may upgrade Hybridly using the following commands:

composer require "hybridly/laravel:^0.7.0"
pnpm i -D hybridly@^0.7.0

This release contains breaking change. Please follow the upgrade guide.

Data has been upgraded to version 4

There are a few breaking changes, especially related to collections. You may read Ruben Van Assche's blog post about it and check out the v4 documentation.

Here is an example upgrade that you may need to do in your application:

return hybridly('chirps.index', [
    'chirps' => ChirpData::collect($chirps, PaginatedDataCollection::class)->transform(),
    'chirps' => ChirpData::collection($chirps),
]);

Note the transform call above, which is related to a bug that might be fixed later.

defineLayout and defineLayoutProperties are gone

Previously, you had the ability to define a page's layout and its properties through the defineLayout and defineLayoutProperties utils.

These functions were implemented prior to defineOptions being added to Vue.

Even though they were useful, there was multiple issues with them:

• They caused a recursive page refresh in some situations, resulting in a lag after HMR,
• They were incompatible with server-side rendering,
• Their implementation was somewhat complex to maintain due to reactivity hoops.

You may now use defineOptions:

defineOptions({
	layout: main,
	properties: {
		fullscreen: false,
	},
})

useBackForward now accepts options

useBackForward is an util function that registers callbacks executed during back-forward browser navigations.

It now accepts a parameter that defines whether the page component should be reloaded on back-forward navigations:

useBackForward({
	reload: true,
})

This is the equivalent of calling the returned reloadOnBackForward function. It's simply more practical.

TypeScript files are no longer automatically imported in all loaded directories

Previously, TypeScript files present in any loaded directory would be auto-imported using unplugin-auto-imports.

For instance, when loading a module, any TypeScript file either at the root of the directory or nested inside of it would have its exports auto-imported. This behavior was not easily customizable and would require developers to override the unplugin-auto-imports configuration in vite.config.ts.

In v0.7.0, this behavior has changed. By default, only TypeScript files at the root of a module will be loaded. They can also be ignored by setting the loadTypeScript argument to false.

You may also arbitrarily load TypeScript files in any directory by calling the loadTypeScriptFilesFrom method.

The php option is no longer available for the Hybridly plugin

The php option allowed to pass the path to the PHP executable path to the plugin so it could call the back-end and fetch the configuration needed by Hybridly to run.

However, this is incompatible with a new feature that allows to pass the options as a callback which accepts the loaded configuration. Additionnally, it makes more sense to define the PHP path as an environment variable, because it is something specific to an environment.

useContext is gone

useContext was a function that returned a computed version of Hybridly's context object.

Prior to Vue 3.4, this was a reactive object—however, memoization changes in Vue 3.4 broke that behavior. Since this utility function was meant to be a escape-hatch though, we decided to remove it in favor to getRouterContext, a similar function that already exists in Hybridly core.

Initial payload is available during initialization

The initial payload that contains data from the back-end during the initial page render is now available to the setup callback from initializeHybridly for advanced usage.

Hidden table actions can now be invoked

A bug was preventing dynamically-hidden table actions from being invoked. This issue has been fixed by Owen Conti.

Model resolution can be customized for table actions

Owen Conti contributed a way to customize the logic for resolving models when working with table actions. This is specifically useful to handle scenarios where specific scopes are needed, such as when using soft-deleted models.

Vue files identifiers are now lower-case

Vue files loaded using loadModule would have their identifier generated using the file structure.

For instance, the identifier for the following show.vue file would be fleet-tracking::Synthesis.show:

src/
└── Feature/
    └── FleetTracking/
        ├── FleetTrackingServiceProvider.php
        └── Synthesis/
            └── show.vue

In v0.7, the same file would be identified by fleet-tracking::synthesis.show.

Fixed downloading of binary files

In a previous version, Hybridly started supporting the download of files using its router. This is a nice quality of life feature, but it was not working when handling binary file types.

This was due to Axios not allowing the response type to be changed after the request was initiated. This is now fixed by handling every response using array buffers and converting them to JSON or blobs using an interceptor.

base supports IDE autocompletion

@brampkg contributed IDE autocompletion support for the base method through Laravel Idea.