feat: Optimize event listeners in AssetsGroup and streamline model loading; enhance sky and scene components with adaptive features

app/src/modules/scene/postProcessing/postProcessing.tsx

@@ -1,4 +1,5 @@
-import { EffectComposer, N8AO, Outline } from "@react-three/postprocessing";
+import { DepthOfField, EffectComposer, GodRays, N8AO, Outline } from "@react-three/postprocessing";
+import { useThree } from "@react-three/fiber";
 import { BlendFunction } from "postprocessing";
 import {
     useDeletableFloorItem,
@@ -11,6 +12,7 @@ import { useEffect } from "react";
 import { useBuilderStore } from "../../../store/builder/useBuilderStore";
 
 export default function PostProcessing() {
+    const { scene } = useThree();
     const { selectedPoints } = useSelectedPoints();
     const { deletableFloorItem } = useDeletableFloorItem();
     const { selectedWallItem } = useSelectedWallItem();
@@ -77,6 +79,11 @@ export default function PostProcessing() {
                 denoiseRadius={6}
                 denoiseSamples={16}
             />
+            <DepthOfField
+                focusDistance={0}
+                focalLength={0.15}
+                bokehScale={2}
+            />
             {selectedWallAsset && (
                 <Outline
                     selection={flattenChildren(selectedWallAsset.children)}