diff --git a/src/components/screens/profile/ProfileDeleteAccountButton.tsx b/src/components/screens/profile/ProfileDeleteAccountButton.tsx index e8f0fea1..8f1bf67d 100644 --- a/src/components/screens/profile/ProfileDeleteAccountButton.tsx +++ b/src/components/screens/profile/ProfileDeleteAccountButton.tsx @@ -58,7 +58,7 @@ export const ProfileDeleteAccountButton = () => { return ( - + + + + + ) +} diff --git a/src/hooks/forms/useUpdatePasswordForm.ts b/src/hooks/forms/useUpdatePasswordForm.ts new file mode 100644 index 00000000..8c5487c1 --- /dev/null +++ b/src/hooks/forms/useUpdatePasswordForm.ts @@ -0,0 +1,58 @@ +import { useAuthControllerUpdate } from '@baca/api/query/auth/auth' +import { AuthUpdateDto } from '@baca/api/types' +import { handleFormError, hapticImpact, showSuccessToast } from '@baca/utils' +import { useMemo } from 'react' +import { useForm } from 'react-hook-form' +import { useTranslation } from 'react-i18next' + +export const useUpdatePasswordForm = () => { + const { t } = useTranslation() + const { mutate: updatePasswordMutation, isLoading } = useAuthControllerUpdate() + + const defaultValues: AuthUpdateDto = useMemo( + () => ({ + oldPassword: '', + password: '', + }), + [] + ) + + const { + control, + formState: { errors }, + handleSubmit, + reset, + setError: setFormError, + } = useForm({ + mode: 'onTouched', + defaultValues, + }) + + const onSubmit = (data: AuthUpdateDto) => { + updatePasswordMutation( + { data }, + { + onSuccess: () => { + showSuccessToast({ description: t('toast.success.profile_updated') }) + reset(defaultValues) + }, + onError: (e) => { + handleFormError( + e as unknown as keyof AuthUpdateDto, + ({ field, description }) => { + setFormError(field, { message: description }) + } + ) + hapticImpact() + }, + } + ) + } + + return { + control, + errors, + isSubmitting: isLoading, + submit: handleSubmit(onSubmit), + } +} diff --git a/src/i18n/translations/en.json b/src/i18n/translations/en.json index 26a6c44a..5cf7e004 100644 --- a/src/i18n/translations/en.json +++ b/src/i18n/translations/en.json @@ -27,6 +27,7 @@ "go_back": "Go back", "remove": "Remove", "save": "Save", + "change": "Change", "search": "Search", "try_again_later": "Please try again later", "try_again": "Try again" @@ -56,7 +57,9 @@ "email": "E-mail address", "first_name": "First name", "last_name": "Last name", - "password": "Password" + "password": "Password", + "old_password": "Old password", + "new_password": "New password" }, "placeholders": { "confirm_password": "Confirm password", @@ -64,7 +67,9 @@ "email": "Enter your email", "first_name": "Enter your first name", "last_name": "Enter your last name", - "password": "Password" + "password": "Password", + "old_password": "Enter current password", + "new_password": "Enter new password" }, "select": {}, "validation": { diff --git a/src/i18n/translations/pl.json b/src/i18n/translations/pl.json index c9ebd6af..f6b51b62 100644 --- a/src/i18n/translations/pl.json +++ b/src/i18n/translations/pl.json @@ -27,6 +27,7 @@ "go_back": "Cofnij", "remove": "Usuń", "save": "Zapisz", + "change": "Zmień", "search": "Szukaj", "try_again_later": "Proszę spróbuj ponownie później", "try_again": "Spróbuj ponownie" @@ -56,7 +57,9 @@ "email": "Adres e-mail", "first_name": "Imię", "last_name": "Nazwisko", - "password": "Hasło" + "password": "Hasło", + "old_password": "Stare hasło", + "new_password": "Nowe hasło" }, "placeholders": { "confirm_password": "Potwierdź hasło", @@ -64,7 +67,9 @@ "email": "Podaj adres e-mail", "first_name": "Podaj swoje imię", "last_name": "Podaj swoje nazwisko", - "password": "Hasło" + "password": "Hasło", + "old_password": "Podaj stare hasło", + "new_password": "Podaj nowe hasło" }, "select": {}, "validation": { @@ -126,18 +131,6 @@ "colors_label": "Kolory" }, "components_screen": { - "test_notification": "Test notification", - "typography": { - "label": "Typography", - "xs": "xs", - "sm": "sm", - "md": "md", - "lg": "lg", - "xl": "xl", - "2xl": "2xl", - "3xl": "3xl", - "4xl": "4xl" - }, "button_variants": { "disabled": "Button disabled", "header": "Button variants", @@ -166,6 +159,18 @@ "notification": { "description": "by react-native-notificated 🎉", "title": "In-app notification example" + }, + "test_notification": "Test notification", + "typography": { + "label": "Typography", + "xs": "xs", + "sm": "sm", + "md": "md", + "lg": "lg", + "xl": "xl", + "2xl": "2xl", + "3xl": "3xl", + "4xl": "4xl" } }, "confirm_email_screen": { diff --git a/src/screens/ProfileScreen.tsx b/src/screens/ProfileScreen.tsx index 3b324d5e..7ef9eaf1 100644 --- a/src/screens/ProfileScreen.tsx +++ b/src/screens/ProfileScreen.tsx @@ -1,6 +1,7 @@ import { ProfileDeleteAccountButton } from '@baca/components/screens/profile/ProfileDeleteAccountButton' import { ProfileDetailsForm } from '@baca/components/screens/profile/ProfileDetailsForm' import { ProfileHeader } from '@baca/components/screens/profile/ProfileHeader' +import { ProfilePasswordForm } from '@baca/components/screens/profile/ProfilePasswordForm' import { Box, Spacer } from '@baca/design-system' import { useTranslation, useScreenOptions } from '@baca/hooks' @@ -16,6 +17,9 @@ export const ProfileScreen = () => { + + + )