Customizing Remote Disable Dialog with Mobile Foundation 8.0

What is Remote Access Management?

It is a capability of Mobile First Platform to control Access to the Mobile App. As an administrator, you can modify whether a particular version of an app is allowed for access or not, right from the Operations Console.

There are three modes of access defined:

  1. Active (Default)
  2. Active and Notifying
  3. Disabled (Blocked)

MF SDK displays the following screens by default when an app is in disabled or in notify mode:

Remote Disable
Remote Disable
Active and Notifying
Active and Notifying

You can read more about it here.


This post has information about how to modify the default screen.

Among all platforms, the central idea remains the same, that is, you can write a custom SecurityCheckChallengeHandler that will override the default behaviour. The security check name used here is the key to overriding. The remote disable is implemented upon the security check framework of the Mobile First Platform.

You can create a class that extends SecurityCheckChallengeHandler and pass in wl_remoteDisableRealm key as the security check name.
Important - You must pass the key as is to override Remote Disable behaviour.

The custom Challenge Handler must override the following 3 callback methods in your implementation:

  1. handleSuccess - for when the App is Active
  2. handleFailure - for when the App is Disabled
  3. handleChallenge - for when the App is Active and Notifying

These callback methods will receive appropriate params when called, one can use the info and customize the UI as needed. This section explains how you can customize based on your platform:

Android

Create a class CustomRemoteDisableHandler as shown here. This is where all the customization goes.

Then in the MainActivity.java create an instance of CustomRD and register the challenge handler as follows:

CustomRemoteDisableHandler challengeHandler = new CustomRemoteDisableHandler("wl_remoteDisableRealm");
WLClient.getInstance().registerChallengeHandler(challengeHandler);

and that’s it!

Link to the full Android project


iOS

Similar to Android, create a class as shown here.

Then inside AppDelegate.m, add the following:

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil) -> Bool {
    // Override point for customization after application launch.
    CustomRemoteDisableChallengeHandler.registerSelf()
    return true
}

Link to the full iOS project


Cordova

Here, the same thing is done a bit differently in JS. The creation and registration of Security Check happens at once. The Challenge Handler is created as follows:

var customRemoteDisableHandler = WL.Client.createSecurityCheckChallengeHandler("wl_remoteDisableRealm");

customRemoteDisableHandler.handleSuccess = function (identity) {
    console.log("handleSuccess", identity);
};

customRemoteDisableHandler.handleFailure = function (err) {
    // contains { message: ..., downloadLink: ...} values set on server
    console.log("handleFailure", err);
    alert("Disabled...\n\n" + err.message);
};

customRemoteDisableHandler.handleChallenge = function (params) {
    // contains { message: ...} value set on server
    console.log("handleChallenge", params);
    alert("Notifying...\n\n" + params.message);
};

Link to the full Cordova project


React-Native

Being JS, this is very similar to Cordova. The Challenge Handler is created as follows:

class CustomRemoteDisableHandler {
  constructor() { }

  handleChallenge(params) {
    // contains { message: ...} value set on server
    console.log("handleChallenge", params);
    Alert.alert("Notifying...", params.message);
  }

  handleSuccess(params) {
    console.log("handleSuccess", params);
  }

  handleFailure(params) {
    // contains { message: ..., downloadLink: ...} values set on server
    console.log("handleFailure", params);
    Alert.alert("Disabled...", params.message);
  }
}

And the registration of Challenge Handler is done as follows:

WLClient.registerChallengeHandler(new CustomRemoteDisableHandler(), "wl_remoteDisableRealm");

Link to the full React-Native project


Conclusion

Customizations makes it feasible for developers to give a consistent look and feel through the app. In this article you learnt about how to customize the Remote Disable default screen UI for the following platforms:

  • Android
  • iOS
  • Cordova
  • React-Native
Last modified on February 02, 2021