@ozdao/martyrs 0.2.585 → 0.2.587

package/src/modules/auth/views/components/pages/EnterCode.vue

@@ -1,204 +0,0 @@
-<template>
-	<section class="t-center pd-medium">
-		<!-- <img loading="lazy" src="@/assets/icons/message1.png" class="i-extra mn-b-small"> -->
-
-		<h3 class="mn-b-medium">
-			{{ route.query.type === 'email' ? t('auth.enterCode.verifyEmailTitle') : t('auth.enterCode.verifyNumberTitle') }}
-		</h3>
-
-		<p class="mn-b-big t-transp">{{ route.query.type === 'email' ? t('auth.enterCode.instructionsEmail') : t('auth.enterCode.instructions') }}</p>
-
-		<div class="w-100 mn-b-big flex-nowrap flex">
-      		<input 
-      			type="number" 
-      			v-model="state.digits[0]" 
-      			ref="firstInput" 
-      			maxlength="1" 
-      			@input="onInput(0)" 
-      			@paste="($event) => onPaste($event, 0)" 
-      			@keydown="($event) => onKeyDown($event, 0)" 
-      			class="w-100 h1 pd-small t-center bg-light radius-small mn-r-small"
-      		>
-			<input 
-				type="number" 
-				v-model="state.digits[1]" 
-				maxlength="1" 
-				@input="onInput(1)" 
-				@paste="($event) => onPaste($event, 1)" 
-				@keydown="($event) => onKeyDown($event, 1)" 
-				class="w-100 h1 pd-small t-center bg-light radius-small mn-r-small"
-			>
-			<input 
-				type="number" 
-				v-model="state.digits[2]" 
-				maxlength="1" 
-				@input="onInput(2)" 
-				@paste="($event) => onPaste($event, 2)" 
-				@keydown="($event) => onKeyDown($event, 2)" 
-				class="w-100 h1 pd-small t-center bg-light radius-small mn-r-small"
-			>
-			<input 
-				type="number" 
-				v-model="state.digits[3]" 
-				maxlength="1" 
-				@input="onInput(3)" 
-				@paste="($event) => onPaste($event, 3)" 
-				@keydown="($event) => onKeyDown($event, 3)" 
-				class="w-100 h1 pd-small t-center bg-light radius-small"
-			>
-    	</div>
-
-		<a v-if="resendTimer < 1" @click="sendAgain" class="t-blue">
-			{{ t('auth.enterCode.resendCode') }}
-		</a>
-
-		<span v-else>
-			{{resendTimer}} {{ t('auth.enterCode.secondsResend') }}
-		</span>
-	</section>
-</template>
-
-<script setup>
-	// Import components
-	import Field from '@martyrs/src/components/Field/Field.vue'
-	// Import libs
-	import { computed,reactive,ref, onMounted, onBeforeMount, watch } from 'vue'
-	import { useRoute,useRouter } from 'vue-router'
-	import { useI18n } from 'vue-i18n'
-	// Import state
-	import * as auth 	from '@martyrs/src/modules/auth/views/store/auth.js'
-	import * as twofa 	from '@martyrs/src/modules/auth/views/store/twofa.js'
-	import { setError } from '@martyrs/src/modules/core/views/store/core.store.js'
-	
-	const route = useRoute()
-	const router = useRouter()
-
-	// Localization
-	// Localization
-	const { t } = useI18n({
-		useScope: 'global', 
-	})
-	
-	const state = reactive({
-	  digits: ['', '', '', ''],
-	  error: null,
-	});
-
-	watch(
-	    () => state.digits[0],
-	    (newVal) => {
-	        if (newVal && String(newVal).length > 1) {
-	            let newValArray = String(newVal).split('');
-	            console.log(newValArray);
-
-	            let newDigits = [...state.digits];
-	            newValArray.forEach((digit, i) => {
-	                console.log(i);
-	                console.log(newDigits[i]);
-	                console.log(digit);
-	                newDigits[i] = digit;
-	            });
-
-	            state.digits = newDigits;
-
-	            onInput(3);
-	        }
-	    }
-	);
-
-	const firstInput = ref(null);
-
-	const resendTimer = ref(0);
-
-	async function sendAgain () {
-		try {
-		  	await twofa.sendCode(
-		  		auth.state.user, 
-		  		route.query.method, 
-		  		route.query.type, 
-		  	)
-
-		  	resendTimer.value = 30;
-
-	     	// Start the timer using `setInterval()`
-	      	const timer = setInterval(() => {
-		        if (resendTimer.value > 0) {
-		          // Decrement the timer by 1 second
-		          resendTimer.value -= 1;
-		        } else {
-		          // Stop the timer when it reaches 0 seconds
-		          clearInterval(timer);
-		        }
-		     }, 1000);
-	  } catch (error) {
-			setError({ response: {data: { errorCode: "CODE_NOT_SENT"}}})
-		}
-	}
-
-
-	const onKeyDown = (event, index) => {
-	    if (event.key === "Backspace" && (state.digits[index] === null || state.digits[index] === undefined || state.digits[index] === '')) {
-	        event.preventDefault();
-
-	        const inputs = document.querySelectorAll('input');
-	        const prevInput = index > 0 ? inputs[index - 1] : null;
-
-	        if (prevInput) {
-	            prevInput.focus();
-	            prevInput.setSelectionRange(prevInput.value.length, prevInput.value.length);
-	        }
-	    }
-	};
-
-	// const onPaste = (event, index) => {
-	//   event.preventDefault();
-	//   const pastedData = event.clipboardData.getData('text/plain');
-	  
-	//   // Проверим, что вставленный текст состоит только из 4 цифр
-	//   if (/^\d{4}$/.test(pastedData)) {
-	//     for (let i = 0; i < 4; i++) {
-	//       state.digits[index + i] = pastedData[i];
-	//     }
-	//     onInput(index + 3); // Вызываем обработчик onInput для последнего инпута, чтобы обработать логику ввода
-	//   } else {
-	//    	setError({ response: {data: { errorCode: "INPUT_ERROR"}}})
-	//   }
-	// };
-
-	const onInput = (index) => {
-	    const inputs = document.querySelectorAll('input');
-	    const nextInput = inputs[index + 1];
-	    const prevInput = index > 0 ? inputs[index - 1] : null;
-
-	    // Переход на следующий инпут
-	    if (state.digits[index] !== '' && state.digits[index] !== null && state.digits[index] !== undefined && index < 4) {
-	        if (index < 3) nextInput.focus();
-	        else firstInput.value.focus();
-	    }
-
-	    // Переход на предыдущий инпут при удалении
-	    if ((state.digits[index] === null || state.digits[index] === undefined || state.digits[index] === '') && index > 0) {
-	        prevInput.focus();
-	    }
-
-	    // Проверка введенного кода
-	    if (state.digits.every(digit => digit !== '')) {
-	        const enteredCode = state.digits.join('');
-	        const correctCode = twofa.state.code.code.toString();
-
-	        if (enteredCode === correctCode) {
-	            twofa.state.code.isValid = true;
-
-	            router.push({
-	                path: '/auth/enter-password',
-	                query: { type: twofa.state.code.type, method: route.query.method, returnUrl: route.query.returnUrl }
-	            });
-
-	        } else {
-	            setError({ response: {data: { errorCode: "WRONG_CODE"}}})
-	            firstInput.value.focus()
-	            state.digits = ['', '', '', ''];
-	        }
-	    }
-	};
-</script>

