feat(paint-slots): add drei sunset environment as an editor viewer child

Inject an EditorEnvironment wrapper (drei prefiltered sunset HDRI at
environmentIntensity 0.6) as a child of the editor Viewer, not baked into
the Viewer component, so read-only/embed viewers stay lightweight. This
gives PBR metals their reflections and lifts lighting on vertical walls
that flat directional + hemisphere lights cannot.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Wassim SAMAD
2026-06-17 14:30:23 -04:00
co-authored by Claude Opus 4.8
parent 8aa179e9cb
commit 37c56788f3
2 changed files with 22 additions and 0 deletions
@@ -0,0 +1,20 @@
'use client'
import { Environment } from '@react-three/drei'
import { Suspense } from 'react'
/**
* Scene IBL for the editor — drei's prefiltered environment map. Injected as a
* <Viewer> *child* (not baked into the Viewer component) so read-only / embed
* viewers don't pull the HDRI. This is what gives PBR metals their reflections
* and lifts the lighting on vertical surfaces (walls), which flat directional +
* hemisphere lights can't do alone. Intensity is dialled below the preset
* default so it complements the scene lights rather than washing them out.
*/
export function EditorEnvironment() {
return (
<Suspense fallback={null}>
<Environment preset="sunset" environmentIntensity={0.6} />
</Suspense>
)
}
@@ -21,6 +21,7 @@ import {
} from '../../lib/scene' } from '../../lib/scene'
import { initSFXBus } from '../../lib/sfx-bus' import { initSFXBus } from '../../lib/sfx-bus'
import useEditor from '../../store/use-editor' import useEditor from '../../store/use-editor'
import { EditorEnvironment } from '../editor-environment'
import { CeilingSelectionAffordanceSystem } from '../systems/ceiling/ceiling-selection-affordance-system' import { CeilingSelectionAffordanceSystem } from '../systems/ceiling/ceiling-selection-affordance-system'
import { CeilingSystem } from '../systems/ceiling/ceiling-system' import { CeilingSystem } from '../systems/ceiling/ceiling-system'
import { RoofEditSystem } from '../systems/roof/roof-edit-system' import { RoofEditSystem } from '../systems/roof/roof-edit-system'
@@ -602,6 +603,7 @@ const ViewerSceneContent = memo(function ViewerSceneContent({
const noEditing = isVersionPreviewMode || isFirstPersonMode || isStudioMode const noEditing = isVersionPreviewMode || isFirstPersonMode || isStudioMode
return ( return (
<> <>
<EditorEnvironment />
{!(isFirstPersonMode || isStudioMode) && <SelectionManager />} {!(isFirstPersonMode || isStudioMode) && <SelectionManager />}
{!noEditing && <BoxSelectTool />} {!noEditing && <BoxSelectTool />}
{!noEditing && <NodeArrowHandles />} {!noEditing && <NodeArrowHandles />}