diff --git a/assets/js/EditProfile.jsx b/assets/js/EditProfile.jsx
index 9fc6f4c8afade702c12d14bce1aded9ec5b9c1cc..c524b935cf4c1215fe85b92d27e38441836da75f 100644
--- a/assets/js/EditProfile.jsx
+++ b/assets/js/EditProfile.jsx
@@ -11,10 +11,9 @@ import {
 import Server from './lib/Server';
 import Storage from './lib/Storage';
 import ModalAlert from './components/ModalAlert';
-import Dumper from './lib/Dumper';
-import { isFromGithubLinkValid } from './Utils';
+import ProfileHandler from './ProfileHandler';
 
-export default class EditProfile extends React.Component {
+export default class EditProfile extends ProfileHandler {
   static propTypes = {
     route: PropTypes.object.isRequired,
     params: PropTypes.object.isRequired,
@@ -157,72 +156,6 @@ export default class EditProfile extends React.Component {
     return dateIndexArray.reverse().join(' ');
   }
 
-  handleSubmit = (e) => {
-    e.preventDefault();
-    if (!isFromGithubLinkValid(this.state.form.github_url)) {
-      this.modalAlert.open(
-        'Pembaharuan profil gagal',
-        'Pastikan link github yang anda tulis benar.(Berpola : https://github.com/<username>',
-      );
-    } else {
-      const submitForm = {};
-      Object.keys(this.state.form).forEach((key) => {
-        if (this.state.form[key] !== '') {
-          submitForm[key] = this.state.form[key];
-        }
-      });
-      this.setState({ loading: true });
-      Server.submit(
-        `/students/${this.state.id}/profile/`,
-        submitForm,
-        'PATCH',
-      ).then(
-        () => {
-          this.setState({ loading: false });
-          this.modalAlert.open(
-            'Profil berhasil diperbaharui',
-            'Silakan periksa kembali profil anda',
-            this.getProfile,
-          );
-        },
-        (error) => error.then((r) => {
-          this.setState({ loading: false });
-          this.modalAlert.open('Pembaharuan profil gagal', Dumper.dump(r));
-        }),
-      );
-    }
-  };
-
-  handleFile = (e) => {
-    const { form } = this.state;
-    form[e.target.name] = e.target.files[0];
-    this.setState({ form });
-  };
-
-  handleChange = (e) => {
-    const { form } = this.state;
-    form[e.target.name] = e.target.value;
-    this.setState({ form });
-  };
-
-  handleCheckbox = (e, d) => {
-    const { form } = this.state;
-    form[d.name] = d.checked;
-    this.setState({ form, show_transcript: d.checked });
-  };
-
-  handleRadioGender = (e, { value }) => {
-    const { form } = this.state;
-    form.gender = value;
-    this.setState({ form });
-  };
-
-  handleRadio = (e, { value }) => {
-    const { form } = this.state;
-    form.job_seeking_status = value;
-    this.setState({ form });
-  };
-
   updateForm(show) {
     if (show) {
       return (
diff --git a/assets/js/ProfileHandler.jsx b/assets/js/ProfileHandler.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..e21b96aae3812298eba2b539d991dc8a28991e48
--- /dev/null
+++ b/assets/js/ProfileHandler.jsx
@@ -0,0 +1,71 @@
+import React from 'react';
+import Dumper from './lib/Dumper';
+import { isFromGithubLinkValid } from './Utils';
+
+export default class ProfileHandler extends React.Component {
+    handleSubmit = (e) => {
+        e.preventDefault();
+        if (!isFromGithubLinkValid(this.state.form.github_url)) {
+        this.modalAlert.open(
+            'Pembaharuan profil gagal',
+            'Pastikan link github yang anda tulis benar.(Berpola : https://github.com/<username>',
+        );
+        } else {
+        const submitForm = {};
+        Object.keys(this.state.form).forEach((key) => {
+            if (this.state.form[key] !== '') {
+            submitForm[key] = this.state.form[key];
+            }
+        });
+        this.setState({ loading: true });
+        Server.submit(
+            `/students/${this.state.id}/profile/`,
+            submitForm,
+            'PATCH',
+        ).then(
+            () => {
+            this.setState({ loading: false });
+            this.modalAlert.open(
+                'Profil berhasil diperbaharui',
+                'Silakan periksa kembali profil anda',
+                this.getProfile,
+            );
+            },
+            (error) => error.then((r) => {
+            this.setState({ loading: false });
+            this.modalAlert.open('Pembaharuan profil gagal', Dumper.dump(r));
+            }),
+        );
+        }
+    };
+
+    handleFile = (e) => {
+        const { form } = this.state;
+        form[e.target.name] = e.target.files[0];
+        this.setState({ form });
+    };
+
+    handleChange = (e) => {
+        const { form } = this.state;
+        form[e.target.name] = e.target.value;
+        this.setState({ form });
+    };
+
+    handleCheckbox = (e, d) => {
+        const { form } = this.state;
+        form[d.name] = d.checked;
+        this.setState({ form, show_transcript: d.checked });
+    };
+
+    handleRadioGender = (e, { value }) => {
+        const { form } = this.state;
+        form.gender = value;
+        this.setState({ form });
+    };
+
+    handleRadio = (e, { value }) => {
+        const { form } = this.state;
+        form.job_seeking_status = value;
+        this.setState({ form });
+    };
+}
\ No newline at end of file
diff --git a/assets/js/ProfilePage.jsx b/assets/js/ProfilePage.jsx
index db2278db7410fc992f1dcfa9560cc1b5023a4447..2c34322ae29b3b43970fad4be86039ac91ef5ca3 100755
--- a/assets/js/ProfilePage.jsx
+++ b/assets/js/ProfilePage.jsx
@@ -15,10 +15,11 @@ import {
 import Server from './lib/Server';
 import Storage from './lib/Storage';
 import ModalAlert from './components/ModalAlert';
+import ProfileHandler from './ProfileHandler';
 import Dumper from './lib/Dumper';
 import { isFromGithubLinkValid, gotoLink } from './Utils';
 
-export default class ProfilePage extends React.Component {
+export default class ProfilePage extends ProfileHandler {
   static propTypes = {
     route: PropTypes.object.isRequired,
     params: PropTypes.object.isRequired,
@@ -281,36 +282,6 @@ export default class ProfilePage extends React.Component {
     }
   };
 
-  handleFile = (e) => {
-    const { form } = this.state;
-    form[e.target.name] = e.target.files[0];
-    this.setState({ form });
-  };
-
-  handleChange = (e) => {
-    const { form } = this.state;
-    form[e.target.name] = e.target.value;
-    this.setState({ form });
-  };
-
-  handleCheckbox = (e, d) => {
-    const { form } = this.state;
-    form[d.name] = d.checked;
-    this.setState({ form, show_transcript: d.checked });
-  };
-
-  handleRadioGender = (e, { value }) => {
-    const { form } = this.state;
-    form.gender = value;
-    this.setState({ form });
-  };
-
-  handleRadio = (e, { value }) => {
-    const { form } = this.state;
-    form.job_seeking_status = value;
-    this.setState({ form });
-  };
-
   gotoStudentResume = () => gotoLink(this.state.resume || '#');
 
   gotoStudentToeflFile = () => gotoLink(this.state.student_toefl_file || '#');