fix journal form

.gitignore

@@ -9,6 +9,7 @@ __pycache__/
 # Distribution / packaging
 .Python
 build/
+/.next/
 develop-eggs/
 dist/
 downloads/

src/components/AddJournal.js

@@ -1,42 +1,21 @@
-/* eslint-disable no-alert */
-import { React, useState } from 'react';
-import { Row, Col, Form, Button } from 'react-bootstrap';
-import { showSuccessMessage, showErrorMessage } from "../helpers/alerts"
-import { JournalValidation } from '../helpers/validate';
+import { React, useState } from "react";
+import { Row, Col, Form, Button } from "react-bootstrap";
 
-function AddJournal() {
-  const [title, setTitle] = useState('');
-  const [url, setUrl] = useState('');
-  const [issn, setIssn] = useState('');
-  const [rating, setRating] = useState('');
-  const [date, setDate] = useState('');
-  const [policyTitle, setPolicyTitle] = useState('');
-  const [firstYear, setFirstYear] = useState('');
-  const [lastYear, setLastYear] = useState('');
-  const [policyType, setPolicyType] = useState('');
-  const [domain, setDomain] = useState('');
-  const [success,setSuccess] = useState("");
-  const [error,setError]=useState("");
+const AddJournal = () => {
+  const [title, setTitle] = useState("");
+  const [url, setUrl] = useState("");
+  const [issn, setIssn] = useState("");
+  const [rating, setRating] = useState("");
+  const [date, setDate] = useState("");
+  const [policyTitle, setPolicyTitle] = useState("");
+  const [firstYear, setFirstYear] = useState("");
+  const [lastYear, setLastYear] = useState("");
+  const [policyType, setPolicyType] = useState("");
+  const [domain, setDomain] = useState("");
 
-  const emptyFields=()=>{
-    setTitle("");
-    setUrl("");
-    setIssn("");
-    setRating("");
-    setDate("");
-    setPolicyTitle("");
-    setFirstYear("");
-    setLastYear("");
-    setPolicyType("");
-    setDomain("");
-  }
   const handleSubmit = (e) => {
     e.preventDefault();
-    setSuccess("");
-    setError("");
-    const check = JournalValidation(title, url, issn, rating, policyTitle, firstYear,
-                                lastYear, policyType, domain, date)
-    if(check){
+
     const policies = {
       title: policyTitle,
       first_year: firstYear,
@@ -45,118 +24,102 @@ function AddJournal() {
     };
     const journal = { title, url, issn, rating, date, policies, domain };
 
-    try{
-    window.scrollTo(0,0);
-    fetch('https://journal-policy-tracker.herokuapp.com/api/journals', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
+    fetch("https://journal-policy-tracker.herokuapp.com/api/journals", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
       body: JSON.stringify(journal),
-    })
-    emptyFields();
-    setSuccess("Journal Added Successfuly")
-    }
-    catch(err)
-    {
-      setError("Cannot Add Journal")
-    }
-  }
-  else{
-    window.scrollTo(0,0);
-    setError("Invalid Input")
-  }
-
+    }).then(() => {
+      alert("Journal added successfully!");
+    });
   };
 
   return (
     <Row>
-      <Col className='m-auto'>
-        <Form className='login-form responsive' onSubmit={handleSubmit}>
-          <Form.Group className='mb-3' controlId='formBasicTitle'>
-            {success && showSuccessMessage(success)}
-            {error && showErrorMessage(error)}
+      <Col md={4}></Col>
+      <Col md={4}>
+        <Form className="login-form" onSubmit={handleSubmit}>
+          <Form.Group className="mb-3" controlId="formBasicTitle">
             <Form.Label>Title</Form.Label>
             <Form.Control
-              type='text'
-              placeholder='Journal title'
+              type="text"
+              placeholder="Journal title"
               onChange={(e) => setTitle(e.target.value)}
-              value={title}
             />
           </Form.Group>
-          <Form.Group className='mb-3' controlId='formBasicUrl'>
+          <Form.Group className="mb-3" controlId="formBasicUrl">
             <Form.Label>URL</Form.Label>
-            <Form.Control type='text' placeholder='URL' 
-            onChange={(e) => setUrl(e.target.value)} value={url} />
+            <Form.Control
+              type="text"
+              placeholder="URL"
+              onChange={(e) => setUrl(e.target.value)}
+            />
           </Form.Group>
-          <Form.Group className='mb-3' controlId='formBasicIssn'>
+          <Form.Group className="mb-3" controlId="formBasicIssn">
             <Form.Label>ISSN</Form.Label>
             <Form.Control
-              type='text'
-              placeholder='ISSN'
+              type="text"
+              placeholder="ISSN"
               onChange={(e) => setIssn(e.target.value)}
-              value={issn}
             />
           </Form.Group>
-          <Form.Group className='mb-3' controlId='formBasicRating'>
+          <Form.Group className="mb-3" controlId="formBasicRating">
             <Form.Label>Rating</Form.Label>
             <Form.Control
-              type='text'
-              placeholder='Rating'
+              type="text"
+              placeholder="Rating"
               onChange={(e) => setRating(e.target.value)}
-              value={rating}
             />
           </Form.Group>
-          <Form.Group className='mb-3' controlId='formBasicDate'>
+          <Form.Group className="mb-3" controlId="formBasicDate">
             <Form.Label>Date</Form.Label>
             <Form.Control
-              type='date'
-              placeholder='Date'
+              type="date"
+              placeholder="Date"
               onChange={(e) => setDate(e.target.value)}
-              value={date}
             />
           </Form.Group>
-          <Form.Group className='mb-3' controlId='formBasicPolicies'>
+          <Form.Group className="mb-3" controlId="formBasicPolicies">
             <Form.Label>Policies</Form.Label>
             <Form.Control
-              type='text'
-              placeholder='Policy Title'
+              className="mb-2"
+              type="text"
+              placeholder="Policy Title"
               onChange={(e) => setPolicyTitle(e.target.value)}
-              value={policyTitle}
             />
             <Form.Control
-              type='text'
-              placeholder='First Year'
+              className="mb-2"
+              type="text"
+              placeholder="First Year"
               onChange={(e) => setFirstYear(e.target.value)}
-              value={firstYear}
             />
             <Form.Control
-              type='text'
-              placeholder='Last Year'
+              className="mb-2"
+              type="text"
+              placeholder="Last Year"
               onChange={(e) => setLastYear(e.target.value)}
-              value={lastYear}
             />
             <Form.Control
-              type='text'
-              placeholder='Type'
+              type="text"
+              placeholder="Type"
               onChange={(e) => setPolicyType(e.target.value)}
-              value={policyType}
             />
           </Form.Group>
-          <Form.Group className='mb-3' controlId='formBasicDomain'>
+          <Form.Group className="mb-3" controlId="formBasicDomain">
             <Form.Label>Domain</Form.Label>
             <Form.Control
-              type='text'
-              placeholder='Domain'
+              type="text"
+              placeholder="Domain"
               onChange={(e) => setDomain(e.target.value)}
-              value={domain}
             />
           </Form.Group>
-          <Button variant='primary' type='submit'>
+          <Button variant="primary" type="submit">
             Add Journal
           </Button>
         </Form>
       </Col>
+      <Col md={4}></Col>
     </Row>
   );
-}
+};
 
 export default AddJournal;