diff --git a/src/components/item/RoomItemsList.jsx b/src/components/item/RoomItemsList.jsx new file mode 100644 index 0000000..fa0de34 --- /dev/null +++ b/src/components/item/RoomItemsList.jsx @@ -0,0 +1,52 @@ +import React, { useState, useEffect } from "react"; +import axios from "axios"; + +export const RoomItemsList = () => { + const [rooms, setRooms] = useState([]); + + useEffect(() => { + const fetchRoomsAndItems = async () => { + try { + const response = await axios.get( + `${import.meta.env.VITE_API_URL}/room`, + ); + const roomsWithItems = await Promise.all( + response.data.map(async (room) => { + const itemsResponse = await axios.get( + `${import.meta.env.VITE_API_URL}/item?room=${room._id}`, + ); + const itemsForThisRoom = itemsResponse.data.filter( + (item) => item.room === room._id, + ); + return { ...room, items: itemsForThisRoom }; + }), + ); + setRooms(roomsWithItems); + } catch (error) { + console.error(error); + } + }; + + fetchRoomsAndItems(); + }, []); + + return ( +
+ {rooms.map((room) => ( +
+

{room.name}

+ {Array.isArray(room.items) && + room.items.map((item) => { + return ( +
+

{item.brand}

+

{item.model}

+

{item.price}

+
+ ); + })} +
+ ))} +
+ ); +}; diff --git a/src/pages/home.jsx b/src/pages/home.jsx index 0cc06bf..e7c4025 100644 --- a/src/pages/home.jsx +++ b/src/pages/home.jsx @@ -4,18 +4,18 @@ import { useAuth } from "../hooks"; import { DatePicker } from "antd"; import { FormCreateItem } from "../components/form/formCreateItem"; import { FormCreateRoom } from "../components/form/formCreateRoom"; -import { ItemPage } from "../components/item/ItemPage"; +import { RoomItemsList } from "../components/item/RoomItemsList"; export const Home = () => { const { user } = useAuth(); return (
-

Home page

{user &&

Hello {user.user.username}

} +
); };