[gnome-shell/T29763: 182/249] payg: Add AccountID support for the UI

[Matthew Leeds <mwleeds src gnome org>]

commit 8faf6c84d66d996dc162e996e9dee7175145eeaf
Author: Mazen Asef <mazen asefali gmail com>
Date:   Thu Jan 9 17:22:06 2020 -0300

    payg: Add AccountID support for the UI
    
    Create a notification on the screenshield that shows
    the user which is the related ACCOUNT_ID tied to the computer.
    
    https://phabricator.endlessm.com/T28225

 data/dbus-interfaces/com.endlessm.Payg1.xml |  1 +
 data/theme/gnome-shell-sass/_endless.scss   |  7 ++++++
 js/misc/paygManager.js                      |  8 +++++++
 js/ui/payg.js                               |  2 ++
 js/ui/paygUnlockDialog.js                   | 36 ++++++++++++++++++++++++++---
 5 files changed, 51 insertions(+), 3 deletions(-)
---
diff --git a/data/dbus-interfaces/com.endlessm.Payg1.xml b/data/dbus-interfaces/com.endlessm.Payg1.xml
index be7ce279da..cc6a762705 100644
--- a/data/dbus-interfaces/com.endlessm.Payg1.xml
+++ b/data/dbus-interfaces/com.endlessm.Payg1.xml
@@ -13,6 +13,7 @@
     <property name="ExpiryTime" type="t" access="read"/>
     <property name="Enabled" type="b" access="read"/>
     <property name="RateLimitEndTime" type="t" access="read"/>
+    <property name="AccountID" type="s" access="read"/>
     <property name="CodeFormat" type="s" access="read"/>
     <property name="CodeFormatPrefix" type="s" access="read"/>
     <property name="CodeFormatSuffix" type="s" access="read"/>
diff --git a/data/theme/gnome-shell-sass/_endless.scss b/data/theme/gnome-shell-sass/_endless.scss
index d741fccaff..841d805291 100644
--- a/data/theme/gnome-shell-sass/_endless.scss
+++ b/data/theme/gnome-shell-sass/_endless.scss
@@ -757,6 +757,13 @@ $success_time_payg_color: #02b842;
           text-align: left;
       }
 
