backend redir

6 files changed, 57 insertions, 17 deletions

diff --git a/frontend/src/components/App.js b/frontend/src/components/App.js
index 2f438e9..605903e 100644
--- a/frontend/src/components/App.js
+++ b/frontend/src/components/App.js
@@ -1,28 +1,34 @@
 import React from 'react';
-import PasteArea from './PasteArea'
+import NewPaste from './NewPaste'
+import ViewPaste from './ViewPaste'
 import Footer from './Footer'
 import styled from 'styled-components'
 import {
   BrowserRouter as Router,
   Switch,
   Route,
-  Link
+  Link,
+  useParams
 } from "react-router-dom";
 
 const SpacedTitle = styled.div`
     margin-top: 10vh
 `
 
-const Inline = styled.div`
-    display: inline-block
-`
-
 const Desc = () => {
   return (
     <h3>a modern, <a href="https://github.com/jackyzha0/ctrl-v" target="_blank" rel="noopener noreferrer">open-source</a> pastebin with latex and markdown rendering support</h3>
   );
 }
 
+const GetPasteWithParam = () => {
+  let { hash } = useParams();
+
+  return (
+    <ViewPaste hash = {hash} />
+  );
+}
+
 function App() {
   return (
     <Router>
@@ -38,7 +44,14 @@ function App() {
           </nav>
         </SpacedTitle>
 
-        <PasteArea/>
+        <Switch>
+          <Route path="/:hash" 
+            children={<GetPasteWithParam />} 
+          />
+          <Route path="/">
+            <NewPaste />
+          </Route>
+        </Switch>
 
         <Footer />
       </div>
diff --git a/frontend/src/components/Inputs.js b/frontend/src/components/Inputs.js
index 110d5bd..25a4b8e 100644
--- a/frontend/src/components/Inputs.js
+++ b/frontend/src/components/Inputs.js
@@ -1,7 +1,7 @@
 import React from 'react';
-import CharLimit from './CharLimit'
+import CharLimit from './decorators/CharLimit'
 import styled from 'styled-components'
-import FloatingLabel from './FloatingLabel'
+import FloatingLabel from './decorators/FloatingLabel'
 import Dropdown from 'react-dropdown';
 
 const CharLimitContainer = styled.div`
diff --git a/frontend/src/components/PasteArea.js b/frontend/src/components/NewPaste.js
index bd08fc1..2ad9533 100644
--- a/frontend/src/components/PasteArea.js
+++ b/frontend/src/components/NewPaste.js
@@ -2,21 +2,30 @@ import React from 'react';
 import { TitleInput, PasteInput } from './Inputs'
 import OptionsContainer from './Options'
 import axios from 'axios';
+import { Redirect } from 'react-router-dom'
 
-class PasteArea extends React.Component {
+class NewPaste extends React.Component {
     constructor(props) {
         super(props);
         this.state = { 
             title: '',
             content: '',
             pass: '',
-            expiry: ''
+            expiry: '',
+            hash: '',
         };
 
         this.handleChange = this.handleChange.bind(this);
         this.handleSubmit = this.handleSubmit.bind(this);
     }
 
+    renderRedirect = () => {
+        if (this.state.hash !== '') {
+            const redirUrl = `/${this.state.hash}`
+            return <Redirect to={redirUrl} />
+        }
+    }
+
     componentDidUpdate() {
         if (this.state.title === "") {
             document.title = `ctrl-v`;
@@ -76,11 +85,12 @@ class PasteArea extends React.Component {
             url: 'http://localhost:8080/api',
             data: bodyFormData,
             headers: { 'Content-Type': 'multipart/form-data' },
-        }).then(function (response) {
-            //handle success
-            console.log(response);
-        }).catch(function (response) {
-            //handle error
+        }).then((response) => {
+
+            // on success, redir
+            this.setState({ hash: response.data.hash })
+        }).catch((response) => {
+            // TODO: handle error
             console.log(response);
         });
 
@@ -90,6 +100,7 @@ class PasteArea extends React.Component {
     render() {
         return (
             <form onSubmit={this.handleSubmit}>
+                {this.renderRedirect()}
                 <TitleInput 
                     onChange={this.handleChange}
                     value={this.state.title}
@@ -110,4 +121,4 @@ class PasteArea extends React.Component {
     }
 }
 
-export default PasteArea
\ No newline at end of file
+export default NewPaste
\ No newline at end of file
diff --git a/frontend/src/components/ViewPaste.js b/frontend/src/components/ViewPaste.js
new file mode 100644
index 0000000..aa0da34
--- /dev/null
+++ b/frontend/src/components/ViewPaste.js
@@ -0,0 +1,16 @@
+import React from 'react';
+// import { TitleInput, PasteInput } from './Inputs'
+// import OptionsContainer from './Options'
+// import axios from 'axios';
+
+class ViewPaste extends React.Component {
+    render() {
+        return (
+            <div>
+                {this.props.hash}
+            </div>
+        );
+    }
+}
+
+export default ViewPaste
\ No newline at end of file
diff --git a/frontend/src/components/CharLimit.js b/frontend/src/components/decorators/CharLimit.js
index 623b378..623b378 100644
--- a/frontend/src/components/CharLimit.js
+++ b/frontend/src/components/decorators/CharLimit.js
diff --git a/frontend/src/components/FloatingLabel.js b/frontend/src/components/decorators/FloatingLabel.js
index e1fc0ba..e1fc0ba 100644
--- a/frontend/src/components/FloatingLabel.js
+++ b/frontend/src/components/decorators/FloatingLabel.js