Add subscription UI

core/imageroot/var/lib/nethserver/cluster/bin/support-clusteradminctl

@@ -45,7 +45,7 @@ def action_add():
             'grant': [{"role": "owner", "on": "*" }],
         },
         extra={
-            'isNotificationHidden': False,
+            'isNotificationHidden': True,
             'title': 'Add user ' + hsubscription['support_user'],
         },
         endpoint="redis://127.0.0.1",
@@ -62,7 +62,7 @@ def action_remove():
             'user': hsubscription['support_user'],
         },
         extra={
-            'isNotificationHidden': False,
+            'isNotificationHidden': True,
             'title': 'Remove user ' + hsubscription['support_user'],
         },
         endpoint="redis://127.0.0.1",

core/ui/public/i18n/en/translation.json

@@ -81,7 +81,9 @@
         "tab_navigation": "Tab navigation",
         "warning": "Warning",
         "remember": "Remember",
-        "click_here_to_upload": "Click here to upload"
+        "click_here_to_upload": "Click here to upload",
+        "not_active": "Inactive",
+        "active": "Active"
     },
     "error": {
         "error": "Error",
@@ -109,7 +111,8 @@
         "ipaddress_format": "Invalid IP address format",
         "path_pattern": "Invalid path pattern",
         "fqdn_format": "Invalid FQDN format",
-        "cannot_retrieve_users_admin_configuration": "Cannot retrieve users portal administration"
+        "cannot_retrieve_users_admin_configuration": "Cannot retrieve users portal administration",
+        "cannot_retrieve_subscription_status": "Cannot retrieve subscription status"
     },
     "websocket": {
         "websocket_disconnected": "Websocket disconnected",
@@ -371,7 +374,14 @@
         "set-fqdn": "Set FQDN",
         "get-fqdn": "Get FQDN",
         "get-password-policy": "Get password policy",
-        "set-password-policy": "Set password policy"
+        "set-password-policy": "Set password policy",
+        "register-cluster-subscription": "Register cluster subscription",
+        "remove-subscription": "Remove cluster subscription",
+        "get-support-session": "Get support session",
+        "set-subscription": "Set subscription",
+        "get-subscription": "Get subscription",
+        "start-support-session": "Start support session",
+        "stop-support-session": "Stop support session"
     },
     "network": {
         "title": "Network"
@@ -575,6 +585,33 @@
     "settings_cluster": {
         "title": "Cluster"
     },
+    "settings_subscription": {
+        "title": "Subscription",
+        "cluster_subscription": "Cluster subscription",
+        "cluster_subscription_description": "Activate additional features, as outlined in the subscribed plan",
+        "subscription_status": "Subscription status",
+        "authentication_token": "Authentication token",
+        "authentication_token_helper": "Authentication token is used to authenticate the cluster nodes to the subscription service.",
+        "request_subscription": "Request",
+        "remove_subscription": "Remove subscription",
+        "authentication_token_placeholder": "Paste the authentication token",
+        "system_id": "System ID",
+        "plan_name": "Plan",
+        "expire_date": "Expiration",
+        "status": "Status",
+        "remote_support": "Remote support",
+        "remote_support_description": "Allow {productName} support team to remotely access your cluster",
+        "start_session_support": "Start session",
+        "session_id": "Session ID",
+        "paste_session_id_to_support_team": "Paste the session ID to the support team",
+        "remote_support_in_progress": "Remote support session in progress",
+        "stop_session_support": "End session",
+        "remove_cluster_subscription_title": "Remove the cluster subscription",
+        "remove_cluster_subscription_description": "You are going to remove the subscription plan. This will disable the subscription features.",
+        "no_expiration": "No expiration",
+        "unknown_token": "Unknown token",
+        "must_be_32_chars_but_less_than_128": "Must be between 32 and 128 characters"
+    },
     "settings_sw_repositories": {
         "title": "Software repositories",
         "no_sw_repositories": "No software repository",
@@ -909,7 +946,9 @@
         "instances_not_backed_up_c": "{num} app not backed up | {num} apps not backed up",
         "apps_installed_c": "Installed application| Installed applications",
         "updated_available_c": "Available update | Available updates",
-        "core_update_available": "Core update available"
+        "core_update_available": "Core update available",
+        "subscription_status": "Subscription",
+        "go_to_subscription": "Go to Subscription"
     },
     "domains": {
         "title": "Domains and users",

core/ui/public/shortcuts.json

@@ -332,5 +332,20 @@
       "it": ["impostazioni", "password"]
     },
     "path": "settings/cluster-admins"
+  },
+  {
+    "name": {
+      "en": "Cluster subscription",
+      "it": "Sottoscrizione cluster"
+    },
+    "description": {
+      "en": "Go to Cluster subscription",
+      "it": "Vai a Sottoscrizione cluster"
+    },
+    "tags": {
+      "en": ["subscription", "support", "remote", "register"],
+      "it": ["sottoscrizione", "supporto", "remoto", "registrazione"]
+    },
+    "path": "settings/subscription"
   }
 ]

