-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: add reset, change password endopints and optout endpoint (#9)
* feat: add reset and change endpoints and related method in useBeditaAuth() composable * feat: optout endpoint and related method in useBeditaAuth composable * refactor: change signature * chore: add type in import * feat(playground): add examples for reset password and optout
- Loading branch information
Showing
11 changed files
with
347 additions
and
6 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -6,7 +6,7 @@ | |
| </p> | ||
| </template> | ||
|
|
||
| <style> | ||
| <style scoped> | ||
| p { | ||
| font-size: 12px; | ||
| } | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,54 @@ | ||
| <template> | ||
| <div> | ||
| <h2>Forgot Password Page</h2> | ||
| <div v-if="!isLogged"> | ||
| <form> | ||
| <div> | ||
| <label> | ||
| <div>Insert your email</div> | ||
| <input v-model="email" type="email" required placeholder="john.smith@example.com"> | ||
| </label> | ||
| </div> | ||
| <div style="margin-top: 10px;"> | ||
| <RecaptchaBadge v-if="showCustomBadge" /> | ||
| <button :disabled="isLoading" @click.prevent="send()">Send</button> | ||
| </div> | ||
| <p v-if="error" style="color: red;">An error occured. Please, try again.</p> | ||
| <p v-if="done" style="color: green;">An email for reset password has sent to you. Follow the instructions.</p> | ||
| </form> | ||
| </div> | ||
|
|
||
| <div v-else> | ||
| <p>Hello {{ user?.name }} {{ user?.surname }}.</p> | ||
| <p>To test the "forgot password" you need to logout.</p> | ||
| <div> | ||
| <button @click="logout">Logout</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script setup lang="ts"> | ||
| const { user, isLogged, resetPassword, logout } = useBeditaAuth(); | ||
|
|
||
| const email = ref(''); | ||
| const error = ref(false); | ||
| const isLoading = ref(false); | ||
| const done = ref(false); | ||
| const showCustomBadge = useRuntimeConfig().public.recaptcha.hideBadge; | ||
|
|
||
| const send = async () => { | ||
| error.value = false; | ||
| isLoading.value = true; | ||
| done.value = false; | ||
| try { | ||
| await resetPassword(email.value); | ||
| done.value = true; | ||
| email.value = ''; | ||
| } catch (e) { | ||
| error.value = true; | ||
| } | ||
| isLoading.value = false; | ||
| } | ||
|
|
||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,52 @@ | ||
| <template> | ||
| <div> | ||
| <h2>Opt-out Page</h2> | ||
| <div> | ||
| <p v-if="isLogged">Hello {{ user?.name }} {{ user?.surname }}</p> | ||
| <p>Insert user e password to delete your account.</p> | ||
| </div> | ||
| <div> | ||
| <form> | ||
| <div> | ||
| <label> | ||
| <div>Username</div> | ||
| <input v-model="username" type="text"> | ||
| </label> | ||
| </div> | ||
| <div> | ||
| <label> | ||
| <div>Password</div> | ||
| <input v-model="password" type="password"> | ||
| </label> | ||
| </div> | ||
| <div style="margin-top: 10px;"> | ||
| <RecaptchaBadge v-if="showCustomBadge" /> | ||
| <button :disabled="isLoading" @click.prevent="deleteAccount()">Delete account</button> | ||
| </div> | ||
| <p v-if="error" style="color: red;">An error occured. Please, try again.</p> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script setup lang="ts"> | ||
| const { user, isLogged, optOut } = useBeditaAuth(); | ||
|
|
||
| const username = ref(''); | ||
| const password = ref(''); | ||
| const error = ref(false); | ||
| const isLoading = ref(false); | ||
| const showCustomBadge = useRuntimeConfig().public.recaptcha.hideBadge; | ||
|
|
||
| const deleteAccount = async () => { | ||
| error.value = false; | ||
| isLoading.value = true; | ||
| try { | ||
| await optOut(username.value, password.value); | ||
| } catch (e) { | ||
| error.value = true; | ||
| } | ||
| isLoading.value = false; | ||
| } | ||
|
|
||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,54 @@ | ||
| <template> | ||
| <div> | ||
| <h2>Reset Password Page</h2> | ||
| <div v-if="!isLogged"> | ||
| <form> | ||
| <label> | ||
| <div>New password</div> | ||
| <input v-model="password" type="password" required> | ||
| </label> | ||
| <div style="margin-top: 10px;"> | ||
| <RecaptchaBadge v-if="showCustomBadge" /> | ||
| <button :disabled="isLoading" @click.prevent="change()">Change password</button> | ||
| <button :disabled="isLoading" style="margin-left: 10px;" @click.prevent="change(true)">Change password and login</button> | ||
| </div> | ||
| <p v-if="error" style="color: red;">An error occured. Please, try again.</p> | ||
| <p v-if="done" style="color: green;">Password change successful. Go to <NuxtLink to="/login">Login</NuxtLink></p> | ||
| </form> | ||
| </div> | ||
|
|
||
| <div v-else> | ||
| <p>Hello {{ user?.name }} {{ user?.surname }}.</p> | ||
| <p v-if="done">Password change successful.</p> | ||
| <p v-else>To test the "reset password" you need to logout.</p> | ||
| <div> | ||
| <button @click="logout">Logout</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script setup lang="ts"> | ||
| const { user, isLogged, changePassword, logout } = useBeditaAuth(); | ||
|
|
||
| const password = ref(''); | ||
| const error = ref(false); | ||
| const isLoading = ref(false); | ||
| const done = ref(false); | ||
| const showCustomBadge = useRuntimeConfig().public.recaptcha.hideBadge; | ||
|
|
||
| const change = async (login = false) => { | ||
| error.value = false; | ||
| isLoading.value = true; | ||
| done.value = false; | ||
| try { | ||
| await changePassword(password.value, login); | ||
| done.value = true; | ||
| password.value = ''; | ||
| } catch (e) { | ||
| error.value = true; | ||
| } | ||
| isLoading.value = false; | ||
| } | ||
|
|
||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| import { defineEventHandler, readBody } from 'h3'; | ||
| import { recaptchaVerifyToken } from '../../../utils/recaptcha'; | ||
| import { beditaClient, handleBeditaApiError } from '../../../utils/bedita-client'; | ||
| import { RecaptchaActions } from '../../../../utils/recaptcha-helpers'; | ||
| import type { UserAuth } from '../../../../types'; | ||
| import { filterUserDataToStore } from '../../../../utils/user-data-store'; | ||
| import { type BEditaClientRequestConfig, FormatUserInterceptor } from '@atlasconsulting/bedita-sdk'; | ||
|
|
||
| export default defineEventHandler(async (event) => { | ||
| try { | ||
| const body = await readBody(event); | ||
| await recaptchaVerifyToken(body?.recaptcha_token, RecaptchaActions.CHANGE_PASSWORD); | ||
| const client = await beditaClient(event); | ||
| const payload = { | ||
| uuid: body?.uuid, | ||
| password: body?.password, | ||
| login: body?.login === true, | ||
| }; | ||
| const requestConfig: BEditaClientRequestConfig = { | ||
| responseInterceptors: [ new FormatUserInterceptor(client) ] | ||
| } | ||
| const response = await client.patch('/auth/change', payload, requestConfig); | ||
|
|
||
| // if login is true it fills session with tokens and user data | ||
| if (body?.login === true) { | ||
| const storageService = client.getStorageService(); | ||
| await storageService.setAccessToken(response.data?.meta?.jwt); | ||
| await storageService.setRefreshToken(response.data?.meta?.renew); | ||
| await storageService.set('user', filterUserDataToStore(response?.formattedData)); | ||
| } | ||
|
|
||
| return response.formattedData as UserAuth; | ||
| } catch (error) { | ||
| return handleBeditaApiError(event, error); | ||
| } | ||
| }); | ||
|
|
Oops, something went wrong.