From f0c69f7051ed12b26129ec5b929edb9a6d5c83fc Mon Sep 17 00:00:00 2001
From: haru <hinagoro5656@gmail.com>
Date: Sun, 21 Dec 2025 04:01:07 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=9C=BA=E3=81=AB=E5=BD=93=E3=81=9F?=
 =?UTF-8?q?=E3=82=8A=E5=88=A4=E5=AE=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/features/room/draggableItem.tsx     |  3 +++
 frontend/src/features/room/draggableSnowdome.tsx |  3 +++
 frontend/src/features/room/itemPlacementMode.tsx |  3 +++
 frontend/src/routes/$roomId/index.lazy.tsx       | 11 ++++++++++-
 4 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/frontend/src/features/room/draggableItem.tsx b/frontend/src/features/room/draggableItem.tsx
index 097e84f..a2b7ad5 100644
--- a/frontend/src/features/room/draggableItem.tsx
+++ b/frontend/src/features/room/draggableItem.tsx
@@ -18,6 +18,7 @@ interface DraggableItemProps {
   onLockChange?: (isLocked: boolean) => void;
   roomRef: React.RefObject<THREE.Group>;
   placedItemsRef?: React.RefObject<THREE.Group>;
+  tableRef: React.RefObject<THREE.Group>;
 }
 
 // 回転のステップ（ラジアン）
@@ -31,6 +32,7 @@ export default function DraggableItem({
   onLockChange,
   roomRef,
   placedItemsRef,
+  tableRef,
 }: DraggableItemProps) {
   const { camera, pointer, gl } = useThree();
   const rigidBodyRef = useRef<RapierRigidBody>(null);
@@ -98,6 +100,7 @@ export default function DraggableItem({
     const targets: THREE.Object3D[] = [];
     if (roomRef.current) targets.push(roomRef.current);
     if (placedItemsRef?.current) targets.push(placedItemsRef.current);
+    if (tableRef.current) targets.push(tableRef.current);
 
     const intersects = raycaster.current.intersectObjects(targets, true);
 
diff --git a/frontend/src/features/room/draggableSnowdome.tsx b/frontend/src/features/room/draggableSnowdome.tsx
index f0fb71d..6107248 100644
--- a/frontend/src/features/room/draggableSnowdome.tsx
+++ b/frontend/src/features/room/draggableSnowdome.tsx
@@ -19,6 +19,7 @@ interface DraggableSnowdomeProps {
   onLockChange?: (isLocked: boolean) => void;
   roomRef: React.RefObject<THREE.Group>;
   placedItemsRef?: React.RefObject<THREE.Group>;
+  tableRef: React.RefObject<THREE.Group>;
 }
 
 // 回転のステップ（ラジアン）
@@ -32,6 +33,7 @@ export default function DraggableSnowdome({
   onLockChange,
   roomRef,
   placedItemsRef,
+  tableRef,
 }: DraggableSnowdomeProps) {
   const { camera, pointer, gl } = useThree();
   const rigidBodyRef = useRef<RapierRigidBody>(null);
@@ -100,6 +102,7 @@ export default function DraggableSnowdome({
     const targets: THREE.Object3D[] = [];
     if (roomRef.current) targets.push(roomRef.current);
     if (placedItemsRef?.current) targets.push(placedItemsRef.current);
+    if (tableRef.current) targets.push(tableRef.current);
 
     const intersects = raycaster.current.intersectObjects(targets, true);
 
diff --git a/frontend/src/features/room/itemPlacementMode.tsx b/frontend/src/features/room/itemPlacementMode.tsx
index 52d0688..7daeafb 100644
--- a/frontend/src/features/room/itemPlacementMode.tsx
+++ b/frontend/src/features/room/itemPlacementMode.tsx
@@ -78,6 +78,7 @@ export function PlacementDraggableItem({
   onLockChange,
   roomRef,
   placedItemsRef,
+  tableRef,
 }: {
   calendarItem: CalendarItemWithItem;
   onPositionChange: (
@@ -90,6 +91,7 @@ export function PlacementDraggableItem({
   onLockChange?: (isLocked: boolean) => void;
   roomRef: React.RefObject<THREE.Group>;
   placedItemsRef?: React.RefObject<THREE.Group>;
+  tableRef: React.RefObject<THREE.Group>;
 }) {
   return (
     <DraggableItem
@@ -101,6 +103,7 @@ export function PlacementDraggableItem({
       setIsPlacementValid={setIsPlacementValid}
       initialRotation={initialRotation}
       onLockChange={onLockChange}
+      tableRef={tableRef}
     />
   );
 }
diff --git a/frontend/src/routes/$roomId/index.lazy.tsx b/frontend/src/routes/$roomId/index.lazy.tsx
index 2f1c991..8e7c837 100644
--- a/frontend/src/routes/$roomId/index.lazy.tsx
+++ b/frontend/src/routes/$roomId/index.lazy.tsx
@@ -62,6 +62,7 @@ function RouteComponent() {
   } = useCalendarFocus();
   const roomRef = useRef<THREE.Group>(null);
   const placedItemsRef = useRef<THREE.Group>(null);
+  const tableRef = useRef<THREE.Group>(null);
   // アイテム取得フロー
   const {
     phase,
@@ -358,9 +359,15 @@ function RouteComponent() {
               <group position={[0, 0, 1]}>
                 <RigidBody
                   lockRotations
+                  colliders="trimesh"
                   type={isAnyPlacementMode ? "kinematicPosition" : "dynamic"}
                 >
-                  <Gltf src={tableUrl} scale={6} position={[0, 0, 0]} />
+                  <Gltf
+                    src={tableUrl}
+                    ref={tableRef}
+                    scale={6}
+                    position={[0, 0, 0]}
+                  />
                 </RigidBody>
                 <RigidBody
                   lockRotations
@@ -406,6 +413,7 @@ function RouteComponent() {
                   placedItemsRef={
                     placedItemsRef as React.RefObject<THREE.Group>
                   }
+                  tableRef={tableRef as React.RefObject<THREE.Group>}
                   calendarItem={targetCalendarItem}
                   onPositionChange={handlePositionChange}
                   isPlacementValid={isPlacementValid}
@@ -421,6 +429,7 @@ function RouteComponent() {
                 roomRef && (
                   <DraggableSnowdome
                     snowdomeParts={snowdomePartsForPlacement}
+                    tableRef={tableRef as React.RefObject<THREE.Group>}
                     onPositionChange={handlePositionChange}
                     isPlacementValid={isPlacementValid}
                     setIsPlacementValid={setIsPlacementValid}