"use client"; import { FacingDirection } from "@/components/consts"; import { createContext, RefObject, useContext, useRef } from "react"; import { Group, Mesh } from "three"; export type CubeMeshRef = RefObject; type CubesContextType = { cubeGroupRef: RefObject; addCube: (cubeMeshRef: CubeMeshRef) => void; getCubes: (faceDirection: FacingDirection) => Mesh[]; }; const CubesContext = createContext({ cubeGroupRef: { current: null }, addCube: () => {}, getCubes: () => [], }); export const useCubesContext = () => useContext(CubesContext); export const CubesProvider = ({ cubeGroupRef, children, }: { cubeGroupRef: RefObject; children: React.ReactNode; }) => { const cubes = useRef([]); const addCube = (cubeMeshRef: CubeMeshRef) => { if (!cubes.current.includes(cubeMeshRef)) { cubes.current.push(cubeMeshRef); } }; const getCubes = (faceDirection: FacingDirection) => { const meshes = cubes.current .map((c) => c.current) .filter((m) => m !== null); switch (faceDirection) { case "front": return meshes.filter((m) => m.position.z > 0); case "back": return meshes.filter((m) => m.position.z < 0); case "left": return meshes.filter((m) => m.position.x < 0); case "right": return meshes.filter((m) => m.position.x > 0); case "top": return meshes.filter((m) => m.position.y > 0); case "bottom": return meshes.filter((m) => m.position.y < 0); } }; return ( {children} ); };