+      .unlock-dialog-payg-account-id {
+          color: $osd_fg_color;
+          font-size: 100%;
+          text-align: left;
+          margin: 12px;
+      }
+
       .unlock-dialog-payg-success {
           color: $success_time_payg_color;
           font-size: 24px;
diff --git a/js/misc/paygManager.js b/js/misc/paygManager.js
index 74b72bd0e1..f81178d169 100644
--- a/js/misc/paygManager.js
+++ b/js/misc/paygManager.js
@@ -41,6 +41,7 @@ var PaygError = {
     CODE_ALREADY_USED: 1,
     TOO_MANY_ATTEMPTS: 2,
     DISABLED: 3,
+    SHOW_ACCOUNT_ID: 4,
 };
 
 const DBusErrorsMapping = {
@@ -48,6 +49,7 @@ const DBusErrorsMapping = {
     CODE_ALREADY_USED: 'com.endlessm.Payg1.Error.CodeAlreadyUsed',
     TOO_MANY_ATTEMPTS: 'com.endlessm.Payg1.Error.TooManyAttempts',
     DISABLED: 'com.endlessm.Payg1.Error.Disabled',
+    SHOW_ACCOUNT_ID: 'com.endlessm.Payg1.Error.DisplayAccountID',
 };
 
 // This list defines the different instants in time where we would
@@ -87,6 +89,7 @@ var PaygManager = GObject.registerClass({
         this._expiryTime = 0;
         this._lastTimeAdded = 0;
         this._rateLimitEndTime = 0;
+        this._accountID = '';
         this._codeFormat = '';
         this._codeFormatRegex = null;
         this._paygNotifier = new Payg.PaygNotifier();
@@ -133,6 +136,7 @@ var PaygManager = GObject.registerClass({
             this._enabled = this._proxy.Enabled;
             this._expiryTime = this._proxy.ExpiryTime;
             this._rateLimitEndTime = this._proxy.RateLimitEndTime;
+            this._accountID = this._proxy.AccountID;
             this._setCodeFormat(this._proxy.CodeFormat || '^[0-9]{8}$');
 
             this._propertiesChangedId = this._proxy.connect('g-properties-changed', 
this._onPropertiesChanged.bind(this));
@@ -349,6 +353,10 @@ var PaygManager = GObject.registerClass({
         return this._rateLimitEndTime;
     }
 
+    get accountID() {
+        return this._accountID;
+    }
+
     get isLocked() {
         if (!this.enabled)
             return false;
diff --git a/js/ui/payg.js b/js/ui/payg.js
index 1459b9ae66..902293d6e9 100644
--- a/js/ui/payg.js
+++ b/js/ui/payg.js
@@ -263,6 +263,8 @@ var PaygUnlockUi = GObject.registerClass({
             this.setErrorMessage(_('Code already used. Please enter a new code.'));
         } else if (error.matches(Gio.IOErrorEnum, Gio.IOErrorEnum.TIMED_OUT)) {
             this.setErrorMessage(_('Time exceeded while verifying the code'));
+        } else if (error.matches(PaygManager.PaygErrorDomain, PaygManager.PaygError.SHOW_ACCOUNT_ID)) {
+            this.setErrorMessage(_('Your Pay As You Go Account ID is: 
%s').format(Main.paygManager.accountID));
         } else {
             // We don't consider any other error here (and we don't consider DISABLED explicitly,
             // since that should not happen), but still we need to show something to the user.
diff --git a/js/ui/paygUnlockDialog.js b/js/ui/paygUnlockDialog.js
index 48086af5a8..ce1637312d 100644
--- a/js/ui/paygUnlockDialog.js
+++ b/js/ui/paygUnlockDialog.js
@@ -70,6 +70,15 @@ var PaygUnlockDialog = GObject.registerClass({
         this._parentActor.add_child(this);
 
         let mainBox = new St.BoxLayout({
+            vertical: true,
+            x_align: Clutter.ActorAlign.FILL,
+            y_align: Clutter.ActorAlign.FILL,
+            x_expand: true,
+            y_expand: true,
+        });
+        this.add_child(mainBox);
+
+        let paygEnterCodeBox = new St.BoxLayout({
             vertical: true,
             x_align: Clutter.ActorAlign.FILL,
             y_align: Clutter.ActorAlign.CENTER,
@@ -77,14 +86,14 @@ var PaygUnlockDialog = GObject.registerClass({
             y_expand: true,
             style_class: 'unlock-dialog-payg-layout',
         });
-        this.add_child(mainBox);
+        mainBox.add_child(paygEnterCodeBox);
 
         let titleLabel = new St.Label({
             style_class: 'unlock-dialog-payg-title',
             text: _('Your Pay As You Go usage credit has expired.'),
             x_align: Clutter.ActorAlign.CENTER,
         });
-        mainBox.add_child(titleLabel);
+        paygEnterCodeBox.add_child(titleLabel);
 
         let promptBox = new St.BoxLayout({
             vertical: true,
@@ -100,7 +109,7 @@ var PaygUnlockDialog = GObject.registerClass({
 
             return Clutter.EVENT_PROPAGATE;
         });
-        mainBox.add_child(promptBox);
+        paygEnterCodeBox.add_child(promptBox);
 
         let promptLabel = new St.Label({
             style_class: 'unlock-dialog-payg-label',
@@ -165,6 +174,27 @@ var PaygUnlockDialog = GObject.registerClass({
 
         promptBox.add_child(helpLineSub);
 
+        // The standard value for an empty ACCOUNT_ID is 0, which implies the backend provider doesn't
+        // support the feature.
+        if (Main.paygManager.accountID !== '0') {
+            let infoBox = new St.BoxLayout({
+                vertical: true,
+                x_align: Clutter.ActorAlign.START,
+                y_align: Clutter.ActorAlign.END,
+                x_expand: true,
+                style_class: 'unlock-dialog-payg-layout',
+            });
+
+            let accountIDText = _('Pay As You Go Account ID: %s').format(Main.paygManager.accountID);
+            let accountIDInfo = new St.Label({
+                style_class: 'unlock-dialog-payg-account-id',
+                text: accountIDText,
+            });
+
+            infoBox.add_child(accountIDInfo);
+            mainBox.add_child(infoBox);
+        }
+
         Main.ctrlAltTabManager.addGroup(promptBox, _('Unlock Machine'), 'dialog-password-symbolic');
 
         this._cancelButton.connect('clicked', () => {