From b2aa735a82fa3a5f9a400baba4dca0d333fa2697 Mon Sep 17 00:00:00 2001
From: Juan Pakpahan <pakpahanjuan46@gmail.com>
Date: Mon, 25 Nov 2019 19:05:06 +0700
Subject: [PATCH 1/3] reduce code duplication by making parent class for
 ApplyModal and InfoModal

---
 assets/js/components/ApplyModal.jsx   | 55 ++-----------------------
 assets/js/components/GeneralModal.jsx | 58 +++++++++++++++++++++++++++
 assets/js/components/InfoModal.jsx    | 53 +-----------------------
 3 files changed, 63 insertions(+), 103 deletions(-)
 create mode 100644 assets/js/components/GeneralModal.jsx

diff --git a/assets/js/components/ApplyModal.jsx b/assets/js/components/ApplyModal.jsx
index 17db0d87..dd32c9c3 100755
--- a/assets/js/components/ApplyModal.jsx
+++ b/assets/js/components/ApplyModal.jsx
@@ -11,59 +11,10 @@ import {
 } from 'semantic-ui-react';
 import ModalAlert from './../components/ModalAlert';
 import Server from './../lib/Server';
+import GeneralModal from './GeneralModal';
 
-export default class ApplyModal extends React.Component {
-  static propTypes = {
-    data: PropTypes.object.isRequired,
-    active: PropTypes.bool.isRequired,
-    buttonTitle: PropTypes.string.isRequired,
-    resume: PropTypes.string,
-    studentId: PropTypes.number.isRequired,
-    updateStatus: PropTypes.func.isRequired,
-  };
-
-  constructor(props) {
-    super(props);
-    /* istanbul ignore next */
-    this.state = {
-      modalOpen: false,
-      coverLetter: '',
-      load: false,
-    };
-    this.handleChange = this.handleChange.bind(this);
-    this.handleOpen = this.handleOpen.bind(this);
-    this.handleApply = this.handleApply.bind(this);
-  }
-
-  componentWillUpdate() {
-    this.fixBody();
-  }
-
-  componentDidUpdate() {
-    this.fixBody();
-  }
-
-  fixBody = () => {
-    const anotherModal = document.getElementsByClassName('ui page modals')
-      .length;
-    if (anotherModal > 0)
-      document.body.classList.add('scrolling', 'dimmable', 'dimmed');
-  };
-
-  handleChange(event) {
-    this.setState({ coverLetter: event.target.value });
-  }
-
-  handleOpen() {
-    this.setState({ modalOpen: true });
-  }
-
-  handleClose = () =>
-    this.setState({
-      modalOpen: false,
-      load: false,
-    });
-
+export default class ApplyModal extends GeneralModal {
+  
   handleApply = () => {
     if (this.props.resume) {
       this.setState({ load: true });
diff --git a/assets/js/components/GeneralModal.jsx b/assets/js/components/GeneralModal.jsx
new file mode 100644
index 00000000..f38e6089
--- /dev/null
+++ b/assets/js/components/GeneralModal.jsx
@@ -0,0 +1,58 @@
+import React from 'react';	
+import PropTypes from 'prop-types';
+import ModalAlert from './../components/ModalAlert';
+
+export default class GeneralModal extends React.Component {
+    static propTypes = {
+      data: PropTypes.object.isRequired,
+      active: PropTypes.bool.isRequired,
+      buttonTitle: PropTypes.string.isRequired,
+      resume: PropTypes.string,
+      studentId: PropTypes.number.isRequired,
+      updateStatus: PropTypes.func.isRequired,
+    };
+  
+    constructor(props) {
+      super(props);
+      /* istanbul ignore next */
+      this.state = {
+        modalOpen: false,
+        coverLetter: '',
+        load: false,
+      };
+      this.handleChange = this.handleChange.bind(this);
+      this.handleOpen = this.handleOpen.bind(this);
+      this.handleApply = this.handleApply.bind(this);
+    }
+  
+    componentWillUpdate() {
+      this.fixBody();
+    }
+  
+    componentDidUpdate() {
+      this.fixBody();
+    }
+  
+    fixBody = () => {
+      const anotherModal = document.getElementsByClassName('ui page modals')
+        .length;
+      if (anotherModal > 0)
+        document.body.classList.add('scrolling', 'dimmable', 'dimmed');
+    };
+  
+    handleChange(event) {
+      this.setState({ coverLetter: event.target.value });
+    }
+  
+    handleOpen() {
+      this.setState({ modalOpen: true });
+    }
+  
+    handleClose = () =>
+      this.setState({
+        modalOpen: false,
+        load: false,
+      });
+  
+    }
+}
diff --git a/assets/js/components/InfoModal.jsx b/assets/js/components/InfoModal.jsx
index 18921da2..940aba74 100644
--- a/assets/js/components/InfoModal.jsx
+++ b/assets/js/components/InfoModal.jsx
@@ -2,58 +2,9 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Modal, Button } from 'semantic-ui-react';
 import ModalAlert from './../components/ModalAlert';
+import GeneralModal from './GeneralModal';
 
-export default class InfoModal extends React.Component {
-  static propTypes = {
-    data: PropTypes.object.isRequired,
-    active: PropTypes.bool.isRequired,
-    buttonTitle: PropTypes.string.isRequired,
-    resume: PropTypes.string,
-    studentId: PropTypes.number.isRequired,
-    updateStatus: PropTypes.func.isRequired,
-  };
-
-  constructor(props) {
-    super(props);
-    /* istanbul ignore next */
-    this.state = {
-      modalOpen: false,
-      coverLetter: '',
-      load: false,
-    };
-    this.handleChange = this.handleChange.bind(this);
-    this.handleOpen = this.handleOpen.bind(this);
-    this.handleApply = this.handleApply.bind(this);
-  }
-
-  componentWillUpdate() {
-    this.fixBody();
-  }
-
-  componentDidUpdate() {
-    this.fixBody();
-  }
-
-  fixBody = () => {
-    const anotherModal = document.getElementsByClassName('ui page modals')
-      .length;
-    if (anotherModal > 0)
-      document.body.classList.add('scrolling', 'dimmable', 'dimmed');
-  };
-
-  handleChange(event) {
-    this.setState({ coverLetter: event.target.value });
-  }
-
-  handleOpen() {
-    this.setState({ modalOpen: true });
-  }
-
-  handleClose = () =>
-    this.setState({
-      modalOpen: false,
-      load: false,
-    });
+export default class InfoModal extends GeneralModal {
 
   handleApply = () => {
     this.setState({ load: true });
-- 
GitLab


From e1d23294c4da3c0caf00f6cf8e4caecb341f3a9e Mon Sep 17 00:00:00 2001
From: Juan Pakpahan <juan.alexander@ui.ac.id>
Date: Tue, 26 Nov 2019 20:39:57 +0700
Subject: [PATCH 2/3] fix GeneralModal class error

---
 assets/js/components/GeneralModal.jsx | 101 +++++++++++++-------------
 1 file changed, 50 insertions(+), 51 deletions(-)

diff --git a/assets/js/components/GeneralModal.jsx b/assets/js/components/GeneralModal.jsx
index f38e6089..7ffc6fd0 100644
--- a/assets/js/components/GeneralModal.jsx
+++ b/assets/js/components/GeneralModal.jsx
@@ -3,56 +3,55 @@ import PropTypes from 'prop-types';
 import ModalAlert from './../components/ModalAlert';
 
 export default class GeneralModal extends React.Component {
-    static propTypes = {
-      data: PropTypes.object.isRequired,
-      active: PropTypes.bool.isRequired,
-      buttonTitle: PropTypes.string.isRequired,
-      resume: PropTypes.string,
-      studentId: PropTypes.number.isRequired,
-      updateStatus: PropTypes.func.isRequired,
-    };
-  
-    constructor(props) {
-      super(props);
-      /* istanbul ignore next */
-      this.state = {
-        modalOpen: false,
-        coverLetter: '',
-        load: false,
-      };
-      this.handleChange = this.handleChange.bind(this);
-      this.handleOpen = this.handleOpen.bind(this);
-      this.handleApply = this.handleApply.bind(this);
-    }
-  
-    componentWillUpdate() {
-      this.fixBody();
-    }
-  
-    componentDidUpdate() {
-      this.fixBody();
-    }
-  
-    fixBody = () => {
-      const anotherModal = document.getElementsByClassName('ui page modals')
-        .length;
-      if (anotherModal > 0)
-        document.body.classList.add('scrolling', 'dimmable', 'dimmed');
+  static propTypes = {
+    data: PropTypes.object.isRequired,
+    active: PropTypes.bool.isRequired,
+    buttonTitle: PropTypes.string.isRequired,
+    resume: PropTypes.string,
+    studentId: PropTypes.number.isRequired,
+    updateStatus: PropTypes.func.isRequired,
+  };
+
+  constructor(props) {
+    super(props);
+    /* istanbul ignore next */
+    this.state = {
+      modalOpen: false,
+      coverLetter: '',
+      load: false,
     };
-  
-    handleChange(event) {
-      this.setState({ coverLetter: event.target.value });
-    }
-  
-    handleOpen() {
-      this.setState({ modalOpen: true });
-    }
-  
-    handleClose = () =>
-      this.setState({
-        modalOpen: false,
-        load: false,
-      });
-  
-    }
+    this.handleChange = this.handleChange.bind(this);
+    this.handleOpen = this.handleOpen.bind(this);
+    this.handleApply = this.handleApply.bind(this);
+  }
+
+  componentWillUpdate() {
+    this.fixBody();
+  }
+
+  componentDidUpdate() {
+    this.fixBody();
+  }
+
+  fixBody = () => {
+    const anotherModal = document.getElementsByClassName('ui page modals')
+      .length;
+    if (anotherModal > 0)
+      document.body.classList.add('scrolling', 'dimmable', 'dimmed');
+  };
+
+  handleChange(event) {
+    this.setState({ coverLetter: event.target.value });
+  }
+
+  handleOpen() {
+    this.setState({ modalOpen: true });
+  }
+
+  handleClose = () =>
+    this.setState({
+      modalOpen: false,
+      load: false,
+  });
 }
+
-- 
GitLab


From ef5ba699a805bd17cc1267dba15a4ffdd310bc3d Mon Sep 17 00:00:00 2001
From: Juan Pakpahan <juan.alexander@ui.ac.id>
Date: Tue, 26 Nov 2019 21:02:03 +0700
Subject: [PATCH 3/3] try fix handleApply issue on GeneralModal

---
 assets/js/components/GeneralModal.jsx | 4 ++++
 assets/js/components/InfoModal.jsx    | 4 ----
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/assets/js/components/GeneralModal.jsx b/assets/js/components/GeneralModal.jsx
index 7ffc6fd0..de77b992 100644
--- a/assets/js/components/GeneralModal.jsx
+++ b/assets/js/components/GeneralModal.jsx
@@ -53,5 +53,9 @@ export default class GeneralModal extends React.Component {
       modalOpen: false,
       load: false,
   });
+
+  handleApply = () => {
+    this.setState({ load: true });
+  };
 }
 
diff --git a/assets/js/components/InfoModal.jsx b/assets/js/components/InfoModal.jsx
index 940aba74..228223a2 100644
--- a/assets/js/components/InfoModal.jsx
+++ b/assets/js/components/InfoModal.jsx
@@ -6,10 +6,6 @@ import GeneralModal from './GeneralModal';
 
 export default class InfoModal extends GeneralModal {
 
-  handleApply = () => {
-    this.setState({ load: true });
-  };
-
   render() {
     return (
       <Modal
-- 
GitLab