diff --git a/modules/room/components/Room.tsx b/modules/room/components/Room.tsx
index ead49f4..7c8f496 100644
--- a/modules/room/components/Room.tsx
+++ b/modules/room/components/Room.tsx
@@ -7,19 +7,22 @@ import MouseRenderer from "./MouseRenderer";
import { ToolBar } from "./toolbar/ToolBar";
import NameInput from "./NameInput";
import UsersList from "./UsersList";
+import { useRef } from "react";
const Room = () => {
const room = useRoom();
- if(!room.id) return
+
+ const undoRef= useRef(null);
+ if(!room.id) return ;
return (
-
-
+
+
diff --git a/modules/room/components/board/Background.tsx b/modules/room/components/board/Background.tsx
new file mode 100644
index 0000000..7cf8949
--- /dev/null
+++ b/modules/room/components/board/Background.tsx
@@ -0,0 +1,45 @@
+import { useEffect, useRef } from "react";
+import { useBoardPosition } from "../../hooks/useBoardPosition";
+import {motion} from "framer-motion";
+import { CANVAS_SIZE } from "@/common/constants/canvasSize";
+
+const Background = () => {
+ const {x,y} = useBoardPosition();
+ const ref= useRef(null);
+
+ useEffect(()=> {
+ const ctx= ref.current?.getContext("2d");
+
+ if(ctx){
+ ctx.fillStyle="#fff";
+ ctx.fillRect(0,0,CANVAS_SIZE.width, CANVAS_SIZE.height);
+ ctx.lineWidth=1;
+ ctx.strokeStyle="#ccc";
+
+
+ for(let i=0;i
+ );
+};
+
+export default Background;
\ No newline at end of file