@tapni/auth 1.0.8 → 1.0.9

package/src/components/DELETE_SSOPick.vue

@@ -1,166 +1,111 @@
 <template>
-  <form
-    @submit.prevent
-    class="menu-wrapper menu-light menu-modal center-text activate-page"
-    :class="{ 'active-menu': toggle }"
-    style="height: auto; margin-top: -172.5px"
-  >
-    <a
-      @click="forceClose"
-      class="color-black pull-right pointer"
-      style="margin-top: 5px; position: absolute; right: 5px"
-    >
-      <i class="font-17 color-black">
-        <img
-          src="https://cdn.tapni.co/icons/down-arrow.png"
-          class="responsive-image"
-          style="width: 45%"
-        />
-      </i>
-    </a>
-    <h3 class="bold center-text color-black half-top half-bottom">
-      {{ ssoLang[appLanguage].select_sign_method }}
-    </h3>
+	<form @submit.prevent class="menu-wrapper menu-light menu-modal center-text activate-page" :class="{ 'active-menu': toggle }" style="height: auto; margin-top: -172.5px">
+		<a @click="forceClose" class="color-black pull-right pointer" style="margin-top: 5px; position: absolute; right: 5px">
+			<i class="font-17 color-black">
+				<img src="https://cdn.tapni.co/icons/down-arrow.png" class="responsive-image" style="width: 45%" />
+			</i>
+		</a>
+		<h3 class="bold center-text color-black half-top half-bottom">
+			{{ ssoLang[appLanguage].select_sign_method }}
+		</h3>
 
-    <!-- Azure Login Button -->
-    <a
-      v-if="sso?.azure"
-      @click="ssoLogin('azure')"
-      class="button-center button black-button button-90 google-button pointer"
-    >
-      <img
-        src="https://cdn.tapni.co/icons/azure.png"
-        style="
-          position: absolute;
-          margin-left: -11px;
-          padding: 8px 0;
-          height: 100%;
-        "
-      />
-      <span v-if="!azureLoad"
-        >{{ ssoLang[appLanguage].sign_in_with }} Azure</span
-      >
-      <span v-else class="button--loading button__loader"></span>
-    </a>
+		<!-- Azure Login Button -->
+		<a v-if="sso?.azure" @click="ssoLogin('azure')" class="button-center button black-button button-90 google-button pointer">
+			<img src="https://cdn.tapni.co/icons/azure.png" style="position: absolute; margin-left: -11px; padding: 8px 0; height: 100%" />
+			<span v-if="!azureLoad">{{ ssoLang[appLanguage].sign_in_with }} Azure</span>
+			<span v-else class="button--loading button__loader"></span>
+		</a>
 
-    <!-- Okta Login Button -->
-    <a
-      v-if="sso?.okta"
-      @click="ssoLogin('okta')"
-      class="button-center button black-button button-90 google-button pointer"
-    >
-      <img
-        src="https://cdn.tapni.co/icons/okta.png"
-        style="
-          position: absolute;
-          margin-left: -11px;
-          padding: 8px 0;
-          height: 100%;
-        "
-      />
-      <span v-if="!oktaLoad"
-        >{{ ssoLang[appLanguage].sign_in_with }} Okta</span
-      >
-      <span v-else class="button--loading button__loader"></span>
-    </a>
+		<!-- Okta Login Button -->
+		<a v-if="sso?.okta" @click="ssoLogin('okta')" class="button-center button black-button button-90 google-button pointer">
+			<img src="https://cdn.tapni.co/icons/okta.png" style="position: absolute; margin-left: -11px; padding: 8px 0; height: 100%" />
+			<span v-if="!oktaLoad">{{ ssoLang[appLanguage].sign_in_with }} Okta</span>
+			<span v-else class="button--loading button__loader"></span>
+		</a>
 
