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 (
);