From 41e04392874b139cbc8ace4e438c5d6a36538c02 Mon Sep 17 00:00:00 2001
From: tyagita <tiagita@gmail.com>
Date: Thu, 5 Dec 2019 17:12:22 +0700
Subject: [PATCH 1/5] Add section skills in Profilepage

---
 assets/js/ProfilePage.jsx | 302 +++++++++++++++++++-------------------
 1 file changed, 154 insertions(+), 148 deletions(-)

diff --git a/assets/js/ProfilePage.jsx b/assets/js/ProfilePage.jsx
index 53d7799b..3c22836e 100755
--- a/assets/js/ProfilePage.jsx
+++ b/assets/js/ProfilePage.jsx
@@ -96,7 +96,7 @@ export default class ProfilePage extends ProfileHandler {
       github_url: '',
       gitlab_url: '',
       awards: '',
-      sertifikat:'',
+      sertifikat: '',
       projects: '',
       certification: '',
       languages: '',
@@ -328,7 +328,7 @@ export default class ProfilePage extends ProfileHandler {
                         <p>
                           {' '}
                           {this.state.major || 'N/A'}
-,
+                          ,
                           {' '}
                           {this.state.batch || 'N/A'}
                           {' '}
@@ -389,7 +389,7 @@ export default class ProfilePage extends ProfileHandler {
                         <p>
                           {' '}
                           {this.state.cityOfBirth || 'N/A'}
-,
+                          ,
                           {' '}
                           {this.state.dateOfBirth || 'N/A'}
                           {' '}
@@ -427,21 +427,6 @@ export default class ProfilePage extends ProfileHandler {
                     </Grid>
                   </Segment>
 
-                  <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="pencil alternate" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <p href={this.state.student_toefl}>
-                          {' '}
-                          {this.state.student_toefl || 'N/A'}
-                          {' '}
-                        </p>
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
-
                   <Segment basic vertical>
                     <Grid>
                       <Grid.Column width={2}>
@@ -488,20 +473,6 @@ export default class ProfilePage extends ProfileHandler {
                       </Grid.Column>
                     </Grid>
                   </Segment>
-                  <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="cogs" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <p>
-                          {' '}
-                          {this.state.skills || 'Skills belum ditambahkan'}
-                          {' '}
-                        </p>
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
                   <Segment basic vertical>
                     <Grid>
                       <Grid.Column width={2}>
@@ -618,22 +589,6 @@ export default class ProfilePage extends ProfileHandler {
                       </Grid.Column>
                     </Grid>
                   </Segment>
-
-                  <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="comment" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <p>
-                          {' '}
-                          {this.state.languages || 'N/A'}
-                          {' '}
-                        </p>
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
-
                   <Segment basic vertical>
                     <Grid>
                       <Grid.Column width={2}>
@@ -754,7 +709,7 @@ export default class ProfilePage extends ProfileHandler {
                 </Segment>
                 <Container textAlign="center">
                   <div className="buttonProfile">
-                  <Button
+                    <Button
                       onClick={this.gotoStudentToeflFile}
                       disabled={!this.state.student_toefl_file}
                       primary
@@ -810,120 +765,171 @@ export default class ProfilePage extends ProfileHandler {
                   </p>
                 </Message>
               ) : (
-                <Message negative>
-                  <Message.Header>Tidak mencari pekerjaan</Message.Header>
-                  <p>
+                  <Message negative>
+                    <Message.Header>Tidak mencari pekerjaan</Message.Header>
+                    <p>
                       Saya sedang tidak mencari pekerjaan. Mohon jangan kirimkan
                       informasi mengenai lowongan pekerjaan.
                   </p>
-                </Message>
-              )}
+                  </Message>
+                )}
             </h4>
           </div>
         </Segment>
 
-        <Segment className="links-form">
-          <h3>Links</h3>
+        <Segment>
+          <h3>Skills</h3>
           <Grid stackable>
             <Grid.Column width={6}>
-            <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="linkify" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <a href={this.state.portfolio_link}>
-                          {' '}
-                          {this.state.portfolio_link || 'Portofolio belum ditambahkan'}
-                          {' '}
-                        </a>
-                      </Grid.Column>
-                    </Grid>
-          </Segment>
-
-          <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="linkedin" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <a href={this.state.linkedin_url}>
-                          {' '}
-                          {this.state.linkedin_url || 'N/A'}
-                          {' '}
-                        </a>
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="cogs" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <p>
+                      {' '}
+                      {this.state.skills || 'Skills belum ditambahkan'}
+                      {' '}
+                    </p>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="comment" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <p>
+                      {' '}
+                      {this.state.languages || 'N/A'}
+                      {' '}
+                    </p>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="pencil alternate" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <p href={this.state.student_toefl}>
+                      {' '}
+                      {this.state.student_toefl || 'N/A'}
+                      {' '}
+                    </p>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
 
-        <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="hackerrank" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <a href={this.state.hackerrank_url}>
-                          {' '}
-                          {this.state.hackerrank_url || 'N/A'}
-                          {' '}
-                        </a>
-                      </Grid.Column>
-                    </Grid>
+            </Grid.Column>
+          </Grid>
         </Segment>
 
-        <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="globe" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <a href={this.state.website_url}>
-                          {' '}
-                          {this.state.website_url || 'N/A'}
-                          {' '}
-                        </a>
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
-
-                  <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="github" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        {this.state.github_url ? (
-                          <a href={this.state.github_url}>
+        <Segment className="links-form">
+          <h3>Links</h3>
+          <Grid stackable>
+            <Grid.Column width={6}>
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="linkify" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <a href={this.state.portfolio_link}>
+                      {' '}
+                      {this.state.portfolio_link || 'Portofolio belum ditambahkan'}
+                      {' '}
+                    </a>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
+
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="linkedin" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <a href={this.state.linkedin_url}>
+                      {' '}
+                      {this.state.linkedin_url || 'N/A'}
+                      {' '}
+                    </a>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
+
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="hackerrank" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <a href={this.state.hackerrank_url}>
+                      {' '}
+                      {this.state.hackerrank_url || 'N/A'}
+                      {' '}
+                    </a>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
+
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="globe" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <a href={this.state.website_url}>
+                      {' '}
+                      {this.state.website_url || 'N/A'}
+                      {' '}
+                    </a>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
+
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="github" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    {this.state.github_url ? (
+                      <a href={this.state.github_url}>
+                        {' '}
+                        {this.state.github_url}
+                        {' '}
+                      </a>
+                    ) : (
+                        <p> N/A </p>
+                      )}
+                  </Grid.Column>
+                </Grid>
+              </Segment>
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="gitlab" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    {
+                      this.state.gitlab_url
+                        ? (
+                          <a href={this.state.gitlab_url}>
                             {' '}
-                            {this.state.github_url}
+                            {this.state.gitlab_url}
                             {' '}
                           </a>
-                        ) : (
-                          <p> N/A </p>
-                        )}
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
-                  <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="gitlab" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        {
-                          this.state.gitlab_url
-                            ? (
-                              <a href={this.state.gitlab_url}>
-                                {' '}
-                                { this.state.gitlab_url }
-                                {' '}
-                              </a>
-                            )
-                            : <p> N/A </p>
-                        }
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
+                        )
+                        : <p> N/A </p>
+                    }
+                  </Grid.Column>
+                </Grid>
+              </Segment>
             </Grid.Column>
           </Grid>
         </Segment>
-- 
GitLab


From b00eb7ccd1b5b4cc8f1ffd120017ef53f3d62b9a Mon Sep 17 00:00:00 2001
From: tyagita <tiagita@gmail.com>
Date: Thu, 5 Dec 2019 17:14:56 +0700
Subject: [PATCH 2/5] Add section skills in EditProfilePage

---
 assets/js/EditProfile.jsx | 203 ++++++++++++++++++++++++++------------
 1 file changed, 142 insertions(+), 61 deletions(-)

diff --git a/assets/js/EditProfile.jsx b/assets/js/EditProfile.jsx
index dadbd4d2..4bac8d25 100644
--- a/assets/js/EditProfile.jsx
+++ b/assets/js/EditProfile.jsx
@@ -11,9 +11,10 @@ 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 } from './Utils';
 
-export default class EditProfile extends ProfileHandler {
+export default class EditProfile extends React.Component {
   static propTypes = {
     route: PropTypes.object.isRequired,
     params: PropTypes.object.isRequired,
@@ -156,6 +157,72 @@ export default class EditProfile extends ProfileHandler {
     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 (
@@ -270,15 +337,6 @@ export default class EditProfile extends ProfileHandler {
                 name="alamat"
               />
             </Form.Field>
-            <Form.Field>
-              <label htmlFor="skills">Skills</label>
-              <input
-                onChange={this.handleChange}
-                placeholder="Isi sesuai dengan keahlian anda"
-                defaultValue={this.state.skills === null ? 'Competitive Programming' : this.state.skills}
-                name="skills"
-              />
-            </Form.Field>
             <Form.Field>
               <label htmlFor="latest_work">Latest Working Experience</label>
               <input
@@ -345,39 +403,6 @@ export default class EditProfile extends ProfileHandler {
                 name="projects"
               />
             </Form.Field>
-            <Form.Field>
-              <label htmlFor="certification">Sertifikasi</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.certification === null
-                    ? 'TOEFL'
-                    : this.state.certification
-                }
-                defaultValue={
-                  this.state.certification === null
-                    ? null
-                    : this.state.certification
-                }
-                name="certification"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="languages">Bahasa yang dikuasai</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.languages === null
-                    ? 'Indonesia'
-                    : this.state.languages
-                }
-                defaultValue={
-                  this.state.languages === null ? null : this.state.languages
-                }
-                name="languages"
-              />
-            </Form.Field>
-
             <Form.Field>
               <label htmlFor="seminar">Seminar dan Training</label>
               <input
@@ -498,6 +523,76 @@ export default class EditProfile extends ProfileHandler {
             </Form.Field>
 
             <Form.Field>
+              <label htmlFor="dependants">Dependants</label>
+              <input
+                onChange={this.handleChange}
+                placeholder={
+                  this.state.dependants === null ? '0' : this.state.dependants
+                }
+                defaultValue={
+                  this.state.dependants === null ? null : this.state.dependants
+                }
+                name="dependants"
+              />
+            </Form.Field>
+          </Form>
+        </Segment>
+
+        <Segment>
+            <Header as="h3" textAlign="center">
+              <Icon name="edit" />
+              <Header.Content>Edit Skills</Header.Content>
+            </Header>
+            <Form
+              ref={(input) => {
+                this.form = input;
+              }}
+              key={this.state.refresh}
+              size="small"
+              onSubmit={this.handleSubmit}
+            >
+              <Form.Field>
+                <label htmlFor="skills">Skills</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder="Isi sesuai dengan keahlian anda"
+                  defaultValue={this.state.skills === null ? 'Competitive Programming' : this.state.skills}
+                  name="skills"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="languages">Bahasa yang dikuasai</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.languages === null
+                      ? 'Indonesia'
+                      : this.state.languages
+                  }
+                  defaultValue={
+                    this.state.languages === null ? null : this.state.languages
+                  }
+                  name="languages"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="certification">Sertifikasi</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.certification === null
+                      ? 'TOEFL'
+                      : this.state.certification
+                  }
+                  defaultValue={
+                    this.state.certification === null
+                      ? null
+                      : this.state.certification
+                  }
+                  name="certification"
+                />
+              </Form.Field>
+              <Form.Field>
                 <label htmlFor="student_toefl">TOEFL</label>
                 <input
                   onChange={this.handleChange}
@@ -520,22 +615,8 @@ export default class EditProfile extends ProfileHandler {
                   type="File"
                 />
               </Form.Field>
-
-            <Form.Field>
-              <label htmlFor="dependants">Dependants</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.dependants === null ? '0' : this.state.dependants
-                }
-                defaultValue={
-                  this.state.dependants === null ? null : this.state.dependants
-                }
-                name="dependants"
-              />
-            </Form.Field>
-          </Form>
-        </Segment>
+            </Form>
+          </Segment>
 
         <Segment className="links-form">
           <Header as="h3" textAlign="center">
@@ -655,4 +736,4 @@ export default class EditProfile extends ProfileHandler {
       <div className="profilePage">{this.updateForm(this.props.route.own)}</div>
     );
   }
-}
+}
\ No newline at end of file
-- 
GitLab


From 7f99314e3d215bafc6fe311ac1101d90462c6d09 Mon Sep 17 00:00:00 2001
From: tyagita <tiagita@gmail.com>
Date: Thu, 5 Dec 2019 17:34:11 +0700
Subject: [PATCH 3/5] Fixing editprofile and profile page

---
 assets/js/EditProfile.jsx | 811 +++++++++++++++++++-------------------
 assets/js/ProfilePage.jsx |  29 +-
 2 files changed, 419 insertions(+), 421 deletions(-)

diff --git a/assets/js/EditProfile.jsx b/assets/js/EditProfile.jsx
index 4bac8d25..8e9cec2f 100644
--- a/assets/js/EditProfile.jsx
+++ b/assets/js/EditProfile.jsx
@@ -227,318 +227,318 @@ export default class EditProfile extends React.Component {
     if (show) {
       return (
         <div className="editProfile">
-        <Segment className="profile-form">
-          <Header as="h3" textAlign="center">
-            <Icon name="edit" />
-            <Header.Content>Edit Profile Page</Header.Content>
-          </Header>
-          <ModalAlert
-            ref={(modal) => {
-              this.modalAlert = modal;
-            }}
-          />
-          <Form
-            ref={(input) => {
-              this.form = input;
-            }}
-            key={this.state.refresh}
-            size="small"
-          >
-            <Form.Field>
-              <label htmlFor="photo">Profile Picture</label>
-              <input
-                onChange={this.handleFile}
-                placeholder="Profile Photo.jpg"
-                name="photo"
-                type="File"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="email">Email</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.email === null
-                    ? 'jojon@email.com'
-                    : this.state.email
-                }
-                defaultValue={
-                  this.state.email === null ? null : this.state.email
-                }
-                name="email"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="phone_number">No. Hp</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.phone_number === null
-                    ? '08123456789'
-                    : this.state.phone_number
-                }
-                defaultValue={
-                  this.state.phone_number === null
-                    ? null
-                    : this.state.phone_number
-                }
-                name="phone_number"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="gender">Jenis Kelamin</label>
-              <Form.Radio
-                label="Perempuan"
-                name="gender"
-                value="Perempuan"
-                onClick={this.handleRadioGender}
-              />
-              <Form.Radio
-                label="Laki-laki"
-                name="gender"
-                value="Laki-laki"
-                onClick={this.handleRadioGender}
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="self_description">Deskripsi Diri</label>
-              <input
-                onChange={this.handleChange}
-                placeholder="Saya suka belajar"
-                name="self_description"
-              />
-            </Form.Field>
-            
-            <Form.Field>
-              <label htmlFor="region">Region</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.region === null ? 'Indonesia' : this.state.region
-                }
-                defaultValue={
-                  this.state.region === null ? null : this.state.region
-                }
-                name="region"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="alamat">Alamat</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.alamat === null
-                    ? 'JL. Satya Raya No.41'
-                    : this.state.alamat
-                }
-                defaultValue={
-                  this.state.alamat === null ? null : this.state.alamat
-                }
-                name="alamat"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="latest_work">Latest Working Experience</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.latest_work === null
-                    ? 'Teaching Asssistant at Fasilkom UI'
-                    : this.state.latest_work
-                }
-                defaultValue={
-                  this.state.latest_work === null
-                    ? null
-                    : this.state.latest_work
-                }
-                name="latest_work"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="latest_work_desc">
-                Latest Working Experience Description
+          <Segment className="profile-form">
+            <Header as="h3" textAlign="center">
+              <Icon name="edit" />
+              <Header.Content>Edit Profile Page</Header.Content>
+            </Header>
+            <ModalAlert
+              ref={(modal) => {
+                this.modalAlert = modal;
+              }}
+            />
+            <Form
+              ref={(input) => {
+                this.form = input;
+              }}
+              key={this.state.refresh}
+              size="small"
+            >
+              <Form.Field>
+                <label htmlFor="photo">Profile Picture</label>
+                <input
+                  onChange={this.handleFile}
+                  placeholder="Profile Photo.jpg"
+                  name="photo"
+                  type="File"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="email">Email</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.email === null
+                      ? 'jojon@email.com'
+                      : this.state.email
+                  }
+                  defaultValue={
+                    this.state.email === null ? null : this.state.email
+                  }
+                  name="email"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="phone_number">No. Hp</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.phone_number === null
+                      ? '08123456789'
+                      : this.state.phone_number
+                  }
+                  defaultValue={
+                    this.state.phone_number === null
+                      ? null
+                      : this.state.phone_number
+                  }
+                  name="phone_number"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="gender">Jenis Kelamin</label>
+                <Form.Radio
+                  label="Perempuan"
+                  name="gender"
+                  value="Perempuan"
+                  onClick={this.handleRadioGender}
+                />
+                <Form.Radio
+                  label="Laki-laki"
+                  name="gender"
+                  value="Laki-laki"
+                  onClick={this.handleRadioGender}
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="self_description">Deskripsi Diri</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder="Saya suka belajar"
+                  name="self_description"
+                />
+              </Form.Field>
+
+              <Form.Field>
+                <label htmlFor="region">Region</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.region === null ? 'Indonesia' : this.state.region
+                  }
+                  defaultValue={
+                    this.state.region === null ? null : this.state.region
+                  }
+                  name="region"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="alamat">Alamat</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.alamat === null
+                      ? 'JL. Satya Raya No.41'
+                      : this.state.alamat
+                  }
+                  defaultValue={
+                    this.state.alamat === null ? null : this.state.alamat
+                  }
+                  name="alamat"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="latest_work">Latest Working Experience</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.latest_work === null
+                      ? 'Teaching Asssistant at Fasilkom UI'
+                      : this.state.latest_work
+                  }
+                  defaultValue={
+                    this.state.latest_work === null
+                      ? null
+                      : this.state.latest_work
+                  }
+                  name="latest_work"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="latest_work_desc">
+                  Latest Working Experience Description
               </label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.latest_work_desc === null