package/src/modules/auth/views/components/pages/EnterPassword.vue

@@ -1,123 +0,0 @@
-<template>
-	<section class="t-left pd-medium">
-		<!-- Header -->
-		<!-- <img loading="lazy" src="@/assets/icons/password.png" class="i-extra mn-b-small"> -->
-		<h3 class="mn-b-small">{{ t('auth.enterPassword.almostDone') }}</h3>
-		<p v-if="route.query.method === 'reset-password'" class="mn-b-semi t-transp">{{ t('auth.enterPassword.newPasswordPrompt') }}</p>
-		<p v-else class="mn-b-semi t-transp">{{ t('auth.enterPassword.registrationPasswordPrompt') }}</p>
-	
-		<!-- Form -->
-		<div class="mn-b-semi radius-small o-hidden">
-			<Field 
-				v-model:field="auth.state.user.password"
-				type="password" 	
-				:validation="passswordValidation" 
-				:placeholder="t('auth.enterPassword.passwordPlaceholder')"		
-				class="bg-light pd-small radius-small mn-b-thin"
-			/>
-			<Field 
-				v-model:field="auth.state.user.passwordRepeat"
-				type="password" 	
-				:placeholder="t('auth.enterPassword.repeatPasswordPlaceholder')"
-				class="bg-light pd-small radius-small mn-b-thin"
-			/>
-		</div>
-		<div
-			 v-if="route.query.method !== 'reset-password'" 
-			 class="p-regular fw-semi mn-b-semi "
-		>
-			 By registering, you agree to our <a class="t-grey" href="/legal/eula" target="_blank" rel="noopener noreferrer">End User License Agreement (EULA)</a>
-		</div>
-		<!-- Button -->
-		<Button :submit="onSubmit" :callback="redirectTo" class="w-100 bg-main mn-b-big">
-			<span  v-if="route.query.method === 'reset-password'">{{ t('auth.enterPassword.changePasswordBtn') }}</span>
-			<span v-else>{{ t('auth.enterPassword.registerBtn') }}</span>
-		</Button>
-	</section> 
-</template>
-
-<script setup>
-// Import components
-import Tab           from '@martyrs/src/components/Tab/Tab.vue'
-import Field         from '@martyrs/src/components/Field/Field.vue'
-import Button        from '@martyrs/src/components/Button/Button.vue'
-// Import libs
-import { computed, onMounted, ref, onBeforeMount } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import { useI18n } from 'vue-i18n'
-// Import state
-import * as auth from '@martyrs/src/modules/auth/views/store/auth.js'
-// Import validation
-import * as inputsValidation from '@martyrs/src/modules/auth/views/validations/inputs.validation'
-const passswordValidation = ref(null)
-// Localization
-const { t } = useI18n({
-	useScope: 'global', 
-})
-// Accessing router
-const route = useRoute()
-const router = useRouter()
-// Accessing state
-const tabAuth = ref('phone')
-// Methods
-async function onSubmit() {
-	try {
-		await inputsValidation.validateInputs(
-			passswordValidation, 
-			inputsValidation.validatePassword, 
-			auth.state.user.password, 
-			'Некорректный пароль'
-		)
-	} catch (error) {
-		throw new Error
-	}
-
-	if (route.query.method === 'reset-password') await auth.actions.updatePassword(auth.state.user, route.query.type)
-	if (route.query.method !== 'reset-password') await auth.actions.signup(auth.state.user, route.query.type)
-}
-
-function redirectTo () {
-	if (route.query.returnUrl) {
-		router.push({ 
-			path: route.query.returnUrl,
-			query: { 
-				afterAuth: 'true' 
-			}
-		})
-	} else { 
-		router.push({ 
-			name: 'User Profile', 
-			params: { 
-				_id: auth.state.user._id 
-			},
-			query: { 
-				afterAuth: 'true' 
-			}
-		})
-	}
-}
-</script>
-
-<style lang="scss">
-	.slide-fade-enter-active {
-	  transition: all  0.3s cubic-bezier(0.4, 0, 0.2, 1);
-	}
-
-	.slide-fade-leave-active {
-	  transition: all  0.3s cubic-bezier(0.4, 0, 0.2, 1);
-
-	}
-
-	.slide-fade-enter-from,
-	.slide-fade-leave-to {
-		position: absolute;
-	  transform: translateX(20px);
-	  opacity: 0;
-	  left: 0;
-	  top: 0;
-	}
-
-	.slide-fade-leave-to {
-
-	}
-</style>