-    <!-- SAML Login Button -->
-    <a
-      v-if="sso?.saml"
-      @click="ssoLogin('saml')"
-      class="button-center button black-button button-90 google-button pointer"
-    >
-      <img
-        src="https://cdn.tapni.co/icons/saml.png"
-        style="
-          position: absolute;
-          margin-left: -11px;
-          padding: 8px 0;
-          height: 100%;
-        "
-      />
-      <span v-if="!samlLoad"
-        >{{ ssoLang[appLanguage].sign_in_with }} SAML</span
-      >
-      <span v-else class="button--loading button__loader"></span>
-    </a>
-  </form>
+		<!-- SAML Login Button -->
+		<a v-if="sso?.saml" @click="ssoLogin('saml')" class="button-center button black-button button-90 google-button pointer">
+			<img src="https://cdn.tapni.co/icons/saml.png" style="position: absolute; margin-left: -11px; padding: 8px 0; height: 100%" />
+			<span v-if="!samlLoad">{{ ssoLang[appLanguage].sign_in_with }} SAML</span>
+			<span v-else class="button--loading button__loader"></span>
+		</a>
+	</form>
 </template>
 
 <script>
-import { EventBus } from "../store/event-bus";
-import MicrosoftMixin from "../mixins/microsoft.mixin";
-import OktaMixin from "../mixins/okta.mixin";
-import SamlMixin from "../mixins/saml.mixin";
-import AuthMixin from "../mixins/auth.mixin";
+import { EventBus } from '../store/event-bus';
+import MicrosoftMixin from '../mixins/microsoft.mixin';
+import OktaMixin from '../mixins/okta.mixin';
+import SamlMixin from '../mixins/saml.mixin';
+import AuthMixin from '../mixins/auth.mixin';
 export default {
-  name: "SSOPick",
-  mixins: [MicrosoftMixin, OktaMixin, SamlMixin, AuthMixin],
-  data() {
-    return {
-      toggle: false,
-      sso: null,
-      email: null,
-      azureLoad: false,
-      oktaLoad: false,
-      samlLoad: false,
-    };
-  },
-  mounted() {
-    EventBus.$on("toggleSSOPickModal", this.toggleModal);
-    EventBus.$on("closeModal", () => {
-      this.toggle = false;
-    });
-  },
-  beforeDestroy() {
-    EventBus["_events"]["toggleSSOPickModal"].pop();
-  },
-  methods: {
-    forceClose() {
-      EventBus.$emit("closeModal");
-    },
-    close() {
-      this.toggleModal();
-    },
-    async ssoLogin(type) {
-      if (type === "azure") {
-        this.microsoftLogin("sso", this.sso.azure.sso);
-        this.azureLoad = true;
-      }
-      if (type === "okta") {
-        this.oktaLogin(this.sso.okta.sso);
-        this.oktaLoad = true;
-      }
-      if (type === "saml") {
-        this.samlLogin(this.sso.saml.sso.loginUrl);
-        this.samlLoad = true;
-      }
-    },
-    toggleModal(data) {
-      this.azureLoad = false;
-      this.oktaLoad = false;
-      this.samlLoad = false;
-      this.sso = null;
-      this.email = null;
+	name: 'SSOPick',
+	mixins: [MicrosoftMixin, OktaMixin, SamlMixin, AuthMixin],
+	data() {
+		return {
+			toggle: false,
+			sso: null,
+			email: null,
+			azureLoad: false,
+			oktaLoad: false,
+			samlLoad: false
+		};
+	},
+	mounted() {
+		EventBus.$on('toggleSSOPickModal', this.toggleModal);
+		EventBus.$on('closeModal', () => {
+			this.toggle = false;
+		});
+	},
+	beforeDestroy() {
+		EventBus['_events']['toggleSSOPickModal'].pop();
+	},
+	methods: {
+		forceClose() {
+			EventBus.$emit('closeModal');
+		},
+		close() {
+			this.toggleModal();
+		},
+		async ssoLogin(type) {
+			if (type === 'azure') {
+				this.microsoftLogin('sso', this.sso.azure.sso);
+				this.azureLoad = true;
+			}
+			if (type === 'okta') {
+				this.oktaLogin(this.sso.okta.sso);
+				this.oktaLoad = true;
+			}
+			if (type === 'saml') {
+				this.samlLogin(this.sso.saml.sso.loginUrl);
+				this.samlLoad = true;
+			}
+		},
+		toggleModal(data) {
+			this.azureLoad = false;
+			this.oktaLoad = false;
+			this.samlLoad = false;
+			this.sso = null;
+			this.email = null;
 
-      if (data) {
-        this.sso = data.sso;
-        this.email = data.email;
-      }
-      this.toggle = !this.toggle;
-    },
-  },
+			if (data) {
+				this.sso = data.sso;
+				this.email = data.email;
+			}
+			this.toggle = !this.toggle;
+		}
+	}
 };
 </script>
 
 <style scoped>
 .sso-img {
-  margin: 0 auto;
-  margin-top: 2px;
-  width: 35px;
+	margin: 0 auto;
+	margin-top: 2px;
+	width: 35px;
 }
 input {
-  margin: 0 auto;
-  height: 25px;
+	margin: 0 auto;
+	height: 25px;
 }
 </style>

