@tapni/auth 1.0.46 → 1.0.48

package/dist/install.css

@@ -0,0 +1 @@
+.app-store-icon[data-v-cb61958b]{box-shadow:0 4px 10px #00000017;border-radius:12px}#codeInput[data-v-7d5cdeb9],#emailInput[data-v-7d5cdeb9]{text-align:center;padding-right:15%;font-size:17px}.firstRow img[data-v-a8c1558d]{width:25px;height:25px;position:absolute;top:50%;right:0;transform:translate(-50%,-50%)}.tapni-auth-general .vue-select{padding:5px 0}.tapni-auth-general .vue-select .dropdown-icon{color:#1d1d1d;width:25px!important;height:25px!important}.tapni-auth-general .vue-select .menu-option:hover{background-color:#d9d9d9}.tapni-auth-general .vue-select .menu-option.focused{background-color:#f4f4f4}.tapni-auth-general .vue-select .menu-option{border-bottom:1px solid #D9D9D9;font-size:15px;color:#151515}.tapni-auth-general .vue-select .menu-option:last-child{border-bottom:none}.tapni-auth-general .vue-select .menu{border-radius:10px;border:none}.tapni-auth-general .vue-select .control.focused{border:none;box-shadow:none}.tapni-auth-general .vue-select .control{min-height:54px!important;background-color:#f4f4f4;border:none;border-radius:10px}.tapni-auth-general .vue-select .menu-option.selected{background-color:#e4e4e4}.tapni-auth-general .vue-select .indicators-container{padding:5px 15px!important}.tapni-auth-general .vue-select .value-container{padding:5px 15px}.tapni-auth-general .vue-select .menu-option{background-color:#f4f4f4}#emailInput[data-v-707a4b16]{text-align:center;padding-right:15%;font-size:17px}html *{font-family:Inter,sans-serif}#bodyId{padding-top:3%;max-width:667px!important;margin:1.5% auto auto;height:95%!important;border-radius:20px}.action-block-top .default-text,.action-block-top .default-text:after{border-radius:50%;width:10em!important;height:10em!important}.action-block-top .default-text{margin:10px auto;font-size:3px;position:relative;text-indent:-9999em;border-left:.5em solid #000000;border-top:.5em solid rgba(0,0,0,.2);border-right:.5em solid rgba(0,0,0,.2);border-bottom:.5em solid rgba(0,0,0,.2);-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load8 1.1s infinite linear;animation:load8 1.1s infinite linear}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.smartbanner-ios{background:linear-gradient(to bottom,#f4f4f4,#f4f4f4);box-shadow:0 0 #fff;border-bottom:1px solid #dddddd}.smartbanner-icon{border-radius:16px}.smartbanner-ios .smartbanner-button{font-size:13px;padding:9px 0;height:40px;border-radius:13px;background:#f4f4f4;color:#0a99d2;border:none;box-shadow:none;text-transform:uppercase}.snack-body{display:none;border-radius:40px;font-size:15px!important}#errorSnack{background-color:#fee3e3!important;border:2px solid #edd9d9!important;color:#000}#successSnack{background-color:#eff5eb!important;border:2px solid #e3ecd7!important;color:#000}.grecaptcha-badge{visibility:hidden}.header-logo{position:absolute;left:50%;transform:translate(-50%,-50%);margin-top:0;z-index:2}.header-logo-img{height:40px;margin-top:10px}@media (max-width: 768px){#bodyId{margin-top:0;border-radius:0;height:100%!important}.header-logo{margin-top:15px}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tapni/auth",
-  "version": "1.0.46",
+  "version": "1.0.48",
   "type": "module",
   "main": "./dist/TapniAuth.umd.js",
   "module": "./dist/TapniAuth.es.js",
@@ -64,4 +64,4 @@
     "vite": "^5.4.11",
     "vite-plugin-node-polyfills": "^0.22.0"
   }
-}
+}

