feat: GNAP integration

.github/workflows/build.yml

@@ -131,19 +131,13 @@ jobs:
           echo '127.0.0.1 testnet.orb.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 wallet.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 wallet-server.trustbloc.local' | sudo tee -a /etc/hosts
-          echo '127.0.0.1 wallet-2.trustbloc.local' | sudo tee -a /etc/hosts
-          echo '127.0.0.1 wallet-server-2.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 mediator.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 uni-resolver-web.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 auth.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 auth-hydra.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 demo-hydra.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 edv.trustbloc.local' | sudo tee -a /etc/hosts
-          echo '127.0.0.1 authz-kms.trustbloc.local' | sudo tee -a /etc/hosts
-          echo '127.0.0.1 edv-oathkeeper-proxy.trustbloc.local' | sudo tee -a /etc/hosts
-          echo '127.0.0.1 ops-kms.trustbloc.local' | sudo tee -a /etc/hosts
-          echo '127.0.0.1 oathkeeper-auth-keyserver.trustbloc.local' | sudo tee -a /etc/hosts
-          echo '127.0.0.1 oathkeeper-ops-keyserver.trustbloc.local' | sudo tee -a /etc/hosts
+          echo '127.0.0.1 kms.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 file-server.trustbloc.local' | sudo tee -a /etc/hosts
           echo '127.0.0.1 demo-adapter.trustbloc.local' | sudo tee -a /etc/hosts
           echo '//npm.pkg.github.com/:_authToken=${GITHUB_TOKEN}' > ~/.npmrc

cmd/wallet-web/src/App.vue

@@ -5,42 +5,26 @@
 -->
 
 <script setup>
-import { computed, onBeforeMount, onMounted, onUnmounted, ref } from 'vue';
+import { onBeforeMount, onMounted, onUnmounted, ref } from 'vue';
 import { useStore } from 'vuex';
 import getStartingLocale from '@/mixins/i18n/getStartingLocale.js';
 import { updateI18nLocale } from '@/plugins/i18n';
 import SpinnerIcon from '@/components/icons/SpinnerIcon.vue';
 
-const store = useStore();
+// Local Variables
+const startingLocale = getStartingLocale(); // Get starting locale, set it in i18n and in the store
 const loaded = ref(false);
-const isAgentInitialized = computed(() => store.getters['agent/isInitialized']);
-const initAgent = () => store.dispatch('agent/init');
-const initOpts = () => store.dispatch('initOpts');
-const loadUser = () => store.dispatch('loadUser');
 
-// Get starting locale, set it in i18n and in the store
-const startingLocale = getStartingLocale();
+// Hooks
+const store = useStore();
+
 store.dispatch('setLocale', startingLocale);
 
 onBeforeMount(async () => {
   await updateI18nLocale(startingLocale.id);
 });
 
-onMounted(async () => {
-  try {
-    // load opts
-    await initOpts();
-
-    // load user if already logged in
-    loadUser();
-
-    // load agent if user already logged in and agent not initialized (scenario: page refresh)
-    if (store.getters.getCurrentUser && !isAgentInitialized.value) {
-      await initAgent();
-    }
-  } catch (e) {
-    console.log('Could not initialize Vue App:', e);
-  }
+onMounted(() => {
   loaded.value = true;
 });
 

cmd/wallet-web/src/components/Signout/SignoutComponent.vue

@@ -34,7 +34,7 @@ async function signout() {
 
   await Promise.all(actions);
 
-  router.push({ name: 'signin' });
+  router.push({ path: '/', query: { signedOut: true } });
 }
 
 const chapi = ref(

cmd/wallet-web/src/mixins/gnap/gnap.js

@@ -5,6 +5,7 @@ SPDX-License-Identifier: Apache-2.0
 */
 
 import { GNAPClient } from '@trustbloc/wallet-sdk';
+import { getGnapKeyPair } from '@/mixins';
 
 export async function gnapRequestAccess(
   signer,

cmd/wallet-web/src/pages/VaultsPage.vue

@@ -139,7 +139,7 @@ onMounted(async () => {
 <template>
   <div>
     <WelcomeBannerComponent
-      v-if="!currentUser.preference.skipWelcomeMsg && !skippedLocally && !loading"
+      v-if="!currentUser?.preference?.skipWelcomeMsg && !skippedLocally && !loading"
       id="welcome-banner-close-button"
       class="md:mb-10"
       @click="updateUserPreferences"

cmd/wallet-web/src/router/TheRoot.vue

@@ -1,3 +1,53 @@
+<!--
+ * Copyright SecureKey Technologies Inc. All Rights Reserved.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+-->
+
+<script setup>
+import { computed, inject, onMounted, ref } from 'vue';
+import { useRoute } from 'vue-router';
+import { useStore } from 'vuex';
+import { CHAPIHandler } from '@/mixins';
+import useBreakpoints from '@/plugins/breakpoints.js';
+
+// Local Variables
+const disableCHAPI = ref(false);
+const loaded = ref(false);
+
+// Hooks
+const route = useRoute();
+const store = useStore();
+const breakpoints = useBreakpoints();
+const polyfill = inject('polyfill');
+const webCredentialHandler = inject('webCredentialHandler');
+
+// Store Getters
+const currentUser = computed(() => store.getters['getCurrentUser']);
+const agentOpts = computed(() => store.getters['getAgentOpts']);
+
+// Store Actions
+const activateCHAPI = () => store.dispatch('activateCHAPI');
+
+onMounted(async () => {
+  // if intended target doesn't require CHAPI.
+  disableCHAPI.value = route.params.disableCHAPI || false;
+  try {
+    if (!breakpoints.xs && !breakpoints.sm && !disableCHAPI.value) {
+      const chapi = new CHAPIHandler(
+        polyfill,
+        webCredentialHandler,
+        agentOpts.value.credentialMediatorURL
+      );
+      await chapi.install(currentUser.value.username);
+      activateCHAPI();
+    }
+  } catch (e) {
+    console.log('Could not initialize Vue App:', e);
+  }
+  loaded.value = true;
+});
+</script>
 <template>
   <router-view />
 </template>