App update modal

The App Update Modal shows a notice when the app starts if the user has a version older than the published one. It works in two modes: informative (the user can postpone) or restrictive (they cannot continue without updating).

Configuration in the backoffice

The plugin compares the installed version with the one you specify, so these fields have to be kept up to date on every release:

Field	Description
Current Play Store version	Version number published on Android
Current App Store version	Version number published on iOS
Android download URL	Link to the Play Store listing
iOS download URL	Link to the App Store listing
Restrictive flow	If enabled, the modal cannot be dismissed

Caution

If you publish a new version and do not update these fields, the modal will not be shown. It is worth including this step in the release checklist.

Customizing the texts

Define RK_APP_UPDATE_PROMPT in the JS module. The default key is required; the other languages are optional.

window.RK_APP_UPDATE_PROMPT = {
  default: {
    title: 'Update available',
    description: 'Update the app to get the latest features.',
    update: 'Update',
    cancel: 'Not now',
  },
  es: {
    title: 'Hay una versión nueva',
    description: 'Actualiza la app para acceder a las últimas novedades.',
    update: 'Actualizar',
    cancel: 'Ahora no',
  },
};

Customizing the style

By default the modal is a bottom sheet with a maximum width of 400px, rounded corners and a red confirmation button (#CC0100). Override the default classes from the CSS module.

/* css_plugin */
.rk-app-update .rk-modal {
  max-width: 480px;
  border-radius: 20px;
}

.rk-app-update .rk-modal button.update {
  background: var(--color-corporativo, #cc0100);
}

Modes

Informative — the new version is announced and the user can choose between updating or postponing. Recommended for minor changes.

Restrictive — the option to dismiss is removed. Use it only when the old version has stopped working (API changes, migrations).