package/src/modules/auth/views/components/sections/ProfileEditCredentials.vue

@@ -1,329 +0,0 @@
-<template>
-  <div v-if="show" class="">
-    <h3 class="mn-b-small">Phone and Email</h3>
-
-    <!-- Email section -->
-    <div v-if="!users.state.current.email" class="mn-b-semi">
-      <div v-if="isAddingEmail">
-        <Field 
-          v-model:field="newEmail"     
-          label="Email"  
-          placeholder="Enter your email" 
-          class="mn-b-thin bg-light pd-medium radius-small"
-          :disabled="isVerificationSent"
-        />
-        <div class="flex gap-2">
-          <Button 
-            v-if="!isVerificationSent"
-            :submit="() => sendVerification('email', 'add')" 
-            class="mn-b-thin t-white bg-second  flex-child-1"
-          >
-            Add Email
-          </Button>
-          <Button 
-            v-if="!isVerificationSent"
-            :submit="() => cancelAdding('email')" 
-            class="mn-b-thin bg-red t-white flex-child-1"
-          >
-            Cancel
-          </Button>
-        </div>
-      </div>
-      <Button 
-        v-if="!isAddingEmail"
-        :submit="() => startAdding('email')" 
-        class="mn-b-thin t-white bg-second w-100"
-      >
-        Add Email
-      </Button>
-    </div>
-
-    <!-- Phone section -->
-    <div v-if="!users.state.current.phone" class="mn-b-semi">
-      <div v-if="isAddingPhone">
-        <FieldPhone
-          @change="(event) => newPhone = event"  
-          :dropdownOptions="{
-            showDialCodeInSelection: true,
-            showFlags: true,
-            showDialCodeInList: true
-          }"
-          :validCharactersOnly="true"
-          mode="national"
-          :inputOptions="{placeholder: 'Enter your phone number', type: 'tel'}"
-          class="bg-light h-4r pd-small radius-small mn-b-thin" 
-        />
-
-        <div class="flex gap-2">
-          <Button 
-            v-if="!isVerificationSent"
-            :submit="() => sendVerification('phone', 'add')" 
-            class="mn-b-thin t-white bg-second flex-child-1"
-          >
-            Add Phone
-          </Button>
-          <Button 
-            v-if="!isVerificationSent"
-            :submit="() => cancelAdding('phone')" 
-            class="mn-b-thin  t-white bg-second t-white flex-child-1"
-          >
-            Cancel
-          </Button>
-        </div>
-      </div>
-      <Button 
-        v-if="!isAddingPhone"
-        :submit="() => startAdding('phone')" 
-        class="mn-b-thin bg-main w-100"
-      >
-        Add Phone
-      </Button>
-    </div>
-
-    <!-- Current contact info with edit options -->
-    <div class="mn-b-semi">
-      <!-- Current/Edit Phone -->
-      <div v-if="users.state.current.phone" class="mn-b-thin">
-        <Field 
-          v-if="!isEditingPhone"
-          v-model:field="users.state.current.phone"     
-          label="Phone"  
-          class="mn-b-thin bg-light pd-medium radius-small" 
-          disabled="true"
-        />
-        <Field 
-          v-else
-          v-model:field="newPhone"     
-          label="New Phone"  
-          placeholder="Enter new phone number" 
-          class="mn-b-thin t-black  bg-light pd-medium radius-small"
-          :disabled="isVerificationSent"
-        />
-        <Button 
-          v-if="!isEditingPhone && !isVerificationSent"
-          :submit="() => startEditing('phone')" 
-          class="mn-b-thin t-black bg-light w-100"
-        >
-          Change Phone
-        </Button>
-        <Button 
-          v-if="isEditingPhone && !isVerificationSent"
-          :submit="() => sendVerification('phone', 'edit')" 
-          class="mn-b-thin bg-main w-100"
-        >
-          Verify New Phone
-        </Button>
-      </div>
-
-      <!-- Current/Edit Email -->
-      <div v-if="users.state.current.email">
-        <Field 
-          v-if="!isEditingEmail"
-          v-model:field="users.state.current.email"     
-          label="Email"  
-          class="mn-b-thin bg-light pd-medium radius-small" 
-          disabled="true"
-        />
-        <Field 
-          v-else
-          v-model:field="newEmail"     
-          label="New Email"  
-          placeholder="Enter new email" 
-          class="mn-b-thin bg-light pd-medium radius-small"
-          :disabled="isVerificationSent"
-        />
-        <Button 
-          v-if="!isEditingEmail && !isVerificationSent"
-          :submit="() => startEditing('email')" 
-          class="mn-b-thin t-black bg-light w-100"
-        >
-          Change Email
-        </Button>
-        <Button 
-          v-if="isEditingEmail && !isVerificationSent"
-          :submit="() => sendVerification('email', 'edit')" 
-          class="mn-b-thin bg-main w-100"
-        >
-          Verify New Email
-        </Button>
-      </div>
-    </div>
-
-    <!-- Verification code section -->
-    <div v-if="isVerificationSent" class="mn-b-semi">
-      <Field 
-        v-model:field="verificationCode"     
-        label="Verification Code"  
-        placeholder="Enter the code" 
-        class="mn-b-thin bg-light pd-medium radius-small"
-      />
-      <div class="flex gap-2">
-        <Button 
-          :submit="verifyCode" 
-          class="mn-b-thin bg-main flex-child-1"
-        >
-          Verify
-        </Button>
-        <Button 
-          :submit="resendCode" 
-          class="mn-b-thin bg-light flex-child-1"
-        >
-          Resend Code
-        </Button>
-        <Button 
-          :submit="cancelEdit" 
-          class="mn-b-thin bg-red t-white flex-child-1"
-        >
-          Cancel
-        </Button>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-// Import components
-import Field from '@martyrs/src/components/Field/Field.vue'
-import Button from '@martyrs/src/components/Button/Button.vue'
-
-// Import libs
-import { ref, onMounted } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-
-// Import state
-import * as users from '@martyrs/src/modules/auth/views/store/users.js'
-import * as twofa from '@martyrs/src/modules/auth/views/store/twofa.js'
-
-// Component state
-const show = ref(false)
-const newEmail = ref('')
-const newPhone = ref('')
-const verificationCode = ref('')
-const isVerificationSent = ref(false)
-const currentVerificationType = ref(null)
-const currentAction = ref(null) // 'add' or 'edit'
-const isEditingEmail = ref(false)
-const isEditingPhone = ref(false)
-const isAddingEmail = ref(false)
-const isAddingPhone = ref(false)
-
-// Router
-const route = useRoute()
-const router = useRouter()
-
-import FieldPhone from '@martyrs/src/components/FieldPhone/FieldPhone.vue'
-
-// Lifecycle hooks
-onMounted(async () => {
-  await users.actions.read({ _id: route.params._id })
-  show.value = true
-})
-
-// Methods
-function startEditing(type) {
-  if (type === 'email') {
-    isEditingEmail.value = true
-    newEmail.value = ''
-  } else {
-    isEditingPhone.value = true
-    newPhone.value = ''
-  }
-}
-
-// Methods for adding new contact info
-function startAdding(type) {
-  if (type === 'email') {
-    isAddingEmail.value = true
-    newEmail.value = ''
-  } else {
-    isAddingPhone.value = true
-    newPhone.value = ''
-  }
-}
-
-function cancelAdding(type) {
-  if (type === 'email') {
-    isAddingEmail.value = false
-    newEmail.value = ''
-  } else {
-    isAddingPhone.value = false
-    newPhone.value = ''
-  }
-}
-
-function cancelEdit() {
-  isEditingEmail.value = false
-  isEditingPhone.value = false
-  isAddingEmail.value = false
-  isAddingPhone.value = false
-  isVerificationSent.value = false
-  verificationCode.value = ''
-  newEmail.value = ''
-  newPhone.value = ''
-  currentVerificationType.value = null
-  currentAction.value = null
-}
-
-async function sendVerification(type, action) {
-  try {
-    // Validate input before sending verification
-    if (action === 'edit') {
-      if (type === 'email' && (!newEmail.value || newEmail.value === users.state.current.email)) {
-        throw new Error('Please enter a different email address')
-      }
-      if (type === 'phone' && (!newPhone.value || newPhone.value === users.state.current.phone)) {
-        throw new Error('Please enter a different phone number')
-      }
-    }
-
-    const userData = {
-      phone: type === 'phone' ? newPhone.value : users.state.current.phone,
-      email: type === 'email' ? newEmail.value : users.state.current.email
-    }
-
-    await twofa.sendCode(userData, 'update', type)
-    isVerificationSent.value = true
-    currentVerificationType.value = type
-    currentAction.value = action
-  } catch (error) {
-    console.error('Failed to send verification code:', error)
-  }
-}
-
-async function verifyCode() {
-  try {
-    // Проверяем, что код существует в state
-    if (!twofa.state.code || !twofa.state.code.code) {
-      throw new Error('Verification code not found')
-    }
-
-    // Сравниваем введенный код с кодом из state
-    if (String(twofa.state.code.code) === String(verificationCode.value)) {
-      const updateData = { ...users.state.current }
-      
-      if (currentVerificationType.value === 'email') {
-        updateData.email = newEmail.value
-      } else {
-        updateData.phone = newPhone.value
-      }
-
-      await users.actions.update(updateData)
-      
-      // Reset state
-      cancelEdit()
-      
-      // Refresh user data
-      await users.actions.read({ _id: route.params._id })
-    } else {
-      throw new Error('Invalid verification code')
-    }
-  } catch (error) {
-    console.error('Verification failed:', error)
-  }
-}
-
-async function resendCode() {
-  verificationCode.value = ''
-  await sendVerification(currentVerificationType.value, currentAction.value)
-}
-</script>