From aa59eaa3fcf9b0e9c3f0aa00a19d4339326de146 Mon Sep 17 00:00:00 2001 From: catanese Date: Sun, 12 May 2024 21:32:30 +0200 Subject: [PATCH] wip --- .vs/2024-DEV-BUT3/v17/.wsuo | Bin 97280 -> 96256 bytes .vs/slnx.sqlite | Bin 90112 -> 90112 bytes src/api/authentication.js | 6 +-- src/api/room.js | 61 +++++++++++++++++++++- src/assets/styles/diagram.css | 40 ++++++++++++++ src/assets/styles/room-page.css | 18 +++++++ src/assets/styles/room-stats.css | 47 +++++++++++++++++ src/components/diagram.jsx | 30 +++++++++++ src/components/form/formUpdateItem.jsx | 24 +++------ src/components/item/ItemBox.jsx | 30 ----------- src/components/nav/Navbar.jsx | 5 +- src/components/parts/image.jsx | 34 ++++++++++++ src/components/rooms/room-list.jsx | 46 +++++++++++++++++ src/components/rooms/room-stats.jsx | 69 +++++++++++++++++++++++++ src/components/rooms/roomBox.jsx | 23 +++++++++ src/pages/rooms-stats.jsx | 25 --------- src/pages/rooms.jsx | 46 +++++++++++++++++ src/router.jsx | 2 + 18 files changed, 428 insertions(+), 78 deletions(-) create mode 100644 src/assets/styles/diagram.css create mode 100644 src/assets/styles/room-page.css create mode 100644 src/assets/styles/room-stats.css create mode 100644 src/components/diagram.jsx create mode 100644 src/components/parts/image.jsx create mode 100644 src/components/rooms/room-list.jsx create mode 100644 src/components/rooms/room-stats.jsx create mode 100644 src/components/rooms/roomBox.jsx delete mode 100644 src/pages/rooms-stats.jsx create mode 100644 src/pages/rooms.jsx diff --git a/.vs/2024-DEV-BUT3/v17/.wsuo b/.vs/2024-DEV-BUT3/v17/.wsuo index ac4359ca8e9ca020a2a3d0a4c412ee12c39ebab7..e30e1c1fbd08cf011250d8db9740d5a892cf0a69 100644 GIT binary patch delta 1625 zcmchX4NOy46vy9rz7~qeO859EWl-p&lv0qnA_ZzCgNXc5Y?KvW;a+mNoh1 z+@krH!z@D{Ei5dcVF0n8F4wV9>u-E}yl-#{8qhQ1B0km! zP4YaO4m-8ziAHEn2HFB78&M&tNGY-cNkr7hY6L$G{WQ3?AU4E=Kync;LW_M0tqzGtRw4rOBvOq0 zLhf)nFvu$u8zHLy{2{~9KWSGQ9&4x9{HC9-seT^$JN+ESX$ec|&%!v>AA_VLOXzpe z2MB5UEB&+?w4mSXr+ccO+JB^9)y8Jj;TUX2XvMFgtw$Ob_l;;hi|a?dbydMgKm5Cd zD1noOP1hixDOLfks|M>MMH@}ZT0D1@AwH9Z48|vrA`KV50b}&hLh(%)A9)-XGHBeY zd=*_67hT$rOW{V>S<(@oB^zs}KuTnT*#avI{56o0ILX2WUJwQZ>S^rIIvF+lP+3ChB zU%GRg=SZ(ThR%`AZn(aCGEMSqo6{cH=h!Rv@Y^7mPz)+&9fs)~QyIjo>kh`20Oz6( zf2W0bHt)i+!uZvO0*v9I1aoRTkg_qgyLUaqj+h45<3 zq~k)5lf4DqAX(XfMvw&~KC9L!8yluT{L}(gG204yxzc_TU>|{8kH|YfBOYu6wf?Qo zb_h=&YroJxdT(yO;d*JwuH!e0=7T%a&m8;Yiw}KvdK(1Dt~DKsR%R=+m8|WI(KpPH zqG5jYvTb1dxd>HrZj185M3|Ou9xA^%Iez5fI87pZ^KGz)fMIR0@eVvu?KIt(cJnIt znRna!b)C|)oMhsNfAD2dUkH)1=S2}rE%*o0#I!M$J1(8tzb5QE<*mHS5t;5T&D8tL ze#%R{R6G0jg8|Rb8=>Rv>ksPN?-#n~#gAPkW#6Hd&s_}m#a@+%s_VNd7lLmdK2=y3 z`j9JsD80l+U#(fEopFwT)3+zJCvA%&S0zU`-2$nClN>B5KaeaZZMHT&nX lNFWtvUVOz2yliU!8Um|spKetD&;3>Zan_02kRx?H_!ShE0xkdm delta 1250 zcmaKreQZ-z7{>28+>(`bbDLW?w$aw^uB%HawA4A5ipyGXQPh<(s(mCH|&n%1L5(OCojl>iSZ~jocTPWBK2d;Tpne59JxelyH6woY3bz| zw?}#WOPG~)VS#Q@v~Tc=DgUJ>yn|UVaaK1OTW8uZdx2GKk zht3QH+VXo(f0sU|?SJRYN&g<_wO7R66;*0&@DEl*MM(upM^njAnq`mqSSafcF_-EN zA7ZkH%RVkU^o%AGkK4s=>r-zzrUnxNy(KgA<_B?Za($P2h?V{)7#aoYkmb-eW z=D=_D+$Cf--&U6+`Afy;jSOwXsRhzhBbHkiMoOd>s(TX|V)xZ%eg z6OD31|AoavJ6FD@%2HFzv`27WdhS$y^tVV>r{&Ajg@O>iM7Q}SXDG90#ZS-FW-IPu K&8m6R1p6BTh!*RifW_9KH_7H4b3{lPXPfeB4qCmIv7p=@n;>$af9KM_?jYV>!YH&u2RKh zb8{%??Ju0(coVRa%Ds8Md+wz%X#}}tp zHbx)HU7ajHnccicjYifHJQ@7^d``4V==>jfvnt_i1PpGg*OJU@9E&3*=T95wY z-cj6POw--=nAB_D4kDJHY<{9uHJ6_80L9!xH(Tk0Of}tiSl6|zF544Rg`tM7@^&%f zZYamwQZv_*?QM*(@)*vxd&Z_o%34_6sr+B9EN;Ux2!CXl<>AR_b%Dmrz#}u~l}K9x+aKUm#+Zp&(n6 z*vA&!+k~WUhEIFht-uHbHyFm=YaGKcPIKRjKLW3nZQq83M%a1~O(oN*VQrY+4zpw5 z3}Ab3-f;A$c@L5Bug3n~nkE7Xga48N`I`jEJ@N93}_wGTB6Ghzl>` zJ2-FF*KNStc@}^~(y~gzvXLR%4qCQ-z_M!Gw*9u%EUWZcHWIa;BWBI;0)QV=I2u^P znO6MhRcTC8#a`Tw&(nrZ(Lm$qOZg2F5~uN2X+@eBPDmcSB77&5qXwfR-O_>+avL$k z$7Hw6i(jE6dKz`1X*7plLtCT^=&o=T-^8Dxli~{bll&}oO09U5Tqh=pQaE06=47rG zJfI_yEaw`4z2o99W2k~t3!V}ok--PPA|q&xN5MTDgJO5; zUW1C-@8%j;Ta{Q*HCtDdQ8bjk|I4T|5*4|sLawevs<|xy7_&RwM%lqhS-8(Ykg*4~ z;4!~G7yvF(#qhxXG(9_-&~%?_qC-(2*<}hp(u6T`_-qY@3YP#X2G&N;KKu9w|$aY@mz+%SXG9xB62xgxRzc^PMuB@A^JXM|O} zJp|!{WgU?o5`73O2r8xrgCu*1vWTL3w1+Swh=P#F2Om0nkzL}0!^i*s|IX#dnOftf z*0@#+p)ey13+IJ8!6q*78~h4?AzcB> z?;PePS-P?aI`}>_GEiJzbwG7&40W$Q7n}K8z~g4dP&7J_Eph=ia;_ALd^>Ym`V6!3 zk`dST#+X@?Fq_$aZQ+ZN|4ns2GZTBBipH5IWhSka1{ZYsf;^~5M~p*;88+!g<1cS# z_0ab-x%E8AXIF}`eT`gpVp6rXnnW9yYPZi8Ks9-Nx0eTnEE_hAh-oN$VOkb^mder} z!AUL|wW6&Q@+JsLbAUS9)N*nXt)nsdBObwTNfjwYK$#~x^57V*!zHpCMTu8#mG0B_ zw%Tf?ku1q~lw!q&D)D3VQ?A8-@FwcO3uK3Ep+$5R-z6W&Dls#~(9eiL*#voe*fr@g zAPFpqhHGb5RW{x*6a3jobtX777~?&3u49?x*eYN`OoMCcJSYMHxR}RQ18JZskJ8SU zcEOedEv@Sl^bngL_C^O{(ZR@|X{eH|5Ttrl$s+Cs!f1wBT`^&+~Y7Z6fHd<3P7 zxBSHo*hdNgQZ=^n9o_6KmlkF#(sZ`+T94%${0jLU5EB0~v@wRZ98I7yS;wdGZIVwM zGF7gTp!@*Wpk1^n&7uOlE4`EU(e@Zadz?`Du#&5A@(X+gElW@Ed;Amu+)sX!&!`pE z;SsVOXK5< XKBwIev*;^oGLinSUhC+@n=k(W0tX { return response.data; } catch (error) { - return error.response.data; + return error.responseq; } }; @@ -15,7 +15,7 @@ export const login = async (username, password) => { const response = await axios.post("/authenticate", { username, password }); return response.data; } catch (error) { - return error.response.data; + return error.response; } }; @@ -25,6 +25,6 @@ export const logout = async () => { return response.data; } catch (error) { - return error.response.data; + return error.response; } }; diff --git a/src/api/room.js b/src/api/room.js index 09ceb90..41e3b3b 100644 --- a/src/api/room.js +++ b/src/api/room.js @@ -5,7 +5,7 @@ import axios from "axios"; export const getRoom = async (_id) => { try { - const response = await axios.get("/room", {_id}); + const response = await axios.get("/room/"+{_id}); console.log(response.data) return response.data; } catch (error) { @@ -16,7 +16,7 @@ export const getRoom = async (_id) => { export const getRooms = async () => { try { - const response = await axios.get("/room", {}); + const response = await axios.get("/room"); console.log(response.data) return response.data; } catch (error) { @@ -24,3 +24,60 @@ export const getRooms = async () => { return error.response.data; } }; + +export const getRoomStats = async () => { + try { + const response = await axios.get("/room/stats"); + console.log(response.data) + return response.data; + } catch (error) { + console.log("ERROR", error.response.data) + return error.response.data; + } +}; + +export const formatRoomStats = (roomStats) => { + const global = formatRoomStatsGlobal(roomStats.global) + const rooms = Object.values(roomStats.rooms).map(formatRoom); + const years = roomStats.years; + return { + global, + rooms, + years + } +} + +function formatRoomStatsGlobal(global){ + const { rooms_count, items_count, total_price, average_price} = global; + + const most_item_room = { + name: global.most_item_room.name, + count: global.most_item_room.count + }; + + const most_expensive_room = { + name: global.most_expensive_room.name, + price: global.most_expensive_room.price + }; + + return { + rooms_count, + items_count, + total_price, + average_price, + most_item_room, + most_expensive_room + }; +} + + +function formatRoom(room) { + const { _id, name, items_count, room_price } = room; + + return { + _id, + name, + items_count, + room_price + }; +} \ No newline at end of file diff --git a/src/assets/styles/diagram.css b/src/assets/styles/diagram.css new file mode 100644 index 0000000..094e6f9 --- /dev/null +++ b/src/assets/styles/diagram.css @@ -0,0 +1,40 @@ +.diagram-container { + width: 100%; /* Utilise toute la largeur horizontale disponible */ + margin-bottom: 20px; +} + +.row-container { + display: flex; + align-items: flex-end; /* Alignement des éléments à la base */ + margin-bottom: 10px; +} + +.row { + background-color: #007bff; + height: 20px; + position: relative; + border-radius: 5px; + transition: width 0.5s ease; + +} + +.value { + position: absolute; + bottom: 50%; /* Alignement par rapport à la base de l'élément parent */ + right: 0; + transform: translate(50%, 50%); /* Ajustement de la position */ + color: white; + font-size: 12px; + padding: 5px; + border-radius: 3px; + background-color: rgba(0, 0, 0, 0.8); +} + +.label { + width: 55px; + text-align: center; + font-size: 14px; + color: #333; + position: relative; /* Permet l'alignement des labels à la base */ + bottom: 0; /* Alignement à la base */ +} \ No newline at end of file diff --git a/src/assets/styles/room-page.css b/src/assets/styles/room-page.css new file mode 100644 index 0000000..0443219 --- /dev/null +++ b/src/assets/styles/room-page.css @@ -0,0 +1,18 @@ +.manContainer { + display: flex; + flex-direction: column; + height: 100%; +} + +.topContainer { + display: flex; + flex-grow: 1; +} + +.statsContainer, .listContainer { + flex-grow: 1; +} + +.detailContainer { + height: 50%; +} diff --git a/src/assets/styles/room-stats.css b/src/assets/styles/room-stats.css new file mode 100644 index 0000000..31cac00 --- /dev/null +++ b/src/assets/styles/room-stats.css @@ -0,0 +1,47 @@ +.room-stats-container { + display: flex; + flex-direction: column; + margin: 20px; +} + +.text-stats { + background-color: #f9f9f9; + padding: 20px; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); + margin-bottom: 20px; +} + +.stats-info { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 20px; +} + +.stat { + padding: 10px; + border: 1px solid #ddd; + border-radius: 5px; +} + + .stat p { + margin: 0; + font-weight: bold; + } + + .stat ul { + list-style: none; + padding: 0; + margin: 5px 0; + } + + .stat ul li { + margin: 5px 0; + } + +.diagram { + background-color: #fff; + padding: 20px; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} diff --git a/src/components/diagram.jsx b/src/components/diagram.jsx new file mode 100644 index 0000000..24dcb57 --- /dev/null +++ b/src/components/diagram.jsx @@ -0,0 +1,30 @@ +import React, { useState, useEffect } from "react"; +import { Col, Row } from "antd"; +import '../assets/styles/diagram.css' + + +const Diagram = ({ data }) => { + const [diagramData, setDiagramData] = useState(data); + + useEffect(() => { + setDiagramData(data); + }, [data]); + + const maxValue = Math.max(...diagramData.map(item => item.value)); + + return ( +
+

