@tapni/auth 0.0.109 → 0.0.118

package/src/mixins/mfa-auth.mixin.js

@@ -0,0 +1,76 @@
+import QRCodeStyling from "qr-code-styling";
+import { authenticator } from "@otplib/preset-browser";
+import {EventBus} from "@/store/event-bus.js";
+
+export default {
+  data () {
+    return {
+      otpToken: null,
+      otpSecret: null,
+      mfaEnable: false,
+      qrCodeHash: null,
+      qrCodeRefreshInterval: null,
+      poolingInterval: null,
+      loading: false,
+    }
+  },
+  props: {
+    isModal: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+  },
+  computed: {
+    promptMFA () {
+      return false;
+    }
+  },
+  async mounted () {
+    if (this.$route.name === 'AuthMFA') {
+      await this.getAccountSettings();
+      this.generateOTPQrCode();
+    }
+
+    EventBus.$on('otpSubmitted', this.otpSubmitted)
+  },
+  methods: {
+    otpSubmitted(code) {
+      this.otpToken = code;
+
+      // Assuming that the parent component had a method called submit
+      this.submit();
+    },
+    generateOTPQrCode() {
+      const user = this.account.email;
+
+      if (this.account.mfaEnabled) {
+        this.mfaEnable = true;
+      } else {
+        const service = "Tapni";
+
+        const secret = authenticator.generateSecret();
+        this.otpSecret = secret;
+
+        const otpQR = authenticator.keyuri(user, service, secret);
+
+        const otpQrCode = new QRCodeStyling({
+          width: 200,
+          height: 200,
+          data: otpQR,
+        });
+        otpQrCode.append(document.getElementById("qrCodeContainer"));
+      }
+    },
+    async cancelMFA() {
+      if (import.meta.env.VITE_APP_MODE === 'npm') {
+        EventBus.$emit('ssoEvent', {name: 'mfaCancel', data: true})
+      } else {
+        this.$router.push('/account');
+      }
+    },
+    async validateMFA() {
+      EventBus.$emit('toggleOTPModal', true);
+    },
+  }
+}

package/src/mixins/microsoft.mixin.js

