first person bug fix

2025-09-04 12:41:49 +05:30
parent e208d79ce6
commit 0d7f5d280f
8 changed files with 149 additions and 160 deletions
--- a/app/src/components/layout/scenes/MainScene.tsx
+++ b/app/src/components/layout/scenes/MainScene.tsx
@@ -80,7 +80,7 @@ function MainScene() {
                }
            })
        }
-    }, [setSelectedVersion, versionHistory])
+    }, [setSelectedVersion, versionHistory, projectId])

    const handleSelectVersion = (option: string) => {
        const version = versionHistory.find((version) => version.versionName === option);
--- a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx
+++ b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx
@@ -1,10 +1,4 @@
-import {
-    AddIcon,
-    ArrowIcon,
-    CloseIcon,
-    KebabIcon,
-    LocationIcon,
-} from "../../../icons/ExportCommonIcons";
+import { AddIcon, ArrowIcon, CloseIcon, KebabIcon, LocationIcon } from "../../../icons/ExportCommonIcons";
 import RenameInput from "../../../ui/inputs/RenameInput";
 import { useVersionHistoryStore } from "../../../../store/builder/useVersionHistoryStore";
 import { useSubModuleStore } from "../../../../store/useModuleStore";
@@ -30,9 +24,8 @@ const VersionHistory = () => {

        getVersionDataApi(projectId, version.versionId).then((versionData) => {
            setSelectedVersion(version);
-            // console.log(versionData);
        }).catch((err) => {
-            // console.log(err);
+            echo.error(err);
        })
    };

--- a/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx
+++ b/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx
@@ -1,8 +1,5 @@
 import { useEffect, useState } from "react";
-import {
-  FinishEditIcon,
-  RenameVersionIcon,
-} from "../../../icons/ExportCommonIcons";
+import { FinishEditIcon, RenameVersionIcon } from "../../../icons/ExportCommonIcons";
 import RenderOverlay from "../../../templates/Overlay";
 import { useVersionHistoryStore } from "../../../../store/builder/useVersionHistoryStore";
 import { createVersionApi } from "../../../../services/factoryBuilder/versionControl/addVersionApi";
@@ -11,144 +8,144 @@ import { getUserData } from "../../../../functions/getUserData";
 import { useVersionContext } from "../../../../modules/builder/version/versionContext";

 const VersionSaved = () => {
-  const { addVersion, createNewVersion, setCreateNewVersion } = useVersionHistoryStore();
-  const { selectedVersionStore } = useVersionContext();
-  const { selectedVersion, setSelectedVersion } = selectedVersionStore();
-  const [newName, setNewName] = useState(new Date().toLocaleString("en-US", {
-    month: "short",
-    day: "numeric",
-    year: "numeric",
-    hour: "numeric",
-    minute: "2-digit",
-  }));
-  const [description, setDescription] = useState("");
-  const [showSaveFinish, setSaveFinish] = useState(false);
-  const { projectId } = useParams();
-  const { userId } = getUserData();
-
-  useEffect(() => {
-    if (createNewVersion) {
-      const defaultName = new Date().toLocaleString("en-US", {
+    const { addVersion, createNewVersion, setCreateNewVersion } = useVersionHistoryStore();
+    const { selectedVersionStore } = useVersionContext();
+    const { selectedVersion, setSelectedVersion } = selectedVersionStore();
+    const [newName, setNewName] = useState(new Date().toLocaleString("en-US", {
        month: "short",
        day: "numeric",
        year: "numeric",
        hour: "numeric",
        minute: "2-digit",
-      });
-      setNewName(defaultName);
-      setDescription("");
-    }
-  }, [createNewVersion]);
+    }));
+    const [description, setDescription] = useState("");
+    const [saveFinish, setSaveFinish] = useState(false);
+    const { projectId } = useParams();
+    const { userId } = getUserData();

-  const handleSave = () => {
-    if (!selectedVersion || !projectId) return;
+    useEffect(() => {
+        if (createNewVersion) {
+            const defaultName = new Date().toLocaleString("en-US", {
+                month: "short",
+                day: "numeric",
+                year: "numeric",
+                hour: "numeric",
+                minute: "2-digit",
+            });
+            setNewName(defaultName);
+            setDescription("");
+        }
+    }, [createNewVersion]);

-    const updatedName = (newName.trim() || selectedVersion.versionName) ?? selectedVersion.timeStamp;
-    const updatedDescription = (description.trim() || selectedVersion.versionName) ?? selectedVersion.timeStamp;
+    const handleSave = () => {
+        if (!selectedVersion || !projectId) return;

-    createVersionApi(projectId, userId, selectedVersion.versionId, updatedName, updatedDescription).then((data) => {
-      setSaveFinish(true);
-      setCreateNewVersion(false);
+        const updatedName = (newName.trim() || selectedVersion.versionName) ?? selectedVersion.timeStamp;
+        const updatedDescription = (description.trim() || selectedVersion.versionName) ?? selectedVersion.timeStamp;

-      addVersion({
-        version: data.version,
-        versionId: data.versionId,
-        versionName: data.versionName,
-        versionDescription: data.description,
-        timeStamp: data.createdAt,
-        createdBy: data.createdBy.userName
-      })
+        createVersionApi(projectId, userId, selectedVersion.versionId, updatedName, updatedDescription).then((data) => {
+            setSaveFinish(true);
+            setCreateNewVersion(false);

-      setSelectedVersion({
-        version: data.version,
-        versionId: data.versionId,
-        versionName: data.versionName,
-        versionDescription: data.description,
-        timeStamp: data.createdAt,
-        createdBy: data.createdBy.userName
-      })
+            addVersion({
+                version: data.version,
+                versionId: data.versionId,
+                versionName: data.versionName,
+                versionDescription: data.description,
+                timeStamp: data.createdAt,
+                createdBy: data.createdBy.userName
+            })

-      setTimeout(() => {
+            setSelectedVersion({
+                version: data.version,
+                versionId: data.versionId,
+                versionName: data.versionName,
+                versionDescription: data.description,
+                timeStamp: data.createdAt,
+                createdBy: data.createdBy.userName
+            })
+
+            setTimeout(() => {
+                setSaveFinish(false);
+            }, 3000);
+        }).catch((err) => {
+            setSaveFinish(false);
+            setCreateNewVersion(false);
+        })
+    };
+
+    const handleCancel = () => {
        setSaveFinish(false);
-      }, 3000);
-    }).catch((err) => {
-      setSaveFinish(false);
-      setCreateNewVersion(false);
-    })
-  };
+        setCreateNewVersion(false);
+    };

-  const handleCancel = () => {
-    setSaveFinish(false);
-    setCreateNewVersion(false);
-  };
+    if (!selectedVersion) return null;

-  if (!selectedVersion) return null;
+    return (
+        <div className={`versionSaved`}>
+            {createNewVersion &&
+                <RenderOverlay>
+                    <div className="edit-version-popup-wrapper">
+                        <div className="details-wrapper-popup-container">
+                            <div className="header-wrapper">
+                                <RenameVersionIcon />
+                                <div className="label">Create Version</div>
+                            </div>
+                            <div className="details-wrapper">
+                                <div className="version-name">
+                                    <input
+                                        type="text"
+                                        value={newName}
+                                        onChange={(e) => setNewName(e.target.value)}
+                                        placeholder="Enter new version name"
+                                    />
+                                    <div className="label">
+                                        by @{selectedVersion.createdBy}{" "}{new Date(selectedVersion.timeStamp).toLocaleDateString("en-US", {
+                                            year: "numeric",
+                                            month: "long",
+                                            day: "2-digit",
+                                        })}
+                                    </div>
+                                </div>
+                                <div className="version-description">
+                                    <textarea
+                                        value={description}
+                                        onChange={(e) => setDescription(e.target.value)}
+                                        placeholder="Add description"
+                                        style={{ resize: "none" }}
+                                    />
+                                </div>
+                            </div>
+                            <div className="btn-wrapper">
+                                <button className="cancel" onClick={handleCancel}>
+                                    Cancel
+                                </button>
+                                <button className="save" onClick={handleSave}>
+                                    Save
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                </RenderOverlay>
+            }

-  return (
-    <div className={`versionSaved`}>
-      {createNewVersion &&
-        <RenderOverlay>
-          <div className="edit-version-popup-wrapper">
-            <div className="details-wrapper-popup-container">
-              <div className="header-wrapper">
-                <RenameVersionIcon />
-                <div className="label">Create Version</div>
-              </div>
-              <div className="details-wrapper">
-                <div className="version-name">
-                  <input
-                    type="text"
-                    value={newName}
-                    onChange={(e) => setNewName(e.target.value)}
-                    placeholder="Enter new version name"
-                  />
-                  <div className="label">
-                    by @{selectedVersion.createdBy}{" "}{new Date(selectedVersion.timeStamp).toLocaleDateString("en-US", {
-                      year: "numeric",
-                      month: "long",
-                      day: "2-digit",
-                    })}
-                  </div>
-                </div>
-                <div className="version-description">
-                  <textarea
-                    value={description}
-                    onChange={(e) => setDescription(e.target.value)}
-                    placeholder="Add description"
-                    style={{ resize: "none" }}
-                  />
-                </div>
-              </div>
-              <div className="btn-wrapper">
-                <button className="cancel" onClick={handleCancel}>
-                  Cancel
-                </button>
-                <button className="save" onClick={handleSave}>
-                  Save
-                </button>
-              </div>
-            </div>
-          </div>
-        </RenderOverlay>
-      }
-
-      {showSaveFinish && (
-        <RenderOverlay>
-          <div className="finishEdit-version-popup-wrapper">
-            <div className="finishEdit-wrapper-popup-container">
-              <div className="icon">
-                <FinishEditIcon />
-              </div>
-              <div className="versionname">
-                {newName.trim()}
-              </div>
-              <div className="success-message">Saved Successfully!</div>
-            </div>
-          </div>
-        </RenderOverlay>
-      )}
-    </div>
-  );
+            {saveFinish && (
+                <RenderOverlay>
+                    <div className="finishEdit-version-popup-wrapper">
+                        <div className="finishEdit-wrapper-popup-container">
+                            <div className="icon">
+                                <FinishEditIcon />
+                            </div>
+                            <div className="versionname">
+                                {newName.trim()}
+                            </div>
+                            <div className="success-message">Saved Successfully!</div>
+                        </div>
+                    </div>
+                </RenderOverlay>
+            )}
+        </div>
+    );
 };

 export default VersionSaved;
--- a/app/src/modules/builder/Decal/eventHandler/useDecalEventHandlers.ts
+++ b/app/src/modules/builder/Decal/eventHandler/useDecalEventHandlers.ts
@@ -338,6 +338,8 @@ export function useDecalEventHandlers({
            canvasElement.addEventListener('pointerup', handlePointerUp);
            canvasElement?.addEventListener("keyup", onKeyUp);
            canvasElement.addEventListener("keydown", onKeyDown);
+        } else {
+            setKeyEvent("");
        }

        return () => {
--- a/app/src/modules/builder/builder.tsx
+++ b/app/src/modules/builder/builder.tsx
@@ -30,7 +30,6 @@ import Decal from "./Decal/decal";

 import { useParams } from "react-router-dom";
 import { useBuilderStore } from "../../store/builder/useBuilderStore";
-import { getUserData } from "../../functions/getUserData";
 import { findEnvironment } from "../../services/factoryBuilder/environment/findEnvironment";

 export default function Builder() {
@@ -46,8 +45,7 @@ export default function Builder() {
    const { setRenderDistance } = useRenderDistance();
    const { setLimitDistance } = useLimitDistance();
    const { projectId } = useParams();
-    const { setHoveredPoint, setHoveredLine } = useBuilderStore();
-    const { userId, organization } = getUserData();
+    const { setHoveredPoint, setHoveredLine, selectedWallAsset } = useBuilderStore();

    useEffect(() => {
        if (!toggleView) {
@@ -71,7 +69,7 @@ export default function Builder() {
    }, [projectId]);

    useFrame(() => {
-        if (csgRef.current) {
+        if (csgRef.current && selectedWallAsset) {
            csgRef.current.update();
        }
    })
--- a/app/src/modules/scene/camera/camMode.tsx
+++ b/app/src/modules/scene/camera/camMode.tsx
@@ -19,7 +19,9 @@ const CamMode: React.FC = () => {

    useEffect(() => {
        const handlePointerLockChange = async () => {
-            if (camMode === "FirstPerson" && !toggleView) {
+            if (document.pointerLockElement && !toggleView) {
+                return;
+            } else if (camMode === "FirstPerson" && !toggleView) {
                setCamMode("ThirdPerson");
                await switchToThirdPerson(state.controls, state.camera);
            }
--- a/app/src/modules/scene/clouds/clouds.tsx
+++ b/app/src/modules/scene/clouds/clouds.tsx
@@ -1,7 +1,7 @@
 import * as THREE from 'three';
 import { useRef, useState } from 'react';
 import { useFrame } from '@react-three/fiber';
-import { Clouds, Cloud } from '@react-three/drei';
+import { Clouds as DreiClouds, Cloud } from '@react-three/drei';

 interface CloudGroupProps {
    initialX: number;
@@ -26,7 +26,7 @@ function CloudGroup({ initialX, initialZ, speed, height }: Readonly<CloudGroupPr

    return (
        <group ref={group} position={[initialX, height, initialZ]}>
-            <Clouds material={THREE.MeshBasicMaterial} frustumCulled={false} limit={10000}>
+            <DreiClouds material={THREE.MeshBasicMaterial} frustumCulled={false} limit={10000}>
                <Cloud
                    seed={Math.random() * 100}
                    bounds={[100, 15, 100]}
@@ -51,12 +51,12 @@ function CloudGroup({ initialX, initialZ, speed, height }: Readonly<CloudGroupPr
                    fade={10000}
                    color="#f0f0f0"
                />
-            </Clouds>
+            </DreiClouds>
        </group>
    );
 }

-export function MovingClouds() {
+export default function Clouds() {

    const savedTheme: string | null = localStorage.getItem("theme");
    const [theme, setTheme] = useState(savedTheme || "light");
@@ -72,19 +72,15 @@ export function MovingClouds() {

    return (
        <>
-            {theme === 'light' &&
-                <>
-                    {cloudGroups.map((group, index) => (
-                        <CloudGroup
-                            key={index}
-                            initialX={group.initialX}
-                            initialZ={group.initialZ}
-                            speed={group.speed}
-                            height={group.height}
-                        />
-                    ))}
-                </>
-            }
+            {cloudGroups.map((group, index) => (
+                <CloudGroup
+                    key={index}
+                    initialX={group.initialX}
+                    initialZ={group.initialZ}
+                    speed={group.speed}
+                    height={group.height}
+                />
+            ))}
        </>
    );
 }
--- a/app/src/modules/scene/setup/setup.tsx
+++ b/app/src/modules/scene/setup/setup.tsx
@@ -1,5 +1,6 @@
 import Sun from '../environment/sky'
 import Shadows from '../environment/shadow'
+// import Clouds from '../clouds/clouds';
 import PostProcessing from '../postProcessing/postProcessing'
 import StatsHelper from '../helpers/StatsHelper';
 import Controls from '../controls/controls';
@@ -18,7 +19,7 @@ function Setup() {

            <PostProcessing />

-            {/* <MovingClouds /> */}
+            {/* <Clouds /> */}

            <Environment files={background} environmentIntensity={1.5} />