From 07a3d810065e6e8b838c5e53bc7d18241e0ff3c5 Mon Sep 17 00:00:00 2001
From: jackyzha0 <j.zhao2k19@gmail.com>
Date: Tue, 12 May 2020 21:09:50 -0700
Subject: password modal

---
 frontend/src/components/PasswordModal.js | 73 ++++++++++++++++++++++++++++++++
 1 file changed, 73 insertions(+)
 create mode 100644 frontend/src/components/PasswordModal.js

(limited to 'frontend/src/components/PasswordModal.js')

diff --git a/frontend/src/components/PasswordModal.js b/frontend/src/components/PasswordModal.js
new file mode 100644
index 0000000..ef96f9d
--- /dev/null
+++ b/frontend/src/components/PasswordModal.js
@@ -0,0 +1,73 @@
+import React from 'react';
+import Modal from 'react-modal';
+import styled from 'styled-components'
+import { PassInput } from './Inputs'
+
+const modalStyles = {
+    content: {
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)',
+        width: '400px',
+        height: '250px',
+        border: '1px solid #11111188'
+    }
+};
+
+const PassProtected = styled.h3`
+    font-weight: 700
+`
+
+const RightPad = styled.div`
+    margin-right: 3em;
+`
+
+const LeftPad = styled.div`
+    margin-left: 2em;
+`
+
+class PasswordModal extends React.Component {
+
+    componentWillMount() {
+        Modal.setAppElement('body');
+    }
+
+    constructor(props) {
+        super(props);
+
+        this.submitPassword = this.submitPassword.bind(this);
+    }
+
+    submitPassword(event) {
+        const password = this.props.value
+        this.props.validateCallback(password)
+        event.preventDefault();
+    }
+
+    render() {
+        return(
+            <Modal
+                isOpen={this.props.hasPass && !this.props.validPass}
+                style={modalStyles}
+                contentLabel="enter paste password"
+                classNames
+            >
+                <form onSubmit={this.submitPassword}>
+                    <LeftPad>
+                        <PassProtected><span role="img" aria-label="warning">🚧&nbsp;</span>err: password protected</PassProtected>
+                    </LeftPad>
+                    <RightPad>
+                        <PassInput
+                            value={this.props.value}
+                            onChange={this.props.onChange} />
+                    </RightPad>
+                    <LeftPad>
+                        <input className="lt-button lt-shadow lt-hover" type="submit" value="continue" />
+                    </LeftPad>
+                </form>
+            </Modal>
+        );
+    }
+}
+
+export default PasswordModal
\ No newline at end of file
-- 
cgit v1.2.3


From 4c6d5b49deb330200cbedc76334e6aa9cd848c94 Mon Sep 17 00:00:00 2001
From: jackyzha0 <j.zhao2k19@gmail.com>
Date: Tue, 12 May 2020 21:39:57 -0700
Subject: working password render

---
 frontend/src/components/PasswordModal.js | 2 ++
 1 file changed, 2 insertions(+)

(limited to 'frontend/src/components/PasswordModal.js')

diff --git a/frontend/src/components/PasswordModal.js b/frontend/src/components/PasswordModal.js
index ef96f9d..4b37dfe 100644
--- a/frontend/src/components/PasswordModal.js
+++ b/frontend/src/components/PasswordModal.js
@@ -2,6 +2,7 @@ import React from 'react';
 import Modal from 'react-modal';
 import styled from 'styled-components'
 import { PassInput } from './Inputs'
+import Error from './Err';
 
 const modalStyles = {
     content: {
@@ -63,6 +64,7 @@ class PasswordModal extends React.Component {
                     </RightPad>
                     <LeftPad>
                         <input className="lt-button lt-shadow lt-hover" type="submit" value="continue" />
+                        <Error msg={this.props.error} />
                     </LeftPad>
                 </form>
             </Modal>
-- 
cgit v1.2.3


From 94a9b304546dd1213ef2f15e57f5966ab88b80b7 Mon Sep 17 00:00:00 2001
From: jackyzha0 <j.zhao2k19@gmail.com>
Date: Tue, 12 May 2020 23:08:20 -0700
Subject: abstract err show logic

---
 frontend/src/components/PasswordModal.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'frontend/src/components/PasswordModal.js')

diff --git a/frontend/src/components/PasswordModal.js b/frontend/src/components/PasswordModal.js
index 4b37dfe..ff4a0df 100644
--- a/frontend/src/components/PasswordModal.js
+++ b/frontend/src/components/PasswordModal.js
@@ -35,8 +35,8 @@ class PasswordModal extends React.Component {
 
     constructor(props) {
         super(props);
-
         this.submitPassword = this.submitPassword.bind(this);
+        this.ErrorLabel = React.createRef();
     }
 
     submitPassword(event) {
@@ -64,7 +64,7 @@ class PasswordModal extends React.Component {
                     </RightPad>
                     <LeftPad>
                         <input className="lt-button lt-shadow lt-hover" type="submit" value="continue" />
-                        <Error msg={this.props.error} />
+                        <Error ref={this.ErrorLabel} />
                     </LeftPad>
                 </form>
             </Modal>
-- 
cgit v1.2.3