From 14a597405797f6eedf632e6529021ff04cf95c52 Mon Sep 17 00:00:00 2001 From: Rei Date: Wed, 27 Dec 2023 14:33:28 +0000 Subject: [PATCH] Almost there ( https://imgur.com/a/7ZnszW6 ) --- src/App.js | 68 +++++++++++++++++++++++++----------------------------- 1 file changed, 31 insertions(+), 37 deletions(-) diff --git a/src/App.js b/src/App.js index df9c493..9947727 100644 --- a/src/App.js +++ b/src/App.js @@ -20,7 +20,7 @@ import { FSContext } from ".//contexts/FSContext.js" import { useContext } from "react"; - export function MyForm(props) { +export function MyForm(props) { const db = useContext(FSContext) const [submitter, setSubmitter] = useState(''); const [date, setDate] = useState(''); @@ -30,45 +30,53 @@ import { useContext } from "react"; const handleCheckboxChange = (event) => { const { value, checked } = event.target; if (checked) { - setSelectedOptions([selectedOptions, value]); + setSelectedOptions([...selectedOptions, value]); } else { setSelectedOptions(selectedOptions.filter((option) => option !== value)); } }; const submitHandler = async (event) => { - event.preventDefault() - const incident = {setSubmitter: submitter, setDate: date, setContext: context, setSelectedOptions: selectedOptions } - const col = collection(db, `incidents/`) - const ref = await addDoc(col, incident ) - console.log( ref ) - } + event.preventDefault() + const incident = { submitter, date, context, selectedOptions } + const col = collection(db, `incidents/`) + const ref = await addDoc(col, incident) + console.log(ref) + } return ( -
+ Ray Ray's Word Bingo Enter submitter name: + name="submitter" + type="text" + placeholder="Name" + value={submitter} + onChange={(e) => setSubmitter(e.target.value)} + /> Enter the date the shennanigans occurred (dd-mm-yyyy): + name="date" + type="text" + placeholder="Date" + value={date} + onChange={(e) => setDate(e.target.value)} + /> Enter context for this tamper tantrum: + type="text" + name="context" + placeholder="Enter context here" + value={context} + onChange={(e) => setContext(e.target.value)} + /> Select the words used by Ray during his little tamper tantrum: + name="selectedoptions" + style={{ fontSize: '30px' }}>Select the words used by Ray during his little tamper tantrum: + - - - - - -

Existing entries

-

To be added

-
- -

I am sorry in advance for this Ash LMFAOšŸ¤£

- - ); } - -export default MyForm; +export default MyForm; \ No newline at end of file