46 lines
1.2 KiB
TypeScript
46 lines
1.2 KiB
TypeScript
|
import { Form, Formik } from "formik";
|
||
|
|
import FormGroup from "../components/FormGroup";
|
||
|
|
import type { SoundUploadValue } from "../../../types/types";
|
||
|
|
|
||
|
|
const SoundUpload = () => {
|
||
|
|
const initialValues: SoundUploadValue = {
|
||
|
|
soundFile: null,
|
||
|
|
};
|
||
|
|
|
||
|
|
const handleSubmit = (values: SoundUploadValue) => {
|
||
|
|
console.log(values);
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Formik initialValues={initialValues} onSubmit={handleSubmit}>
|
||
|
|
{({ setFieldValue }) => (
|
||
|
|
<Form>
|
||
|
|
<FormGroup>
|
||
|
|
<label htmlFor="soundFile">Sighting Sound</label>
|
||
|
|
<input
|
||
|
|
type="file"
|
||
|
|
name="soundFile"
|
||
|
|
id="sightingSoundinput"
|
||
|
|
onChange={(e) => {
|
||
|
|
if (
|
||
|
|
e.target.files &&
|
||
|
|
e.target.files[0].type.lastIndexOf(".mp3")
|
||
|
|
)
|
||
|
|
setFieldValue("sightingSound", e.target.files[0]);
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
</FormGroup>
|
||
|
|
<button
|
||
|
|
type="submit"
|
||
|
|
className="w-1/4 text-white bg-green-700 hover:bg-green-800 font-small rounded-lg text-sm px-2 py-2.5"
|
||
|
|
>
|
||
|
|
Upload
|
||
|
|
</button>
|
||
|
|
</Form>
|
||
|
|
)}
|
||
|
|
</Formik>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default SoundUpload;
|