How to check AEM server runmode in Sightly/HTL Using Server-side ClientSide (JavaScript)

Server-side JavaScript
"use strict";
use(function () {
var myRunmode = this.runmode;
var isValidRunmode = false;
var slingSettingsService = sling.getService(Packages.org.apache.sling.settings.SlingSettingsService);
var runModes = slingSettingsService.getRunModes().toString();
if (runModes && myRunmode) {
isValidRunmode = (runModes.indexOf(myRunmode) >= 0);
}
    return {
    hasRunmode : isValidRunmode,
    runmodes:runModes
};
});

HTL / Sightly
<div data-sly-use.checkRunmode="${'check-runmode.js' @ runmode='author'}">
    <div data-sly-test="${checkRunmode.hasRunmode}">Author runmode</div>
    ${checkRunmode.runmodes}
</div>
<div data-sly-use.checkRunmode="${'check-runmode.js' @ runmode='publish'}">
    <div data-sly-test="${checkRunmode.hasRunmode}">Publish runmode</div>
</div>