M frontend/containers/Profile/index.tsx → frontend/containers/Profile/index.tsx

@@ -8,11 +8,13 @@ import {useTranslation} from 'react-i18next';
 import EditPassword from './EditPassword';
 import ProfileField from './ProfileField';
 import useToastStore from '../../stores/useToastStore';
+import {useUpdateMeMutation} from '../../generated/graphql';
 
-const Profile = ({profile, updateProfile, logout}) => {
+const Profile = ({profile, logout}) => {
   const {t} = useTranslation();
   const addToast = useToastStore(s => s.addToast);
   const classes = useStyles();
+  const [updateProfile] = useUpdateMeMutation();
   const [isEditing, setIsEditing] = useState(false);
   const [isEditingPassword, setIsEditingPassword] = useState(false);
   const [firstName, setFirstName] = useState(profile.firstName);
@@ -33,13 +35,14 @@ 
   const savePassword = async () => {
     try {
       await updateProfile({
-        oldPassword,
-        password: newPassword,
+        variables: {
+          userUpdate: {oldPassword, password: newPassword},
+        },
       });
       addToast(t('profile.password_changed'));
       resetPassword();
     } catch (err) {
-      if (err.message === 'Auth.form.error.password.matching') {
+      if (err.message === 'Wrong password') {
         setErrorPassword(t('profile.errors.password_nomatch'));
         return;
       }
@@ -48,7 +51,11 @@ };
 
   const onSave = async () => {
     try {
-      await updateProfile({firstName, lastName, email});
+      await updateProfile({
+        variables: {
+          userUpdate: {firstName, lastName, email},
+        },
+      });
       setIsEditing(false);
     } catch (error) {
       console.error(error);
@@ -69,7 +76,7 @@ />
     );
 
   return (
-    <form>
+    <>
       <Card>
         <CardContent>
           <ProfileField
@@ -143,7 +150,7 @@ </Button>
           )}
         </CardActions>
       </Card>
-    </form>
+    </>
   );
 };
 

M frontend/pages/profile.tsx → frontend/pages/profile.tsx

@@ -1,7 +1,6 @@ 
 import {useEffect} from 'react';
 import {useRouter} from 'next/router';
 import {useTranslation} from 'react-i18next';
-import {UsersPermissionsUserInput, useUpdateMeMutation} from '../generated/graphql';
 import useAuthStore from '../stores/useAuthStore';
 import useProfile from '../hooks/useProfile';
 import Loading from '../containers/Loading';
@@ -14,15 +13,11 @@ const {t} = useTranslation();
   const isAuth = useAuthStore(s => !!s.token);
   const logout = useAuthStore(s => s.logout);
   const {profile} = useProfile();
-  const [updateProfile] = useUpdateMeMutation();
 
   useEffect(() => {
     if (!isAuth) router.push('/');
   }, [isAuth]);
 
-  const onUpdateProfile = (userUpdate: UsersPermissionsUserInput) =>
-    updateProfile({variables: {userUpdate}});
-
   const menuActions = [
     {
       label: t('menu.new_event'),
@@ -40,11 +35,7 @@ if (!profile) return <Loading />;
 
   return (
     <Layout menuTitle={t('profile.title')} menuActions={menuActions} goBack>
-      <Profile
-        profile={profile}
-        updateProfile={onUpdateProfile}
-        logout={logout}
-      />
+      <Profile profile={profile} logout={logout} />
     </Layout>
   );
 };