@tapni/auth 0.0.170 → 0.0.172

package/src/store/store.js

@@ -1,8 +1,8 @@
-import { createStore } from 'vuex'
-import auth from './auth.js'
+import { createStore } from 'vuex';
+import auth from './auth.js';
 
 export default createStore({
-  modules: {
-    auth
-  },
-})
+	modules: {
+		auth
+	}
+});

package/src/views/Account.vue

@@ -1,239 +1,201 @@
 <template>
-  <div class="page-login content-boxed content-boxed-padding center-text" style="margin-top: -1px; overflow: hidden; border: solid 0px #ffffff;">
-    <br>
-    <h1 class="bold full-top no-bottom center-text">{{ssoLang[appLanguage].welcome}}</h1>
-    <p class="full-bottom half-top center-text color-black font-16">{{account.email}}</p>
-
-    <div v-if="display !== 'npm' && false" class="full-top full-bottom">
-      <a @click="continueTo('app')" class="button-center button button-90 google-button bg-tapni-grey pointer">
-        <span> {{ssoLang[appLanguage].continue}} </span>
-      </a>
-
-      <div class="page-login-links center-text">
-        <a @click="continueTo('admin')">Looking for Admin Dashboard? <b>{{ssoLang[appLanguage].click_here}}</b></a>
-        <div class="clear"></div>
-      </div>
-    </div>
-
-    <div class="container">
-      <div v-if="false" class="accountCard pointer" @click="expanded = !expanded">
-        <div class="activeAccount">
-          <div class="left" v-if="$storex.username">
-            <img
-                :src="loggedInAccounts[$storex.username]?.photo"
-                :alt="loggedInAccounts[$storex.username]?.name"
-                style="width: 50px; border-radius: 20px"
-            />
-          </div>
-          <div class="middle" v-if="$storex.username">
-            <h4>{{ loggedInAccounts[$storex.username]?.name }}</h4>
-            <div>@{{ $storex.username }}</div>
-          </div>
-          <div class="right" v-show="addAccountReady">
-            <img
-                src="https://cdn.tapni.co/icons/newArrowRight.svg"
-                alt="Right arrow"
-                :style="{ transform: expanded ? 'rotate(90deg)' : '' }"
-            />
-          </div>
-        </div>
-        <div class="otherAccounts" v-if="expanded && loggedInAccounts">
-          <template v-for="(username, index) in Object.keys(loggedInAccounts)">
-            <div
-                class="activeAccount"
-                :key="index"
-                v-if="username !== $storex.username"
-                @click="switchAccount(username)"
-            >
-              <div class="left">
-                <img
-                    :src="loggedInAccounts[username].photo"
-                    :alt="loggedInAccounts[username].name"
-                    style="width: 50px; border-radius: 20px"
-                />
-              </div>
-              <div class="middle">
-                <h4>{{ loggedInAccounts[username].name }}</h4>
-                <div>@ {{ username }}</div>
-              </div>
-            </div>
-          </template>
-          <div class="activeAccount newAccount" @click="addAccount">
-            <div class="left">
-              <img
-                  src="https://cdn.tapni.co/icons/Add.png"
-                  style="width: 50px; border-radius: 20px"
-              />
-            </div>
-            <div class="middle">
-              <h4>{{ssoLang[appLanguage].add_account }}</h4>
-            </div>
-            <div class="right">
-              <img
-                  src="https://cdn.tapni.co/icons/Plus.png"
-                  width="30px"
-              />
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="settingsCard pointer left-text">
-        <div class="device" @click="toggleAccountSettingsModal">
-          <div class="left">
-            <img
-                src="https://cdn.tapni.co/icons/newSettings.svg"
-                style="width: 50px; border-radius: 20px"
-            />
-          </div>
-          <div class="middle">
-            <h4>{{ssoLang[appLanguage].mfa }}</h4>
-          </div>
-          <div class="right">
-            <img
-                src="https://cdn.tapni.co/icons/newArrowRight.svg"
-            />
-          </div>
-        </div>
-
-        <div class="divider"></div>
-
-        <div class="device" @click="toggleLanguageModal">
-          <div class="left">
-            <img
-                src="https://cdn.tapni.co/icons/newPublicProfile.svg"
-                style="width: 50px; border-radius: 20px"
-            />
-          </div>
-          <div class="middle">
-            <h4>{{ssoLang[appLanguage].change_language }}</h4>
-          </div>
-          <div class="right">
-            <img
-                src="https://cdn.tapni.co/icons/newArrowRight.svg"
-            />
-          </div>
-        </div>
-
-        <div class="divider"></div>
-
-        <div class="device" @click="logoutAccount">
-          <div class="left">
-            <img
-                src="https://cdn.tapni.co/icons/newLogout.svg"
-                style="width: 50px; border-radius: 20px"
-            />
-          </div>
-          <div class="middle">
-            <h4>{{ssoLang[appLanguage].logout }}</h4>
-          </div>
-          <div class="right">
-            <img
-                src="https://cdn.tapni.co/icons/newArrowRight.svg"
-            />
-          </div>
-        </div>
-
-        <!-- Additional items can be added here in the future -->
-        <div v-if="false" class="moreFooter">
-          <p class="app-version" style="margin-top: 10px">
-            {{ssoLang[appLanguage].version }}: {{ appVersion }}
-          </p>
-          <h4 v-if="false">{{ssoLang[appLanguage].terms_and_privacy }}</h4>
-        </div>
-      </div>
-    </div>
-  </div>
+	<div class="page-login content-boxed content-boxed-padding center-text" style="margin-top: -1px; overflow: hidden; border: solid 0px #ffffff">
+		<br />
+		<h1 class="bold full-top no-bottom center-text">{{ ssoLang[appLanguage].welcome }}</h1>
+		<p class="full-bottom half-top center-text color-black font-16">{{ account.email }}</p>
+
+		<div v-if="display !== 'npm' && false" class="full-top full-bottom">
+			<a @click="continueTo('app')" class="button-center button button-90 google-button bg-tapni-grey pointer">
+				<span> {{ ssoLang[appLanguage].continue }} </span>
+			</a>
+
+			<div class="page-login-links center-text">
+				<a @click="continueTo('admin')"
+					>Looking for Admin Dashboard? <b>{{ ssoLang[appLanguage].click_here }}</b></a
+				>
+				<div class="clear"></div>
+			</div>
+		</div>
+
+		<div class="container">
+			<div v-if="false" class="accountCard pointer" @click="expanded = !expanded">
+				<div class="activeAccount">
+					<div class="left" v-if="$storex.username">
+						<img :src="loggedInAccounts[$storex.username]?.photo" :alt="loggedInAccounts[$storex.username]?.name" style="width: 50px; border-radius: 20px" />
+					</div>
+					<div class="middle" v-if="$storex.username">
+						<h4>{{ loggedInAccounts[$storex.username]?.name }}</h4>
+						<div>@{{ $storex.username }}</div>
+					</div>
+					<div class="right" v-show="addAccountReady">
+						<img src="https://cdn.tapni.co/icons/newArrowRight.svg" alt="Right arrow" :style="{ transform: expanded ? 'rotate(90deg)' : '' }" />
+					</div>
+				</div>
+				<div class="otherAccounts" v-if="expanded && loggedInAccounts">
+					<template v-for="(username, index) in Object.keys(loggedInAccounts)">
+						<div class="activeAccount" :key="index" v-if="username !== $storex.username" @click="switchAccount(username)">
+							<div class="left">
+								<img :src="loggedInAccounts[username].photo" :alt="loggedInAccounts[username].name" style="width: 50px; border-radius: 20px" />
+							</div>
+							<div class="middle">
+								<h4>{{ loggedInAccounts[username].name }}</h4>
+								<div>@ {{ username }}</div>
+							</div>
+						</div>
+					</template>
+					<div class="activeAccount newAccount" @click="addAccount">
+						<div class="left">
+							<img src="https://cdn.tapni.co/icons/Add.png" style="width: 50px; border-radius: 20px" />
+						</div>
+						<div class="middle">
+							<h4>{{ ssoLang[appLanguage].add_account }}</h4>
+						</div>
+						<div class="right">
+							<img src="https://cdn.tapni.co/icons/Plus.png" width="30px" />
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="settingsCard pointer left-text">
+				<div class="device" @click="toggleAccountSettingsModal">
+					<div class="left">
+						<img src="https://cdn.tapni.co/icons/newSettings.svg" style="width: 50px; border-radius: 20px" />
+					</div>
+					<div class="middle">
+						<h4>{{ ssoLang[appLanguage].mfa }}</h4>
+					</div>
+					<div class="right">
+						<img src="https://cdn.tapni.co/icons/newArrowRight.svg" />
+					</div>
+				</div>
+
+				<div class="divider"></div>
+
+				<div class="device" @click="toggleLanguageModal">
+					<div class="left">
+						<img src="https://cdn.tapni.co/icons/newPublicProfile.svg" style="width: 50px; border-radius: 20px" />
+					</div>
+					<div class="middle">
+						<h4>{{ ssoLang[appLanguage].change_language }}</h4>
+					</div>
+					<div class="right">
+						<img src="https://cdn.tapni.co/icons/newArrowRight.svg" />
+					</div>
+				</div>
+
+				<div class="divider"></div>
+
+				<div class="device" @click="logoutAccount">
+					<div class="left">
+						<img src="https://cdn.tapni.co/icons/newLogout.svg" style="width: 50px; border-radius: 20px" />
+					</div>
+					<div class="middle">
+						<h4>{{ ssoLang[appLanguage].logout }}</h4>
+					</div>
+					<div class="right">
+						<img src="https://cdn.tapni.co/icons/newArrowRight.svg" />
+					</div>
+				</div>
+
+				<!-- Additional items can be added here in the future -->
+				<div v-if="false" class="moreFooter">
+					<p class="app-version" style="margin-top: 10px">{{ ssoLang[appLanguage].version }}: {{ appVersion }}</p>
+					<h4 v-if="false">{{ ssoLang[appLanguage].terms_and_privacy }}</h4>
+				</div>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script>
-import AuthMixin from "../mixins/auth.mixin";
-import { EventBus } from "../store/event-bus.js";
-import AuthService from "../services/AuthService.js";
+import AuthMixin from '../mixins/auth.mixin';
+import { EventBus } from '../store/event-bus.js';
+import AuthService from '../services/AuthService.js';
 export default {
-  mixins: [AuthMixin],
-  data () {
-    return {
-      expanded: false,
-      addAccountReady: false,
-      appVersion: import.meta.env.APP_VERSION,
-    }
-  },
-  async mounted () {
-    if (!this.isLoggedIn) {
-      return this.$router.push('/');
-    }
-    this.getAccountSettings();
-  },
-  methods: {
-    continueTo (realm) {
-      console.log('continue to ' + realm);
-    },
-    addAccount () {
-      this.$router.push('/login');
-    },
-    switchAccount (username) {
-      console.log('switch', username);
-    },
-    toggleAccountSettingsModal () {
-      this.$router.push('/mfa');
-      // EventBus.$emit('toggleAccountSettingsModal')
-    },
-    toggleLanguageModal () {
-      EventBus.$emit('toggleSSOLanguageModal')
-    },
-    logoutAccount () {
-      this.logout({ refreshToken: this.refreshTokens[0], sendRequest: true })
-    },
-  }
+	mixins: [AuthMixin],
+	data() {
+		return {
+			expanded: false,
+			addAccountReady: false,
+			appVersion: import.meta.env.APP_VERSION
+		};
+	},
+	async mounted() {
+		if (!this.isLoggedIn) {
+			return this.$router.push('/');
+		}
+		this.getAccountSettings();
+	},
+	methods: {
+		continueTo(realm) {
+			console.log('continue to ' + realm);
+		},
+		addAccount() {
+			this.$router.push('/login');
+		},
+		switchAccount(username) {
+			console.log('switch', username);
+		},
+		toggleAccountSettingsModal() {
+			this.$router.push('/mfa');
+			// EventBus.$emit('toggleAccountSettingsModal')
+		},
+		toggleLanguageModal() {
+			EventBus.$emit('toggleSSOLanguageModal');
+		},
+		logoutAccount() {
+			this.logout({ refreshToken: this.refreshTokens[0], sendRequest: true });
+		}
+	}
 };
 </script>
 
 <style scoped>
 .container {
-  padding: 20px !important;
-  display: flex;
-  flex-direction: column;
-  gap: 20px;
-  padding-bottom: 100px !important;
+	padding: 20px !important;
+	display: flex;
+	flex-direction: column;
+	gap: 20px;
+	padding-bottom: 100px !important;
 }
 .settingsCard {
-  background-color: white;
-  padding: 20px;
-  border-radius: 26px;
-  align-items: center;
+	background-color: white;
+	padding: 20px;
+	border-radius: 26px;
+	align-items: center;
 }
 
 .device {
-  display: flex;
-  align-items: center;
+	display: flex;
+	align-items: center;
 }
 
 h4 {
-  margin-left: 20px;
-  font-weight: bold;
+	margin-left: 20px;
+	font-weight: bold;
 }
 
 .middle {
-  flex: 1;
+	flex: 1;
 }
 
 .left img {
-  background-color: #f7f8f9;
-  border-radius: 20px;
-  padding: 10px;
+	background-color: #f7f8f9;
+	border-radius: 20px;
+	padding: 10px;
 }
 
 .divider {
-  height: 1px;
-  background-color: #f0f0f0;
-  margin: 20px 0;
+	height: 1px;
+	background-color: #f0f0f0;
+	margin: 20px 0;
 }
 
 .moreFooter {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 10px;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 0 10px;
 }
 </style>

