Merge pull request #19 from the-collab-lab/mm-jo-rendered-list

Add SingleList to Home component and ListItem to List component

src/views/Home.jsx

@@ -1,3 +1,4 @@
+import { SingleList } from '../components';
 import './Home.css';
 
 export function Home({ data, setListPath }) {
@@ -7,10 +8,14 @@ export function Home({ data, setListPath }) {
  Hello from the home (<code>/</code>) page!
  </p>
  <ul>
- {/**
- * TODO: write some JavaScript that renders the `lists` array
- * so we can see which lists the user has access to.
- */}
+ {data.map((item, index) => (
+ <SingleList
+ key={index}
+ name={item.name}
+ path={item.path}
+ setListPath={setListPath}
+ />
+ ))}
  </ul>
  </div>
  );

src/views/List.jsx

@@ -7,11 +7,9 @@ export function List({ data }) {
  Hello from the <code>/list</code> page!
  </p>
  <ul>
- {/**
- * TODO: write some JavaScript that renders the `data` array
- * using the `ListItem` component that's imported at the top
- * of this file.
- */}
+ {data.map((item) => (
+ <ListItem key={item.id} name={item.name} />
+ ))}
  </ul>
  </>
  );