package/src/eslint.config.js

@@ -0,0 +1,15 @@
+import pluginVue from 'eslint-plugin-vue';
+export default [
+	...pluginVue.configs['flat/recommended'],
+	{
+		rules: {
+			'vue/require-valid-default-prop': 'off',
+			'vue/max-attributes-per-line': 'off',
+			'vue/html-indent': 'off',
+			'vue/html-self-closing': 'off',
+			'vue/singleline-html-element-content-newline': 'off'
+			// override/add rules settings here, such as:
+			// 'vue/no-unused-vars': 'error'
+		}
+	}
+];

package/src/install.js

@@ -1,17 +1,16 @@
-import App from "./App.vue";
+import App from './App.vue';
 import auth from './store/auth.js';
 
 // Export the component by default
 export default {
-    install: (app, {store, apiRoot}) => {
-        // Register the component
-        app.component('TapniAuth', App);
+	install: (app, { store, apiRoot }) => {
+		// Register the component
+		app.component('TapniAuth', App);
 
-        if(!store.hasModule('auth')) {
-            store.registerModule('auth', auth);
-        }
+		if (!store.hasModule('auth')) {
+			store.registerModule('auth', auth);
+		}
 
-        app.config.globalProperties.$apiRoot = apiRoot;
-
-    }
+		app.config.globalProperties.$apiRoot = apiRoot;
+	}
 };

package/src/main.js

@@ -1,76 +1,75 @@
-import "@tapni/styles/dist/index.css";
-import { createApp } from 'vue'
-import RootApp from './App.vue'
-import router from './router'
-import VueCookies from 'vue-cookies'
+import '@tapni/styles/dist/index.css';
+import { createApp } from 'vue';
+import RootApp from './App.vue';
+import router from './router';
+import VueCookies from 'vue-cookies';
 import { App } from '@capacitor/app';
 import { Browser } from '@capacitor/browser';
 import store from './store/store.js';
 import { sync } from 'vuex-router-sync';
 
-const app = createApp(RootApp)
+const app = createApp(RootApp);
 
-app.config.productionTip = false
+app.config.productionTip = false;
 
 // Vuex Router Sync
 sync(store, router);
 
 // Cookies
-app.use(VueCookies)
+app.use(VueCookies);
 
-app.use(router)
+app.use(router);
 
-app.use(store)
-
-app.mount('#app')
+app.use(store);
 