-                    ? 'Evaluate weekly assignment for 15 students'
-                    : this.state.latest_work_desc
-                }
-                defaultValue={
-                  this.state.latest_work_desc === null
-                    ? null
-                    : this.state.latest_work_desc
-                }
-                name="latest_work_desc"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="awards">Awards and Achievements</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.awards === null
-                    ? 'Juara 2 UIUX Gemastik 2019'
-                    : this.state.awards
-                }
-                defaultValue={
-                  this.state.awards === null ? null : this.state.awards
-                }
-                name="awards"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="projects">Projects</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.projects === null
-                    ? 'Ow-Jek - Android Mobile Project'
-                    : this.state.projects
-                }
-                defaultValue={
-                  this.state.projects === null ? null : this.state.projects
-                }
-                name="projects"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="seminar">Seminar dan Training</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.seminar === null
-                    ? 'Seminar CompFest'
-                    : this.state.seminar
-                }
-                defaultValue={
-                  this.state.seminar === null ? null : this.state.seminar
-                }
-                name="seminar"
-              />
-            </Form.Field>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.latest_work_desc === null
+                      ? 'Evaluate weekly assignment for 15 students'
+                      : this.state.latest_work_desc
+                  }
+                  defaultValue={
+                    this.state.latest_work_desc === null
+                      ? null
+                      : this.state.latest_work_desc
+                  }
+                  name="latest_work_desc"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="awards">Awards and Achievements</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.awards === null
+                      ? 'Juara 2 UIUX Gemastik 2019'
+                      : this.state.awards
+                  }
+                  defaultValue={
+                    this.state.awards === null ? null : this.state.awards
+                  }
+                  name="awards"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="projects">Projects</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.projects === null
+                      ? 'Ow-Jek - Android Mobile Project'
+                      : this.state.projects
+                  }
+                  defaultValue={
+                    this.state.projects === null ? null : this.state.projects
+                  }
+                  name="projects"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="seminar">Seminar dan Training</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.seminar === null
+                      ? 'Seminar CompFest'
+                      : this.state.seminar
+                  }
+                  defaultValue={
+                    this.state.seminar === null ? null : this.state.seminar
+                  }
+                  name="seminar"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="interests">Interests</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={this.state.interests === null ? 'Machine Learning' : this.state.interests}
-                defaultValue={this.state.interests === null ? null : this.state.interests}
-                name="interests"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="interests">Interests</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={this.state.interests === null ? 'Machine Learning' : this.state.interests}
+                  defaultValue={this.state.interests === null ? null : this.state.interests}
+                  name="interests"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="related_course">Related Coursework Taken</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.related_course === null
-                    ? 'Intraction System, Machine Learning'
-                    : this.state.related_course
-                }
-                defaultValue={
-                  this.state.related_course === null ? null : this.state.related_course
-                }
-                name="related_course"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="related_course">Related Coursework Taken</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.related_course === null
+                      ? 'Intraction System, Machine Learning'
+                      : this.state.related_course
+                  }
+                  defaultValue={
+                    this.state.related_course === null ? null : this.state.related_course
+                  }
+                  name="related_course"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="resume">Resume</label>
-              <input
-                onChange={this.handleFile}
-                placeholder="Resume"
-                name="resume"
-                type="File"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="expected_salary">Expected Salary</label>
-              <input onChange={this.handleChange} placeholder="2000000" name="expected_salary" />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="intro">Intro</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.intro === null
-                    ? 'Ceritakan dirimu secara singkat'
-                    : this.state.intro
-                }
-                defaultValue={
-                  this.state.intro === null ? null : this.state.intro
-                }
-                name="intro"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="volunteer">Volunteering Experience</label>
-              <input
-                onChange={this.handleChange}
-                placeholder="Ketua Organisasi A - 2020"
-                name="volunteer"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="intro">Status Pencarian Kerja</label>
-              <Form.Radio
-                label="Aktif"
-                name="job_seeking_status"
-                value="Active"
-                onClick={this.handleRadio}
-              />
-              <Form.Radio
-                label="Pasif"
-                name="job_seeking_status"
-                value="Passive"
-                onClick={this.handleRadio}
-              />
-            </Form.Field>
-            <Form.Field>
-              <Checkbox
-                onChange={this.handleCheckbox}
-                checked={!!this.state.show_transcript}
-                label="Ijinkan perusahaan tempat saya mendaftar untuk melihat transkrip akademik saya"
-                name="show_transcript"
-              />
-            </Form.Field>
-            <Form.Field>
-              <label htmlFor="student_gpa">GPA</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.student_gpa === null
-                    ? '3.50'
-                    : this.state.student_gpa
-                }
-                defaultValue={
-                  this.state.student_gpa === null
-                    ? null
-                    : this.state.student_gpa
-                }
-                name="student_gpa"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="resume">Resume</label>
+                <input
+                  onChange={this.handleFile}
+                  placeholder="Resume"
+                  name="resume"
+                  type="File"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="expected_salary">Expected Salary</label>
+                <input onChange={this.handleChange} placeholder="2000000" name="expected_salary" />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="intro">Intro</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.intro === null
+                      ? 'Ceritakan dirimu secara singkat'
+                      : this.state.intro
+                  }
+                  defaultValue={
+                    this.state.intro === null ? null : this.state.intro
+                  }
+                  name="intro"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="volunteer">Volunteering Experience</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder="Ketua Organisasi A - 2020"
+                  name="volunteer"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="intro">Status Pencarian Kerja</label>
+                <Form.Radio
+                  label="Aktif"
+                  name="job_seeking_status"
+                  value="Active"
+                  onClick={this.handleRadio}
+                />
+                <Form.Radio
+                  label="Pasif"
+                  name="job_seeking_status"
+                  value="Passive"
+                  onClick={this.handleRadio}
+                />
+              </Form.Field>
+              <Form.Field>
+                <Checkbox
+                  onChange={this.handleCheckbox}
+                  checked={!!this.state.show_transcript}
+                  label="Ijinkan perusahaan tempat saya mendaftar untuk melihat transkrip akademik saya"
+                  name="show_transcript"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="student_gpa">GPA</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.student_gpa === null
+                      ? '3.50'
+                      : this.state.student_gpa
+                  }
+                  defaultValue={
+                    this.state.student_gpa === null
+                      ? null
+                      : this.state.student_gpa
+                  }
+                  name="student_gpa"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="dependants">Dependants</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.dependants === null ? '0' : this.state.dependants
-                }
-                defaultValue={
-                  this.state.dependants === null ? null : this.state.dependants
-                }
-                name="dependants"
-              />
-            </Form.Field>
-          </Form>
-        </Segment>
+              <Form.Field>
+                <label htmlFor="dependants">Dependants</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.dependants === null ? '0' : this.state.dependants
+                  }
+                  defaultValue={
+                    this.state.dependants === null ? null : this.state.dependants
+                  }
+                  name="dependants"
+                />
+              </Form.Field>
+            </Form>
+          </Segment>
 
