reiyua
/
RayRaysWordBingo
mirror of https://github.com/reiyua/RayRaysWordBingo.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Almost there ( https://imgur.com/a/7ZnszW6 )

This commit is contained in:
Ray 2023-12-27 14:33:28 +00:00 committed by GitHub
parent d5ccae751e
commit 14a5974057
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 31 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
src/App.js
View File

@ -20,7 +20,7 @@ import { FSContext } from ".//contexts/FSContext.js"
import { useContext } from "react"; import { useContext } from "react";
export function MyForm(props) { export function MyForm(props) {
const db = useContext(FSContext) const db = useContext(FSContext)
const [submitter, setSubmitter] = useState(''); const [submitter, setSubmitter] = useState('');
const [date, setDate] = useState(''); const [date, setDate] = useState('');
@ -30,45 +30,53 @@ import { useContext } from "react";
const handleCheckboxChange = (event) => { const handleCheckboxChange = (event) => {
const { value, checked } = event.target; const { value, checked } = event.target;
if (checked) { if (checked) {
setSelectedOptions([selectedOptions, value]); setSelectedOptions([...selectedOptions, value]);
} else { } else {
setSelectedOptions(selectedOptions.filter((option) => option !== value)); setSelectedOptions(selectedOptions.filter((option) => option !== value));
} }
}; };
const submitHandler = async (event) => { const submitHandler = async (event) => {
event.preventDefault() event.preventDefault()
const incident = {setSubmitter: submitter, setDate: date, setContext: context, setSelectedOptions: selectedOptions } const incident = { submitter, date, context, selectedOptions }
const col = collection(db, `incidents/`) const col = collection(db, `incidents/`)
const ref = await addDoc(col, incident ) const ref = await addDoc(col, incident)
console.log( ref ) console.log(ref)
} }
return ( return (
<Form> <Form onSubmit={submitHandler}>
<Form.Group> <Form.Group>
<Form.Label style={{ fontSize: '40px' }}>Ray Ray's Word Bingo</Form.Label> <Form.Label style={{ fontSize: '40px' }}>Ray Ray's Word Bingo</Form.Label>
<Col sm={2}></Col> <Col sm={2}></Col>
<Col sm={8}> <Col sm={8}>
<Form.Label style={{ fontSize: '30px' }}>Enter submitter name:</Form.Label> <Form.Label style={{ fontSize: '30px' }}>Enter submitter name:</Form.Label>
<Form.Control <Form.Control
name="submitter" name="submitter"
type="text" type="text"
placeholder="Name" /> placeholder="Name"
value={submitter}
onChange={(e) => setSubmitter(e.target.value)}
/>
<Form.Label style={{ fontSize: '30px' }}>Enter the date the shennanigans occurred (dd-mm-yyyy):</Form.Label> <Form.Label style={{ fontSize: '30px' }}>Enter the date the shennanigans occurred (dd-mm-yyyy):</Form.Label>
<Form.Control <Form.Control
name="date" name="date"
type="text" type="text"
placeholder="Date" placeholder="Date"
/> value={date}
onChange={(e) => setDate(e.target.value)}
/>
<Form.Label style={{ fontSize: '30px' }}>Enter context for this tamper tantrum:</Form.Label> <Form.Label style={{ fontSize: '30px' }}>Enter context for this tamper tantrum:</Form.Label>
<Form.Control <Form.Control
type="text" type="text"
name="context" name="context"
placeholder="Enter context here" /> placeholder="Enter context here"
value={context}
onChange={(e) => setContext(e.target.value)}
/>
<Form.Label <Form.Label
name="selectedoptions" name="selectedoptions"
style={{ fontSize: '30px' }}>Select the words used by Ray during his little tamper tantrum: style={{ fontSize: '30px' }}>Select the words used by Ray during his little tamper tantrum:
</Form.Label> </Form.Label>
<Form.Check <Form.Check
type="checkbox" type="checkbox"
@ -98,24 +106,10 @@ import { useContext } from "react";
checked={selectedOptions.includes('fart')} checked={selectedOptions.includes('fart')}
onChange={handleCheckboxChange} onChange={handleCheckboxChange}
/> />
<Button type="submit">Submit</Button>
</Col> </Col>
<Col sm={2}></Col>
</Form.Group>
<Button variant="primary" type="submit">
Submit
</Button>
<Form.Group>
<h3>Existing entries</h3>
<p>To be added</p>
</Form.Group>
<Form.Group>
<h3>I am sorry in advance for this Ash LMFAO🤣</h3>
</Form.Group> </Form.Group>
</Form> </Form>
); );
} }
export default MyForm;
export default MyForm;