@@ -12,9 +12,7 @@ export default {
   },
   computed: {
     displayMicrosoftSSOLogin() {
-      return (
-        (this.ssoCompany?.login?.microsoft_login && !this.isModal) ?? false
-      );
+      return false;
     },
   },
   methods: {
@@ -22,8 +20,6 @@ export default {
       if (type === "sso") this.microsoftSSOLoad = true;
       else this.microsoftLoad = true;
 
-      if (!Object.keys(sso).length) sso = this.ssoCompany.sso?.azure?.sso || {};
-
       const [errAuth, user] = await to(
         MsAuthPlugin.login({
           clientId: type === "sso" ? sso.clientID : import.meta.env.VITE_APP_SSO_ID,
@@ -32,7 +28,7 @@ export default {
           knownAuthorities: [],
           keyHash: "4+5wCp8QcLptlO0aeP5RDTTOWyg=", // Android,
           redirectUri:
-            import.meta.env.NODE_ENV === "development"
+            import.meta.env.DEV
               ? `${window.location.origin}/login`
               : "https://" + window.location.host + "/login",
         })
@@ -50,7 +46,7 @@ export default {
 
       if (user && (user.accessToken || user.idToken)) {
         const [err, response] = await to(
-          AuthService.microsoftSDK(user, this.$storage)
+          AuthService.microsoftSDK(user, this.$storex)
         );
         if (err) {
           this.microsoftLoad = false;

package/src/mixins/okta.mixin.js

@@ -32,7 +32,7 @@ export default {
 			let user = {accessToken: response.data?.access_token, domain: data.domain}
 			if (this.display === 'popup') user.response_type = 'code';
 
-			[err, response] = await to(AuthService.oktaSDK(user, this.$storage));
+			[err, response] = await to(AuthService.oktaSDK(user, this.$storex));
 			if (err) {
 				this.oktaLoad = false
 				EventBus.$emit('ssoEvent', {name: 'setLoading', data: false})

package/src/mixins/qr-auth.mixin.js

@@ -20,6 +20,11 @@ export default {
       default: false,
     },
   },
+  computed: {
+    displayQRLogin () {
+      return this.$route.name === 'AuthLogin' && this.display !== 'npm';
+    }
+  },
   mounted () {
     if (this.$route.name === 'AuthQR') this.changeLoginToQr();
   },
@@ -85,7 +90,7 @@ export default {
       this.poolingInterval = setInterval(async () => {
         const [err, response] = await to(CompanyService.qrCodePooling({
           qrToken: this.qrCodeHash,
-        }, this.$storage));
+        }, this.$storex));
         if (err) return this.errorHandler(err);
         if (response.data.auth_code) {
           if (this.display === 'npm') {

package/src/mixins/saml.mixin.js

@@ -31,7 +31,8 @@ export default {
 			const platform = Capacitor.getPlatform();
 
 			// append public key as relayState
-			let relayState = Buffer.from(`code_challenge=${this.code_challenge}&platform=${platform}&redirect_uri=${(location.origin + '/callback/saml')}&realm=${this.$storage.realm}`).toString('base64');
+			let dataString = `code_challenge=${this.code_challenge}&platform=${platform}&redirect_uri=${(location.origin + '/callback/saml')}&realm=${this.$storex.realm}`;
+			let relayState = btoa(dataString);
 
 			loginUrl = `${loginUrl}&RelayState=${relayState}`
 

package/src/routes.js

@@ -4,12 +4,15 @@ const Login = () => import("./views/Login.vue");
 const Register = () =>
     import("./views/Register.vue");
 const Reset = () => import("./views/Reset.vue");
+const Account = () => import("./views/Account.vue");
 const Verify = () =>
     import("./views/Verify.vue");
 const Callback = () =>
     import("./views/Callback.vue");
 const QR = () =>
     import("./views/QR.vue");
+const MFA = () =>
+    import("./views/MFA.vue");
 
 export default [
   {
@@ -33,6 +36,16 @@ export default [
     name: "AuthQR",
     component: QR,
   },
+  {
+    path: "/mfa",
+    name: "AuthMFA",
+    component: MFA,
+  },
+  {
+    path: "/account",
+    name: "AuthAccount",
+    component: Account,
+  },
   {
     path: "/reset",
     name: "AuthReset",

package/src/services/Api.js

@@ -1,28 +1,21 @@
 import axios from 'axios'
 import { jwtDecode } from "jwt-decode";
 import { version } from "../../package.json"
-import AuthMixin from "../mixins/auth.mixin"
+import store from '../store/store.js';
 
-let apiRootFromOptions;
-
-
-export default {
-  setApiRootFromOptions(apiRoot) {
-    apiRootFromOptions = apiRoot
-  },
-  instance(storage, refreshTokenAction = null) {
 
+export default (refreshTokenAction = null) => {
     const appInfo = version;
     let baseURL = import.meta.env.VITE_APP_API_ROOT + '/v1/';
 
-    if (apiRootFromOptions) {
-      baseURL = apiRootFromOptions;
+    if (store.getters.apiRoot) {
+      baseURL = store.getters.apiRoot;
     }
 
     let apiInstance = axios.create({
       baseURL,
       headers: {
-        ...(storage ? { Authorization: `Bearer ${storage.token}` } : {}),
+        Authorization: `Bearer ${store.getters.accessToken}`,
         "X-Client-Name": "sso-" + appInfo.platform,
         "X-Client-Version": appInfo.version
       }
@@ -34,33 +27,28 @@ export default {
       if (['post', 'put', 'delete'].includes(config.method.toLowerCase())) {
         config.data = {
           ...config.data,
-          ...(storage ? {
-            lang: storage.appLanguage,
-            realm: storage.realm || 'app'
-          } : {}),
+          lang: store.getters.appLanguage,
+          realm: store.getters.appRealm || 'app'
         }
       } else if (config.method.toLowerCase() === 'get') {
         config.params = {
           ...config.params,
-          ...(storage ? {
-            lang: storage.appLanguage,
-            realm: storage.realm || 'app'
-          } : {}),
+          lang: store.getters.appLanguage,
+          realm: store.getters.appRealm || 'app'
         }
       }
 
-      // Check refresh token expiration before request is sent
-      if (storage && storage.token && !refreshTokenAction) {
-        const decoded = jwtDecode(storage.token)
+        // Check refresh token expiration before request is sent
+      if (store.getters.accessToken && !refreshTokenAction) {
+        const decoded = jwtDecode(store.getters.accessToken)
 
         // Check if access token expired
         if (decoded.exp - 30 < Math.floor(Date.now() / 1000)) {
-
-          return AuthMixin.methods.refreshTokenAction({...decoded, refreshToken: storage.refreshTokens ? storage.refreshTokens.split(',')[0] : null, storage })
-              .then((token) => {
+          return store.dispatch('refreshTokenAction', decoded)
+              .then(() => {
                 config.headers = {
                   ...config.headers,
-                  Authorization: `Bearer ${token}`
+                  Authorization: `Bearer ${store.getters.accessToken}`
                 }
                 return config;
               })
@@ -70,5 +58,4 @@ export default {
     });
 
     return apiInstance;
-  }
 }

package/src/services/AuthService.js

@@ -1,76 +1,81 @@
-import Api from './Api';
+import api from './Api';
 import { Device } from '@capacitor/device';
-const api = Api.instance;
 
 let deviceID;
 Device.getId().then((DeviceId)=> deviceID = DeviceId.uuid)
 
 export default {
-  register (data, storage) {
+  register (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/register', data)
+    return api().post('/users/register', data)
   },
-  login (data, storage) {
+  login (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/login', data)
+    return api().post('/users/login', data)
   },
-  logout (data, storage) {
+  logout (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/logout', data)
+    return api().post('/users/logout', data)
   },
-  refreshToken (data, storage) {
-    return api(storage, true).get(`/users/refresh-token?UserId=${data.id}&token=${data.refreshToken}`)
+  refreshToken (data) {
+    return api( true).get(`/users/refresh-token?UserId=${data.id}&token=${data.refreshToken}`)
   },
-  getLoggedInAccounts(data, storage) {
-    return api(storage).post(`/users/tokens`, data);
+  getLoggedInAccounts(data) {
+    return api().post(`/users/tokens`, data);
   },
-  sendResetEmail (data, storage) {
+  sendResetEmail (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/reset', data)
+    return api().post('/users/reset', data)
   },
-  changePassword (data, storage) {
-    return api(storage).put('/users/password', data, {
+  changePassword (data) {
+    return api().put('/users/password', data, {
       headers: { Authorization: 'Bearer ' + data.token }
     })
   },
-  verify (data, storage) {
-    return api(storage).get('/users/verify?c=' + data.code + '&e=' + data.email + '&captchatoken=' + data.captchaToken)
+  verify (data) {
+    return api().get('/users/verify?c=' + data.code + '&e=' + data.email + '&captchatoken=' + data.captchaToken)
   },
   googleUrl (storage) {
-    return api(storage).get('/users/google/url')
+    return api().get('/users/google/url')
   },
-  google (data, storage) {
+  google (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/google', data)
+    return api().post('/users/google', data)
   },
-  facebook (data, storage) {
+  facebook (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/facebook', data)
+    return api().post('/users/facebook', data)
   },
-  googleSDK (data, storage) {
+  googleSDK (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/google/sdk', data)
+    return api().post('/users/google/sdk', data)
   },
-  facebookSDK (data, storage) {
+  facebookSDK (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/facebook/sdk', data)
+    return api().post('/users/facebook/sdk', data)
   },
-  appleSDK (data, storage) {
+  appleSDK (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/apple/sdk', data)
+    return api().post('/users/apple/sdk', data)
   },
-  microsoftSDK (data, storage) {
+  microsoftSDK (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/microsoft/sdk', data)
+    return api().post('/users/microsoft/sdk', data)
   },
-  oktaSDK (data, storage) {
+  oktaSDK (data) {
     data.device_id = deviceID
-    return api(storage).post('/users/okta/sdk', data)
+    return api().post('/users/okta/sdk', data)
   },
-  samlLoginUrl (data, storage) {
-    return api(storage).post('/saml/url', data)
+  samlLoginUrl (data) {
+    return api().post('/saml/url', data)
   },
-  exchangeAuthCode (data, storage) {
-    return api(storage).post('/users/auth-code', data)
+  exchangeAuthCode (data) {
+    return api().post('/users/auth-code', data)
+  },
+  setMfa(data) {
+    return api().post("/users/set-mfa", data);
+  },
+  getAccountSettings() {
+    return api().get("/users/settings");
   },
 }

package/src/services/CompanyService.js

@@ -1,14 +1,13 @@
-import Api from './Api';
-const api = Api.instance;
+import api from './Api';
 
 export default {
-  getBySSOEmail (email, storage) {
-    return api(storage).get(`/company/sso/${email}`)
+  getBySSOEmail (email) {
+    return api().get(`/company/sso/${email}`)
   },
-  acceptCompanyInvitation (code, storage) {
-    return api(storage).get(`/users/invitation?ic=${code}`)
+  acceptCompanyInvitation (code) {
+    return api().get(`/users/invitation?ic=${code}`)
   },
-  qrCodePooling(payload, storage) {
-    return api(storage).post("/company/login/qr", payload);
+  qrCodePooling(payload) {
+    return api().post("/company/login/qr", payload);
   },
 }

package/src/services/DeviceService.js

@@ -1,11 +1,10 @@
-import Api from './Api';
-const api = Api.instance;
+import api from './Api';
 
 export default {
-	registerDevice(data, storage) {
-		return api(storage).post(`/devices/add`, data)
+	registerDevice(data) {
+		return api().post(`/devices/add`, data)
 	},
-	addFcmToken(data, storage) {
-		return api(storage).post(`/devices/fcm/add`, data)
+	addFcmToken(data) {
+		return api().post(`/devices/fcm/add`, data)
 	}
 }

package/src/services/UserService.js

@@ -1,50 +1,49 @@
-import Api from './Api';
-const api = Api.instance;
+import api from './Api.js';
 
 export default {
   getMe() {
-    return Api(storage).get(`/users/me`);
+    return api().get(`/users/me`);
   },
-  getByUsername(data, storage) {
+  getByUsername(data) {
     let referrer = document.referrer || "";
     let params = data.utmParams || {};
     if (data.dontTap) params.dontTap = true;
-    return api(storage).get(`/users/${data.username}`, {
+    return api().get(`/users/${data.username}`, {
       params,
       headers: { "X-Referer": referrer },
     });
   },
-  getByNumber(data, storage) {
+  getByNumber(data) {
     let referrer = document.referrer || "";
     let params = data.utmParams || {};
     if (data.dontTap) params.dontTap = true;
-    return api(storage).get(`/users/tag/${data.serial}`, {
+    return api().get(`/users/tag/${data.serial}`, {
       params,
       headers: { "X-Referer": referrer },
     });
   },
-  save(data, storage) {
-    return api(storage).put(`/users`, data);
+  save(data) {
+    return api().put(`/users`, data);
   },
-  newPassword(data, storage) {
-    return api(storage).put(`/users/new-password`, data);
+  newPassword(data) {
+    return api().put(`/users/new-password`, data);
   },
-  connect(data, storage) {
-    return api(storage).post(`/users/connect`, data);
+  connect(data) {
+    return api().post(`/users/connect`, data);
   },
-  eventLog(data, storage) {
-    return api(storage).post(`/users/log`, data);
+  eventLog(data) {
+    return api().post(`/users/log`, data);
   },
-  deleteAccount(data, storage) {
-    return api(storage).post(`/users/profile/delete`, data);
+  deleteAccount(data) {
+    return api().post(`/users/profile/delete`, data);
   },
-  registerDevice(data, storage) {
-    return api(storage).post(`/users/device/register`, data);
+  registerDevice(data) {
+    return api().post(`/users/device/register`, data);
   },
-  addFcmToken(data, storage) {
-    return api(storage).post(`/users/device/fcm`, data);
+  addFcmToken(data) {
+    return api().post(`/users/device/fcm`, data);
   },
-  loginUsingQR(data, storage) {
-    return api(storage).post("/users/qr/login", data);
+  loginUsingQR(data) {
+    return api().post("/users/qr/login", data);
   }
 };

package/src/services/UtilService.js

@@ -132,7 +132,7 @@ export default {
             reader.onerror = error => reject(error);
         });
     },
-    getUTMParams(data, storage) {
+    getUTMParams(data) {
         let utm = {}
         if (data.utm_source) utm.utm_source = data.utm_source;
         if (data.utm_medium) utm.utm_medium = data.utm_medium;

package/src/store/locales/en.js

@@ -495,7 +495,7 @@ export default {
     analyticsLinkVisits: "Link Visits",
     analyticsNewConnections: "New Connections",
     analyticsTopCountries: "Top Countries",
-    analyticsTopReferers: "Top Referers",
+    analyticsTopReferers: "Top Referrers",
 
     please_wait: "Please wait...",
     click_here: "click here",
@@ -510,5 +510,12 @@ export default {
     choose_other_login_methods: "Choose other login methods",
     no_sso_logins:
       "Your company does not use SSO login, please contact your administrator",
+
+    mfa: "Multi-Factor Authentication",
+    otp_title: "Enter MFA Code to continue",
+    otp_code: "MFA Code",
+    otp_subtitle: "To continue, turn on or view your MFA device and type the authentication code below.",
+    otp_p1: "If you have trouble signing in, <br> please contact us at",
+    change_language: "Change language"
   },
 };