-        <Segment>
+          <Segment>
             <Header as="h3" textAlign="center">
               <Icon name="edit" />
               <Header.Content>Edit Skills</Header.Content>
@@ -549,7 +549,6 @@ export default class EditProfile extends React.Component {
               }}
               key={this.state.refresh}
               size="small"
-              onSubmit={this.handleSubmit}
             >
               <Form.Field>
                 <label htmlFor="skills">Skills</label>
@@ -618,111 +617,111 @@ export default class EditProfile extends React.Component {
             </Form>
           </Segment>
 
-        <Segment className="links-form">
-          <Header as="h3" textAlign="center">
-            <Icon name="edit" />
-            <Header.Content>Edit Links</Header.Content>
-          </Header>
-          <Form
-            ref={(input) => {
-              this.form = input;
-            }}
-            key={this.state.refresh}
-            size="small"
-            onSubmit={this.handleSubmit}
-          >
+          <Segment className="links-form">
+            <Header as="h3" textAlign="center">
+              <Icon name="edit" />
+              <Header.Content>Edit Links</Header.Content>
+            </Header>
+            <Form
+              ref={(input) => {
+                this.form = input;
+              }}
+              key={this.state.refresh}
+              size="small"
+            >
 
-          <Form.Field>
-              <label htmlFor="portfolio_link">Portfolio Link</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.portfolio_link === null
-                    ? 'https://www.example.com/myproject/'
-                    : this.state.portfolio_link
-                }
-                defaultValue={
-                  this.state.portfolio_link === null
-                    ? null
-                    : this.state.portfolio_link
-                }
-                name="portfolio_link"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="portfolio_link">Portfolio Link</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.portfolio_link === null
+                      ? 'https://www.example.com/myproject/'
+                      : this.state.portfolio_link
+                  }
+                  defaultValue={
+                    this.state.portfolio_link === null
+                      ? null
+                      : this.state.portfolio_link
+                  }
+                  name="portfolio_link"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="linkedin_url">URL Profile LinkedIn</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.linkedin_url === null
-                    ? 'https://www.linkedin.com/in/jojo/'
-                    : this.state.linkedin_url
-                }
-                defaultValue={
-                  this.state.linkedin_url === null
-                    ? null
-                    : this.state.linkedin_url
-                }
-                name="linkedin_url"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="linkedin_url">URL Profile LinkedIn</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.linkedin_url === null
+                      ? 'https://www.linkedin.com/in/jojo/'
+                      : this.state.linkedin_url
+                  }
+                  defaultValue={
+                    this.state.linkedin_url === null
+                      ? null
+                      : this.state.linkedin_url
+                  }
+                  name="linkedin_url"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="hackerrank_url">URL Profile Hackerrank</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.hackerrank_url === null
-                    ? 'https://www.hackerrank.com/james'
-                    : this.state.hackerrank_url
-                }
-                defaultValue={
-                  this.state.hackerrank_url === null
-                    ? null
-                    : this.state.hackerrank_url
-                }
-                name="hackerrank_url"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="hackerrank_url">URL Profile Hackerrank</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.hackerrank_url === null
+                      ? 'https://www.hackerrank.com/james'
+                      : this.state.hackerrank_url
+                  }
+                  defaultValue={
+                    this.state.hackerrank_url === null
+                      ? null
+                      : this.state.hackerrank_url
+                  }
+                  name="hackerrank_url"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="website_url">Website URL</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={
-                  this.state.website_url === null
-                    ? 'https://www.example.com/'
-                    : this.state.website_url
-                }
-                defaultValue={
-                  this.state.website_url === null
-                    ? null
-                    : this.state.website_url
-                }
-                name="website_url"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="website_url">Website URL</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.website_url === null
+                      ? 'https://www.example.com/'
+                      : this.state.website_url
+                  }
+                  defaultValue={
+                    this.state.website_url === null
+                      ? null
+                      : this.state.website_url
+                  }
+                  name="website_url"
+                />
+              </Form.Field>
 