Prix total par an

+ {diagramData.map(({ name, value }) => ( +
+
{name}
+
+
{value}
+
+
+ ))} +
+ ); +}; + +export default Diagram; \ No newline at end of file diff --git a/src/components/form/formUpdateItem.jsx b/src/components/form/formUpdateItem.jsx index b2037e6..ca54b2f 100644 --- a/src/components/form/formUpdateItem.jsx +++ b/src/components/form/formUpdateItem.jsx @@ -8,34 +8,24 @@ import moment from 'moment'; const { Option } = Select; -function formatItem(itemObj) {//_id, brand, model, room, price, purchaseDate, description, categories, createdAt, updatedAt, __v, link) { - let _id = itemObj._id - let brand = itemObj.brand - let model = itemObj.model - let room = itemObj.room - let price = itemObj.price - let purchaseDate = new Date(itemObj.purchaseDate) - let description = itemObj.description - let categories = itemObj.categories - let createdAt = itemObj.createdAt - let updatedAt = itemObj.updatedAt - let __v = itemObj.__v - let link = itemObj.link - let item = { +function formatItem(itemObj) { + const {_id,brand,model,room,price,purchaseDate,description,categories,createdAt,updatedAt,__v,link} = itemObj + const formattedPurchaseDate = typeof purchaseDate === 'string' ? new Date(purchaseDate) : purchaseDate; + + return { _id, brand, model, room, price, - purchaseDate, + purchaseDate: formattedPurchaseDate, description, categories, createdAt, updatedAt, __v, link - } - return item; + }; } export const FormUpdateItem = ({ itemId }) => { diff --git a/src/components/item/ItemBox.jsx b/src/components/item/ItemBox.jsx index 1ea6ad2..3a6ad85 100644 --- a/src/components/item/ItemBox.jsx +++ b/src/components/item/ItemBox.jsx @@ -1,40 +1,10 @@ import React, { useEffect, useState } from 'react'; -import { searchAndResizeImage } from '../../api/image-request' import '../../assets/styles/modal.css' import '../../assets/styles/itembox.css' import FormUpdateItem from '../form/formUpdateItem'; -// Composant Image -const Image = ({ src, alt, request, _id }) => { - const [cacheUrl, setCacheUrl] = useState(null); - useEffect(() => { - const fetchData = async () => { - let cachedUrl = localStorage.getItem(_id); - if (!cachedUrl) { - try { - cachedUrl = await searchAndResizeImage(request); - localStorage.setItem(_id, cachedUrl); - console.log("Mise en cache de l'image avec l'ID : " + _id); - } catch (error) { - console.error("Erreur lors de la récupération de l'image : ", error); - } - } - setCacheUrl(cachedUrl); - }; - - fetchData(); - }, [request, _id]); - - if (src) { - return {alt}; - } else if (cacheUrl) { - return {alt}; - } else { - return {alt}; - } -}; // Composant Description const Description = ({ title, children }) => { diff --git a/src/components/nav/Navbar.jsx b/src/components/nav/Navbar.jsx index ea3df3f..30fbb66 100644 --- a/src/components/nav/Navbar.jsx +++ b/src/components/nav/Navbar.jsx @@ -60,7 +60,10 @@ const Navbar = () => { , {roomItems} - + , + + Voir les chambres + , ]; diff --git a/src/components/parts/image.jsx b/src/components/parts/image.jsx new file mode 100644 index 0000000..ac6c3fc --- /dev/null +++ b/src/components/parts/image.jsx @@ -0,0 +1,34 @@ + +import React, { useEffect, useState } from 'react'; +import { searchAndResizeImage } from '../../api/image-request' + +// Composant Image +export const Image = ({ src, alt, request, _id }) => { + const [cacheUrl, setCacheUrl] = useState(null); + + useEffect(() => { + const fetchData = async () => { + let cachedUrl = localStorage.getItem(_id); + if (!cachedUrl) { + try { + cachedUrl = await searchAndResizeImage(request); + localStorage.setItem(_id, cachedUrl); + console.log("Mise en cache de l'image avec l'ID : " + _id); + } catch (error) { + console.error("Erreur lors de la récupération de l'image : ", error); + } + } + setCacheUrl(cachedUrl); + }; + + fetchData(); + }, [request, _id]); + + if (src) { + return {alt}; + } else if (cacheUrl) { + return {alt}; + } else { + return {alt}; + } +} \ No newline at end of file diff --git a/src/components/rooms/room-list.jsx b/src/components/rooms/room-list.jsx new file mode 100644 index 0000000..e2a1ed6 --- /dev/null +++ b/src/components/rooms/room-list.jsx @@ -0,0 +1,46 @@ +import React, { useState, useEffect } from "react"; +import axios from 'axios'; // Assurez-vous que le chemin d'importation soit correct +import { ItemBox } from './ItemBox'; +import { Space, DatePicker, Row, Col, Select, Input, InputNumber } from 'antd'; +import '../../assets/styles/item-page.css' + + + +const { RangePicker } = DatePicker; +const { Option } = Select; + +const itemsPerPage = 8; // Nombre total d'items par page +const itemsPerRow = 4; // Nombre d'items par rangée + +// Fonction pour diviser le tableau d'items en rangées +const chunkArray = (arr, size) => { + const chunkedArr = []; + for (let i = 0; i < arr.length; i += size) { + chunkedArr.push(arr.slice(i, i + size)); + } + return chunkedArr; +}; + +// Composant d'affichage de la page +export const RoomList = (roomsParam) => { + const [rooms, setRooms] = useState([]); + const [selectedRoom, setSelectedRoom] = useState('all'); + + useEffect(() => { + setRooms(roomsParam) + }, [roomsParam]); + + const handleRoomChange = (value) => { + setSelectedRoom(value); + }; + + return ( +
+
+ {rooms.forEach((room) => { + +
+ ); +}; \ No newline at end of file diff --git a/src/components/rooms/room-stats.jsx b/src/components/rooms/room-stats.jsx new file mode 100644 index 0000000..8e6742c --- /dev/null +++ b/src/components/rooms/room-stats.jsx @@ -0,0 +1,69 @@ +import React, { useEffect, useState } from 'react'; + +import { formatRoomStats } from '../../api/room' +import Diagram from '../diagram'; +import '../../assets/styles/room-stats.css' + + + +const RoomStats = ({statsParam}) => { + const [stats, setStats] = useState(); + const [diagramValues, setDiagramValues] = useState([]) + + useEffect(() => { + if (statsParam.global) { + console.log(statsParam) + let formatedStats = formatRoomStats(statsParam) + setStats(formatedStats) + } + }, [statsParam]); + + useEffect(() => { + if (stats) { + let table = Object.entries(stats.years) + .filter(([year, value]) => value !== 0) // Filtrer les entrées où Y n'est pas égal à 0 + .map(([year, value]) => ({ name: year, value: value })); + setDiagramValues(table); + } + }, [stats]) + + return ( +
+
+

Statistiques des chambres

+
+
+

Total des chambres :

+ {stats?.global?.rooms_count} +
+
+

Total des articles :

+ {stats?.global?.items_count} +
+
+

Prix total :

+ {stats?.global?.total_price} +
+
+

La chambre avec le plus d'articles :

+
    +
  • {stats?.global.most_item_room?.name}
    • +
  • Nombre d'articles : {stats?.global?.most_item_room?.count}
    • +
+
+
+

La chambre la plus chère :

+
    +
  • {stats?.global?.most_expensive_room?.name}
    • +
  • Prix total : {stats?.global?.most_expensive_room?.price}
    • +
+
+
+
+
+ +
+
+ ); +}; +export default RoomStats; \ No newline at end of file diff --git a/src/components/rooms/roomBox.jsx b/src/components/rooms/roomBox.jsx new file mode 100644 index 0000000..f5d0626 --- /dev/null +++ b/src/components/rooms/roomBox.jsx @@ -0,0 +1,23 @@ +import React, { useEffect, useState } from 'react'; +import '../../assets/styles/itembox.css' +import { } from '../item/ItemBox' + + +// Composant Détails du Produit +export const RoomBox = ({ name, itemCount, roomPrice, _id }) => { + const [roomData, setRoomData] = useState(); + + useEffect(() => { + setRoomData({name, itemCount, roomPrice, _id}) + }, [name, itemCount, roomPrice, _id]); + + + return ( +
+ + + + +
+ ); +}; \ No newline at end of file diff --git a/src/pages/rooms-stats.jsx b/src/pages/rooms-stats.jsx deleted file mode 100644 index 8087dec..0000000 --- a/src/pages/rooms-stats.jsx +++ /dev/null @@ -1,25 +0,0 @@ -import React, { useEffect } from 'react'; - -import { useAuth } from "../hooks"; -import { ItemPage } from "../components/item/ItemPage"; -import { usePageTitle } from '../hooks/page-title-context'; - -export const RoomsStats = () => { - const { user } = useAuth(); - const { setPageTitle } = usePageTitle(); - - - // Mettre à jour le titre de la page dans le contexte - useEffect(() => { - setPageTitle("Toutes les rooms :"); - }, [setPageTitle]); - - useEffect(() => { - setPageTitle("Toutes les rooms :"); - }, [setPageTitle]); - return ( -
-
-
- ); -}; diff --git a/src/pages/rooms.jsx b/src/pages/rooms.jsx new file mode 100644 index 0000000..7e472c9 --- /dev/null +++ b/src/pages/rooms.jsx @@ -0,0 +1,46 @@ +import React, { useEffect, useState } from 'react'; +import '../assets/styles/room-page.css' + +import { useAuth } from "../hooks"; +import { formatRoomStats, getRooms, getRoomStats } from "../api/room"; +import { usePageTitle } from '../hooks/page-title-context'; +import RoomStats from '../components/rooms/room-stats'; + +export const Rooms = () => { + const { user } = useAuth(); + const { setPageTitle } = usePageTitle(); + const [stats, setStats] = useState({}); + + + // Mettre à jour le titre de la page dans le contexte + useEffect(() => { + setPageTitle("Toutes les rooms :"); + }, [setPageTitle]); + + useEffect(() => { + const fetchData = async () => { + const roomsStatsResponse = await getRoomStats(); + setStats(roomsStatsResponse); + }; + + fetchData(); + }, []); + + + return ( +
+
+
+ + +
+
+
+
+
+ + +
+
+ ); +}; diff --git a/src/router.jsx b/src/router.jsx index 1147a9b..368f59b 100644 --- a/src/router.jsx +++ b/src/router.jsx @@ -3,6 +3,7 @@ import { Route, Routes } from "react-router-dom"; import { Home, Login, Register } from "./pages"; import { Items } from "./pages/items"; +import { Rooms } from "./pages/rooms"; export const Router = () => ( @@ -11,5 +12,6 @@ export const Router = () => ( } /> } /> } /> + } /> );