package/src/views/Callback.vue

@@ -1,46 +1,49 @@
 <template>
- <div class="page-login content-boxed content-boxed-padding">
-   <h5 v-if="($route.query.platform ==='android' || $route.query.platform ==='ios') && !isNative" style="text-align: center; width: 80%; margin: 0 auto; margin-top: 260px; ">
-       {{ssoLang[this.appLanguage].you_will_be_redirected}}<br>
-       {{ssoLang[this.appLanguage].if_redirect_not_directly}}, <span @click="inAppRedirect" style="color: blue; cursor: pointer">{{ssoLang[this.appLanguage].click_here}}</span>.</h5>
-   <h4 v-else style="text-align: center; width: 80%; margin: 0 auto; margin-top: 260px; ">{{ssoLang[this.appLanguage].please_wait}}</h4>
- </div>
+	<div class="page-login content-boxed content-boxed-padding">
+		<h5 v-if="($route.query.platform === 'android' || $route.query.platform === 'ios') && !isNative" style="text-align: center; width: 80%; margin: 0 auto; margin-top: 260px">
+			{{ ssoLang[this.appLanguage].you_will_be_redirected }}<br />
+			{{ ssoLang[this.appLanguage].if_redirect_not_directly }}, <span @click="inAppRedirect" style="color: blue; cursor: pointer">{{ ssoLang[this.appLanguage].click_here }}</span
+			>.
+		</h5>
+		<h4 v-else style="text-align: center; width: 80%; margin: 0 auto; margin-top: 260px">{{ ssoLang[this.appLanguage].please_wait }}</h4>
+	</div>
 </template>
 
 <script>
 /* eslint-disable */
