fix: Change variable name from update to change

Author: winverse

src/components/setting/SettingEmailRow.tsx

@@ -7,16 +7,17 @@ import Button from '../common/Button';
 
 export type SettingEmailRowProps = {
   email: string;
-  onUpdateEmail: (email: string) => Promise<void>;
+  onChangeEmail: (email: string) => Promise<void>;
 };
 
-function SettingEmailRow({ email, onUpdateEmail }: SettingEmailRowProps) {
+function SettingEmailRow({ email, onChangeEmail }: SettingEmailRowProps) {
   const [edit, setEdit] = useState(false);
   const [value, onChange] = useInput(email);
 
   const onSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
-    await onUpdateEmail(value);
+    //! TODO: 이메일 형식으로 입력하지 않을 경우 처리
+    await onChangeEmail(value);
     setEdit(false);
   };
 

src/components/setting/SettingRows.tsx

@@ -14,7 +14,7 @@ export type SettingRowsProps = {
   username: string;
   email: string;
   onUpdateTitle: (title: string) => Promise<any>;
-  onUpdateEmail: (email: string) => Promise<any>;
+  onChangeEmail: (email: string) => Promise<any>;
   onUpdateSocialInfo: (profileLinks: ProfileLinks) => Promise<any>;
   onUpdateEmailRules: (params: {
     promotion: boolean;
@@ -42,7 +42,7 @@ function SettingRows({
   userMeta,
   email,
   onUpdateTitle,
-  onUpdateEmail,
+  onChangeEmail,
   onUpdateSocialInfo,
   onUpdateEmailRules,
   onUnregister,
@@ -54,7 +54,7 @@ function SettingRows({
         onUpdateTitle={onUpdateTitle}
       />
       <SettingSocialInfoRow {...profileLinks} onUpdate={onUpdateSocialInfo} />
-      <SettingEmailRow email={email} onUpdateEmail={onUpdateEmail} />
+      <SettingEmailRow email={email} onChangeEmail={onChangeEmail} />
       {userMeta && (
         <SettingEmailRulesRow
           notification={userMeta.email_notification}

src/containers/setting/SettingRowsContainer.tsx

@@ -7,7 +7,7 @@ import useUserProfile from './hooks/useUserProfile';
 import useUpdateSocialInfo from './hooks/useUpdateSocialInfo';
 import useUpdateEmailRules from './hooks/useUpdateEmailRules';
 import useUnregister from './hooks/useUnregister';
-import useUpdateEmail from './hooks/useUpdateEmail';
+import useChangeEmail from './hooks/useChangeEmail';
 
 export type SettingRowsContainerProps = {};
 
@@ -17,7 +17,7 @@ function SettingRowsContainer(props: SettingRowsContainerProps) {
   const user = useSelector((state: RootState) => state.core.user);
   const updateSocialInfo = useUpdateSocialInfo();
   const { update: updateEmailRules } = useUpdateEmailRules();
-  const { update: updateEmail } = useUpdateEmail();
+  const { change: changeEmail } = useChangeEmail();
   const unregister = useUnregister();
 
   const onUpdateEmailRules = useCallback(
@@ -44,7 +44,7 @@ function SettingRowsContainer(props: SettingRowsContainerProps) {
       username={user.username}
       email={user.email}
       onUpdateTitle={updateTitle}
-      onUpdateEmail={updateEmail}
+      onChangeEmail={changeEmail}
       profileLinks={profile.profile_links}
       onUpdateSocialInfo={updateSocialInfo.update}
       onUpdateEmailRules={onUpdateEmailRules}

src/containers/setting/hooks/useChangeEmail.ts

@@ -0,0 +1,28 @@
+import { useMutation } from '@apollo/react-hooks';
+import gql from 'graphql-tag';
+import { useCallback } from 'react';
+
+const CHANGE_EMAIL = gql`
+  mutation ChangeEmail($email: String!) {
+    changeEmail(email: $email)
+  }
+`;
+
+export default function useChangeEmail() {
+  const [changeEmail] = useMutation(CHANGE_EMAIL);
+
+  const change = useCallback(
+    (email: string) => {
+      return changeEmail({
+        variables: {
+          email,
+        },
+      });
+    },
+    [changeEmail],
+  );
+
+  return {
+    change,
+  };
+}