SpringBot Release 2.3.0.0

Noteworthy changes

  • Upgraded to Angular 11!
    • The client-side of your application has been upgraded to the latest version of Angular
    • Key benefits of the Angular 11 upgrade are build and runtime performance improvements.
      • This upgrade can reduce the reload time when making client-side changes by approximately 80% when used with HMR !
      • HMR can be enabled by starting your development server with the --hmr flag (i.e. ng serve --hmr).
    • Also includes an upgrade to Typescript 4!

Improvements

  • Added a new script to package.json for starting the client-side with Hot Module Replacement
    • HMR reduces the time required to reload your application after a change by only reloading components that have changed
    • It also allows you to maintain application state, which would be lost during a full reload
    • Hot Module Reloading can be used when starting the client-side by using the command yarn startHot
  • Changed the link to the release notes in the README with a link to their new home, the Codebots forum.

Migration path

There are no additional steps which are required to migrate to this version of SpringBot. However, there are some issues that you might encounter if you have not yet upgraded to SpringBot v2.2.3.0.

OnDeleteClicked

Previously, the delete logic within the data table list component had access to the click event. In SpringBot v2.2.3.0, the delete logic was abstracted into the onDeleteClicked method and as a result no longer has direct access to the click event. All variables accessed within this event object are available in the new context as discrete parameters.

All direct references to this event must be replaced with their parameterised counterparts.

Before

onMultipleItemsActionClicked(event: { actionName: string, payload?: any }) {
  ....
  // Delete logic had access to the `event` parameter
}

After

onMultipleItemsActionClicked(event: { actionName: string, payload?: any }) {
	...
	if (event.actionName === MultipleItemActionEnum.Delete) {
		...
		this.onDeleteClicked(event.payload.usingSelected, event.payload.models, modelsToDelete);
		return;
	}
	...
}

Method signature

/**
 * Handle deletion of entities from the crud list.
 * Deletion can come from multiple sources so this method will handle single deletion, as well as deletion through multiple selection
 * @param usingSelected false if user has selected entities using the select all button, true otherwise.  Determines whether to use delete or delete excluding
 * @param models the models to delete or exclude from deletion, depending on usingSelected
 * @param modelsToDelete the number of models to delete, used to alter the error message to handle plurality.
 * 							Also changes the action used if only 1 model is to be deleted.
 * 							Required because models is not exclusively the models to delete, so models.length is not a valid substitute
 */
onDeleteClicked(usingSelected: boolean, models: CourseCategoryModel[], modelsToDelete: number);

relativeTo Routing parameter

Passing the relativeTo to your routing actions may cause them to fail, the solution to this is to build the routes in the routing actions in place of using the relativeTo parameter.

An example of the change that was made to bot-written code is:

Before

commands.push('fish');

if (tileMode !== CrudTileMode.List) {

	commands.push(tileMode.toString());

}

if (id) {
	commands.push(id);
}

this.routerStore.dispatch(new routingAction.NavigateRoutingAction(commands, {
	queryParams: {listPage: this.pageIndex + 1},
	relativeTo: this.activatedRoute.parent, // route in this instance was /admin/entities/fish, so the parent route was /admin/entities

}));

After

commands.push('admin');
commands.push('entities');
commands.push('fish');

if (tileMode !== CrudTileMode.List) {
	commands.push(tileMode.toString());
}

if (id) {
	commands.push(id);
}

this.routerStore.dispatch(new routingAction.NavigateRoutingAction(commands, {
	queryParams: {listPage: this.pageIndex + 1},

}));

This change needs to be applied to all routing actions that use the relativeTo parameter.

1 Like