Posts Real Estate to the API

Node/real-estate/queries.js

@@ -1,33 +1,38 @@
-const Pool = require('pg').Pool
+const Pool = require("pg").Pool;
 const pool = new Pool({
-  user: 'postgres',
-  host: 'localhost',
-  database: 'real_estate',
-  password: 'root',
+  user: "postgres",
+  host: "localhost",
+  database: "real_estate",
+  password: "root",
   port: 5432,
 });
 
 const getAllRealEstate = (request, response) => {
-    pool.query('SELECT * FROM real_estate ORDER BY id DESC', (error, results) => {
-      if (error) {
-        throw error
-      }
-      response.status(200).json(results.rows)
-    })
+  pool.query("SELECT * FROM real_estate ORDER BY id DESC", (error, results) => {
+    if (error) {
+      throw error;
+    }
+    response.status(200).json(results.rows);
+  });
 };
 
+// We don't need the citizen_upn here? ** Temporary **
 const insertRealEstate = (request, response) => {
-  const { address, area } = request.body
+  const { address, area, citizen_upn } = request.body;
 
-  pool.query('INSERT INTO real_estate (address, area) VALUES ($1, $2)', [address, area], (error, results) => {
-    if (error) {
-      throw error
+  pool.query(
+    "INSERT INTO real_estate (address, area, citizen_upn) VALUES ($1, $2, $3)",
+    [address, area, citizen_upn],
+    (error, results) => {
+      if (error) {
+        throw error;
+      }
+      response.status(201).send("done :)");
     }
-    response.status(201).send('done :)')
-  })
-}
+  );
+};
 
 module.exports = {
   getAllRealEstate,
-  insertRealEstate
-}
+  insertRealEstate,
+};

React/real-estate/src/pages/components/Navbar.js

@@ -53,7 +53,7 @@ const Navbar = () => {
                   className="text-white font-inter font-semibold hover:text-white focus:text-white tracking-normal mr-20"
                   style={{ fontSize: "1.335rem" }}
                 >
-                  Your Real Estates
+                  Your Real Estate
                 </Link>
               </li>
               <li className="m-0">
@@ -62,7 +62,7 @@ const Navbar = () => {
                   className="text-white font-inter font-semibold hover:text-white focus:text-white tracking-normal mr-20"
                   style={{ fontSize: "1.335rem" }}
                 >
-                  Register Real Estates
+                  Register Real Estate
                 </Link>
               </li>
               <li

React/real-estate/src/pages/components/VehicleRegisterForm.js

@@ -1,5 +1,6 @@
 import React, { useState } from "react";
 import { useSelector } from "react-redux";
+import { useHistory } from "react-router-dom";
 
 // Services
 import * as apiService from "../../services/apiService";
@@ -9,61 +10,42 @@ import Card from "./Card";
 import Heading3 from "./Heading3";
 import Button from "./Button";
 import InputText from "./inputs/InputText";
-import InputSelect from "./inputs/InputSelect";
 
 const VehicleRegisterForm = () => {
-  const [model, setModel] = useState("");
-  const [licensePlate, setlicensePlate] = useState("");
-  const [color, setColor] = useState("White");
-  const [type, setType] = useState(1);
+  const [address, setAddress] = useState("");
+  const [area, setArea] = useState("");
 
   const user = useSelector((state) => state.auth.user);
 
+  const history = useHistory();
+
   async function registerVehicle() {
     await apiService.registerVehicle(
-      { model, licensePlate, color, type },
+      { address, area, citizen_upn: user.profile.sub },
       user.access_token
     );
-    // await getVehicles();
+    history.push("/");
   }
 
   return (
     <Card styles={{ padding: "60px" }} classes="xl:w-2/5">
       <form onSubmit={(e) => e.preventDefault()} className="m-0 flex flex-col">
-        <Heading3 styles={{ marginTop: "0" }}>Register A Vehicle</Heading3>
+        <Heading3 styles={{ marginTop: "0" }}>Register Real Estate</Heading3>
 
         <div className="flex flex-col">
           <InputText
-            label="Model"
-            value={model}
-            name="model"
-            placeholder="Model"
-            onChangeEvent={(e) => setModel(e.target.value)}
+            label="Address"
+            value={address}
+            name="address"
+            placeholder="Address"
+            onChangeEvent={(e) => setAddress(e.target.value)}
           />
           <InputText
-            label="License Plate"
-            value={licensePlate}
-            name="licensePlate"
-            placeholder="License Plate"
-            onChangeEvent={(e) => setlicensePlate(e.target.value)}
-          />
-          <InputText
-            label="Color"
-            value={color}
-            name="color"
-            placeholder="Color"
-            onChangeEvent={(e) => setColor(e.target.value)}
-          />
-          <InputSelect
-            label="Type"
-            value={type}
-            name="type"
-            onChangeEvent={(e) => setType(e.target.value)}
-            options={[
-              { value: "1", text: "Sedan" },
-              { value: "2", text: "SUV" },
-              { value: "3", text: "Pickup" },
-            ]}
+            label="Area"
+            value={area}
+            name="area"
+            placeholder="Area"
+            onChangeEvent={(e) => setArea(e.target.value)}
           />
         </div>
         <Button