diff --git a/src/App.jsx b/src/App.jsx index 3d945b1..5fa9782 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -56,7 +56,7 @@ export function App() { /> } + element={} /> diff --git a/src/components/ManageListForms/AddItemForm.jsx b/src/components/ManageListForms/AddItemForm.jsx index 763d0cb..1d937d5 100644 --- a/src/components/ManageListForms/AddItemForm.jsx +++ b/src/components/ManageListForms/AddItemForm.jsx @@ -1,19 +1,32 @@ import { useState } from 'react'; import { addItem } from '../../api/firebase'; +import toast from 'react-hot-toast'; -export default function AddItemForm({ listPath }) { +export default function AddItemForm({ listPath, data }) { const [formData, setFormData] = useState({ itemName: '', daysUntilNextPurchase: '', }); const handleSubmit = async (event) => { + event.preventDefault(); + + const formattedItemName = formData.itemName + .toLowerCase() + .replace(/[^a-z]/g, ''); + + const match = data.find((item) => item.name === formattedItemName); + try { - event.preventDefault(); - await addItem(listPath, formData); - alert(`${formData.itemName} was added to the list successfully`); + if (!match) { + await addItem(listPath, { ...formData, itemName: formattedItemName }); + toast.success(`${formattedItemName} was added to your list`); + } else { + toast.error(`${formattedItemName} is already on your list`); + return; + } } catch (error) { - alert(`There was a problem adding ${formData.itemName} to the list`); + toast.error(`Failed to add ${formattedItemName}`); } }; diff --git a/src/views/ManageList.jsx b/src/views/ManageList.jsx index 15ca47d..20cca9c 100644 --- a/src/views/ManageList.jsx +++ b/src/views/ManageList.jsx @@ -1,10 +1,10 @@ import AddItemForm from '../components/ManageListForms/AddItemForm'; import ShareListForm from '../components/ManageListForms/ShareListForm'; -export function ManageList({ listPath, user }) { +export function ManageList({ listPath, user, data }) { return (
- +
);