-            <Form.Field>
-              <label htmlFor="github_url">URL Profile Github</label>
-              <input
-                onChange={this.handleChange}
-                placeholder={this.state.github_url === null ? 'https://github.com/bob' : this.state.github_url}
-                defaultValue={this.state.github_url === null ? null : this.state.github_url}
-                name="github_url"
-              />
-            </Form.Field>
+              <Form.Field>
+                <label htmlFor="github_url">URL Profile Github</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={this.state.github_url === null ? 'https://github.com/bob' : this.state.github_url}
+                  defaultValue={this.state.github_url === null ? null : this.state.github_url}
+                  name="github_url"
+                />
+              </Form.Field>
             </Form>
-        </Segment>
-        <Button onClick={this.handleSubmit}
-              fluid
-              type="submit"
-              size="small"
-              loading={this.state.loading}
-              primary
-            >
-              Submit
+          </Segment>
+          <Button
+            onClick={this.handleSubmit}
+            fluid
+            type="submit"
+            size="small"
+            loading={this.state.loading}
+            primary
+          >
+            Submit
             </Button>
         </div>
       );
diff --git a/assets/js/ProfilePage.jsx b/assets/js/ProfilePage.jsx
index 88012ecf..8a2d10a0 100755
--- a/assets/js/ProfilePage.jsx
+++ b/assets/js/ProfilePage.jsx
@@ -573,21 +573,6 @@ export default class ProfilePage extends ProfileHandler {
                       </Grid.Column>
                     </Grid>
                   </Segment>
-
-                  <Segment basic vertical>
-                    <Grid>
-                      <Grid.Column width={2}>
-                        <Icon name="certificate" size="big" />
-                      </Grid.Column>
-                      <Grid.Column width={13}>
-                        <p>
-                          {' '}
-                          {this.state.certification || 'N/A'}
-                          {' '}
-                        </p>
-                      </Grid.Column>
-                    </Grid>
-                  </Segment>
                   <Segment basic vertical>
                     <Grid>
                       <Grid.Column width={2}>
@@ -808,6 +793,20 @@ export default class ProfilePage extends ProfileHandler {
                   </Grid.Column>
                 </Grid>
               </Segment>
+              <Segment basic vertical>
+                <Grid>
+                  <Grid.Column width={2}>
+                    <Icon name="certificate" size="big" />
+                  </Grid.Column>
+                  <Grid.Column width={13}>
+                    <p>
+                      {' '}
+                      {this.state.certification || 'N/A'}
+                      {' '}
+                    </p>
+                  </Grid.Column>
+                </Grid>
+              </Segment>
               <Segment basic vertical>
                 <Grid>
                   <Grid.Column width={2}>
-- 
GitLab


From 59b53de92fb3b87f9bb87327fb1f6bf4663ddc64 Mon Sep 17 00:00:00 2001
From: tyagita <tiagita@gmail.com>
Date: Thu, 5 Dec 2019 20:25:39 +0700
Subject: [PATCH 4/5] merge conflict with master

---
 assets/js/EditProfile.jsx | 132 ++++++++++++++++++--------------------
 1 file changed, 64 insertions(+), 68 deletions(-)

diff --git a/assets/js/EditProfile.jsx b/assets/js/EditProfile.jsx
index fb783206..c27ba056 100644
--- a/assets/js/EditProfile.jsx
+++ b/assets/js/EditProfile.jsx
@@ -389,29 +389,6 @@ export default class EditProfile extends React.Component {
                   name="volunteer"
                 />
               </Form.Field>
-              <Form.Field>
-                <label htmlFor="intro">Status Pencarian Kerja</label>
-                <Form.Radio
-                  label="Aktif"
-                  name="job_seeking_status"
-                  value="Active"
-                  onClick={this.handleRadio}
-                />
-                <Form.Radio
-                  label="Pasif"
-                  name="job_seeking_status"
-                  value="Passive"
-                  onClick={this.handleRadio}
-                />
-              </Form.Field>
-              <Form.Field>
-                <Checkbox
-                  onChange={this.handleCheckbox}
-                  checked={!!this.state.show_transcript}
-                  label="Ijinkan perusahaan tempat saya mendaftar untuk melihat transkrip akademik saya"
-                  name="show_transcript"
-                />
-              </Form.Field>
               <Form.Field>
                 <label htmlFor="student_gpa">GPA</label>
                 <input
@@ -429,7 +406,6 @@ export default class EditProfile extends React.Component {
                   name="student_gpa"
                 />
               </Form.Field>
-
               <Form.Field>
                 <label htmlFor="resume">Resume</label>
                 <input
@@ -458,29 +434,6 @@ export default class EditProfile extends React.Component {
                   name="intro"
                 />
               </Form.Field>
-              <Form.Field>
-                <label htmlFor="intro">Status Pencarian Kerja</label>
-                <Form.Radio
-                  label="Aktif"
-                  name="job_seeking_status"
-                  value="Active"
-                  onClick={this.handleRadio}
-                />
-                <Form.Radio
-                  label="Pasif"
-                  name="job_seeking_status"
-                  value="Passive"
-                  onClick={this.handleRadio}
-                />
-              </Form.Field>
-              <Form.Field>
-                <Checkbox
-                  onChange={this.handleCheckbox}
-                  checked={!!this.state.show_transcript}
-                  label="Ijinkan perusahaan tempat saya mendaftar untuk melihat transkrip akademik saya"
-                  name="show_transcript"
-                />
-              </Form.Field>
               <Form.Field>
                 <label htmlFor="student_gpa">GPA</label>
                 <input
@@ -498,9 +451,6 @@ export default class EditProfile extends React.Component {
                   name="student_gpa"
                 />
               </Form.Field>
-
-
-
               <Form.Field>
                 <label htmlFor="dependants">Dependants</label>
                 <input
@@ -514,6 +464,29 @@ export default class EditProfile extends React.Component {
                   name="dependants"
                 />
               </Form.Field>
+              <Form.Field>
+                <label htmlFor="intro">Status Pencarian Kerja</label>
+                <Form.Radio
+                  label="Aktif"
+                  name="job_seeking_status"
+                  value="Active"
+                  onClick={this.handleRadio}
+                />
+                <Form.Radio
+                  label="Pasif"
+                  name="job_seeking_status"
+                  value="Passive"
+                  onClick={this.handleRadio}
+                />
+              </Form.Field>
+              <Form.Field>
+                <Checkbox
+                  onChange={this.handleCheckbox}
+                  checked={!!this.state.show_transcript}
+                  label="Ijinkan perusahaan tempat saya mendaftar untuk melihat transkrip akademik saya"
+                  name="show_transcript"
+                />
+              </Form.Field>
             </Form>
           </Segment>
 
@@ -585,24 +558,6 @@ export default class EditProfile extends React.Component {
                 />
               </Form.Field>
 
-              <Form.Field>
-                <label htmlFor="certification">Sertifikasi</label>
-                <input
-                  onChange={this.handleChange}
-                  placeholder={
-                    this.state.certification === null
-                      ? 'TOEFL'
-                      : this.state.certification
-                  }
-                  defaultValue={
-                    this.state.certification === null
-                      ? null
-                      : this.state.certification
-                  }
-                  name="certification"
-                />
-              </Form.Field>
-
               <Form.Field>
                 <label htmlFor="projects">Projects</label>
                 <input
@@ -683,8 +638,49 @@ export default class EditProfile extends React.Component {
                   name="languages"
                 />
               </Form.Field>
+              <Form.Field>
+                <label htmlFor="certification">Sertifikasi</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.certification === null
+                      ? 'TOEFL'
+                      : this.state.certification
+                  }
+                  defaultValue={
+                    this.state.certification === null
+                      ? null
+                      : this.state.certification
+                  }
+                  name="certification"
+                />
+              </Form.Field>
+              <Form.Field>
+                <label htmlFor="student_toefl">TOEFL</label>
+                <input
+                  onChange={this.handleChange}
+                  placeholder={
+                    this.state.student_toefl === null
+                      ? '400'
+                      : this.state.student_toefl
+                  }
+                  defaultValue={
+                    this.state.student_toefl === null
+                      ? null
+                      : this.state.student_toefl
+                  }
+                  name="student_toefl"
+                />
+                <input
+                  onChange={this.handleFile}
+                  placeholder="TOEFL file"
+                  name="student_toefl_file"
+                  type="File"
+                />
+              </Form.Field>
             </Form>
           </Segment>
+
           <Segment className="links-form">
             <Header as="h3" textAlign="center">
               <Icon name="edit" />
-- 
GitLab


From 5adfc1552550e1ecf15825a0de29b5d95cf959d2 Mon Sep 17 00:00:00 2001
From: tyagita <tiagita@gmail.com>
Date: Thu, 5 Dec 2019 20:55:25 +0700
Subject: [PATCH 5/5] Fixing duplication code

---
 assets/js/EditProfile.jsx    | 71 +-----------------------------------
 assets/js/ProfileHandler.jsx |  1 +
 2 files changed, 3 insertions(+), 69 deletions(-)

diff --git a/assets/js/EditProfile.jsx b/assets/js/EditProfile.jsx
index c27ba056..a6510952 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
index e21b96aa..40cb8ae4 100644
--- a/assets/js/ProfileHandler.jsx
+++ b/assets/js/ProfileHandler.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import Server from './lib/Server';
 import Dumper from './lib/Dumper';
 import { isFromGithubLinkValid } from './Utils';
 
-- 
GitLab