package/src/App.vue

@@ -17,11 +17,11 @@ document.addEventListener('DOMContentLoaded', function() {
 
     <AuthWelcome v-if="initialized && renderView === 'AuthWelcome'" />
     <AuthLogin v-else-if="initialized && renderView === 'AuthLogin'" :isModal="isModal" />
-    <AuthGeneral v-else-if="initialized && renderView === 'AuthGeneral'" :isModal="isModal" />
+    <AuthGeneral v-else-if="initialized && renderView === 'AuthGeneral'" :isModal="isModal" @update:viewProp="setView" />
     <AuthAccount v-else-if="initialized && renderView === 'AuthAccount'" :isModal="isModal" @update:viewProp="setView" />
     <AuthRegister v-else-if="initialized && renderView === 'AuthRegister'" :isModal="isModal" />
     <AuthVerify v-else-if="initialized && renderView === 'AuthVerify'" :isModal="isModal" />
-    <AuthSecurity v-else-if="initialized && renderView === 'AuthSecurity'" :isModal="isModal" :payload="payload" />
+    <AuthSecurity v-else-if="initialized && renderView === 'AuthSecurity'" :isModal="isModal" :payload="payload" @update:viewProp="setView" />
     <AuthReset v-else-if="initialized && renderView === 'AuthReset'" />
     <AuthCallback v-else-if="initialized && renderView === 'AuthCallback'" />
     <RouterView v-else-if="display !== 'npm'" />

package/src/services/UserService.js

@@ -45,5 +45,8 @@ export default {
 	},
 	loginUsingQR(data) {
 		return api().post('/users/qr/login', data);
+	},
+	updateAccount(data) {
+		return api().put('/accounts/me', data);
 	}
 };

package/src/views/Account.vue

@@ -152,7 +152,7 @@
       </router-link>
 
 
-      <div class="settingRow" @click="logoutAccount">
+      <div v-if="!isModal" class="settingRow" @click="logoutAccount">
         <div class="firstRow">
           <img
               :src="getIcon('logout-red.svg')"

package/src/views/General.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="page-login content-boxed content-boxed-padding">
+    <div class="page-login content-boxed content-boxed-padding tapni-auth-general">
         <a v-if="isModal" @click="close" class="color-black pull-right pointer" style="margin-top: 0px; position: absolute; right: -20px; text-align: right;">
           <i class="font-17 color-black">
             <img src="https://cdn.tapni.co/icons/down-arrow.png" class="responsive-image" style="width: 35%;"/>
@@ -7,7 +7,16 @@
         </a>
       <div class="subheaderContainer full-top">
         <!-- Back Button -->
-        <router-link v-if="!isModal" to="/account" class="button gray-button pointer left-button">
+        <div v-if="isModal" class="button gray-button pointer left-button" @click="$emit('update:viewProp', 'AuthAccount')">
+          <img
+              :src="getIcon('arrow-gray-right.svg')"
+              height="20"
+              width="20"
+              class="btn-icon"
+              style="rotate: 180deg;"
+          />
+        </div>
+        <router-link v-else to="/account" class="button gray-button pointer left-button">
           <img
               :src="getIcon('arrow-gray-right.svg')"
               height="20"
@@ -48,6 +57,7 @@
               { label: 'Mauritius', value: 'mu' },
               { label: 'Colombia', value: 'co' },
               { label: 'Serbia', value: 'sr' },
+              { label: 'Singapore', value: 'sg' },
               { label: 'China', value: 'cn' },
             ]"
               :isClearable="false"
@@ -90,7 +100,7 @@
 
 <script>
 import AuthMixin from "../mixins/auth.mixin";
-import AuthService from '../services/AuthService'
+import UserService from '../services/UserService'
 import to from "await-to-js";
 import {EventBus} from "@/store/event-bus.js";
 import VueSelect from "vue3-select-component";