+app.mount('#app');
 
 function hasQueryParams(route) {
-    return !!Object.keys(route.query).length
+	return !!Object.keys(route.query).length;
 }
 
 router.beforeEach((to, from, next) => {
-    setTimeout(() => {
-        window.scrollTo(0, 0)
-    }, 100)
-
-    if(!hasQueryParams(to) && hasQueryParams(from)){
-        next({name: to.name, query: from.query});
-    } else {
-        next()
-    }
-})
+	setTimeout(() => {
+		window.scrollTo(0, 0);
+	}, 100);
+
+	if (!hasQueryParams(to) && hasQueryParams(from)) {
+		next({ name: to.name, query: from.query });
+	} else {
+		next();
+	}
+});
 
 /**
  * Redirect users to desired profile - DEEP LINKING
  * @param data
  */
 function redirectToProfile(data) {
-    if (data && data.url) {
-        let url = new URL(data.url)
-        let pathname = url.pathname || '';
-        let queryParams = url.search || ''
-        if(queryParams) queryParams = Object.fromEntries(new URLSearchParams(queryParams));
-        else queryParams = {};
-        let subdomain = '';
-        //['my', 'tapni', 'co']
-        let tempArr = url.hostname.split('.');
-        if(tempArr.length === 3) subdomain = tempArr[0];
-        if(subdomain) queryParams.s = subdomain;
-
-        // open t.link shorter links in browser
-        if(pathname && /[A-Z]/.test(pathname) && !pathname.startsWith('/t/')) {
-            Browser.open({url: url.toString()});
-            return router.push('/');
-        }
-
-        if (pathname) {
-            router.push({
-                path: pathname,
-                query: queryParams
-            })
-        }
-    }
+	if (data && data.url) {
+		let url = new URL(data.url);
+		let pathname = url.pathname || '';
+		let queryParams = url.search || '';
+		if (queryParams) queryParams = Object.fromEntries(new URLSearchParams(queryParams));
+		else queryParams = {};
+		let subdomain = '';
+		//['my', 'tapni', 'co']
+		let tempArr = url.hostname.split('.');
+		if (tempArr.length === 3) subdomain = tempArr[0];
+		if (subdomain) queryParams.s = subdomain;
+
+		// open t.link shorter links in browser
+		if (pathname && /[A-Z]/.test(pathname) && !pathname.startsWith('/t/')) {
+			Browser.open({ url: url.toString() });
+			return router.push('/');
+		}
+
+		if (pathname) {
+			router.push({
+				path: pathname,
+				query: queryParams
+			});
+		}
+	}
 }
 /**
  * CAPACITOR_CONFIG
@@ -78,13 +77,12 @@ function redirectToProfile(data) {
  * Users who have an app should get the profiles opened in the app ie: tapni.co/tapni
  */
 App.addListener('appUrlOpen', async function (data) {
-    if(data.url && data.url.startsWith('tapni://')) data.url = data.url.replace('tapni://', 'https://')
-    let url = new URL(data.url);
-    if(url.pathname.includes('/callback/')) {
-        await router.push({path: url.pathname, query:  Object.fromEntries(new URLSearchParams(url.search))});
-    }
-    else redirectToProfile(data);
-})
+	if (data.url && data.url.startsWith('tapni://')) data.url = data.url.replace('tapni://', 'https://');
+	let url = new URL(data.url);
+	if (url.pathname.includes('/callback/')) {
+		await router.push({ path: url.pathname, query: Object.fromEntries(new URLSearchParams(url.search)) });
+	} else redirectToProfile(data);
+});
 
 // When the app is open and you trigger NFC event to open the app
 // App.addListener('appStateChange', async function (l) {
