Merge pull request #24 from the-collab-lab/jo-mm-welcome-prompt

Added prompt for user

src/views/List.jsx

@@ -1,9 +1,11 @@
 import { useEffect, useState } from 'react';
 import { ListItem, SearchBar } from '../components';
+import { useNavigate } from 'react-router-dom';
 
 export function List({ data }) {
  const [search, setSearch] = useState('');
  const [displayData, setDisplayData] = useState([]);
+ const navigate = useNavigate();
 
  useEffect(() => {
  setDisplayData([...data]);
@@ -22,6 +24,14 @@ export function List({ data }) {
  <ListItem key={item.id} name={item.name} />
  ))}
  </ul>
+ {data.length === 0 && (
+ <div>
+ <p>You currently have no shopping items. Click below to add items</p>
+ <button id="addFirstItem" onClick={() => navigate('/manage-list')}>
+ Start adding items!
+ </button>
+ </div>
+ )}
  </>
  );
 }