Merge pull request #20 from jackyzha0/pass-rendering

rendering password protected pastes

1 files changed, 19 insertions, 66 deletions

diff --git a/frontend/src/components/NewPaste.js b/frontend/src/components/NewPaste.js
index 3bdd41a..f48f48b 100644
--- a/frontend/src/components/NewPaste.js
+++ b/frontend/src/components/NewPaste.js
@@ -1,9 +1,9 @@
 import React from 'react';
 import { TitleInput, PasteInput } from './Inputs'
 import OptionsContainer from './Options'
-import axios from 'axios';
 import { Redirect } from 'react-router-dom'
 import Error from './Err'
+import { PostNewPaste } from '../helpers/httpHelper'
 
 class NewPaste extends React.Component {
     constructor(props) {
@@ -19,13 +19,7 @@ class NewPaste extends React.Component {
 
         this.handleChange = this.handleChange.bind(this);
         this.handleSubmit = this.handleSubmit.bind(this);
-    }
-
-    newErr(msg, duration = 5000) {
-        this.setState({ error: msg })
-        setTimeout(() => {
-            this.setState({ error: '' })
-        }, duration);
+        this.ErrorLabel = React.createRef();
     }
 
     renderRedirect = () => {
@@ -52,65 +46,24 @@ class NewPaste extends React.Component {
         });
     }
 
-    parseExpiry(e) {
-        var cur = new Date();
-        var inSeconds = 0
-        switch (e) {
-            case '5 years':
-                inSeconds = 600 * 6 * 24 * 7 * 4 * 12 * 5
-                break;
-            case '1 year':
-                inSeconds = 600 * 6 * 24 * 7 * 4 * 12
-                break;
-            case '1 month':
-                inSeconds = 600 * 6 * 24 * 7 * 4
-                break;
-            case '1 day':
-                inSeconds = 600 * 6 * 24
-                break;
-            case '1 hour':
-                inSeconds = 600 * 6
-                break;
-            case '10 min':
-                inSeconds = 600
-                break;
-            case '1 week':
-            default:
-                inSeconds = 600 * 6 * 24 * 7
-                break;
-        }
-        return new Date(cur.getTime() + inSeconds * 1000).toISOString();
-    }
-
     handleSubmit(event) {
-        var bodyFormData = new FormData();
-        bodyFormData.set('title', this.state.title);
-        bodyFormData.set('content', this.state.content);
-        bodyFormData.set('password', this.state.pass);
-        bodyFormData.set('expiry', this.parseExpiry(this.state.expiry));
-
-        axios({
-            method: 'post',
-            url: 'http://localhost:8080/api',
-            data: bodyFormData,
-            headers: { 'Content-Type': 'multipart/form-data' },
-        }).then((response) => {
-            // on success, redir
-            this.setState({ hash: response.data.hash })
-        }).catch((error) => {
-            const resp = error.response
-
-            // some weird err
-            if (resp !== undefined) {
-                const errTxt = `${resp.statusText}: ${resp.data}`
-                this.newErr(errTxt)
-            } else {
-                // some weird err (e.g. network)
-                this.newErr(error)
-            }
-        });
-
         event.preventDefault();
+        PostNewPaste(this.state)
+            .then((response) => {
+                // on success, redir
+                this.setState({ hash: response.data.hash })
+            }).catch((error) => {
+                const resp = error.response
+
+                // some weird err
+                if (resp !== undefined) {
+                    const errTxt = `${resp.statusText}: ${resp.data}`
+                    this.ErrorLabel.current.showMessage(errTxt)
+                } else {
+                    // some weird err (e.g. network)
+                    this.ErrorLabel.current.showMessage(error)
+                }
+            });
     }
 
     render() {
@@ -128,7 +81,7 @@ class NewPaste extends React.Component {
                     maxLength="100000"
                     id="pasteInput" />
                 <input className="lt-button lt-shadow lt-hover" type="submit" value="new paste" />
-                <Error msg={this.state.error} />
+                <Error ref={this.ErrorLabel} />
                 <OptionsContainer
                     pass={this.state.pass}
                     expiry={this.state.expiry}