@@ -93,8 +91,7 @@ App.addListener('appUrlOpen', async function (data) {
 
 // When the app is closed and NFC event opens the app
 App.getLaunchUrl().then((data) => {
-    redirectToProfile(data)
+	redirectToProfile(data);
 });
 
-
 export { app };

package/src/mixins/apple.mixin.js

@@ -1,59 +1,61 @@
-import to from 'await-to-js'
-import AuthService from '../services/AuthService'
-import {SignInWithApple} from '@capacitor-community/apple-sign-in';
+import to from 'await-to-js';
+import AuthService from '../services/AuthService';
+import { SignInWithApple } from '@capacitor-community/apple-sign-in';
 
-import { jwtDecode } from "jwt-decode";
-import {EventBus} from '../store/event-bus';
+import { jwtDecode } from 'jwt-decode';
+import { EventBus } from '../store/event-bus';
 export default {
-  data () {
-    return {
-      appleLoad: false
-    }
-  },
-  computed: {
-    displayAppleLogin () {
-      return ((Capacitor.isNativePlatform() && Capacitor.getPlatform() === 'ios') || (!Capacitor.isNativePlatform() && this.isiOS));
-    }
-  },
-  methods: {
-    async appleLogin () {
-      this.appleLoad = true
-      const [errAuth, user] = await to(SignInWithApple.authorize({
-        clientId: 'co.tapni.applelogin',
-        redirectURI: 'https://' + window.location.host + '/login',
-        scopes: 'email name'
-      }))
-      if (errAuth) return this.appleLoad = false
-      user.response.tokenData = jwtDecode(user.response.identityToken);
+	data() {
+		return {
+			appleLoad: false
+		};
+	},
+	computed: {
+		displayAppleLogin() {
+			return (Capacitor.isNativePlatform() && Capacitor.getPlatform() === 'ios') || (!Capacitor.isNativePlatform() && this.isiOS);
+		}
+	},
+	methods: {
+		async appleLogin() {
+			this.appleLoad = true;
+			const [errAuth, user] = await to(
+				SignInWithApple.authorize({
+					clientId: 'co.tapni.applelogin',
+					redirectURI: 'https://' + window.location.host + '/login',
+					scopes: 'email name'
+				})
+			);
+			if (errAuth) return (this.appleLoad = false);
+			user.response.tokenData = jwtDecode(user.response.identityToken);
 
-      if (user && user.response && user.response.identityToken) {
-        // Track Referrals
-        if (this.referral) user.response.ref = this.referral;
+			if (user && user.response && user.response.identityToken) {
+				// Track Referrals
+				if (this.referral) user.response.ref = this.referral;
 
-        // Code Login
-        if (this.display === 'popup') user.response_type = 'code';
+				// Code Login
+				if (this.display === 'popup') user.response_type = 'code';
 
-        const [err, response] = await to(AuthService.appleSDK(user.response, this.$storex))
-        if (err) {
-          this.appleLoad = false
-          EventBus.$emit('ssoEvent', {name: 'setLoading', data: false})
-          return this.errorHandler(err)
-        }
-        if (response.data.success) {
-          if (this.display === 'popup') {
-            return window.parent?.postMessage({ code: response.data.auth_code, state: this.$route.query.state }, '*');
-          }
-          await this.loginSetup(response)
-          await this.getLoggedInAccounts()
-          this.loginSuccess({ ...response, isModal: this.isModal });
-          setTimeout(() => {
-            this.appleLoad = false
-          }, 1000)
-        } else this.errorSnack(this.ssoLang[this.appLanguage].unexpected_err)
-      } else {
-        this.appleLoad = false
-        EventBus.$emit('ssoEvent', {name: 'setLoading', data: false})
-      }
-    }
-  }
-}
+				const [err, response] = await to(AuthService.appleSDK(user.response, this.$storex));
+				if (err) {
+					this.appleLoad = false;
+					EventBus.$emit('ssoEvent', { name: 'setLoading', data: false });
+					return this.errorHandler(err);
+				}
+				if (response.data.success) {
+					if (this.display === 'popup') {
+						return window.parent?.postMessage({ code: response.data.auth_code, state: this.$route.query.state }, '*');
+					}
+					await this.loginSetup(response);
+					await this.getLoggedInAccounts();
+					this.loginSuccess({ ...response, isModal: this.isModal });
+					setTimeout(() => {
+						this.appleLoad = false;
+					}, 1000);
+				} else this.errorSnack(this.ssoLang[this.appLanguage].unexpected_err);
+			} else {
+				this.appleLoad = false;
+				EventBus.$emit('ssoEvent', { name: 'setLoading', data: false });
+			}
+		}
+	}
+};

package/src/mixins/auth.mixin.js

@@ -1,6 +1,6 @@
 import { createNamespacedHelpers } from 'vuex';
 const { mapState, mapActions, mapGetters } = createNamespacedHelpers('auth');
-import GlobalMixin from './global.mixin'
+import GlobalMixin from './global.mixin';
 
 export default {
   mixins: [GlobalMixin],
@@ -64,6 +64,7 @@ export default {
       'setRedirectUri',
       'setDisplay',
       'setState',
+      'setRealm',
       'setResponseType',
       'switchAccount',
       'loginSetup',
@@ -78,7 +79,7 @@ export default {
         if (this.$route.query.display) this.setDisplay(this.$route.query.display);
         if (this.$route.query.state) this.setState(this.$route.query.state)
         if (this.$route.query.response_type) this.setResponseType(this.$route.query.response_type);
-        if (this.$route.query.realm && this.$storage) this.setRealm(this.$route.query.realm);
+        if (this.$route.query.realm) this.setRealm(this.$route.query.realm);
       },
       deep: true,
     },

package/src/mixins/global.mixin.js

@@ -30,10 +30,10 @@ export default {
   },
   methods: {
     getIcon(icon) {
-      if (!this.isNative && false) {
+      if (!this.isNative) {
         return 'https://cdn.tapni.co/icons/' + icon;
       } else {
-        return `http://localhost:7777/icons/${icon}`;
+        return `/icons/${icon}`;
       }
     },
     errorHandler(error) {