// 'use client'
// ==========================================================
// RESOURCES
// ** APOLLO Imports
import { useReactiveVar } from '@apollo/client'
import {
// isPreferencesDataSetVar,
preferencesDataVar,
// preferencesStore,
// projectStore,
} from '#/lib/api/graphql/apollo'
// REACT Imports
import {
forwardRef,
Suspense,
useImperativeHandle,
useRef,
useState,
useEffect,
useTransition,
} from 'react'
// ** R3F Imports
import {
Environment, Stage,
// KeyboardControls,
OrbitControls, TransformControls, PivotControls,
GizmoHelper, GizmoViewcube, GizmoViewport,
ContactShadows, BakeShadows,
// softShadows, // softShadows()
// Loader, useProgress,
// Preload,
Html, Center,
// **
// useGLTF, useFBX,
// **
View as ThreeDViewImpl,
// PerspectiveCamera,
Grid,
Bvh,
} from '@react-three/drei'
// ** React Spring
import {
useSpring,
animated
} from '@react-spring/three'
// ** LEVA CONTROLS Imports
import { useControls } from 'leva'
// ** THREED Config
import {
Config,
INITIAL,
detailLevels,
modifyConfigsFromUrlParams,
getFocusFromUrlParams,
seasonProperties,
} from "#/lib/farmbot/threed-farmbot/config-threed"
import {
PrivateOverlay,
PublicOverlay,
ToolTip
} from "#/lib/farmbot/threed-farmbot/config_overlays"
// ** THREED:IO Imports
// import { ThreedIO } from '#/lib/threed/threedio/components/ThreedIO'
// ** THREED OBJECTS
import ThreeDLights from '#/lib/threed/components/canvas/Lights'
import ThreeDCamera from '#/lib/threed/components/canvas/Camera'
import ThreeDExperience from '#/lib/threed/components/canvas/Experience'
// ** HELPER Components
// import Spinner from '#/layout/ui/spinner'
// ** UUID Imports
// import { v4 as newUUID } from 'uuid'
// ** Performance Monitor
import { Perf, PerfHeadless, usePerf } from 'r3f-perf'
// ** COLORFUL CONSOLE MESSAGES (ccm)
import ccm from '#/lib/utils/console-colors'
// console.debug('%c ccm', ccm)
// ==============================================================
// ** INTERFACES + TYPES
interface IViewerProps {
// children: any,
enableOrbit: boolean,
enableGizmoCube: boolean,
enableAxesHelper: boolean,
enableGridHelper: boolean,
enableGridHelper2: boolean,
enablePerf: boolean,
threeds: Object[],
// ModelProps
config: Config,
setConfig: Function, // setConfig REACT.useState props cascading...
activeFocus: string,
setActiveFocus(focus: string): void,
}
// ==============================================================
// ** VARIABLES
const debug = true // false | true // ts: boolean
const DEBUG = true // false | true // ts: boolean
// ** Environment
function ThreeDEnvironment() {
// ** HOOKS
const prefs = useReactiveVar(preferencesDataVar)
// ==========================================================
return (
)
}
// ==========================================================
// ** RETURN ThreeDExperienceViewer
const ThreeDExperienceViewer = forwardRef((
{
// children,
enableOrbit,
enableGizmoCube,
enableAxesHelper,
enableGridHelper,
enableGridHelper2,
enablePerf,
threeds,
// ...props
// ModelProps
config,
setConfig,
activeFocus,
setActiveFocus,
}: IViewerProps,
// },
refCanvas // the forwarded ref
) => {
// ** HOOKS
const prefs = useReactiveVar(preferencesDataVar)
// ** THREED IO
// const localRef = useRef(null)
// useImperativeHandle(ref, () => localRef.current)
// ==========================================================
// ** RETURN JSX
return (
<>
{/* */}
{/* THREED IO */}
{/* */}
{/*
*/}
{/* BACKGROUND COLOR? */}
{/* LIGHTS, CAMERA, ACTION */}
{/* THREED LIGHTS */}
{/* */}
{/* THREED CAMERA */}
{/* THREED ACTION */}
{/* TESTING: Camera + Animation Action Rig */}
{/* */}
{/* AXES + GRID HELPERS */}
{enableAxesHelper && (
)}
{enableGridHelper && (
<>
{enableGridHelper2 && (
)}
)}
{/* THREED SCENE
* Imports "Custom" Files/Assets via API for ThreeDs into Canvas */}
{/* */}
{/* THREED ENVIRONMENT */}
{/* THREED EXPERIENCE */}
{/* */}
{/* SHADOW EFFECTS */}
{/* Transform Model using TransformControls */}
{/*
*/}
{/* EXAMPLE: SHOE + SHOES */}
{/*
*/}
{/* ORBIT CONTROLS (CAMERA CONTROLS) */}
{/* makeDefault makes the controls known to r3f,
now transform-controls can auto-disable them when active */}
{enableOrbit && (
<>
{/* ORBIT CONTROLS GIZMO HELPER */}
{enableGizmoCube && (
)}
)}
{enablePerf && (
)}
{/*
*/}
{/* */}
)
}
) // forwardRef end
// module properties
ThreeDExperienceViewer.displayName = 'ThreeD-ExperienceViewer'
export { ThreeDExperienceViewer }
export default ThreeDExperienceViewer