-import OktaMixin from "../mixins/okta.mixin";
-import SamlMixin from "../mixins/saml.mixin";
-import AuthMixin from "../mixins/auth.mixin";
+import OktaMixin from '../mixins/okta.mixin';
+import SamlMixin from '../mixins/saml.mixin';
+import AuthMixin from '../mixins/auth.mixin';
 import { sanitizeUrl } from '@braintree/sanitize-url';
 export default {
-  name: "AuthCallback",
-  mixins: [OktaMixin, SamlMixin, AuthMixin],
+	name: 'AuthCallback',
+	mixins: [OktaMixin, SamlMixin, AuthMixin],
 
-  data() {
-    return {
+	data() {
+		return {};
+	},
 
-    };
-  },
-
-  async mounted() {
-    if(this.$route.path === '/callback/auth') {
-        this.exchangeAuthCode({
-            code: this.$route.query.code
-        })
-    }
-    if(this.$route.path === '/callback/okta') return await this.handleOktaRedirect();
-    if(this.$route.path === '/callback/saml') return await this.handleSamlRedirect();
-  },
-  methods: {
-    inAppRedirect() {
-      let url = sanitizeUrl(location.href);
-      url = url.replace('http', 'tapni')
-      url = url.replace('https', 'tapni')
-      return window.open(url);
+	async mounted() {
+		if (this.$route.path === '/callback/redirect') {
+      return location.href = atob(this.$route.query.uri);
     }
-  },
-
+		if (this.$route.path === '/callback/auth') {
+			this.exchangeAuthCode({
+				code: this.$route.query.code,
+        code_verifier: this.$route.query.code_verifier
+			});
+		}
+		if (this.$route.path === '/callback/okta') return await this.handleOktaRedirect();
+		if (this.$route.path === '/callback/saml') return await this.handleSamlRedirect();
+	},
+	methods: {
+		inAppRedirect() {
+			let url = sanitizeUrl(location.href);
+			url = url.replace('http', 'tapni');
+			url = url.replace('https', 'tapni');
+			return window.open(url);
+		}
+	}
 };
 </script>