@@ -102,6 +112,10 @@ export default {
     VueSelect
   },
   props: {
+    isModal: {
+      type: Boolean,
+      default: false
+    },
     payload: {
       type: Object,
       default: {}
@@ -121,73 +135,90 @@ export default {
       EventBus.$emit('ssoEvent', {name: 'toggleAuthModal', data: true})
     },
     async submitGeneralUpdate () {
-      if (this.password.length < 8) return this.errorSnack(this.ssoLang[this.appLanguage].password_8_chars)
-
       this.loading = true;
-      const result = await this.newPassword({
-
-      })
-      if (result === true) {
-        this.successSnack(this.ssoLang[this.appLanguage].password_change_success)
-        this.changePassword = false;
+      
+      const data = {
+        name: this.account.name,
+        lang: this.account.lang,
+        billing: this.account.billing ? {
+          region: this.account.billing.region
+        } : undefined
+      };
+
+      const [err, response] = await to(UserService.updateAccount(data));
+      
+      if (err) {
+        this.errorHandler(err);
+      } else if (response.data.success) {
+        this.successSnack(this.ssoLang[this.appLanguage].profile_update_success);
+        await this.getAccountSettings();
       }
+
       this.loading = false;
     },
   }
 };
 </script>
 
-<style scoped>
-:deep(.vue-select) {
+<style>
+.tapni-auth-general .vue-select {
   padding: 5px 0;
 }
 
-:deep(.vue-select .dropdown-icon) {
+.tapni-auth-general .vue-select .dropdown-icon {
   color: #1d1d1d;
   width: 25px!important;
   height: 25px!important;
 }
-:deep(.vue-select .menu-option:hover) {
+
+.tapni-auth-general .vue-select .menu-option:hover {
   background-color: #D9D9D9;
 }
-:deep(.vue-select .menu-option.focused) {
+
+.tapni-auth-general .vue-select .menu-option.focused {
   background-color: #f4f4f4;
 }
-:deep(.vue-select .menu-option) {
+
+.tapni-auth-general .vue-select .menu-option {
   border-bottom: 1px solid #D9D9D9;
   font-size: 15px;
   color: #151515;
 }
-:deep(.vue-select .menu-option:last-child) {
+
+.tapni-auth-general .vue-select .menu-option:last-child {
   border-bottom: none;
 }
 
-:deep(.vue-select .menu) {
+.tapni-auth-general .vue-select .menu {
   border-radius: 10px;
   border: none;
 }
-:deep(.vue-select .control.focused) {
+
+.tapni-auth-general .vue-select .control.focused {
   border: none;
   box-shadow: none;
 }
-:deep(.vue-select .control) {
+
+.tapni-auth-general .vue-select .control {
   min-height: 54px!important;
   background-color: #F4F4F4;
   border: none;
   border-radius: 10px;
 }
 
-:deep(.vue-select .menu-option.selected) {
+.tapni-auth-general .vue-select .menu-option.selected {
   background-color: #E4E4E4;
 }
-:deep(.vue-select .indicators-container) {
+
+.tapni-auth-general .vue-select .indicators-container {
   padding: 5px 15px!important
 }
-:deep(.vue-select .value-container) {
+
+.tapni-auth-general .vue-select .value-container {
   padding: 5px 15px;
 }
 
-:deep(.vue-select .menu-option) {
+.tapni-auth-general .vue-select .menu-option {
   background-color: #f4f4f4;
 }
 </style>

package/src/views/Security.vue

@@ -7,7 +7,16 @@
         </a>
       <div class="subheaderContainer full-top">
         <!-- Back Button -->
-        <router-link v-if="!isModal" to="/account" class="button gray-button pointer left-button">
+        <div v-if="isModal" class="button gray-button pointer left-button" @click="$emit('update:viewProp', 'AuthAccount')">
+          <img
+              :src="getIcon('arrow-gray-right.svg')"
+              height="20"
+              width="20"
+              class="btn-icon"
+              style="rotate: 180deg;"
+          />
+        </div>
+        <router-link v-else to="/account" class="button gray-button pointer left-button">
           <img
               :src="getIcon('arrow-gray-right.svg')"
               height="20"

package/dist/style.css

@@ -1 +0,0 @@
-.app-store-icon[data-v-cb61958b]{box-shadow:0 4px 10px #00000017;border-radius:12px}#codeInput[data-v-7d5cdeb9],#emailInput[data-v-7d5cdeb9]{text-align:center;padding-right:15%;font-size:17px}.firstRow img[data-v-6037b00e]{width:25px;height:25px;position:absolute;top:50%;right:0;transform:translate(-50%,-50%)}[data-v-9dc93691] .vue-select{padding:5px 0}[data-v-9dc93691] .vue-select .dropdown-icon{color:#1d1d1d;width:25px!important;height:25px!important}[data-v-9dc93691] .vue-select .menu-option:hover{background-color:#d9d9d9}[data-v-9dc93691] .vue-select .menu-option.focused{background-color:#f4f4f4}[data-v-9dc93691] .vue-select .menu-option{border-bottom:1px solid #D9D9D9;font-size:15px;color:#151515}[data-v-9dc93691] .vue-select .menu-option:last-child{border-bottom:none}[data-v-9dc93691] .vue-select .menu{border-radius:10px;border:none}[data-v-9dc93691] .vue-select .control.focused{border:none;box-shadow:none}[data-v-9dc93691] .vue-select .control{min-height:54px!important;background-color:#f4f4f4;border:none;border-radius:10px}[data-v-9dc93691] .vue-select .menu-option.selected{background-color:#e4e4e4}[data-v-9dc93691] .vue-select .indicators-container{padding:5px 15px!important}[data-v-9dc93691] .vue-select .value-container{padding:5px 15px}[data-v-9dc93691] .vue-select .menu-option{background-color:#f4f4f4}#emailInput[data-v-707a4b16]{text-align:center;padding-right:15%;font-size:17px}html *{font-family:Inter,sans-serif}#bodyId{padding-top:3%;max-width:667px!important;margin:1.5% auto auto;height:95%!important;border-radius:20px}.action-block-top .default-text,.action-block-top .default-text:after{border-radius:50%;width:10em!important;height:10em!important}.action-block-top .default-text{margin:10px auto;font-size:3px;position:relative;text-indent:-9999em;border-left:.5em solid #000000;border-top:.5em solid rgba(0,0,0,.2);border-right:.5em solid rgba(0,0,0,.2);border-bottom:.5em solid rgba(0,0,0,.2);-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:load8 1.1s infinite linear;animation:load8 1.1s infinite linear}@-webkit-keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.smartbanner-ios{background:linear-gradient(to bottom,#f4f4f4,#f4f4f4);box-shadow:0 0 #fff;border-bottom:1px solid #dddddd}.smartbanner-icon{border-radius:16px}.smartbanner-ios .smartbanner-button{font-size:13px;padding:9px 0;height:40px;border-radius:13px;background:#f4f4f4;color:#0a99d2;border:none;box-shadow:none;text-transform:uppercase}.snack-body{display:none;border-radius:40px;font-size:15px!important}#errorSnack{background-color:#fee3e3!important;border:2px solid #edd9d9!important;color:#000}#successSnack{background-color:#eff5eb!important;border:2px solid #e3ecd7!important;color:#000}.grecaptcha-badge{visibility:hidden}.header-logo{position:absolute;left:50%;transform:translate(-50%,-50%);margin-top:0;z-index:2}.header-logo-img{height:40px;margin-top:10px}@media (max-width: 768px){#bodyId{margin-top:0;border-radius:0;height:100%!important}.header-logo{margin-top:15px}}.withBackground[data-v-2f7f5584],.withBackground[data-v-4d3e1bec],.withBackground[data-v-36b27d1f]{height:50px}