Update NewArticle Component

compmonk · May 19, 2020 · 13e2cfb · 13e2cfb
1 parent f5fff66
commit 13e2cfb
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 90 deletions.
diff --git a/src/components/article/Article.js b/src/components/article/Article.js
@@ -60,12 +60,9 @@ function Article() {
 
     }
 
-
     if (currentUser && article) {
         isAuthor = article.author === currentUser._id
         userRating = article.ratings ? article.ratings.filter((rating) => (rating.reviewerId === currentUser._id))[0] : {}
-        console.log("isAuthor", isAuthor)
-        console.log("userRating", userRating);
     }
 
     return (

diff --git a/src/components/article/NewArticle.js b/src/components/article/NewArticle.js
@@ -1,92 +1,57 @@
-import React from "react";
-import { useState, useEffect } from "react";
-import { Form, Button, Table } from "react-bootstrap";
-import Page404 from "../others/FourZeroFour";
+import React, {useContext} from "react";
+import {Form, Button, Col} from "react-bootstrap";
 import "../../sass/App.css";
 import axios from "axios";
+import {AuthContext} from "../auth/AuthContext";
 
-function UserProfile() {
-  const [title, setTitle] = useState({});
-  const [text, setText] = useState({});
-  const [html, setHtml] = useState({});
-  const [keywords, setKeyword] = useState(undefined);
+function NewArticle() {
+    const {cookies} = useContext(AuthContext)
+    const onSubmit = async (e) => {
+        e.preventDefault();
+        const {title, text, html, keywords} = e.target.elements;
+        let article = {
+            title: title.value,
+            text: text.value,
+            html: html.value,
+            keywords: keywords.value.split(",")
+        }
+        await axios.post("/api/articles/", article, {
+            withCredentials: true,
+            headers: cookies
+        }).then((response) => {
+            window.location.href = `/articles/${response.data._id}`;
+        })
+    }
 
-  const handleTitle = function (e) {
-    setTitle(e.target.value);
-    e.preventDefault();
-  };
-  const handleText = function (e) {
-    setText(e.target.value);
-    e.preventDefault();
-  };
-  const handleHtml = function (e) {
-    setHtml(e.target.value);
-    e.preventDefault();
-  };
-  const handleKeywords = function (e) {
-    setKeyword(e.target.value);
-    e.preventDefault();
-  };
-  const submitNameChange = async (e) => {
-    let arr = keywords.split(" ");
-    let article = {
-      title: title,
-      text: text,
-      html: html,
-      keywords: arr,
-    };
-    await axios.post("/api/articles/", article)
-  };
-
-  return (
-    <div className="row justify-content-center">
-      <Form
-        className="col-sm-8 col-md-8 col-lg-8 counselor-form"
-        onSubmit={submitNameChange}
-      >
-        <Form.Group controlId="formBasicEmail">
-          <Form.Label>Title</Form.Label>
-          <Form.Control
-            required
-            type="text"
-            placeholder="Suitable Title"
-            onChange={handleTitle}
-          />
-          <Form.Text className="text-muted">
-            Note - Title is mandatory*
-          </Form.Text>
-
-          <Form.Label>Text</Form.Label>
-          <Form.Control
-            required
-            type="textarea"
-            onChange={handleText}
-            placeholder="Your Article here...."
-          />
-
-          <Form.Label>HTML</Form.Label>
-          <Form.Control
-            as="textarea"
-            placeholder="Article HTML"
-            onChange={handleHtml}
-          />
-
-          <Form.Label>Keywords</Form.Label>
-          <Form.Control
-            as="textarea"
-            onChange={handleKeywords}
-            placeholder="Keywords e.g. CS 554, Web Programming, Algorithms"
-          />
-          <Form.Text className="text-muted">
-            Note - Add more keywords to reach out to maximum people*
-          </Form.Text>
-
-          <Button variant="primary" type="submit">
-            Create Article
-          </Button>
-        </Form.Group>
-      </Form>
-    </div>
-  );
+    return (
+        <Form className="container-fluid col-sm-8 col-md-8 col-lg-8 counselor-form" onSubmit={onSubmit}>
+            <Form.Group as={Col} controlId="formBasicEmail">
+                <Form.Label>Title</Form.Label>
+                <Form.Control required name="title" type="text" placeholder="Suitable Title"/>
+                <Form.Text className="text-muted">
+                    Note - Title is mandatory*
+                </Form.Text>
+            </Form.Group>
+            <Form.Group as={Col}>
+                <Form.Label>Text</Form.Label>
+                <Form.Control required name="text" type="textarea" placeholder="Your Article here...."/>
+            </Form.Group>
+            <Form.Group as={Col}>
+                <Form.Label>HTML</Form.Label>
+                <Form.Control as="textarea" name="html" placeholder="Article HTML"/>
+            </Form.Group>
+            <Form.Group as={Col}>
+                <Form.Label>Keywords</Form.Label>
+                <Form.Control as="textarea" name="keywords" placeholder="CS 554, Web Programming, Algorithms"/>
+                <Form.Text className="text-muted">
+                    Note - Add more keywords to reach out to maximum people*
+                </Form.Text>
+            </Form.Group>
+            <Button variant="primary" type="submit">
+                Create Article
+            </Button>
+        </Form>
+    )
 }
-export default UserProfile;
+
+export default NewArticle;