From bac99578a1c2f1d00ec18b9b8b0d2bb4c379d57a Mon Sep 17 00:00:00 2001 From: Parvin Sattorova Date: Thu, 16 Nov 2023 08:18:25 -0700 Subject: [PATCH 1/7] Add org create request button --- src/Components/App/App.js | 8 +- .../CareRequestForm/CareRequestForm.js | 54 +++++++ .../CareRequestForm/CareRequestForm.scss | 53 +++++++ .../OrganizationDashboard.js | 143 +++++++++--------- .../OrganizationDashboard.scss | 29 ++-- .../SearchResults/SearchResults.scss | 12 +- 6 files changed, 208 insertions(+), 91 deletions(-) create mode 100644 src/Components/CareRequestForm/CareRequestForm.js create mode 100644 src/Components/CareRequestForm/CareRequestForm.scss diff --git a/src/Components/App/App.js b/src/Components/App/App.js index 541e78a..4d7f190 100644 --- a/src/Components/App/App.js +++ b/src/Components/App/App.js @@ -1,5 +1,5 @@ -import { useState } from 'react'; -import { Route, Routes, useNavigate, } from 'react-router-dom'; +import React, { useState } from 'react'; +import { Route, Routes, useNavigate } from 'react-router-dom'; import NavBar from '../NavBar/NavBar'; import Homepage from '../Homepage/Homepage'; import OrganizationDashboard from '../OrganizationDashboard/OrganizationDashboard'; @@ -7,7 +7,8 @@ import ProvideAidPage from '../ProvideAidPage/ProvideAidPage'; import Error404 from '../ErrorHandling/Error404'; import Error500 from '../ErrorHandling/Error500'; import GeneralError from '../ErrorHandling/GeneralError'; -import Contact from '../Contact/Contact' +import Contact from '../Contact/Contact'; +import CareRequestForm from '../CareRequestForm/CareRequestForm'; function App() { const [isLoggedIn, setIsLoggedIn] = useState(false); @@ -31,6 +32,7 @@ function App() { } /> } /> } /> + } /> } /> {window.location.pathname === '/500-test' && ( } /> diff --git a/src/Components/CareRequestForm/CareRequestForm.js b/src/Components/CareRequestForm/CareRequestForm.js new file mode 100644 index 0000000..545070f --- /dev/null +++ b/src/Components/CareRequestForm/CareRequestForm.js @@ -0,0 +1,54 @@ +import React, { useState } from 'react'; +import { useNavigate } from 'react-router-dom'; +import '../CareRequestForm/CareRequestForm.scss'; + +function CareRequestForm() { + const navigate = useNavigate(); + const [formData, setFormData] = useState({ + aidType: '', + description: '', + // You can add more fields as needed + }); + + const handleChange = (e) => { + const { name, value } = e.target; + setFormData(prevState => ({ + ...prevState, + [name]: value + })); + }; + + const handleSubmit = (e) => { + e.preventDefault(); + // Here you should add the logic to send data to your server + // For now, we'll just log the formData and navigate to a different page + console.log(formData); + + // After submitting, navigate to a different page, e.g., the dashboard or a success page + navigate('/success'); + }; + + return ( +
+
+
+ + +
+
+ +