core/ui/src/router/index.js

@@ -92,6 +92,14 @@ const routes = [
         /* webpackChunkName: "settings-account" */ "../views/settings/SettingsAccount.vue"
       ),
   },
+  {
+    path: "/settings/subscription",
+    name: "SettingsSubscription",
+    component: () =>
+      import(
+        /* webpackChunkName: "subscription" */ "../views/settings/SettingsSubscription.vue"
+      ),
+  },
   {
     path: "/settings/cluster-admins",
     name: "ClusterAdmins",

core/ui/src/views/ClusterStatus.vue

@@ -58,6 +58,46 @@
           </template>
         </NsInfoCard>
       </cv-column>
+      <cv-column :md="4" :max="4">
+        <NsInfoCard
+          light
+          :title="$t('cluster_status.subscription_status')"
+          :icon="Badge32"
+          :loading="loading.getSubscription"
+          :isErrorShown="error.getSubscription"
+          :errorTitle="$t('error.cannot_retrieve_subscription_status')"
+          :errorDescription="error.getSubscription"
+          class="min-height-card"
+        >
+          <template slot="content">
+            <div class="card-rows">
+              <div class="card-row">
+                <div v-if="!loading.getSubscription" class="card-row ">
+                  <cv-tag
+                    v-if="subscription_status === 'active'"
+                    kind="green"
+                    :label="$t('common.active')"
+                  ></cv-tag>
+                  <cv-tag
+                    v-else
+                    kind="high-contrast"
+                    :label="$t('common.not_active')"
+                  ></cv-tag>
+                </div>
+              </div>
+            <div class="card-row">
+              <NsButton
+                kind="ghost"
+                :icon="ArrowRight20"
+                @click="$router.push('/settings/subscription')"
+              >
+                {{ $t("cluster_status.go_to_subscription") }}
+              </NsButton>
+            </div>
+            </div>
+          </template>
+        </NsInfoCard>
+      </cv-column>
       <cv-column :md="4" :max="4">
         <NsInfoCard
           light
@@ -228,11 +268,13 @@ export default {
       backups: [],
       instancesNotBackedUp: [],
       isCoreUpdateAvailable: false,
+      subscription_status: "inactive",
       loading: {
         getClusterStatus: true,
         listModules: true,
         listBackups: true,
         listCoreModules: true,
+        getSubscription: true,
       },
       error: {
         name: "",
@@ -241,6 +283,7 @@ export default {
         listModules: "",
         listBackups: "",
         listCoreModules: "",
+        getSubscription: "",
       },
     };
   },
@@ -329,6 +372,47 @@ export default {
       this.listModules();
       this.listCoreModules();
       this.listBackups();
+      this.getSubscription();
+    },
+    async getSubscription() {
+      this.clearErrors();
+      this.loading.getSubscription = true;
+      const taskAction = "get-subscription";
+
+      // register to task completion
+      this.$root.$once(
+        taskAction + "-completed",
+        this.getSubscriptionCompleted
+      );
+
+      const res = await to(
+        this.createClusterTask({
+          action: taskAction,
+          extra: {
+            title: this.$t("action." + taskAction),
+            isNotificationHidden: true,
+          },
+        })
+      );
+
+      const err = res[0];
+
+      if (err) {
+        console.error(`error creating task ${taskAction}`, err);
+        this.error.getSubscription = this.getErrorMessage(err);
+        this.loading.getSubscription = false;
+        return;
+      }
+    },
+    getSubscriptionCompleted(taskContext, taskResult) {
+      const output = taskResult.output;
+      if (output.subscription == null) {
+        this.status = "inactive";
+        this.loading.getSubscription = false;
+        return;
+      }
+      this.subscription_status = output.subscription.status;
+      this.loading.getSubscription = false;
     },
     async getClusterStatus() {
       this.error.getClusterStatus = "";

core/ui/src/views/settings/Settings.vue

@@ -30,6 +30,16 @@
           <h6>{{ $t("settings_account.title") }}</h6>
         </NsTile>
       </cv-column>
+      <cv-column :md="4" :xlg="4">
+        <NsTile
+          :light="true"
+          kind="clickable"
+          @click="goTo('/settings/subscription')"
+          :icon="Badge32"
+        >
+          <h6>{{ $t("settings_subscription.title") }}</h6>
+        </NsTile>
+      </cv-column>
       <cv-column :md="4" :xlg="4">
         <NsTile
           :light="true"