react-native-app-version-force-update

This project will check that app needs an update or not. It will do calculation based on version of App and will show a popup based on below 3 condition.

• App needs a force update
• App needs a update but with remind me later option
• App is updated

Installation

react-native-device-info

This package has a dependency with react-native-device-info. If your project doesn't have a dependency with this package already, please refer to their installation instructions.

moment

This package has a dependency with moment. If your project doesn't have a dependency with this package already, please refer to their installation instructions.

$ npm install react-native-app-version-force-update --save

Usage

import { checkForVersion } from 'react-native-app-version-force-update';

let options = {
    "current_version": "2",
    "release_note": "Today We have big app update, Please update app.",
    "last_force_update_version": "1",
    "release_date": "2019-12-31",
    "app_url": appUrl,
    "dateFormat":'DD-MM-YYYY',
}
checkForVersion(options);

Options

Options	Usage	Required	Default Values
current_version	Current version of App	Yes	-
release_note	Message that you want to show on dialog	Yes	-
last_force_update_version	Last force update version	Yes	-
release_date	Latest release date of App	Yes	-
app_url	Platform specific app url	Yes	-
style	Custom styles for dialog and its components	Optional	-
dateFormat	Format of release date which will diaplay at top	Optional	DD-MM-YYYY hh:mm:ss
update_btn_name	Text for update button	Optional	Update App
remindMeLater_btn_name	Text for remind me later button	Optional	Remind Me Later
closeBtnCallback	callback function for close button	Optional	-
updateBtnCallback	callback function for update button	Optional	-
remindMeBtnCallback	callback function for remind me later button	Optional	-

How to redesign style ?

We can pass the styles prop to cover default style. See Example below.

import { checkForVersion } from 'react-native-app-version-force-update';

const styleobj = {
  titleText:{
    color: 'rgba(255,255,255,0.8)',
  },
  closeIcon:{
    tintColor:'white'
  }
};
let options = {
    "current_version": "2",
    "release_note": "Today We have big app update, Please update app.",
    "last_force_update_version": "1",
    "release_date": "2019-12-31",
    "app_url": Platform.OS === 'ios' ? iosUrl : androidUrl,
    "dateFormat":'DD-MM-YYYY',
    "style":styleobj,
}

checkForVersion(options);

Options for override style

Style	Usage
modalContainer	Main container style
mainContainer	Content of dialog style
headerContainer	Header container style
titleContainer	Title container style inside header
titleText	Title text style
descText	Description text style
btnContainer	close button container style
closeIcon	close icon style
linkContainer	bottom button container style
updateBt	update button style
linkBtnUpdate	update button text style
linkBtnRemindMeLater	remind me button text style