Zum Hauptinhalt springen

Upgrade steps (4.1.1 - 5.3.1)

5.3.1​

There are no manual upgrade steps for this version and upgrade is mostly automated.

See How to upgrade.

Changes in microapps in 5.3.1​

Independent configurations for the shell app and microapps​

Since Jutro 5.3.1, the Jutro configuration storage and @jutro/config package APIs have been isolated between the shell app and microapps. That means that micro-apps won't be able to access or set shell app configurations. However, the shell app can still provide the initial values for the microapp configurations by using the new props described below.

New props for seeding microapp configurations​

Since Jutro 5.3.1, two new props were made available to the shell app which allows it to override configurations for the embedded microapps. The shell app can now also override the Jutro launchProps passed in to the Jutro start function. The new props are configOverrides and launchPropOverrides respectively. You can use either one or both according to your needs.

Important: Please note that after Jutro 6.0 these props can be namespaced under a jutro top level prop. See 'jutro prop namespace' for more details. If on Jutro 6.5+ see also 'Deprecation of non namespaced props'.

Nested router navigation​

Since Jutro 5.3.1, nested router navigation now works properly, respecting the routerBasename prop passed to microapps. This allows microapps to navigate freely inside a subdomain of the shell app without overriding the full URL, but only the suffix after the basename. You might also want to change your shell app's router configuration to allow inexact matches for the page where the microapp is attached so that the microapp can be deep linked directly upon refresh.

5.2.0​

There are no manual upgrade steps for this version and upgrade is mostly automated.

See How to upgrade.

5.1.0​

There are no manual upgrade steps for this version and upgrade is mostly automated.

See How to upgrade.

5.0.0​

New version of React and Node.js​

Update your app and deployments:

  • react and react-dom version to 16.14.0
  • Node.js to version 14.14.0
  • npm to version 6.14.8

New theming​

In the new theming, the default theme is compact (enterprise). If you want to use a different theme and you relied on the default before, set the theme for your app.

Also, we changed the SCSS variables. We will not introduce any breaking changes to the variables anymore. However, if you used our old variables, you need to update your styles. See a full list of variables to migrate.

Storybook package renamed​

The package with pre-built Storybook is now called @jutro/app-storybook.

Import order of SCSS files​

Remove the following imports, if you have them in app/src/styles/Theme.scss, or anywhere in your styles.

@import '~@jutro/layout/hashedStyles';
@import '~@jutro/components/hashedStyles';
@import '~@jutro/theme/hashedStyles';
@import '~@jutro/router/hashedStyles';
@import '~@jutro/floorplan/hashedStyles';
@import '~@jutro/datatable/hashedStyles';
@import '~@jutro/wizard/hashedStyles';

New version of React​

Updated react and react-dom version from 16.13.1 to 16.14.0.

No more routes in application header​

Application Header does not take routes anymore, Sub Application Header takes them instead, which is a standalone component now. (this does not affect the floorplan).

Enhanced ENV security​

SAFE_ENV is true by default.

Updated react-intl​

react-intl updated from 2.9.0 to 5.8.6.

addLocaleData is no longer part of react-intl and as such loadLocaleData is no longer exported from jutro-locale. By default, react-intl formatted components render text inside of a React.Fragment instead of a span. consumers can pass 'span' to the intlTextComponent property of the start method to keep the old functionality.

ESlint updated​

eslint updated from 6.8.0 to 7.10.0. As from the version 7 eslint no longer ignores .eslintrc.js by default.

Action for you: Add .eslintrc.js to .eslintignore.

ESlint config changed​

The format of lint-staged.config.js changed. Update your file to match this format:

module.exports = {
'*.js': ['npm run prettier-check', 'eslint'],
'*.{ts,tsx}': ['npm run prettier-check', 'eslint'],
'*.scss': ['stylelint'],
};

If you run into a conflict between stylelint and Prettier, add the stylelint-config-prettier shared config to stylelint.

Removed event from modals​

Removed onReject from confirmation and alert modals in modal-next.

Lints-staged updated​

lints-staged updated from 7.3.0 to 10.4.0.

Update your lint-staged.config.js:

  1. Move content of 'linters' key outside
  2. Remove the empty 'linters' entry

Changed the "update" command in the CLI​

Aligned all "update" sub-commands in jutro-cli.

jutro-cli update cli // replace "jutro-cli update"
jutro-cli update ui-metadata // replace jutro-cli uiMetadata migrate
jutro-cli update jsx // replace jutro-cli codemods
jutro-cli update app // it should replace update-app
jutro-cli update module // it should replace update-module

4.3.0​

Known issues​

In @jutro/HttpRequest, the default encoder for getting files only works with JSON files. This is fixed in the next version.

If you need to download a file other than JSON, implement the following encoder:

export const encoder = (data, options) => {
if (options?.headers && isJsonPayload(options.headers)) {
return JSON.stringify(data);
}
return data;
};

And then use it in your request builder:

new HttpRequestBuilder(baseUrl)
.addHandler(REQUEST_HANDLER_TYPE.ENCODE, encoder)
...
.build()

Upgrading​

There are no manual upgrade steps for this version and upgrade is mostly automated.

See How to upgrade.

4.2.1​

The upgrade is largely automatic.

See How to upgrade.

Potential breaking changes​

  • react-scripts version changed from 3.4.0 to 3.4.3 because of a security fix. This may impact some of your custom scripts.
  • The format of IDs changed for RadioButton, ImageRadioButton and Checkbox. You may need to update your tests.

4.1.1​

There are no manual upgrade steps for this version and upgrade is mostly automated.

See How to upgrade.

Okta has been updated to the latest version to improve security. If you are using auth, you need to update the client_id and start using PKCE, as it is a behavior of the react-okta package.

If you don't have permissions to create the the application on keti, or add the groups that you need for your application, contact #keti-users on Slack.