Fixed design and functional issues

apps/front/src/App.tsx

@@ -1,7 +1,7 @@
 import { useEffect, useRef, useState } from "react";
 import { makeStyles, Grid, useTheme } from "@material-ui/core";
 
-import { RoomContextProvider, useRoomContext } from "./context";
+import { RoomContextProvider } from "./context";
 import { BuildingPlan } from "./components/BuildingPlan";
 import { RoomList } from "./components/RoomList";
 import { AppTheme } from "./theme";
@@ -11,6 +11,10 @@ const useStyles = makeStyles((theme) => ({
   root: {
     padding: theme.spacing(10, 2, 2, 2),
     height: "100vh",
+    overflow: "hidden",
+    "& > div": {
+      height: "100%",
+    },
     "& > div > *": {
       height: "100%",
     },

apps/front/src/components/BuildingPlan.tsx

@@ -58,7 +58,7 @@ export const BuildingPlan = ({ width, height }: BuildingPlanProps) => {
 
   const clickCb = (x: number, y: number) => {
     const index = getRoomByCoord(x, y, state.map);
-    if (index >= 0) toggleFree(index);
+    if (index >= 0) toggleFree(index + 1);
   };
 
   return (

apps/front/src/components/RoomList.tsx

@@ -20,6 +20,12 @@ const useStyles = makeStyles((theme) => ({
     width: "100%",
     height: `calc(100% - ${theme.spacing(1)}px)`,
     padding: theme.spacing(2),
+    overflow: "auto",
+    "-ms-overflow-style": "none",
+    scrollbarWidth: "none",
+    "&::-webkit-scrollbar": {
+      display: "none",
+    },
   },
   filterBox: {
     display: "flex",

apps/front/src/context.tsx

@@ -49,7 +49,11 @@ export const RoomContextProvider: FC = ({ children }) => {
             free,
             id,
           } of message.args) {
-            map.push({ coordinates: { x, y }, size: { w, h }, title: title });
+            map.push({
+              coordinates: { x, y },
+              size: { w, h },
+              title: title,
+            });
             char.push({ free });
             ids[id] = map.length - 1;
           }