diff --git a/app/src/components/Dashboard/DashboardHome.tsx b/app/src/components/Dashboard/DashboardHome.tsx index 264d3fb..d7526b5 100644 --- a/app/src/components/Dashboard/DashboardHome.tsx +++ b/app/src/components/Dashboard/DashboardHome.tsx @@ -58,7 +58,6 @@ const DashboardHome: React.FC = () => { }; const handleDeleteProject = async (projectId: any) => { - console.log("projectId:delete ", projectId); try { //API for delete project // const deletedProject = await deleteProject( @@ -109,7 +108,6 @@ const DashboardHome: React.FC = () => { projectUuid: projectId, projectName, }; - console.log('projectId: ', projectId); projectSocket.emit("v1:project:Duplicate", duplicateRecentProjectData); }; diff --git a/app/src/components/Dashboard/DashboardTrash.tsx b/app/src/components/Dashboard/DashboardTrash.tsx index a5e47dd..dc4d409 100644 --- a/app/src/components/Dashboard/DashboardTrash.tsx +++ b/app/src/components/Dashboard/DashboardTrash.tsx @@ -22,9 +22,7 @@ interface DiscardedProjects { } const DashboardTrash: React.FC = () => { - const [discardedProjects, setDiscardedProjects] = useState( - {} - ); + const [discardedProjects, setDiscardedProjects] = useState({}); const [isSearchActive, setIsSearchActive] = useState(false); const { userId, organization } = getUserData(); const { projectSocket } = useSocketStore(); diff --git a/app/src/components/footer/Footer.tsx b/app/src/components/footer/Footer.tsx index 0ee70c5..9196809 100644 --- a/app/src/components/footer/Footer.tsx +++ b/app/src/components/footer/Footer.tsx @@ -8,15 +8,21 @@ import { CurserRightIcon, } from "../icons/LogIcons"; import ShortcutHelper from "./shortcutHelper"; -import { useShortcutStore } from "../../store/builder/store"; +import useVersionHistoryVisibleStore, { useShortcutStore } from "../../store/builder/store"; import { usePlayButtonStore } from "../../store/usePlayButtonStore"; +import { useVersionHistoryStore } from "../../store/builder/useVersionHistoryStore"; +import useModuleStore, { useSubModuleStore } from "../../store/useModuleStore"; const Footer: React.FC = () => { const { logs, setIsLogListVisible } = useLogger(); const lastLog = logs.length > 0 ? logs[logs.length - 1] : null; + const { setActiveModule } = useModuleStore(); + const { setSubModule } = useSubModuleStore(); + const { setVersionHistoryVisible } = useVersionHistoryVisibleStore(); const { isPlaying } = usePlayButtonStore(); const { showShortcuts, setShowShortcuts } = useShortcutStore(); + const { selectedVersion } = useVersionHistoryStore(); return (
@@ -61,8 +67,12 @@ const Footer: React.FC = () => { )}
-
- V 0.01 +
{ + setVersionHistoryVisible(true); + setSubModule("properties"); + setActiveModule('builder'); + }}> + {(selectedVersion?.version) ?? 'v 0.0.0'}
@@ -72,11 +82,10 @@ const Footer: React.FC = () => { {!isPlaying && (
- +
)}
diff --git a/app/src/components/layout/sidebarRight/SideBarRight.tsx b/app/src/components/layout/sidebarRight/SideBarRight.tsx index 86c98cb..e7cc3db 100644 --- a/app/src/components/layout/sidebarRight/SideBarRight.tsx +++ b/app/src/components/layout/sidebarRight/SideBarRight.tsx @@ -13,7 +13,7 @@ import { useToggleStore } from "../../../store/useUIToggleStore"; import Visualization from "./visualization/Visualization"; import Analysis from "./analysis/Analysis"; import Simulations from "./simulation/Simulations"; -import useVersionHistoryStore, { +import useVersionHistoryVisibleStore, { useSaveVersion, useSelectedFloorItem, useToolMode, @@ -38,7 +38,7 @@ const SideBarRight: React.FC = () => { const { selectedFloorItem } = useSelectedFloorItem(); const { selectedEventData } = useSelectedEventData(); const { selectedEventSphere } = useSelectedEventSphere(); - const { viewVersionHistory, setVersionHistory } = useVersionHistoryStore(); + const { viewVersionHistory, setVersionHistoryVisible } = useVersionHistoryVisibleStore(); const { isVersionSaved } = useSaveVersion(); // Reset activeList whenever activeModule changes @@ -81,7 +81,7 @@ const SideBarRight: React.FC = () => { }`} onClick={() => { setSubModule("properties"); - setVersionHistory(false); + setVersionHistoryVisible(false); }} >
properties
@@ -96,7 +96,7 @@ const SideBarRight: React.FC = () => { }`} onClick={() => { setSubModule("simulations"); - setVersionHistory(false); + setVersionHistoryVisible(false); }} >
simulations
@@ -108,7 +108,7 @@ const SideBarRight: React.FC = () => { }`} onClick={() => { setSubModule("mechanics"); - setVersionHistory(false); + setVersionHistoryVisible(false); }} >
mechanics
@@ -120,7 +120,7 @@ const SideBarRight: React.FC = () => { }`} onClick={() => { setSubModule("analysis"); - setVersionHistory(false); + setVersionHistoryVisible(false); }} >
analysis
diff --git a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx index a15f990..98ceede 100644 --- a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx +++ b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx @@ -1,148 +1,125 @@ -import React, { useState } from "react"; import { - AddIcon, - ArrowIcon, - CloseIcon, - KebabIcon, - LocationIcon, + AddIcon, + ArrowIcon, + CloseIcon, + KebabIcon, + LocationIcon, } from "../../../icons/ExportCommonIcons"; import RenameInput from "../../../ui/inputs/RenameInput"; -import { useVersionStore } from "../../../../store/builder/store"; -import { generateUniqueId } from "../../../../functions/generateUniqueId"; import { getUserData } from "../../../../functions/getUserData"; +import { useParams } from "react-router-dom"; +import { useVersionHistoryStore } from "../../../../store/builder/useVersionHistoryStore"; +import { useSubModuleStore } from "../../../../store/useModuleStore"; +import useVersionHistoryVisibleStore from "../../../../store/builder/store"; const VersionHistory = () => { - const { userName, userId, organization, email } = getUserData(); - const { versions, addVersion, setVersions, updateVersion } = - useVersionStore(); - const [selectedVersion, setSelectedVersion] = useState( - versions.length > 0 ? versions[0] : null - ); + const { userName } = getUserData(); + const { setSubModule } = useSubModuleStore(); + const { setVersionHistoryVisible } = useVersionHistoryVisibleStore(); + const { versionHistory, addVersion, selectedVersion, setSelectedVersion, setCreateNewVersion } = useVersionHistoryStore(); + const { projectId } = useParams(); - const addNewVersion = () => { - const newVersion = { - id: generateUniqueId(), - versionLabel: `v${versions.length + 1}.0`, - versionName: "", - timestamp: new Date().toLocaleDateString("en-US", { - year: "numeric", - month: "long", - day: "2-digit", - }), - savedBy: userName ?? "Anonymous", + const addNewVersion = () => { + setCreateNewVersion(true); }; - const newVersions = [newVersion, ...versions]; - addVersion(newVersion); - setSelectedVersion(newVersion); - setVersions(newVersions); - }; + const handleSelectVersion = (version: any) => { - const handleSelectVersion = (version: any) => { - setSelectedVersion(version); - const reordered = [version, ...versions.filter((v) => v.id !== version.id)]; - setVersions(reordered); - }; + }; - const handleVersionNameChange = (newName: string, versionId: string) => { - const updated = versions.map((v) => - v.id === versionId ? { ...v, versionName: newName } : v - ); - setVersions(updated); - updateVersion(versionId, { versionName: newName }); - }; + const handleVersionNameChange = (newName: string, versionId: string) => { - return ( -
- {/* Header */} -
-
Version History
-
- -
- -
-
- -
-
-
+ }; - {/* Shortcut Info */} -
-
i
-
- Press Ctrl + Alt + S to add to version history while editing -
-
- - {/* Current Version Display */} - {selectedVersion && ( -
-
- -
-
-
- Current Version ({selectedVersion.versionLabel}) -
-
- {versions.length} Saved History -
-
-
- )} - - {/* Versions List */} -
- {versions.length === 0 ? ( -
No saved versions
- ) : ( - versions.map((version) => ( - +
+ +
+
{ + setSubModule("properties"); + setVersionHistoryVisible(false); + }} + > + +
- -
- - )) - )} -
- - ); + + + {/* Shortcut Info */} +
+
i
+
+ Press Ctrl + Alt + S to add to version history while editing +
+
+ + {/* Current Version Display */} + {selectedVersion && ( +
+
+ +
+
+
+ Current Version ({selectedVersion.version}) +
+
+ {versionHistory.length} Saved History +
+
+
+ )} + + {/* Versions List */} +
+ {versionHistory.length === 0 ? ( +
No saved versions
+ ) : ( + versionHistory.map((version) => ( + + )) + )} +
+ + ); }; export default VersionHistory; diff --git a/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx b/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx index 07f62d2..2a58399 100644 --- a/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx +++ b/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx @@ -1,148 +1,88 @@ -import React, { useState, useEffect, useRef } from "react"; -import { useVersionStore } from "../../../../store/builder/store"; +import { useEffect, useState } from "react"; import { - CloseIcon, FinishEditIcon, RenameVersionIcon, - SaveIcon, - SaveVersionIcon, } from "../../../icons/ExportCommonIcons"; import RenderOverlay from "../../../templates/Overlay"; +import { useVersionHistoryStore } from "../../../../store/builder/useVersionHistoryStore"; +import { createVersionApi } from "../../../../services/factoryBuilder/versionControl/addVersionApi"; +import { useParams } from "react-router-dom"; +import { getUserData } from "../../../../functions/getUserData"; const VersionSaved = () => { - const { versions, updateVersion } = useVersionStore(); - const [isEditing, setIsEditing] = useState(false); - const [shouldDismiss, setShouldDismiss] = useState(false); - const [showNotification, setShowNotification] = useState(false); - const [newName, setNewName] = useState(""); + const { versionHistory, addVersion, createNewVersion, setCreateNewVersion } = useVersionHistoryStore(); + 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 [showEditedFinish, setShowEditedFinish] = useState(false); - const [editedVersionName, setEditedVersionName] = useState(""); - const prevVersionCount = useRef(versions.length); - const dismissTimerRef = useRef(null); + const [showSaveFinish, setSaveFinish] = useState(false); + const { projectId } = useParams(); + const { userId } = getUserData(); - const latestVersion = versions?.[0]; + const latestVersion = versionHistory?.[0]; useEffect(() => { - return () => { - if (dismissTimerRef.current) clearTimeout(dismissTimerRef.current); - }; - }, []); - - useEffect(() => { - if (versions.length > prevVersionCount.current && latestVersion) { - setShowNotification(true); - setShouldDismiss(false); - setIsEditing(false); - setNewName(latestVersion.versionName ?? ""); - setDescription(latestVersion.description ?? ""); - setEditedVersionName(latestVersion.versionName ?? ""); // Initialize editedVersionName - - if (!isEditing) { - startDismissTimer(); - } - - prevVersionCount.current = versions.length; - } else if (versions.length < prevVersionCount.current) { - prevVersionCount.current = versions.length; + if (createNewVersion) { + const defaultName = new Date().toLocaleString("en-US", { + month: "short", + day: "numeric", + year: "numeric", + hour: "numeric", + minute: "2-digit", + }); + setNewName(defaultName); + setDescription(""); } - }, [versions, isEditing, latestVersion]); + }, [createNewVersion]); - const startDismissTimer = (delay = 5000) => { - if (dismissTimerRef.current) clearTimeout(dismissTimerRef.current); - dismissTimerRef.current = setTimeout(() => { - setShouldDismiss(true); - }, delay); - }; + const handleSave = () => { + if (!latestVersion || !projectId) return; - useEffect(() => { - if (shouldDismiss) { - const timer = setTimeout(() => setShowNotification(false), 200); - return () => clearTimeout(timer); - } - }, [shouldDismiss]); + const updatedName = (newName.trim() || latestVersion.versionName) ?? latestVersion.timeStamp; + const updatedDescription = (description.trim() || latestVersion.versionName) ?? latestVersion.timeStamp; - const handleEditName = () => { - if (!latestVersion) return; + createVersionApi(projectId, userId, latestVersion.versionId, updatedName, updatedDescription).then((data) => { + setSaveFinish(true); + setCreateNewVersion(false); - setIsEditing(true); - setNewName(latestVersion.versionName ?? ""); - setDescription(latestVersion.description ?? ""); - if (dismissTimerRef.current) { - clearTimeout(dismissTimerRef.current); - dismissTimerRef.current = null; - } - }; + addVersion({ + version: data.version, + versionId: data.versionId, + versionName: data.versionName, + versionDescription: data.description, + timeStamp: data.createdAt, + createdBy: data.createdBy.userName + }) - const handleFinishEdit = () => { - if (!latestVersion) return; - - const updatedName = - (newName.trim() || latestVersion.versionName) ?? latestVersion.timestamp; - updateVersion(latestVersion.id, { - versionName: updatedName, - description, - }); - - setEditedVersionName(updatedName); - setIsEditing(false); - setShowEditedFinish(true); - - setTimeout(() => { - setShowEditedFinish(false); - }, 5000); - - startDismissTimer(); + setTimeout(() => { + setSaveFinish(false); + }, 3000); + }).catch((err) => { + setSaveFinish(false); + setCreateNewVersion(false); + }) }; const handleCancel = () => { - setIsEditing(false); - startDismissTimer(); + setSaveFinish(false); + setCreateNewVersion(false); }; - const handleClose = () => { - setShouldDismiss(true); - if (dismissTimerRef.current) clearTimeout(dismissTimerRef.current); - }; - - if (!showNotification || !latestVersion) return null; + if (!latestVersion) return null; return ( -
- {!isEditing && !showEditedFinish && ( -
-
-
-
- -
- Saved New Version -
- -
- -
- -
-
- New Version Created {latestVersion.versionLabel}{" "} - {latestVersion.timestamp.toUpperCase()} -
- -
-
-
- )} - - {isEditing && ( +
+ {createNewVersion &&
-
Rename Version
+
Create Version
@@ -153,13 +93,10 @@ const VersionSaved = () => { placeholder="Enter new version name" />
- by @{latestVersion.savedBy}{" "} - {new Date(latestVersion.timestamp).toLocaleString("en-US", { - month: "short", - day: "numeric", - year: "2-digit", - hour: "numeric", - minute: "2-digit", + by @{latestVersion.createdBy}{" "}{new Date(latestVersion.timeStamp).toLocaleDateString("en-US", { + year: "numeric", + month: "long", + day: "2-digit", })}
@@ -176,16 +113,16 @@ const VersionSaved = () => { -
- )} + } - {showEditedFinish && ( + {showSaveFinish && (
@@ -193,7 +130,7 @@ const VersionSaved = () => {
- {editedVersionName || latestVersion.versionName} + {newName.trim()}
Saved Successfully!
diff --git a/app/src/components/ui/FileMenu.tsx b/app/src/components/ui/FileMenu.tsx index 0983936..18a9f20 100644 --- a/app/src/components/ui/FileMenu.tsx +++ b/app/src/components/ui/FileMenu.tsx @@ -10,114 +10,99 @@ import { updateProject } from "../../services/dashboard/updateProject"; import { getUserData } from "../../functions/getUserData"; const FileMenu: React.FC = () => { - const [openMenu, setOpenMenu] = useState(false); - const containerRef = useRef(null); - let clickTimeout: NodeJS.Timeout | null = null; - const { projectName, setProjectName } = useProjectName(); - const { dashBoardSocket } = useSocketStore(); - const { projectId } = useParams(); - const { userId, organization, email } = getUserData(); + const [openMenu, setOpenMenu] = useState(false); + const containerRef = useRef(null); + let clickTimeout: NodeJS.Timeout | null = null; + const { projectName, setProjectName } = useProjectName(); + const { dashBoardSocket } = useSocketStore(); + const { projectId } = useParams(); + const { userId, organization, email } = getUserData(); - const handleClick = () => { - if (clickTimeout) return; - setOpenMenu((prev) => !prev); - clickTimeout = setTimeout(() => { - clickTimeout = null; - }, 800); - }; - - useEffect(() => { - const handleClickOutside = (event: MouseEvent) => { - if ( - containerRef.current && - !containerRef.current.contains(event.target as Node) - ) { - setOpenMenu(false); - } + const handleClick = () => { + if (clickTimeout) return; + setOpenMenu((prev) => !prev); + clickTimeout = setTimeout(() => { + clickTimeout = null; + }, 800); }; - document.addEventListener("mousedown", handleClickOutside); - return () => document.removeEventListener("mousedown", handleClickOutside); - }, []); + useEffect(() => { + const handleClickOutside = (event: MouseEvent) => { + if ( + containerRef.current && + !containerRef.current.contains(event.target as Node) + ) { + setOpenMenu(false); + } + }; - // project - // const [projectName, setProjectName] = useState("Demo Project"); + document.addEventListener("mousedown", handleClickOutside); + return () => document.removeEventListener("mousedown", handleClickOutside); + }, []); - // Load project name from localStorage on mount - // useEffect(() => { - // const savedName = localStorage.getItem("projectName"); - // if (savedName) { - // setProjectName(savedName); - // } - // }, []); + const handleProjectRename = async (projectName: string) => { + setProjectName(projectName); + if (!projectId) return - // const handleProjectRename = (newName: string) => { - // setProjectName(newName); - // localStorage.setItem("projectName", newName); - // }; - const handleProjectRename = async (projectName: string) => { - setProjectName(projectName); - if (!projectId) return - // localStorage.setItem("projectName", newName); - try { + // localStorage.setItem("projectName", newName); - if (!email || !userId) { + try { - return; - } - const projects = await getAllProjects( - userId, organization - ); - // console.log('projects: ', projects); - let projectUuid = projects.Projects.find((val: any) => val.projectUuid === projectId || val._id - === projectId) - const updateProjects = { - projectId: projectUuid, - organization, - userId, - projectName, - thumbnail: undefined - } + if (!email || !userId) return; - // if (dashBoardSocket) { - // const handleResponse = (data: any) => { - // console.log('Project update response:', data); - // dashBoardSocket.off("v1-project:response:update", handleResponse); // Clean up - // }; - // dashBoardSocket.on("v1-project:response:update", handleResponse); - // dashBoardSocket.emit("v1:project:update", updateProjects); - // } + const projects = await getAllProjects(userId, organization); + // console.log('projects: ', projects); + let projectUuid = projects.Projects.find((val: any) => val.projectUuid === projectId || val._id === projectId) - //API for projects rename - const updatedProjectName = await updateProject( - projectId, - userId, - organization, - undefined, - projectName - ); - // - } catch (error) { } - }; - return ( - - ); + const updateProjects = { + projectId: projectUuid, + organization, + userId, + projectName, + thumbnail: undefined + } + + // if (dashBoardSocket) { + // const handleResponse = (data: any) => { + // console.log('Project update response:', data); + // dashBoardSocket.off("v1-project:response:update", handleResponse); // Clean up + // }; + // dashBoardSocket.on("v1-project:response:update", handleResponse); + // dashBoardSocket.emit("v1:project:update", updateProjects); + // } + + //API for projects rename + const updatedProjectName = await updateProject( + projectId, + userId, + organization, + undefined, + projectName + ); + // + } catch (error) { + console.error("Error updating project name:", error); + } + }; + return ( + + ); }; export default FileMenu; diff --git a/app/src/components/ui/ModuleToggle.tsx b/app/src/components/ui/ModuleToggle.tsx index 070e143..dea27c7 100644 --- a/app/src/components/ui/ModuleToggle.tsx +++ b/app/src/components/ui/ModuleToggle.tsx @@ -12,7 +12,7 @@ import useVersionHistoryStore from "../../store/builder/store"; const ModuleToggle: React.FC = () => { const { activeModule, setActiveModule } = useModuleStore(); const { setToggleUI } = useToggleStore(); - const { setVersionHistory } = useVersionHistoryStore(); + const { setVersionHistoryVisible } = useVersionHistoryStore(); return (
@@ -21,7 +21,7 @@ const ModuleToggle: React.FC = () => { className={`module-list ${activeModule === "builder" ? "active" : ""}`} onClick={() => { setActiveModule("builder"); - setVersionHistory(false); + setVersionHistoryVisible(false); setToggleUI( localStorage.getItem("navBarUiLeft") ? localStorage.getItem("navBarUiLeft") === "true" @@ -44,7 +44,7 @@ const ModuleToggle: React.FC = () => { }`} onClick={() => { setActiveModule("simulation"); - setVersionHistory(false); + setVersionHistoryVisible(false); setToggleUI( localStorage.getItem("navBarUiLeft") ? localStorage.getItem("navBarUiLeft") === "true" @@ -67,7 +67,7 @@ const ModuleToggle: React.FC = () => { }`} onClick={() => { setActiveModule("visualization"); - setVersionHistory(false); + setVersionHistoryVisible(false); setToggleUI( localStorage.getItem("navBarUiLeft") ? localStorage.getItem("navBarUiLeft") === "true" @@ -88,7 +88,7 @@ const ModuleToggle: React.FC = () => { className={`module-list ${activeModule === "market" ? "active" : ""}`} onClick={() => { setActiveModule("market"); - setVersionHistory(false); + setVersionHistoryVisible(false); setToggleUI(false, false); }} > diff --git a/app/src/components/ui/menu/menu.tsx b/app/src/components/ui/menu/menu.tsx index b7d9e12..3f6dac5 100644 --- a/app/src/components/ui/menu/menu.tsx +++ b/app/src/components/ui/menu/menu.tsx @@ -2,13 +2,12 @@ import React, { useState } from "react"; import { useNavigate } from "react-router-dom"; import { ArrowIcon } from "../../icons/ExportCommonIcons"; import { toggleTheme } from "../../../utils/theme"; -import useVersionHistoryStore, { +import useVersionHistoryVisibleStore, { useShortcutStore, - useVersionStore, } from "../../../store/builder/store"; -import { useSubModuleStore } from "../../../store/useModuleStore"; -import { generateUniqueId } from "../../../functions/generateUniqueId"; +import useModuleStore, { useSubModuleStore } from "../../../store/useModuleStore"; import { getUserData } from "../../../functions/getUserData"; +import { useVersionHistoryStore } from "../../../store/builder/useVersionHistoryStore"; interface MenuBarProps { setOpenMenu: (isOpen: boolean) => void; @@ -28,11 +27,11 @@ const MenuBar: React.FC = ({ setOpenMenu }) => { const navigate = useNavigate(); const [activeMenu, setActiveMenu] = useState(null); const [activeSubMenu, setActiveSubMenu] = useState(null); - const [selectedItems, setSelectedItems] = useState>( - {} - ); + const [selectedItems, setSelectedItems] = useState>({}); - const { setVersionHistory } = useVersionHistoryStore(); + const { setCreateNewVersion } = useVersionHistoryStore(); + const { setVersionHistoryVisible } = useVersionHistoryVisibleStore(); + const { setActiveModule } = useModuleStore(); const { setSubModule } = useSubModuleStore(); const { showShortcuts, setShowShortcuts } = useShortcutStore(); @@ -60,35 +59,21 @@ const MenuBar: React.FC = ({ setOpenMenu }) => { setShowShortcuts(!showShortcuts); } + function handleVersionCreation() { + setCreateNewVersion(true); + setVersionHistoryVisible(true); + setSubModule("properties"); + setActiveModule('builder'); + } + const menus: Record = { File: [ { label: "New File", shortcut: "Ctrl + N" }, { label: "Open Local File", shortcut: "Ctrl + O" }, { label: "Save Version", - action: () => { - const versionStore = useVersionStore.getState(); - const versionCount = versionStore.versions.length; - - const newVersion = { - id: generateUniqueId(), - versionLabel: `v${versionCount + 1}.0`, - timestamp: `${new Date().toLocaleTimeString("en-US", { - hour: "numeric", - minute: "2-digit", - hour12: true, - })} ${new Date().toLocaleDateString("en-US", { - year: "numeric", - month: "long", - day: "2-digit", - })}`, - - savedBy: userName ?? "Anonymous", - }; - - console.log("newVersion: ", newVersion); - versionStore.addVersion(newVersion); - }, + shortcut: "Ctrl + Alt + S", + action: handleVersionCreation, }, { label: "Make a Copy" }, { label: "Share" }, @@ -237,8 +222,9 @@ const MenuBar: React.FC = ({ setOpenMenu }) => { setActiveSubMenu(null); }} onClick={() => { - setVersionHistory(true); + setVersionHistoryVisible(true); setSubModule("properties"); + setActiveModule('builder'); }} >
Version history
diff --git a/app/src/modules/builder/builder.tsx b/app/src/modules/builder/builder.tsx index 5194fc9..c1ed9a5 100644 --- a/app/src/modules/builder/builder.tsx +++ b/app/src/modules/builder/builder.tsx @@ -105,7 +105,7 @@ export default function Builder() { const { refTextupdate, setRefTextUpdate } = useRefTextUpdate(); const { projectId } = useParams(); const { setHoveredPoint } = useBuilderStore(); - const { userId, organization, email } = getUserData(); + const { userId, organization } = getUserData(); // const loader = new GLTFLoader(); // const dracoLoader = new DRACOLoader(); diff --git a/app/src/modules/builder/groups/floorPlanGroup.tsx b/app/src/modules/builder/groups/floorPlanGroup.tsx index 71869f2..6f187f9 100644 --- a/app/src/modules/builder/groups/floorPlanGroup.tsx +++ b/app/src/modules/builder/groups/floorPlanGroup.tsx @@ -50,7 +50,6 @@ const FloorPlanGroup = ({ floorPlanGroup, floorPlanGroupLine, floorPlanGroupPoin // Load data from localStorage if available getLines(organization, projectId).then((data) => { - // console.log('data: ', data); const Lines: Types.Lines = objectLinesToArray(data); diff --git a/app/src/modules/market/MarketPlace.tsx b/app/src/modules/market/MarketPlace.tsx index b02670f..1bf446e 100644 --- a/app/src/modules/market/MarketPlace.tsx +++ b/app/src/modules/market/MarketPlace.tsx @@ -23,10 +23,6 @@ const MarketPlace = () => { const [filteredModels, setFilteredModels] = useState([]); const [isLoading, setisLoading] = useState(false); // Loading state - useEffect(() => { - echo.log("opend market place"); - }, []); - useEffect(() => { const filteredAssets = async () => { setisLoading(true); diff --git a/app/src/modules/simulation/products/products.tsx b/app/src/modules/simulation/products/products.tsx index 986e42f..95c9cbb 100644 --- a/app/src/modules/simulation/products/products.tsx +++ b/app/src/modules/simulation/products/products.tsx @@ -44,7 +44,6 @@ function Products() { const id = THREE.MathUtils.generateUUID(); const name = 'Product 1'; addProduct(name, id); - console.log(name, id, projectId); upsertProductOrEventApi({ productName: name, productUuid: id, diff --git a/app/src/pages/Dashboard.tsx b/app/src/pages/Dashboard.tsx index 9e26756..0ce9deb 100644 --- a/app/src/pages/Dashboard.tsx +++ b/app/src/pages/Dashboard.tsx @@ -14,7 +14,7 @@ import { useEventsStore } from "../store/simulation/useEventsStore"; const Dashboard: React.FC = () => { const [activeTab, setActiveTab] = useState("Home"); const { socket } = useSocketStore(); - const { userId, organization, email, userName } = getUserData(); + const { organization, email } = getUserData(); const { clearProducts } = useProductStore(); const { clearEvents } = useEventsStore(); diff --git a/app/src/pages/Project.tsx b/app/src/pages/Project.tsx index 3feaab6..98bc9f6 100644 --- a/app/src/pages/Project.tsx +++ b/app/src/pages/Project.tsx @@ -25,6 +25,8 @@ import ComparisonSceneProvider from "../components/layout/scenes/ComparisonScene import MainSceneProvider from "../components/layout/scenes/MainSceneProvider"; import { getUserData } from "../functions/getUserData"; import { SceneProvider } from "../modules/scene/sceneContext"; +import { getVersionHistoryApi } from "../services/factoryBuilder/versionControl/getVersionHistoryApi"; +import { useVersionHistoryStore } from "../store/builder/useVersionHistoryStore"; const Project: React.FC = () => { let navigate = useNavigate(); @@ -42,6 +44,7 @@ const Project: React.FC = () => { const { userId, email, organization, userName } = getUserData(); const { selectedUser } = useSelectedUserStore(); const { isLogListVisible } = useLogger(); + const { setVersions, setSelectedVersion } = useVersionHistoryStore(); useEffect(() => { if (!email || !userId) { @@ -52,14 +55,31 @@ const Project: React.FC = () => { getAllProjects(userId, organization).then((projects) => { const filterProject = projects?.Projects.find((val: any) => val.projectUuid === projectId || val._id === projectId) setProjectName(filterProject.projectName) - viewProject(organization, filterProject._id, userId).then((viewedProject) => { - }); }); }, []); + useEffect(() => { + if (!projectId) return; + getVersionHistoryApi(projectId).then((data) => { + const versions: VersionHistory = []; + data.versions.forEach((version: any) => { + versions.push({ + version: version.version, + versionId: version.versionId, + versionName: version.versionName, + versionDescription: version.description, + timeStamp: version.createdAt, + createdBy: version.createdBy.userName + }) + }) + setVersions(versions); + setSelectedVersion(versions[0]) + }) + }, [projectId]) + useEffect(() => { if (!isVersionSaved) { setToggleUI(true, true); diff --git a/app/src/services/dashboard/createProject.ts b/app/src/services/dashboard/createProject.ts index 1718086..5de4b68 100644 --- a/app/src/services/dashboard/createProject.ts +++ b/app/src/services/dashboard/createProject.ts @@ -22,9 +22,9 @@ export const createProject = async (projectUuid: string, userId: string, thumbna return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/dashboard/deleteProject.ts b/app/src/services/dashboard/deleteProject.ts index e804099..27dc425 100644 --- a/app/src/services/dashboard/deleteProject.ts +++ b/app/src/services/dashboard/deleteProject.ts @@ -31,9 +31,9 @@ export const deleteProject = async ( } catch (error) { echo.error("Failed to clean pannel"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/dashboard/duplicateProject.ts b/app/src/services/dashboard/duplicateProject.ts index 911d824..b65e6ec 100644 --- a/app/src/services/dashboard/duplicateProject.ts +++ b/app/src/services/dashboard/duplicateProject.ts @@ -30,9 +30,9 @@ export const duplicateProject = async ( return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/dashboard/getAllProjects.ts b/app/src/services/dashboard/getAllProjects.ts index 754c270..45adab6 100644 --- a/app/src/services/dashboard/getAllProjects.ts +++ b/app/src/services/dashboard/getAllProjects.ts @@ -22,6 +22,6 @@ export const getAllProjects = async (userId: string, organization: string) => { return await response.json(); } catch (error: any) { echo.error("Failed to get asset image"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/dashboard/projectTutorial.ts b/app/src/services/dashboard/projectTutorial.ts index 5bd84a0..cb262bf 100644 --- a/app/src/services/dashboard/projectTutorial.ts +++ b/app/src/services/dashboard/projectTutorial.ts @@ -19,9 +19,9 @@ export const projectTutorial = async () => { return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/dashboard/recentlyViewed.ts b/app/src/services/dashboard/recentlyViewed.ts index c77c679..b7649c7 100644 --- a/app/src/services/dashboard/recentlyViewed.ts +++ b/app/src/services/dashboard/recentlyViewed.ts @@ -22,6 +22,6 @@ export const recentlyViewed = async (organization: string, userId: string) => { return await response.json(); } catch (error: any) { console.error("Failed to get project"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/dashboard/searchProjects.ts b/app/src/services/dashboard/searchProjects.ts index a1b1cee..b741e42 100644 --- a/app/src/services/dashboard/searchProjects.ts +++ b/app/src/services/dashboard/searchProjects.ts @@ -30,9 +30,9 @@ export const searchProject = async ( return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/dashboard/trashSearchProject.ts b/app/src/services/dashboard/trashSearchProject.ts index 1e25082..90ae211 100644 --- a/app/src/services/dashboard/trashSearchProject.ts +++ b/app/src/services/dashboard/trashSearchProject.ts @@ -28,9 +28,9 @@ export const trashSearchProject = async ( return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/dashboard/updateProject.ts b/app/src/services/dashboard/updateProject.ts index 1835895..afe45b0 100644 --- a/app/src/services/dashboard/updateProject.ts +++ b/app/src/services/dashboard/updateProject.ts @@ -1,5 +1,4 @@ let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`; -// let url_Backend_dwinzo = `http://192.168.0.102:5000`; export const updateProject = async ( projectId: string, @@ -40,9 +39,9 @@ export const updateProject = async ( return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/dashboard/viewProject.ts b/app/src/services/dashboard/viewProject.ts index 07a9e00..04095b7 100644 --- a/app/src/services/dashboard/viewProject.ts +++ b/app/src/services/dashboard/viewProject.ts @@ -26,6 +26,6 @@ export const viewProject = async ( return await response.json(); } catch (error: any) { console.error("Failed to get asset image:", error); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/factoryBuilder/aisle/createAisleApi.ts b/app/src/services/factoryBuilder/aisle/createAisleApi.ts index fc3487c..c6a60b8 100644 --- a/app/src/services/factoryBuilder/aisle/createAisleApi.ts +++ b/app/src/services/factoryBuilder/aisle/createAisleApi.ts @@ -27,9 +27,9 @@ export const createAisleApi = async ( return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/aisle/deleteAisleApi.ts b/app/src/services/factoryBuilder/aisle/deleteAisleApi.ts index 285e11f..2c65ac4 100644 --- a/app/src/services/factoryBuilder/aisle/deleteAisleApi.ts +++ b/app/src/services/factoryBuilder/aisle/deleteAisleApi.ts @@ -21,9 +21,9 @@ export const deleteAisleApi = async (aisleUuid: string, projectId: string) => { return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/aisle/getAisleApi.ts b/app/src/services/factoryBuilder/aisle/getAisleApi.ts index d45fcd1..9a25bb5 100644 --- a/app/src/services/factoryBuilder/aisle/getAisleApi.ts +++ b/app/src/services/factoryBuilder/aisle/getAisleApi.ts @@ -23,6 +23,6 @@ export const getAisleApi = async (projectId: string) => { return await response.json(); } catch (error: any) { console.error("Failed to get asset image:", error); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/factoryBuilder/assest/assets/getAssetImages.ts b/app/src/services/factoryBuilder/assest/assets/getAssetImages.ts index 22deb02..a8cdf98 100644 --- a/app/src/services/factoryBuilder/assest/assets/getAssetImages.ts +++ b/app/src/services/factoryBuilder/assest/assets/getAssetImages.ts @@ -19,6 +19,6 @@ export const getAssetImages = async (cursor?: string) => { return await response.json(); } catch (error: any) { echo.error("Failed to get asset image"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/factoryBuilder/assest/assets/getAssetModel.ts b/app/src/services/factoryBuilder/assest/assets/getAssetModel.ts index 67e0a28..9459cd7 100644 --- a/app/src/services/factoryBuilder/assest/assets/getAssetModel.ts +++ b/app/src/services/factoryBuilder/assest/assets/getAssetModel.ts @@ -21,9 +21,9 @@ export const getAssetModel = async (modelId: string) => { } catch (error) { echo.error("Failed to get asset model"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/assest/assets/getCategoryAsset.ts b/app/src/services/factoryBuilder/assest/assets/getCategoryAsset.ts index c4c94aa..478d240 100644 --- a/app/src/services/factoryBuilder/assest/assets/getCategoryAsset.ts +++ b/app/src/services/factoryBuilder/assest/assets/getCategoryAsset.ts @@ -15,6 +15,6 @@ export const getCategoryAsset = async (categoryName: any) => { return result; } catch (error: any) { echo.error("Failed to get category asset"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/factoryBuilder/assest/floorAsset/deleteFloorItemApi.ts b/app/src/services/factoryBuilder/assest/floorAsset/deleteFloorItemApi.ts index b84199b..9cc61ec 100644 --- a/app/src/services/factoryBuilder/assest/floorAsset/deleteFloorItemApi.ts +++ b/app/src/services/factoryBuilder/assest/floorAsset/deleteFloorItemApi.ts @@ -26,9 +26,9 @@ export const deleteFloorItem = async ( } catch (error) { echo.error("Failed to delete floor item"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/assest/floorAsset/getFloorItemsApi.ts b/app/src/services/factoryBuilder/assest/floorAsset/getFloorItemsApi.ts index 302c582..e0fb107 100644 --- a/app/src/services/factoryBuilder/assest/floorAsset/getFloorItemsApi.ts +++ b/app/src/services/factoryBuilder/assest/floorAsset/getFloorItemsApi.ts @@ -27,9 +27,9 @@ export const getFloorAssets = async (organization: string, projectId?: string) = } catch (error) { echo.error("Failed to get floor asset"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/assest/floorAsset/setFloorItemApi.ts b/app/src/services/factoryBuilder/assest/floorAsset/setFloorItemApi.ts index 2c5e676..23c727a 100644 --- a/app/src/services/factoryBuilder/assest/floorAsset/setFloorItemApi.ts +++ b/app/src/services/factoryBuilder/assest/floorAsset/setFloorItemApi.ts @@ -42,9 +42,9 @@ export const setFloorItemApi = async ( } catch (error) { echo.error("Failed to set floor items"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/assest/wallAsset/deleteWallItemApi.ts b/app/src/services/factoryBuilder/assest/wallAsset/deleteWallItemApi.ts index 7c1276e..45e5253 100644 --- a/app/src/services/factoryBuilder/assest/wallAsset/deleteWallItemApi.ts +++ b/app/src/services/factoryBuilder/assest/wallAsset/deleteWallItemApi.ts @@ -26,9 +26,9 @@ export const deleteWallItem = async ( } catch (error) { echo.error("Failed to delete wall items"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/assest/wallAsset/getWallItemsApi.ts b/app/src/services/factoryBuilder/assest/wallAsset/getWallItemsApi.ts index e890efb..ead0af8 100644 --- a/app/src/services/factoryBuilder/assest/wallAsset/getWallItemsApi.ts +++ b/app/src/services/factoryBuilder/assest/wallAsset/getWallItemsApi.ts @@ -25,9 +25,9 @@ export const getWallItems = async (organization: string,projectId?:string) => { } catch (error) { echo.error("Failed to get wall items"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/assest/wallAsset/setWallItemApi.ts b/app/src/services/factoryBuilder/assest/wallAsset/setWallItemApi.ts index b8a63d3..8098ffe 100644 --- a/app/src/services/factoryBuilder/assest/wallAsset/setWallItemApi.ts +++ b/app/src/services/factoryBuilder/assest/wallAsset/setWallItemApi.ts @@ -39,9 +39,9 @@ export const setWallItem = async ( } catch (error) { echo.error("Failed to set wall items"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/camera/getCameraApi.ts b/app/src/services/factoryBuilder/camera/getCameraApi.ts index 81d3e71..d63ffeb 100644 --- a/app/src/services/factoryBuilder/camera/getCameraApi.ts +++ b/app/src/services/factoryBuilder/camera/getCameraApi.ts @@ -28,9 +28,9 @@ export const getCamera = async (organization: string, userId: string, projectId? } catch (error) { echo.error("Failed to get camera"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/camera/setCameraApi.ts b/app/src/services/factoryBuilder/camera/setCameraApi.ts index 8db3715..40316d7 100644 --- a/app/src/services/factoryBuilder/camera/setCameraApi.ts +++ b/app/src/services/factoryBuilder/camera/setCameraApi.ts @@ -31,9 +31,9 @@ export const setCamera = async ( } catch (error) { echo.error("Failed to set camera"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/collab/getActiveUsers.ts b/app/src/services/factoryBuilder/collab/getActiveUsers.ts index 286b20e..ba7be84 100644 --- a/app/src/services/factoryBuilder/collab/getActiveUsers.ts +++ b/app/src/services/factoryBuilder/collab/getActiveUsers.ts @@ -24,9 +24,9 @@ export default async function getActiveUsersData(organization: string) { } catch (error) { echo.error("Failed to get active users"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } } diff --git a/app/src/services/factoryBuilder/collab/getUsersApi.ts b/app/src/services/factoryBuilder/collab/getUsersApi.ts index b06c529..964ec0d 100644 --- a/app/src/services/factoryBuilder/collab/getUsersApi.ts +++ b/app/src/services/factoryBuilder/collab/getUsersApi.ts @@ -24,9 +24,9 @@ export default async function fetchShareUsers(organization: string) { } catch (error) { echo.error("Failed to get user API"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } } diff --git a/app/src/services/factoryBuilder/collab/giveCollabAccess.ts b/app/src/services/factoryBuilder/collab/giveCollabAccess.ts index d90b402..1c2b747 100644 --- a/app/src/services/factoryBuilder/collab/giveCollabAccess.ts +++ b/app/src/services/factoryBuilder/collab/giveCollabAccess.ts @@ -23,9 +23,9 @@ export default async function giveCollabAccess( } catch (error) { echo.error("Failed to give collab access"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } } diff --git a/app/src/services/factoryBuilder/environment/findEnvironment.ts b/app/src/services/factoryBuilder/environment/findEnvironment.ts index 12c493f..3a6ead1 100644 --- a/app/src/services/factoryBuilder/environment/findEnvironment.ts +++ b/app/src/services/factoryBuilder/environment/findEnvironment.ts @@ -26,9 +26,9 @@ export const findEnvironment = async (organization: string, userId: string, proj } catch (error) { echo.error("Failed to find env"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/environment/setEnvironment.ts b/app/src/services/factoryBuilder/environment/setEnvironment.ts index b0bb82a..5b495fd 100644 --- a/app/src/services/factoryBuilder/environment/setEnvironment.ts +++ b/app/src/services/factoryBuilder/environment/setEnvironment.ts @@ -46,9 +46,9 @@ export const setEnvironment = async ( } catch (error) { echo.error("Failed to set env"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/lines/deleteLayerApi.ts b/app/src/services/factoryBuilder/lines/deleteLayerApi.ts index a13b1bb..29ae2cd 100644 --- a/app/src/services/factoryBuilder/lines/deleteLayerApi.ts +++ b/app/src/services/factoryBuilder/lines/deleteLayerApi.ts @@ -19,9 +19,9 @@ export const deleteLayer = async (organization: string, layer: number) => { } catch (error) { echo.error("Failed to delete line"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/lines/deleteLineApi.ts b/app/src/services/factoryBuilder/lines/deleteLineApi.ts index 21569ea..7aba3cd 100644 --- a/app/src/services/factoryBuilder/lines/deleteLineApi.ts +++ b/app/src/services/factoryBuilder/lines/deleteLineApi.ts @@ -19,9 +19,9 @@ export const deleteLineApi = async (organization: string, line: Object) => { } catch (error) { echo.error("Failed to delete line"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/lines/deletePointApi.ts b/app/src/services/factoryBuilder/lines/deletePointApi.ts index 3d3cd07..9d63aa9 100644 --- a/app/src/services/factoryBuilder/lines/deletePointApi.ts +++ b/app/src/services/factoryBuilder/lines/deletePointApi.ts @@ -19,9 +19,9 @@ export const deletePointApi = async (organization: string, uuid: string) => { } catch (error) { echo.error("Failed to delete point"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/lines/getLinesApi.ts b/app/src/services/factoryBuilder/lines/getLinesApi.ts index 4e9ed90..5a24f71 100644 --- a/app/src/services/factoryBuilder/lines/getLinesApi.ts +++ b/app/src/services/factoryBuilder/lines/getLinesApi.ts @@ -1,6 +1,6 @@ let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`; -export const getLines = async (organization: string,projectId?:string) => { +export const getLines = async (organization: string, projectId?: string) => { try { const response = await fetch( `${url_Backend_dwinzo}/api/V1/lines/${projectId}`, @@ -25,9 +25,9 @@ export const getLines = async (organization: string,projectId?:string) => { } catch (error) { echo.error("Failed to get Lines"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/lines/setLineApi.ts b/app/src/services/factoryBuilder/lines/setLineApi.ts index 3b08d9b..e0ab043 100644 --- a/app/src/services/factoryBuilder/lines/setLineApi.ts +++ b/app/src/services/factoryBuilder/lines/setLineApi.ts @@ -24,9 +24,9 @@ export const setLine = async ( } catch (error) { echo.error("Failed to set line"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/lines/updatePointApi.ts b/app/src/services/factoryBuilder/lines/updatePointApi.ts index 960fac3..3392d89 100644 --- a/app/src/services/factoryBuilder/lines/updatePointApi.ts +++ b/app/src/services/factoryBuilder/lines/updatePointApi.ts @@ -23,9 +23,9 @@ export const updatePoint = async ( } catch (error) { echo.error("Failed to update point"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/signInSignUp/signUpApi.ts b/app/src/services/factoryBuilder/signInSignUp/signUpApi.ts index 18992dc..73e1a70 100644 --- a/app/src/services/factoryBuilder/signInSignUp/signUpApi.ts +++ b/app/src/services/factoryBuilder/signInSignUp/signUpApi.ts @@ -22,9 +22,9 @@ export const signUpApi = async ( } catch (error) { echo.error("Failed to sign-up"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/versionControl/addVersionApi.ts b/app/src/services/factoryBuilder/versionControl/addVersionApi.ts new file mode 100644 index 0000000..0f9e81c --- /dev/null +++ b/app/src/services/factoryBuilder/versionControl/addVersionApi.ts @@ -0,0 +1,39 @@ +let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`; + +export const createVersionApi = async (projectId: string, createdBy: string, hierarchyVersion: string, versionName: string, description: string) => { + try { + const response = await fetch( + `${url_Backend_dwinzo}/api/V1/generateVersion`, + { + method: "POST", + headers: { + Authorization: "Bearer ", + "Content-Type": "application/json", + token: localStorage.getItem("token") || "", + refresh_token: localStorage.getItem("refreshToken") || "", + }, + body: JSON.stringify({ + projectId, + createdBy, + hierarchyVersion, + versionName, + description + }) + } + ); + + if (!response.ok) { + throw new Error("Failed to create Version History"); + } + + const result = await response.json(); + return result; + } catch (error) { + echo.error("Failed to create Version History"); + if (error instanceof Error) { + console.log(error.message); + } else { + console.log("An unknown error occurred"); + } + } +}; diff --git a/app/src/services/factoryBuilder/versionControl/getVersionHistoryApi.ts b/app/src/services/factoryBuilder/versionControl/getVersionHistoryApi.ts new file mode 100644 index 0000000..08fa982 --- /dev/null +++ b/app/src/services/factoryBuilder/versionControl/getVersionHistoryApi.ts @@ -0,0 +1,32 @@ +let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`; + +export const getVersionHistoryApi = async (projectId: string, page?: number, limit?: number) => { + try { + const response = await fetch( + `${url_Backend_dwinzo}/api/V1/${projectId}/versions`, + { + method: "GET", + headers: { + Authorization: "Bearer ", + "Content-Type": "application/json", + token: localStorage.getItem("token") || "", + refresh_token: localStorage.getItem("refreshToken") || "", + }, + } + ); + + if (!response.ok) { + throw new Error("Failed to get Version History"); + } + + const result = await response.json(); + return result; + } catch (error) { + echo.error("Failed to get Version History"); + if (error instanceof Error) { + console.log(error.message); + } else { + console.log("An unknown error occurred"); + } + } +}; diff --git a/app/src/services/factoryBuilder/zones/deleteZoneApi.ts b/app/src/services/factoryBuilder/zones/deleteZoneApi.ts index 2cd1f48..4d921a1 100644 --- a/app/src/services/factoryBuilder/zones/deleteZoneApi.ts +++ b/app/src/services/factoryBuilder/zones/deleteZoneApi.ts @@ -24,9 +24,9 @@ export const deleteZonesApi = async ( } catch (error) { echo.error("Failed to delete zone"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/zones/getZonesApi.ts b/app/src/services/factoryBuilder/zones/getZonesApi.ts index 34e45e2..3aad902 100644 --- a/app/src/services/factoryBuilder/zones/getZonesApi.ts +++ b/app/src/services/factoryBuilder/zones/getZonesApi.ts @@ -27,9 +27,9 @@ export const getZonesApi = async (organization: string, projectId?: string) => { } catch (error) { echo.error("Failed to get zone data"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/factoryBuilder/zones/setZonesApi.ts b/app/src/services/factoryBuilder/zones/setZonesApi.ts index 0468752..5ba7ea3 100644 --- a/app/src/services/factoryBuilder/zones/setZonesApi.ts +++ b/app/src/services/factoryBuilder/zones/setZonesApi.ts @@ -23,9 +23,9 @@ export const setZonesApi = async ( } catch (error) { echo.error("Failed to zone data"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/marketplace/fetchAssetDetails.ts b/app/src/services/marketplace/fetchAssetDetails.ts index cebefc2..ea0731e 100644 --- a/app/src/services/marketplace/fetchAssetDetails.ts +++ b/app/src/services/marketplace/fetchAssetDetails.ts @@ -19,6 +19,6 @@ export const getAssetDetails = async (filename: string) => { } catch (error: any) { echo.error("Failed to fetch assetg details"); // console.error("Error fetching category:", error.message); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/marketplace/fetchAssets.ts b/app/src/services/marketplace/fetchAssets.ts index 6077b74..f2dd243 100644 --- a/app/src/services/marketplace/fetchAssets.ts +++ b/app/src/services/marketplace/fetchAssets.ts @@ -12,6 +12,6 @@ export const fetchAssets = async () => { } catch (error) { echo.error("Failed to fetch assets"); console.log("error: ", error); - // throw new Error(error.message); + // console.log(error.message); } }; diff --git a/app/src/services/marketplace/fetchGltfUrl.ts b/app/src/services/marketplace/fetchGltfUrl.ts index aeef3f6..b03cccd 100644 --- a/app/src/services/marketplace/fetchGltfUrl.ts +++ b/app/src/services/marketplace/fetchGltfUrl.ts @@ -21,6 +21,6 @@ export const fetchGltfUrl = async (filename: string, AssetID: string) => { return result; } catch (error: any) { // - throw new Error(error.message); + console.log(error.message); } } diff --git a/app/src/services/marketplace/getSortedAssets.ts b/app/src/services/marketplace/getSortedAssets.ts index aa98cc7..fd4be5c 100644 --- a/app/src/services/marketplace/getSortedAssets.ts +++ b/app/src/services/marketplace/getSortedAssets.ts @@ -21,6 +21,6 @@ export const getSortedAssets = async (category: any, orders: any) => { } catch (error: any) { echo.error("Failed to fetching category"); console.error("Error fetching category:", error.message); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/simulation/products/UpsertProductOrEventApi.ts b/app/src/services/simulation/products/UpsertProductOrEventApi.ts index 9c8de04..058db57 100644 --- a/app/src/services/simulation/products/UpsertProductOrEventApi.ts +++ b/app/src/services/simulation/products/UpsertProductOrEventApi.ts @@ -25,9 +25,9 @@ export const upsertProductOrEventApi = async (body: any) => { } catch (error) { echo.error("Failed to upsert product Or eventApi"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/simulation/products/deleteEventDataApi.ts b/app/src/services/simulation/products/deleteEventDataApi.ts index d922563..7bf8554 100644 --- a/app/src/services/simulation/products/deleteEventDataApi.ts +++ b/app/src/services/simulation/products/deleteEventDataApi.ts @@ -25,9 +25,9 @@ export const deleteEventDataApi = async (body: any) => { } catch (error) { echo.error("Failed to delete event data API"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/simulation/products/deleteProductApi.ts b/app/src/services/simulation/products/deleteProductApi.ts index 3516894..4e55282 100644 --- a/app/src/services/simulation/products/deleteProductApi.ts +++ b/app/src/services/simulation/products/deleteProductApi.ts @@ -25,9 +25,9 @@ export const deleteProductApi = async (body: any) => { } catch (error) { echo.error("Failed to delete product API"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/simulation/products/getProductApi.ts b/app/src/services/simulation/products/getProductApi.ts index fe20a2c..53edccb 100644 --- a/app/src/services/simulation/products/getProductApi.ts +++ b/app/src/services/simulation/products/getProductApi.ts @@ -27,9 +27,9 @@ export const getProductApi = async ( } catch (error) { echo.error("Failed to get product asset"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/simulation/products/getallProductsApi.ts b/app/src/services/simulation/products/getallProductsApi.ts index 5e11402..453c225 100644 --- a/app/src/services/simulation/products/getallProductsApi.ts +++ b/app/src/services/simulation/products/getallProductsApi.ts @@ -24,9 +24,9 @@ export const getAllProductsApi = async (projectId: string) => { } catch (error) { echo.error("Failed to get all product API"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/simulation/products/renameProductApi.ts b/app/src/services/simulation/products/renameProductApi.ts index 756a5cd..34d9df2 100644 --- a/app/src/services/simulation/products/renameProductApi.ts +++ b/app/src/services/simulation/products/renameProductApi.ts @@ -28,9 +28,9 @@ export const renameProductApi = async (body: { echo.error("Failed to rename product Api"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/add3dWidget.ts b/app/src/services/visulization/zone/add3dWidget.ts index 141c52a..0dad631 100644 --- a/app/src/services/visulization/zone/add3dWidget.ts +++ b/app/src/services/visulization/zone/add3dWidget.ts @@ -26,9 +26,9 @@ export const adding3dWidgets = async ( } catch (error) { echo.error("Failed to add 3d widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/addFloatingWidgets.ts b/app/src/services/visulization/zone/addFloatingWidgets.ts index c613f15..fb93ec6 100644 --- a/app/src/services/visulization/zone/addFloatingWidgets.ts +++ b/app/src/services/visulization/zone/addFloatingWidgets.ts @@ -32,9 +32,9 @@ export const addingFloatingWidgets = async ( } catch (error) { echo.error("Failed to add floating"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/addWidgets.ts b/app/src/services/visulization/zone/addWidgets.ts index 842bb71..affccbd 100644 --- a/app/src/services/visulization/zone/addWidgets.ts +++ b/app/src/services/visulization/zone/addWidgets.ts @@ -29,9 +29,9 @@ export const addingWidgets = async ( } catch (error) { echo.error("Failed to add widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/clearPanel.ts b/app/src/services/visulization/zone/clearPanel.ts index d1b5d2e..5b60e4a 100644 --- a/app/src/services/visulization/zone/clearPanel.ts +++ b/app/src/services/visulization/zone/clearPanel.ts @@ -26,9 +26,9 @@ export const clearPanel = async ( } catch (error) { echo.error("Failed to clean pannel"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/delete3dWidget.ts b/app/src/services/visulization/zone/delete3dWidget.ts index 3b18377..6fb0e16 100644 --- a/app/src/services/visulization/zone/delete3dWidget.ts +++ b/app/src/services/visulization/zone/delete3dWidget.ts @@ -30,9 +30,9 @@ export const delete3dWidgetApi = async ( } catch (error) { echo.error("Failed to delete 3d widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/deleteFloatingWidget.ts b/app/src/services/visulization/zone/deleteFloatingWidget.ts index b0ffad7..b3a624b 100644 --- a/app/src/services/visulization/zone/deleteFloatingWidget.ts +++ b/app/src/services/visulization/zone/deleteFloatingWidget.ts @@ -29,9 +29,9 @@ export const deleteFloatingWidgetApi = async ( } catch (error) { echo.error("Failed to delete floating widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/deletePanel.ts b/app/src/services/visulization/zone/deletePanel.ts index a11805b..cf55888 100644 --- a/app/src/services/visulization/zone/deletePanel.ts +++ b/app/src/services/visulization/zone/deletePanel.ts @@ -27,9 +27,9 @@ export const deletePanelApi = async ( } catch (error) { echo.error("Failed to delete pannel"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/deleteTemplate.ts b/app/src/services/visulization/zone/deleteTemplate.ts index c7825f3..adaf2af 100644 --- a/app/src/services/visulization/zone/deleteTemplate.ts +++ b/app/src/services/visulization/zone/deleteTemplate.ts @@ -28,9 +28,9 @@ export const deleteTemplateApi = async ( } catch (error) { echo.error("Failed to delete widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/deleteWidgetApi.ts b/app/src/services/visulization/zone/deleteWidgetApi.ts index 8f579de..d7ea84f 100644 --- a/app/src/services/visulization/zone/deleteWidgetApi.ts +++ b/app/src/services/visulization/zone/deleteWidgetApi.ts @@ -26,9 +26,9 @@ export const deleteWidgetApi = async ( } catch (error) { echo.error("Failed to delete widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/duplicateWidget.ts b/app/src/services/visulization/zone/duplicateWidget.ts index 4a1a370..cf6af04 100644 --- a/app/src/services/visulization/zone/duplicateWidget.ts +++ b/app/src/services/visulization/zone/duplicateWidget.ts @@ -26,9 +26,9 @@ export const duplicateWidgetApi = async ( } catch (error) { echo.error("Failed to dublicate widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/get3dWidgetData.ts b/app/src/services/visulization/zone/get3dWidgetData.ts index 9eb9903..8478ae8 100644 --- a/app/src/services/visulization/zone/get3dWidgetData.ts +++ b/app/src/services/visulization/zone/get3dWidgetData.ts @@ -27,6 +27,6 @@ export const get3dWidgetZoneData = async ( return await response.json(); } catch (error: any) { echo.error("Failed to fetch 3d data"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/visulization/zone/getFloatingData.ts b/app/src/services/visulization/zone/getFloatingData.ts index 207e83d..e6bf8a6 100644 --- a/app/src/services/visulization/zone/getFloatingData.ts +++ b/app/src/services/visulization/zone/getFloatingData.ts @@ -26,6 +26,6 @@ export const getFloatingZoneData = async ( return await response.json(); } catch (error: any) { echo.error("Failed to fetch floating data"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/visulization/zone/getSelect2dZoneData.ts b/app/src/services/visulization/zone/getSelect2dZoneData.ts index 93c2dad..fcd2c1c 100644 --- a/app/src/services/visulization/zone/getSelect2dZoneData.ts +++ b/app/src/services/visulization/zone/getSelect2dZoneData.ts @@ -23,6 +23,6 @@ export const getSelect2dZoneData = async (zoneUuid?: string, organization?: stri return await response.json(); } catch (error: any) { echo.error("Failed to fetch 2d widget data"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/visulization/zone/getTemplate.ts b/app/src/services/visulization/zone/getTemplate.ts index 9730260..0d1e045 100644 --- a/app/src/services/visulization/zone/getTemplate.ts +++ b/app/src/services/visulization/zone/getTemplate.ts @@ -22,6 +22,6 @@ export const getTemplateData = async (organization?: string, projectId?: string) return await response.json(); } catch (error: any) { echo.error("Failed to template data"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/visulization/zone/getZoneData.ts b/app/src/services/visulization/zone/getZoneData.ts index 117007a..fbdd353 100644 --- a/app/src/services/visulization/zone/getZoneData.ts +++ b/app/src/services/visulization/zone/getZoneData.ts @@ -21,6 +21,6 @@ export const getZone2dData = async (organization?: string, projectId?: string) = return await response.json(); } catch (error: any) { echo.error("Failed to fetch 2d zone data"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/visulization/zone/getZones.ts b/app/src/services/visulization/zone/getZones.ts index 65b0ddb..ce33cd6 100644 --- a/app/src/services/visulization/zone/getZones.ts +++ b/app/src/services/visulization/zone/getZones.ts @@ -23,6 +23,6 @@ export const getZoneData = async (zoneUuid: string, organization: string, projec return await response.json(); } catch (error: any) { echo.error("Failed to fetch zone data"); - throw new Error(error.message); + console.log(error.message); } }; diff --git a/app/src/services/visulization/zone/loadTemplate.ts b/app/src/services/visulization/zone/loadTemplate.ts index fde2eb7..16c9476 100644 --- a/app/src/services/visulization/zone/loadTemplate.ts +++ b/app/src/services/visulization/zone/loadTemplate.ts @@ -29,9 +29,9 @@ export const loadTempleteApi = async ( } catch (error) { echo.error("Failed to load template"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/lockPanel.ts b/app/src/services/visulization/zone/lockPanel.ts index 85af5d6..046c484 100644 --- a/app/src/services/visulization/zone/lockPanel.ts +++ b/app/src/services/visulization/zone/lockPanel.ts @@ -26,9 +26,9 @@ export const lockPanel = async ( } catch (error) { echo.error("Failed to fetch locked panel data"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/panel.ts b/app/src/services/visulization/zone/panel.ts index c4f9f6c..b083df4 100644 --- a/app/src/services/visulization/zone/panel.ts +++ b/app/src/services/visulization/zone/panel.ts @@ -27,9 +27,9 @@ export const panelData = async ( } catch (error) { echo.error("Failed to fetch panel data"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/saveTempleteApi.ts b/app/src/services/visulization/zone/saveTempleteApi.ts index 61d6395..79c7a33 100644 --- a/app/src/services/visulization/zone/saveTempleteApi.ts +++ b/app/src/services/visulization/zone/saveTempleteApi.ts @@ -23,9 +23,9 @@ export const saveTemplateApi = async (organization: string, template: {}) => { } catch (error) { echo.error("Failed to save template"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/update3dWidget.ts b/app/src/services/visulization/zone/update3dWidget.ts index 38ef186..dfbf855 100644 --- a/app/src/services/visulization/zone/update3dWidget.ts +++ b/app/src/services/visulization/zone/update3dWidget.ts @@ -36,9 +36,9 @@ export const update3dWidget = async ( return result; } catch (error) { if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; @@ -78,9 +78,9 @@ export const update3dWidgetRotation = async ( } catch (error) { echo.error("Failed to rotate 3d widget"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/services/visulization/zone/zoneCameraUpdation.ts b/app/src/services/visulization/zone/zoneCameraUpdation.ts index 57bd153..d74a38d 100644 --- a/app/src/services/visulization/zone/zoneCameraUpdation.ts +++ b/app/src/services/visulization/zone/zoneCameraUpdation.ts @@ -23,9 +23,9 @@ export const zoneCameraUpdate = async (zoneData: {}, organization: string, proje } catch (error) { echo.error("Failed to update zone camera"); if (error instanceof Error) { - throw new Error(error.message); + console.log(error.message); } else { - throw new Error("An unknown error occurred"); + console.log("An unknown error occurred"); } } }; diff --git a/app/src/store/builder/store.ts b/app/src/store/builder/store.ts index 890a0e8..6638534 100644 --- a/app/src/store/builder/store.ts +++ b/app/src/store/builder/store.ts @@ -515,15 +515,15 @@ export const useZoneAssetId = create((set) => ({ // version visible hidden interface VersionHistoryState { viewVersionHistory: boolean; - setVersionHistory: (value: boolean) => void; + setVersionHistoryVisible: (value: boolean) => void; } -const useVersionHistoryStore = create((set) => ({ +const useVersionHistoryVisibleStore = create((set) => ({ viewVersionHistory: false, - setVersionHistory: (value) => set({ viewVersionHistory: value }), + setVersionHistoryVisible: (value) => set({ viewVersionHistory: value }), })); -export default useVersionHistoryStore; +export default useVersionHistoryVisibleStore; interface ShortcutStore { showShortcuts: boolean; @@ -647,47 +647,6 @@ export const useSaveVersion = create((set) => ({ setIsVersionSaved: (value: boolean) => set({ isVersionSaved: value }), })); -// Version object type -export interface Version { - id: string; - versionLabel: string; - versionName?: string; - timestamp: string; - savedBy: string; - description?: string; -} - -// Version list store -interface VersionListStore { - versions: Version[]; - addVersion: (version: Version) => void; - clearVersions: () => void; - setVersions: (newVersions: Version[]) => void; - updateVersion: (id: string, data: Partial) => void; // ✅ Added -} - -export const useVersionStore = create((set) => ({ - versions: [], - - addVersion: (newVersion) => - set((state) => ({ - versions: [newVersion, ...state.versions], - })), - - clearVersions: () => set({ versions: [] }), - - setVersions: (newVersions) => set({ versions: newVersions }), - - updateVersion: (id, data) => - set((state) => ({ - versions: state.versions.map((version) => - version.id === id ? { ...version, ...data } : version - ), - })), -})); - - - interface ViewSceneState { viewSceneLabels: boolean; setViewSceneLabels: (value: boolean | ((prev: boolean) => boolean)) => void; diff --git a/app/src/store/builder/useVersionHistoryStore.ts b/app/src/store/builder/useVersionHistoryStore.ts new file mode 100644 index 0000000..a0911fe --- /dev/null +++ b/app/src/store/builder/useVersionHistoryStore.ts @@ -0,0 +1,84 @@ +import { create } from 'zustand'; +import { immer } from 'zustand/middleware/immer'; + +interface VersionHistoryStore { + versionHistory: VersionHistory; + + selectedVersion: Version | null; + createNewVersion: boolean; + + setSelectedVersion: (version: Version | null) => void; + setCreateNewVersion: (createNewVersion: boolean) => void; + + addVersion: (version: Version) => void; + setVersions: (versions: Version[]) => void; + clearVersions: () => void; + + setVersionName: (versionId: string, versionName: string) => void; + updateVersion: (versionId: string, versionName: string, versionDescription: string) => void; + + getVersionById: (versionId: string) => Version | undefined; +} + +export const useVersionHistoryStore = create()( + immer((set, get) => ({ + versionHistory: [], + selectedVersion: null, + createNewVersion: false, + + setSelectedVersion: (version: Version | null) => { + set((state) => { + state.selectedVersion = version; + }) + }, + + setCreateNewVersion: (createNewVersion: boolean) => { + set((state) => { + state.createNewVersion = createNewVersion; + }) + }, + + addVersion: (version: Version) => { + set((state) => { + state.versionHistory.unshift(version); + }) + }, + + setVersions: (versions: Version[]) => { + set((state) => { + state.versionHistory = versions; + }) + }, + + clearVersions: () => { + set((state) => { + state.versionHistory = []; + }) + }, + + setVersionName: (versionId: string, versionName: string) => { + set((state) => { + const version = state.versionHistory.find((v) => v.versionId === versionId); + if (version) { + version.versionName = versionName; + } + }) + }, + + updateVersion: (versionId: string, versionName: string, versionDescription: string) => { + set((state) => { + const version = state.versionHistory.find((v) => v.versionId === versionId); + if (version) { + version.versionName = versionName; + version.versionDescription = versionDescription; + } + }) + }, + + getVersionById: (versionId: string) => { + return get().versionHistory.find((v) => { + return v.versionId === versionId + }) + } + })) +); diff --git a/app/src/styles/layout/sidebar.scss b/app/src/styles/layout/sidebar.scss index 1f6e034..51f32df 100644 --- a/app/src/styles/layout/sidebar.scss +++ b/app/src/styles/layout/sidebar.scss @@ -2,2270 +2,2279 @@ @use "../abstracts/mixins" as *; .toggle-sidebar-ui-button { - @include flex-center; - cursor: pointer; - height: 32px; - width: 32px; - min-height: 32px; - min-width: 32px; - border-radius: #{$border-radius-large}; - position: relative; - - .tooltip { - top: 6px; - right: -168px; - - &::after { - left: 0px; - bottom: 50%; - } - } - - &:hover { - outline: 1px solid var(--border-color); - outline-offset: -1px; - background: var(--background-color-solid); + @include flex-center; + cursor: pointer; + height: 32px; + width: 32px; + min-height: 32px; + min-width: 32px; + border-radius: #{$border-radius-large}; + position: relative; .tooltip { - opacity: 1; - transform: translateX(2px); - } - } -} - -.toggle-sidebar-ui-button.active { - background: var(--background-color-accent); - - rect { - stroke: var(--icon-default-color-active); - } - - circle { - fill: var(--icon-default-color-active); - } - - &:hover { - filter: saturate(0.8); - background: var(--background-color-accent); - } -} - -.sidebar-left-wrapper { - width: 270px; - position: fixed; - top: 22px; - left: 8px; - background: var(--background-color); - backdrop-filter: blur(20px); - border-radius: #{$border-radius-extra-large}; - outline: 1px solid var(--border-color); - box-shadow: #{$box-shadow-medium}; - z-index: #{$z-index-tools}; - - .header-container { - @include flex-space-between; - padding: 10px; - width: 100%; - - .header-content { - @include flex-center; - width: calc(100% - 34px); - - .logo-container { - @include flex-center; - cursor: pointer; - } - - .header-title { - padding: 0 8px; - width: 100%; - max-width: calc(100% - 32px); - } - } - - .toggle-sidebar-ui-button { - .tooltip { top: 6px; right: -168px; &::after { - left: 0px; - bottom: 50%; + left: 0px; + bottom: 50%; } - } } - } - .sidebar-left-container { - min-height: 50vh; - max-width: 100%; - padding-bottom: 4px; - position: relative; - display: flex; - flex-direction: column; + &:hover { + outline: 1px solid var(--border-color); + outline-offset: -1px; + background: var(--background-color-solid); - .sidebar-left-content-container { - position: relative; - - .template-list { - display: flex; - flex-direction: column; - gap: 1rem; - padding: 1rem; - min-height: 50vh; - max-height: 60vh; - } - - .template-item { - border: 1px solid #e0e0e0; - border-radius: #{$border-radius-medium}; - - padding: 1rem; - transition: box-shadow 0.3s ease; - } - - .template-image-container { - position: relative; - padding-bottom: 56.25%; // 16:9 aspect ratio - } - - .template-image { - position: absolute; - width: 100%; - height: 100%; - object-fit: contain; - border-radius: #{$border-radius-small}; - - cursor: pointer; - transition: transform 0.3s ease; - } - - .template-details { - display: flex; - justify-content: space-between; - align-items: center; - margin-top: 0.5rem; - } - - .template-name { - cursor: pointer; - font-weight: 500; - } - - .delete-button { - padding: 0.25rem 0.5rem; - background: #ff4444; - color: white; - border: none; - border-radius: #{$border-radius-small}; - - cursor: pointer; - transition: opacity 0.3s ease; - } - - .no-templates { - text-align: center; - color: #666; - grid-column: 1 / -1; - display: flex; - flex-direction: column; - align-items: flex-start; - gap: 6px; - - h2 { - font-weight: 600; + .tooltip { + opacity: 1; + transform: translateX(2px); } - } + } +} - .widgets-wrapper { - min-height: 50vh; - max-height: 60vh; - overflow: auto; - } +.toggle-sidebar-ui-button.active { + background: var(--background-color-accent); - .widget-left-sideBar { - .widget2D { - overflow: auto; + rect { + stroke: var(--icon-default-color-active); + } - .chart-container { - display: flex; - flex-direction: column; - gap: 8px; - padding: 6px; - flex-wrap: nowrap; - overflow: auto; + circle { + fill: var(--icon-default-color-active); + } - .chart { - min-height: 170px; - background: var(--background-color); - border: 1.23px solid var(--border-color); - box-shadow: 0px 4.91px 4.91px 0px #0000001c; - border-radius: $border-radius-medium; - padding: 12px 6px; + &:hover { + filter: saturate(0.8); + background: var(--background-color-accent); + } +} + +.sidebar-left-wrapper { + width: 270px; + position: fixed; + top: 22px; + left: 8px; + background: var(--background-color); + backdrop-filter: blur(20px); + border-radius: #{$border-radius-extra-large}; + outline: 1px solid var(--border-color); + box-shadow: #{$box-shadow-medium}; + z-index: #{$z-index-tools}; + + .header-container { + @include flex-space-between; + padding: 10px; + width: 100%; + + .header-content { + @include flex-center; + width: calc(100% - 34px); + + .logo-container { + @include flex-center; + cursor: pointer; } - .progressBar { - height: auto !important; - padding: 12px 10px 41px 10px; - display: flex; - flex-direction: column; - gap: 16px; + .header-title { + padding: 0 8px; + width: 100%; + max-width: calc(100% - 32px); + } + } - .header { + .toggle-sidebar-ui-button { + .tooltip { + top: 6px; + right: -168px; + + &::after { + left: 0px; + bottom: 50%; + } + } + } + } + + .sidebar-left-container { + min-height: 50vh; + max-width: 100%; + padding-bottom: 4px; + position: relative; + display: flex; + flex-direction: column; + + .sidebar-left-content-container { + position: relative; + + .template-list { display: flex; - justify-content: start; - align-items: center; - border-bottom: none; - } + flex-direction: column; + gap: 1rem; + padding: 1rem; + min-height: 50vh; + max-height: 60vh; + } - .stock { - padding: 13px 5px; - background: var(--background-color-secondary); + .template-item { + border: 1px solid #e0e0e0; border-radius: #{$border-radius-medium}; - box-shadow: var(--box-shadow-light); + + padding: 1rem; + transition: box-shadow 0.3s ease; + } + + .template-image-container { + position: relative; + padding-bottom: 56.25%; // 16:9 aspect ratio + } + + .template-image { + position: absolute; + width: 100%; + height: 100%; + object-fit: contain; + border-radius: #{$border-radius-small}; + + cursor: pointer; + transition: transform 0.3s ease; + } + + .template-details { display: flex; justify-content: space-between; + align-items: center; + margin-top: 0.5rem; + } - .stock-item { - .stockValues { - display: flex; - flex-direction: row-reverse; - align-items: flex-end; - gap: 3px; + .template-name { + cursor: pointer; + font-weight: 500; + } - .value { - color: var(--accent-color); - font-size: var(--font-size-large); - } - } + .delete-button { + padding: 0.25rem 0.5rem; + background: #ff4444; + color: white; + border: none; + border-radius: #{$border-radius-small}; - .stock-description { - font-size: var(--font-size-small); - } + cursor: pointer; + transition: opacity 0.3s ease; + } + + .no-templates { + text-align: center; + color: #666; + grid-column: 1 / -1; + display: flex; + flex-direction: column; + align-items: flex-start; + gap: 6px; + + h2 { + font-weight: 600; } - } } - } - } - .widget3D { - display: flex; - flex-direction: column; - gap: 6px; - padding: 6px; - - .widget-item { - height: 170px; - background: var(--background-color); - border: 1.23px solid var(--border-color); - box-shadow: 0px 4.91px 4.91px 0px #0000001c; - border-radius: $border-radius-medium; - padding: 12px 6px; - - .widget-image { - width: 100%; - height: 90%; - object-fit: contain; + .widgets-wrapper { + min-height: 50vh; + max-height: 60vh; + overflow: auto; + } + + .widget-left-sideBar { + .widget2D { + overflow: auto; + + .chart-container { + display: flex; + flex-direction: column; + gap: 8px; + padding: 6px; + flex-wrap: nowrap; + overflow: auto; + + .chart { + min-height: 170px; + background: var(--background-color); + border: 1.23px solid var(--border-color); + box-shadow: 0px 4.91px 4.91px 0px #0000001c; + border-radius: $border-radius-medium; + padding: 12px 6px; + } + + .progressBar { + height: auto !important; + padding: 12px 10px 41px 10px; + display: flex; + flex-direction: column; + gap: 16px; + + .header { + display: flex; + justify-content: start; + align-items: center; + border-bottom: none; + } + + .stock { + padding: 13px 5px; + background: var(--background-color-secondary); + border-radius: #{$border-radius-medium}; + box-shadow: var(--box-shadow-light); + display: flex; + justify-content: space-between; + + .stock-item { + .stockValues { + display: flex; + flex-direction: row-reverse; + align-items: flex-end; + gap: 3px; + + .value { + color: var(--accent-color); + font-size: var(--font-size-large); + } + } + + .stock-description { + font-size: var(--font-size-small); + } + } + } + } + } + } + + .widget3D { + display: flex; + flex-direction: column; + gap: 6px; + padding: 6px; + + .widget-item { + height: 170px; + background: var(--background-color); + border: 1.23px solid var(--border-color); + box-shadow: 0px 4.91px 4.91px 0px #0000001c; + border-radius: $border-radius-medium; + padding: 12px 6px; + + .widget-image { + width: 100%; + height: 90%; + object-fit: contain; + } + } + } } - } } - } - } - .outline-container { - height: 100%; + .outline-container { + height: 100%; - .outline-content-container { - position: relative; - height: 100%; - padding: 8px; + .outline-content-container { + position: relative; + height: 100%; + padding: 8px; - .overflow { - height: calc(100% - 16px); - max-height: 46vh; - overflow: auto; - margin: 0; + .overflow { + height: calc(100% - 16px); + max-height: 46vh; + overflow: auto; + margin: 0; + } + } } - } } - } } .sidebar-right-wrapper { - width: 320px; - position: fixed; - top: 22px; - right: 8px; - background: var(--background-color); - backdrop-filter: blur(20px); - border-radius: #{$border-radius-extra-large}; - outline: 1px solid var(--border-color); - box-shadow: #{$box-shadow-medium}; - z-index: #{$z-index-tools}; + width: 320px; + position: fixed; + top: 22px; + right: 8px; + background: var(--background-color); + backdrop-filter: blur(20px); + border-radius: #{$border-radius-extra-large}; + outline: 1px solid var(--border-color); + box-shadow: #{$box-shadow-medium}; + z-index: #{$z-index-tools}; - .header-container { - @include flex-space-between; - padding: 10px; - width: 100%; - gap: 8px; - height: 52px; - - .options-container { - @include flex-center; - gap: 8px; - - .share-button { - padding: 4px 12px; - color: var(--text-button-color); - background: var(--background-color-button); - font-weight: var(--font-weight-regular); - border-radius: #{$border-radius-large}; - cursor: pointer; - } - - .app-docker-button { - @include flex-center; - } - } - - .split { - height: 20px; - min-width: 1px; - background: var(--text-disabled); - } - - .users-container { - width: 100%; - @include flex-space-between; - - .user-profile { - @include flex-center; - height: 26px; - width: 26px; - min-height: 26px; - min-width: 26px; - border-radius: #{$border-radius-circle}; - - font-weight: var(--font-weight-bold); - color: white; - text-transform: capitalize; - } - - .guest-users-container { - display: flex; + .header-container { + @include flex-space-between; + padding: 10px; width: 100%; - justify-content: flex-end; + gap: 8px; + height: 52px; - .other-guest { - @include flex-center; - height: 26px; - width: 26px; - min-height: 26px; - min-width: 26px; - border-radius: #{$border-radius-circle}; + .options-container { + @include flex-center; + gap: 8px; - background: var(--highlight-accent-color); - font-weight: var(--font-weight-bold); - color: var(--accent-color); - outline: 1px solid var(--accent-color); - outline-offset: -1px; - } - } + .share-button { + padding: 4px 12px; + color: var(--text-button-color); + background: var(--background-color-button); + font-weight: var(--font-weight-regular); + border-radius: #{$border-radius-large}; + cursor: pointer; + } - .user-profile-container { - display: flex; - - .user-profile { - background: var(--background-color-accent); - color: var(--text-button-color); + .app-docker-button { + @include flex-center; + } } - .user-organization { - height: 26px; - width: 52px; - max-width: 52px; - border-radius: #{$border-radius-extra-large}; + .split { + height: 20px; + min-width: 1px; + background: var(--text-disabled); + } - overflow: hidden; - margin-left: 2px; - - img { - height: 100%; + .users-container { width: 100%; - object-fit: cover; - vertical-align: top; - } - } - } - } - } + @include flex-space-between; - .sidebar-actions-container { - position: absolute; - left: -40px; - background: transparent; - overflow: visible; + .user-profile { + @include flex-center; + height: 26px; + width: 26px; + min-height: 26px; + min-width: 26px; + border-radius: #{$border-radius-circle}; - .tooltip { - top: 6px; - right: calc(100% + 6px); - - &::after { - left: 100%; - bottom: 50%; - } - } - - .sidebar-action-list { - margin-bottom: 12px; - @include flex-center; - height: 34px; - width: 34px; - border-radius: #{$border-radius-circle}; - background: var(--background-color-solid-gradient); - backdrop-filter: blur(12px); - outline: 1px solid var(--border-color); - outline-offset: -1px; - transition: all 0.2s; - - &:hover { - outline-color: var(--border-color-accent); - - svg { - transition: all 0.2s; - scale: 1.1; - } - - .tooltip { - opacity: 1; - transform: translateX(-2px); - } - } - } - - .active { - background: var(--background-color-accent); - outline: none; - - &:hover { - svg { - scale: 1; - } - - background: var(--background-color-accent); - } - } - } - - .sidebar-right-container { - min-height: 50vh; - padding: 8px; - position: relative; - overflow: auto; - - .sidebar-right-content-container { - height: calc(100% - 36px); - position: relative; - width: 304px; - - .version-history-container { - max-height: calc(62vh - 12px); - display: flex; - flex-direction: column; - padding: 0 8px; - gap: 10px; - - .version-history-header { - display: flex; - justify-content: space-between; - align-items: center; - - .version-history-icons { - display: flex; - align-items: center; - gap: 6px; - - .add-icon { - transform: scale(1.1); + font-weight: var(--font-weight-bold); + color: white; + text-transform: capitalize; } - .kebab-icon { - display: flex; - transform: rotate(90deg) scale(0.8); - } - - .close-icon { - transform: scale(1.5); - } - } - } - - .version-history-shortcut-info { - display: flex; - gap: 6px; - border: 1px solid var(--border-color); - - background: var(--background-color); - padding: 10px 8px; - border-radius: 13px; - - .info-icon { - width: 12px; - height: 12px; - display: flex; - justify-content: center; - align-items: center; - border-radius: 50%; - border: 1px solid var(--border-color); - padding: 4px; - font-size: 10px; - } - - .shortcut-text { - color: var(--text-disabled); - } - } - - .version-history-location { - display: flex; - align-items: center; - gap: 12px; - - .location-details { - display: flex; - flex-direction: column; - gap: 4px; - - .saved-history-count { - font-size: var(--font-size-tiny); - } - } - } - - .saved-versions-list { - padding-top: 16px; - display: flex; - flex-direction: column; - gap: 20px; - - .saved-version { - display: flex; - align-items: center; - gap: 12px; - - .version-name { - background: var(--background-color); - border: 1px solid var(--border-color); - color: var(--text-color); - border-radius: 13px; - padding: 4px 8px; - position: relative; - font-size: var(--font-size-small); - } - - &:not(:first-child) .version-name::after { - content: ""; - position: absolute; - top: -35px; - left: 50%; - transform: translateX(-50%); - width: 1px; - height: 32px; - background-color: var(--text-disabled); - } - - .version-details { - width: 100%; - display: flex; - justify-content: space-between; - align-items: center; - gap: 6px; - - .details { + .guest-users-container { display: flex; - flex-direction: column; - gap: 6px; - } + width: 100%; + justify-content: flex-end; - .saved-by { + .other-guest { + @include flex-center; + height: 26px; + width: 26px; + min-height: 26px; + min-width: 26px; + border-radius: #{$border-radius-circle}; + + background: var(--highlight-accent-color); + font-weight: var(--font-weight-bold); + color: var(--accent-color); + outline: 1px solid var(--accent-color); + outline-offset: -1px; + } + } + + .user-profile-container { display: flex; - align-items: center; - gap: 6px; .user-profile { - background: var(--background-color-accent); - color: var(--text-button-color); - width: 20px; - height: 20px; - border-radius: 50%; - - display: flex; - justify-content: center; - align-items: center; - text-transform: uppercase; + background: var(--background-color-accent); + color: var(--text-button-color); } - .user-name { - text-transform: capitalize; - } - } + .user-organization { + height: 26px; + width: 52px; + max-width: 52px; + border-radius: #{$border-radius-extra-large}; - .timestamp { - .input-value { - color: var(--text-color); - text-align: start; + overflow: hidden; + margin-left: 2px; + + img { + height: 100%; + width: 100%; + object-fit: cover; + vertical-align: top; + } } - } } - } } - } - - .no-event-selected { - color: #666; - padding: 16px; - grid-column: 1 / -1; - border-radius: #{$border-radius-large}; - background: var(--background-color); - - .products-list { - padding-top: 1rem; - - .product-item { - text-align: start; - margin-top: 8px; - padding: 2px 0; - text-decoration: none; - display: flex; - flex-wrap: wrap; - gap: 6px; - - button { - width: fit-content; - position: relative; - @include flex-center; - gap: 4px; - background: var(--background-color); - padding: 8px 12px; - border-radius: #{$border-radius-extra-large}; - outline: 1px solid var(--border-color); - - &:hover { - background: var(--background-color-accent); - color: var(--text-button-color); - outline: none; - - path { - stroke: var(--text-button-color); - strokeWidth: 1.3; - } - } - } - } - - .products-list-title { - text-align: start; - color: var(--accent-color); - font-size: var(--font-size-regular); - } - } - } } - } - .visualization-right-sideBar { - min-height: 50vh; - max-height: 60vh; + .sidebar-actions-container { + position: absolute; + left: -40px; + background: transparent; + overflow: visible; - .sidebar-right-content-container { - .dataSideBar { - .inputs-wrapper { - display: flex; - flex-direction: column; - gap: 6px; + .tooltip { + top: 6px; + right: calc(100% + 6px); - .datas { - .input-value { - padding: 5px 10px; + &::after { + left: 100%; + bottom: 50%; } - - .input-value, - .rename-input { - margin-right: 24px; - width: 170px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - } } - width: 100%; - height: 100%; - display: flex; - flex-direction: column; - gap: 12px; - padding: 10px 12px; - - .datas { - display: flex; - align-items: center; - justify-content: space-between; - - .datas__class { - display: flex; - align-items: center; - gap: 12px; - - .multi-level-dropdown { - width: 170px; - - .dropdown-button { - display: flex; - justify-content: space-between; - gap: 6px; - } - - .disable { - cursor: not-allowed; - pointer-events: none; - /* Disables all mouse interactions */ - opacity: 0.5; - /* Optional: Makes the button look visually disabled */ - } - } - } - } - - .sideBarHeader { - color: var(--accent-color); - border-bottom: 1px solid var(--border-color); - padding-bottom: 6px; - } - - .selectedMain-container { - display: flex; - flex-direction: column; - gap: 6px; - border-bottom: 1px solid var(--border-color); - padding-bottom: 10px; - - .selectedMain { - display: flex; - align-items: center; - gap: 6px; - - main { - width: 35%; - white-space: nowrap; - /* Prevent wrapping */ - } - - .icon { - padding: 0; - cursor: pointer; - } - - button { - background: transparent; - box-shadow: none; - color: #5273eb; - padding: 6px; - font-size: var(--font-size-xlarge); - } - - .bulletPoint { - color: #5273eb; - font-size: var(--font-size-large); - } - - .regularDropdown-container { - width: 100%; - } - - &:first-child { - gap: 4px; - } - } - } - - .child { - width: 100%; - gap: 6px; - } - - .infoBox { - display: flex; - align-items: flex-start; - gap: 6px; - color: #444; - border-radius: #{$border-radius-medium}; - font-size: var(--font-weight-regular); - - .infoIcon { - padding: 0px 7px; - border-radius: #{$border-radius-circle}; - - border: 1px solid gray; - } - - p { - margin: 0; - } - } - } - - .design { - width: 100%; - display: flex; - flex-direction: column; - gap: 15px; - font-size: var(--font-weight-regular); - color: var(--text-color); - padding: 12px; - - .appearance-container, - .element-container { - - background: var(--background-color); - backdrop-filter: blur(20px); - border-radius: 15px; - outline: 1px solid var(--border-color); - - padding: 10px; - - display: flex; - flex-direction: column; - gap: 12px; - - .header-container { - padding: 0; - height: auto; - } - - .appearance-style { - display: flex; - align-items: center; - justify-content: space-between; - flex-direction: column; - gap: 12px; - - .regularDropdown-container { - .dropdown-options { - width: 130%; - left: -15%; - } - - .dropdown-header { - gap: 12px; - } - } - - .color-wrapper, - .opacity-wrapper, - .blurEffect-wrapper, - .theme-wrapper { - width: 100%; - display: flex; - justify-content: space-between; - align-items: center; - flex-direction: column; - - .input-range-container { - width: 100%; - padding: 0; - } - } - - .theme-wrapper { - - width: 100%; - display: flex; - flex-direction: row; - justify-content: space-between; - } - - .color-wrapper { - flex-direction: row; - - .value { - display: flex; - align-items: center; - - input { - width: 34px; - height: 24px; - border-radius: 12px; - padding: 0; - } - } - } - } - } - - - - .element-container { - padding: 8px; - - .display-element { - width: 100%; - height: 150px; + .sidebar-action-list { + margin-bottom: 12px; @include flex-center; - background: var(--background-color); - backdrop-filter: blur(20px); - border-radius: 5px; - outline: 1px solid var(--border-color); - } - - .name-wrapper, - .element-wrapper { - display: flex; - align-items: center; - justify-content: space-between; - - .value { - width: 60%; - } - } - } - } - - .reviewChart { - width: 100%; - height: 150px; - background: var(--background-color); - display: flex; - align-items: center; - } - - .optionsContainer { - display: flex; - flex-direction: column; - gap: 10px; - padding: 0 12px; - - .option { - display: flex; - align-items: center; - justify-content: space-between; - gap: 12px; - - .regularDropdown-container, - input { - width: 160px; - } - - &:last-child { - flex-direction: column; - - .header { - width: 100%; - display: flex; - justify-content: space-between; - } - - .colorDisplayer { - width: 100%; - display: flex; - justify-content: start; - align-items: center; - - - input[type="color"] { - border: none; - outline: none; - background: none; - width: 24px; - height: 26px; - border-radius: #{$border-radius-small}; - padding: 0; - } - } - } - - span { - min-width: 100px; - } - } - } - } - } - - .machine-mechanics-container { - .machine-mechanics-header { - padding: 8px 12px; - border-top: 1px solid var(--border-color); - border-bottom: 1px solid var(--border-color); - color: var(--accent-color); - } - - .process-list-container { - display: flex; - align-items: center; - gap: 4px; - padding: 8px; - border-bottom: 1px solid var(--border-color); - - .label { - margin-right: 8px; - } - - .add-new-process { - @include flex-center; - height: 24px; - min-width: 24px; - cursor: pointer; - background: var(--background-color-secondary); - border-radius: #{$border-radius-medium}; - - path { - stroke: var(--accent-color); - strokeWidth: 1.5px; - } - - &:hover { - background: var(--accent-color); - - path { - stroke: var(--highlight-accent-color); - } - } - } - } - } - - .machine-mechanics-content-container, - .simulations-container, - .event-proprties-wrapper { - position: relative; - max-height: calc(62vh - (47px - 35px)); - width: 304px; - border-radius: #{$border-radius-large}; - overflow-x: hidden; - - .header { - @include flex-space-between; - padding: 6px 12px; - padding-right: 6px; - text-transform: capitalize; - - .add-button { - @include flex-center; - padding: 4px 8px; - background: var(--background-color-button); - color: var(--text-button-color); - border-radius: #{$border-radius-large}; - cursor: pointer; - outline: none; - border: none; - - path { - stroke: var(--text-button-color); - } - - &:disabled { - background: var(--text-disabled); - } - } - } - - .global-props { - .property-list-container { - .property-item { - .value-field-container { - margin: 0; - - input { - padding: 5px 10px; - } - - .dropdown { - top: 4px; - right: 4px; - } - } - } - } - } - - .selected-actions-details { - .selected-actions-header .input-value { - padding: 8px 12px; - color: var(--accent-color); - } - - .selected-actions-list { - margin-bottom: 8px; - - .eye-dropper-input-container { - padding: 6px 12px; - - .regularDropdown-container { - padding: 5px 8px; + height: 34px; + width: 34px; + border-radius: #{$border-radius-circle}; + background: var(--background-color-solid-gradient); + backdrop-filter: blur(12px); outline: 1px solid var(--border-color); outline-offset: -1px; - border: none; - } - } + transition: all 0.2s; - .value-field-container { - margin: 0; + &:hover { + outline-color: var(--border-color-accent); - input { - padding: 5px 4px; - text-align: center; - } + svg { + transition: all 0.2s; + scale: 1.1; + } - .dropdown { - top: 4px; - right: 4px; - } - } - } - } - - .lists-main-container { - margin: 2px; - width: calc(100% - 4px); - background: var(--background-color-gray); - border-radius: #{$border-radius-medium}; - - min-height: 120px; - - .list-container { - padding: 4px; - height: calc(100% - 16px); - overflow-y: scroll; - - .list-item { - @include flex-space-between; - padding: 4px 12px; - width: 100%; - border-radius: #{$border-radius-medium}; - - .value { - display: flex; - justify-content: flex-start; - align-items: center; - min-width: 80%; - gap: 6px; - - .input-value { - text-align: start; + .tooltip { + opacity: 1; + transform: translateX(-2px); + } } - - input { - width: fit-content; - outline: none; - accent-color: var(--accent-color); - } - } } .active { - background: var(--highlight-accent-color); - - .value .input-value { - color: var(--accent-color); - } - - path { - stroke: var(--accent-color); - } - } - - .remove-button { - @include flex-center; - height: 18px; - width: 18px; - cursor: pointer; - border-radius: #{$border-radius-small}; - transform: translateX(4px); - - &:hover { background: var(--background-color-accent); + outline: none; - path { - stroke: var(--text-button-color); + &:hover { + svg { + scale: 1; + } + + background: var(--background-color-accent); } - } } - } - - .resize-icon { - @include flex-center; - padding: 4px; - cursor: grab; - width: 100%; - - &:active { - cursor: grabbing; - } - } } - .selected-properties-container { - padding: 12px; + .sidebar-right-container { + min-height: 50vh; + padding: 8px; + position: relative; + overflow: auto; - .properties-header { - color: var(--accent-color); - font-weight: var(--font-weight-regular); - padding: 8px 0; - } + .sidebar-right-content-container { + height: calc(100% - 36px); + position: relative; + width: 304px; - .input-toggle-container { - padding: 0; - margin-bottom: 6px; - } + .version-history-container { + max-height: calc(62vh - 12px); + display: flex; + flex-direction: column; + padding: 0 8px; + gap: 10px; - .value-field-container { - margin-bottom: 6px; - padding: 0; - @include flex-space-between; + .version-history-header { + display: flex; + justify-content: space-between; + align-items: center; - .label { - width: 40%; + .version-history-icons { + display: flex; + align-items: center; + gap: 6px; + + .add-icon { + transform: scale(1.1); + } + + .kebab-icon { + display: flex; + transform: rotate(90deg) scale(0.8); + } + + .close-icon { + transform: scale(1.5); + } + } + } + + .version-history-shortcut-info { + display: flex; + gap: 6px; + border: 1px solid var(--border-color); + + background: var(--background-color); + padding: 10px 8px; + border-radius: 13px; + + .info-icon { + width: 12px; + height: 12px; + display: flex; + justify-content: center; + align-items: center; + border-radius: 50%; + border: 1px solid var(--border-color); + padding: 4px; + font-size: 10px; + } + + .shortcut-text { + color: var(--text-disabled); + } + } + + .version-history-location { + display: flex; + align-items: center; + gap: 12px; + + .location-details { + display: flex; + flex-direction: column; + gap: 4px; + + .saved-history-count { + font-size: var(--font-size-tiny); + } + } + } + + .saved-versions-list { + padding-top: 16px; + display: flex; + flex-direction: column; + gap: 20px; + + .saved-version { + display: flex; + align-items: center; + gap: 12px; + + .version-name { + background: var(--background-color); + border: 1px solid var(--border-color); + color: var(--text-color); + border-radius: 13px; + padding: 4px 8px; + position: relative; + font-size: var(--font-size-small); + text-wrap: nowrap; + } + + &:not(:first-child) .version-name::after { + content: ""; + position: absolute; + top: -35px; + left: 50%; + transform: translateX(-50%); + width: 1px; + height: 32px; + background-color: var(--text-disabled); + } + + .version-details { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + gap: 6px; + + .details { + display: flex; + flex-direction: column; + gap: 6px; + } + + .saved-by { + display: flex; + align-items: center; + gap: 6px; + + .user-profile { + background: var(--background-color-accent); + color: var(--text-button-color); + width: 20px; + height: 20px; + border-radius: 50%; + + display: flex; + justify-content: center; + align-items: center; + text-transform: uppercase; + } + + .user-name { + text-transform: capitalize; + } + } + + .timestamp { + .input-value { + color: var(--text-color); + text-align: start; + } + } + } + } + } + } + + .no-event-selected { + color: #666; + padding: 16px; + grid-column: 1 / -1; + border-radius: #{$border-radius-large}; + background: var(--background-color); + + .products-list { + padding-top: 1rem; + + .product-item { + text-align: start; + margin-top: 8px; + padding: 2px 0; + text-decoration: none; + display: flex; + flex-wrap: wrap; + gap: 6px; + + button { + width: fit-content; + position: relative; + @include flex-center; + gap: 4px; + background: var(--background-color); + padding: 8px 12px; + border-radius: #{$border-radius-extra-large}; + outline: 1px solid var(--border-color); + + &:hover { + background: var(--background-color-accent); + color: var(--text-button-color); + outline: none; + + path { + stroke: var(--text-button-color); + strokewidth: 1.3; + } + } + } + } + + .products-list-title { + text-align: start; + color: var(--accent-color); + font-size: var(--font-size-regular); + } + } + } } - - .regularDropdown-container { - width: 60%; - } - - .default { - width: 60%; - } - } } - .simulation-process { - .collapse-header-container { - @include flex-space-between; - padding-right: 12px; - margin: 8px 0; - width: 100%; + .visualization-right-sideBar { + min-height: 50vh; + max-height: 60vh; + + .sidebar-right-content-container { + .dataSideBar { + .inputs-wrapper { + display: flex; + flex-direction: column; + gap: 6px; + + .datas { + .input-value { + padding: 5px 10px; + } + + .input-value, + .rename-input { + margin-right: 24px; + width: 170px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } + } + + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + gap: 12px; + padding: 10px 12px; + + .datas { + display: flex; + align-items: center; + justify-content: space-between; + + .datas__class { + display: flex; + align-items: center; + gap: 12px; + + .multi-level-dropdown { + width: 170px; + + .dropdown-button { + display: flex; + justify-content: space-between; + gap: 6px; + } + + .disable { + cursor: not-allowed; + pointer-events: none; + /* Disables all mouse interactions */ + opacity: 0.5; + /* Optional: Makes the button look visually disabled */ + } + } + } + } + + .sideBarHeader { + color: var(--accent-color); + border-bottom: 1px solid var(--border-color); + padding-bottom: 6px; + } + + .selectedMain-container { + display: flex; + flex-direction: column; + gap: 6px; + border-bottom: 1px solid var(--border-color); + padding-bottom: 10px; + + .selectedMain { + display: flex; + align-items: center; + gap: 6px; + + main { + width: 35%; + white-space: nowrap; + /* Prevent wrapping */ + } + + .icon { + padding: 0; + cursor: pointer; + } + + button { + background: transparent; + box-shadow: none; + color: #5273eb; + padding: 6px; + font-size: var(--font-size-xlarge); + } + + .bulletPoint { + color: #5273eb; + font-size: var(--font-size-large); + } + + .regularDropdown-container { + width: 100%; + } + + &:first-child { + gap: 4px; + } + } + } + + .child { + width: 100%; + gap: 6px; + } + + .infoBox { + display: flex; + align-items: flex-start; + gap: 6px; + color: #444; + border-radius: #{$border-radius-medium}; + font-size: var(--font-weight-regular); + + .infoIcon { + padding: 0px 7px; + border-radius: #{$border-radius-circle}; + + border: 1px solid gray; + } + + p { + margin: 0; + } + } + } + + .design { + width: 100%; + display: flex; + flex-direction: column; + gap: 15px; + font-size: var(--font-weight-regular); + color: var(--text-color); + padding: 12px; + + .appearance-container, + .element-container { + background: var(--background-color); + backdrop-filter: blur(20px); + border-radius: 15px; + outline: 1px solid var(--border-color); + + padding: 10px; + + display: flex; + flex-direction: column; + gap: 12px; + + .header-container { + padding: 0; + height: auto; + } + + .appearance-style { + display: flex; + align-items: center; + justify-content: space-between; + flex-direction: column; + gap: 12px; + + .regularDropdown-container { + .dropdown-options { + width: 130%; + left: -15%; + } + + .dropdown-header { + gap: 12px; + } + } + + .color-wrapper, + .opacity-wrapper, + .blurEffect-wrapper, + .theme-wrapper { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + flex-direction: column; + + .input-range-container { + width: 100%; + padding: 0; + } + } + + .theme-wrapper { + width: 100%; + display: flex; + flex-direction: row; + justify-content: space-between; + } + + .color-wrapper { + flex-direction: row; + + .value { + display: flex; + align-items: center; + + input { + width: 34px; + height: 24px; + border-radius: 12px; + padding: 0; + } + } + } + } + } + + .element-container { + padding: 8px; + + .display-element { + width: 100%; + height: 150px; + @include flex-center; + background: var(--background-color); + backdrop-filter: blur(20px); + border-radius: 5px; + outline: 1px solid var(--border-color); + } + + .name-wrapper, + .element-wrapper { + display: flex; + align-items: center; + justify-content: space-between; + + .value { + width: 60%; + } + } + } + } + + .reviewChart { + width: 100%; + height: 150px; + background: var(--background-color); + display: flex; + align-items: center; + } + + .optionsContainer { + display: flex; + flex-direction: column; + gap: 10px; + padding: 0 12px; + + .option { + display: flex; + align-items: center; + justify-content: space-between; + gap: 12px; + + .regularDropdown-container, + input { + width: 160px; + } + + &:last-child { + flex-direction: column; + + .header { + width: 100%; + display: flex; + justify-content: space-between; + } + + .colorDisplayer { + width: 100%; + display: flex; + justify-content: start; + align-items: center; + + input[type="color"] { + border: none; + outline: none; + background: none; + width: 24px; + height: 26px; + border-radius: #{$border-radius-small}; + padding: 0; + } + } + } + + span { + min-width: 100px; + } + } + } + } + } + + .machine-mechanics-container { + .machine-mechanics-header { + padding: 8px 12px; + border-top: 1px solid var(--border-color); + border-bottom: 1px solid var(--border-color); + color: var(--accent-color); + } + + .process-list-container { + display: flex; + align-items: center; + gap: 4px; + padding: 8px; + border-bottom: 1px solid var(--border-color); + + .label { + margin-right: 8px; + } + + .add-new-process { + @include flex-center; + height: 24px; + min-width: 24px; + cursor: pointer; + background: var(--background-color-secondary); + border-radius: #{$border-radius-medium}; + + path { + stroke: var(--accent-color); + strokewidth: 1.5px; + } + + &:hover { + background: var(--accent-color); + + path { + stroke: var(--highlight-accent-color); + } + } + } + } + } + + .machine-mechanics-content-container, + .simulations-container, + .event-proprties-wrapper { + position: relative; + max-height: calc(62vh - (47px - 35px)); + width: 304px; + border-radius: #{$border-radius-large}; + overflow-x: hidden; .header { - color: var(--accent-color); - } - } + @include flex-space-between; + padding: 6px 12px; + padding-right: 6px; + text-transform: capitalize; - .process-container { - padding: 0 12px; - margin: 6px 0; - padding-left: 16px; - position: relative; + .add-button { + @include flex-center; + padding: 4px 8px; + background: var(--background-color-button); + color: var(--text-button-color); + border-radius: #{$border-radius-large}; + cursor: pointer; + outline: none; + border: none; - &::after { - content: "↶"; - rotate: -90deg; - transform: translate(-16px, 4px) scaleX(1); - height: 100%; - width: 1px; - position: absolute; - color: var(--accent-color); - font-size: var(--font-size-regular); - outline-offset: -1px; - top: 0; - left: 4px; + path { + stroke: var(--text-button-color); + } + + &:disabled { + background: var(--text-disabled); + } + } } - &:last-child { - &::after { - display: none; - } + .global-props { + .property-list-container { + .property-item { + .value-field-container { + margin: 0; + + input { + padding: 5px 10px; + } + + .dropdown { + top: 4px; + right: 4px; + } + } + } + } } - .value { - @include flex-space-between; + .selected-actions-details { + .selected-actions-header .input-value { + padding: 8px 12px; + color: var(--accent-color); + } - .arrow-container { - height: 16px; - width: 16px; - } + .selected-actions-list { + margin-bottom: 8px; - .active { - rotate: 90deg; - } + .eye-dropper-input-container { + padding: 6px 12px; + + .regularDropdown-container { + padding: 5px 8px; + outline: 1px solid var(--border-color); + outline-offset: -1px; + border: none; + } + } + + .value-field-container { + margin: 0; + + input { + padding: 5px 4px; + text-align: center; + } + + .dropdown { + top: 4px; + right: 4px; + } + } + } } - .children-drop { - .value { - padding: 6px; - border-left: 1px solid var(--border-color); - } + .lists-main-container { + margin: 2px; + width: calc(100% - 4px); + background: var(--background-color-gray); + border-radius: #{$border-radius-medium}; + + min-height: 120px; + + .list-container { + padding: 4px; + height: calc(100% - 16px); + overflow-y: scroll; + + .list-item { + @include flex-space-between; + padding: 4px 12px; + width: 100%; + border-radius: #{$border-radius-medium}; + + .value { + display: flex; + justify-content: flex-start; + align-items: center; + min-width: 80%; + gap: 6px; + + .input-value { + text-align: start; + } + + input { + width: fit-content; + outline: none; + accent-color: var(--accent-color); + } + } + } + + .active { + background: var(--highlight-accent-color); + + .value .input-value { + color: var(--accent-color); + } + + path { + stroke: var(--accent-color); + } + } + + .remove-button { + @include flex-center; + height: 18px; + width: 18px; + cursor: pointer; + border-radius: #{$border-radius-small}; + transform: translateX(4px); + + &:hover { + background: var(--background-color-accent); + + path { + stroke: var(--text-button-color); + } + } + } + } + + .resize-icon { + @include flex-center; + padding: 4px; + cursor: grab; + width: 100%; + + &:active { + cursor: grabbing; + } + } + } + + .selected-properties-container { + padding: 12px; + + .properties-header { + color: var(--accent-color); + font-weight: var(--font-weight-regular); + padding: 8px 0; + } + + .input-toggle-container { + padding: 0; + margin-bottom: 6px; + } + + .value-field-container { + margin-bottom: 6px; + padding: 0; + @include flex-space-between; + + .label { + width: 40%; + } + + .regularDropdown-container { + width: 60%; + } + + .default { + width: 60%; + } + } + } + + .simulation-process { + .collapse-header-container { + @include flex-space-between; + padding-right: 12px; + margin: 8px 0; + width: 100%; + + .header { + color: var(--accent-color); + } + } + + .process-container { + padding: 0 12px; + margin: 6px 0; + padding-left: 16px; + position: relative; + + &::after { + content: "↶"; + rotate: -90deg; + transform: translate(-16px, 4px) scaleX(1); + height: 100%; + width: 1px; + position: absolute; + color: var(--accent-color); + font-size: var(--font-size-regular); + outline-offset: -1px; + top: 0; + left: 4px; + } + + &:last-child { + &::after { + display: none; + } + } + + .value { + @include flex-space-between; + + .arrow-container { + height: 16px; + width: 16px; + } + + .active { + rotate: 90deg; + } + } + + .children-drop { + .value { + padding: 6px; + border-left: 1px solid var(--border-color); + } + } + } + } + + .trigger-wrapper { + .trigger-item { + .trigger-name { + padding: 8px; + margin-top: 4px; + } + + .value-field-container { + margin: 0; + } + } + } + + .footer { + @include flex-center; + justify-content: flex-start; + gap: 4px; + padding: 12px; + font-size: var(--font-size-tiny); + } + + .compare-simulations-container { + background: var(--background-color); + padding: 12px; + border-radius: #{$border-radius-large}; + + .compare-simulations-header { + font-weight: var(--font-weight-medium); + } + + .content { + padding: 12px 0; + font-size: var(--font-size-small); + + span { + font-size: inherit; + color: var(--accent-color); + } + } + + .input { + width: 100%; + display: flex; + flex-direction: row-reverse; + justify-content: flex-start; + + input { + width: fit-content; + background: var(--background-color-button); + color: var(--text-button-color); + padding: 3px 10px; + cursor: pointer; + border: none; + outline: none; + } + } } - } } - .trigger-wrapper { - .trigger-item { - .trigger-name { - padding: 8px; - margin-top: 4px; + .aisle-properties-container { + max-height: 65vh; + overflow: auto; + + .aisle-texture-container { + max-height: 40vh; + overflow: auto; + + .aisle-list { + width: calc(100% - 8px); + text-align: start; + padding: 4px 6px; + display: flex; + align-items: center; + gap: 6px; + border-radius: #{$border-radius-large}; + margin: 2px 6px; + + .texture-display { + height: 34px; + width: 34px; + background: #7e7e7e86; + border-radius: #{$border-radius-large}; + margin-right: 4px; + overflow: hidden; + } + + .aisle-color { + text-transform: capitalize; + } + + .aisle-brief { + font-size: var(--font-size-small); + color: var(--input-text-color); + } + + &.selected { + background: var(--highlight-accent-color); + + .aisle-color { + // color: var(--text-button-color); + } + + &:hover { + // background: var(--background-color-accent); + } + } + + &:hover { + background: var(--highlight-accent-color); + // background: var(--background-color-secondary); + } + } } .value-field-container { - margin: 0; + margin: 0; + } + + .presets-list-container { + display: flex; + flex-wrap: wrap; + gap: 6px; + padding: 6px; + padding-left: 7px; + + .preset-list { + background: #444; + height: 90px; + width: 90px; + border-radius: #{$border-radius-large}; + overflow: hidden; + + .thumbnail { + height: 100%; + width: 100%; + border-radius: #{$border-radius-large}; + outline-offset: -1px; + + img { + height: 100%; + width: 100%; + object-fit: cover; + transition: all 0.2s; + } + + &.selected { + outline: 2px solid var(--border-color-accent); + outline-offset: -2px; + + &:hover { + outline: 2px solid var(--border-color-accent); + + img { + transform: scale(1); + } + } + } + + &:hover { + outline: 1px solid var(--border-color); + + img { + transform: scale(1.1); + } + } + } + } } - } } - .footer { - @include flex-center; - justify-content: flex-start; - gap: 4px; - padding: 12px; - font-size: var(--font-size-tiny); - } - - .compare-simulations-container { - background: var(--background-color); - padding: 12px; - border-radius: #{$border-radius-large}; - - .compare-simulations-header { - font-weight: var(--font-weight-medium); - } - - .content { - padding: 12px 0; - font-size: var(--font-size-small); - - span { - font-size: inherit; - color: var(--accent-color); - } - } - - .input { - width: 100%; - display: flex; - flex-direction: row-reverse; - justify-content: flex-start; - - input { - width: fit-content; - background: var(--background-color-button); - color: var(--text-button-color); - padding: 3px 10px; - cursor: pointer; - border: none; - outline: none; - } - } - } - } - - .aisle-properties-container { - max-height: 65vh; - overflow: auto; - - .aisle-texture-container { - max-height: 40vh; - overflow: auto; - - .aisle-list { - width: calc(100% - 8px); - text-align: start; - padding: 4px 6px; - display: flex; - align-items: center; - gap: 6px; - border-radius: #{$border-radius-large}; - margin: 2px 6px; - - .texture-display { - height: 34px; - width: 34px; - background: #7e7e7e86; - border-radius: #{$border-radius-large}; - margin-right: 4px; - overflow: hidden; - } - - .aisle-color { - text-transform: capitalize; - } - - .aisle-brief { - font-size: var(--font-size-small); - color: var(--input-text-color); - } - - &.selected { - background: var(--highlight-accent-color); - - .aisle-color { - // color: var(--text-button-color); - } - - &:hover { - // background: var(--background-color-accent); - } - } - - &:hover { - background: var(--highlight-accent-color); - // background: var(--background-color-secondary); - } - } - } - - .value-field-container { - margin: 0; - } - - .presets-list-container { - display: flex; - flex-wrap: wrap; - gap: 6px; - padding: 6px; - padding-left: 7px; - - .preset-list { - background: #444; - height: 90px; - width: 90px; - border-radius: #{$border-radius-large}; - overflow: hidden; - - .thumbnail { - height: 100%; - width: 100%; - border-radius: #{$border-radius-large}; - outline-offset: -1px; - - img { - height: 100%; + .global-properties-container, + .analysis-main-container, + .asset-properties-container, + .zone-properties-container, + .aisle-properties-container { + .header { + @include flex-space-between; + padding: 10px 12px; + color: var(--text-color); width: 100%; - object-fit: cover; - transition: all 0.2s; - } - &.selected { - outline: 2px solid var(--border-color-accent); - outline-offset: -2px; - - &:hover { - outline: 2px solid var(--border-color-accent); - - img { - transform: scale(1); - } + .input-value { + color: inherit; } - } - - &:hover { - outline: 1px solid var(--border-color); - - img { - transform: scale(1.1); - } - } } - } - } - } - - .global-properties-container, - .analysis-main-container, - .asset-properties-container, - .zone-properties-container, - .aisle-properties-container { - .header { - @include flex-space-between; - padding: 10px 12px; - color: var(--text-color); - width: 100%; - - .input-value { - color: inherit; - } - } - - .input-container { - @include flex-center; - - .remove-button { - @include flex-center; - height: 18px; - width: 18px; - margin-bottom: 6px; - border-radius: 8px 0 0 8px; - - &:hover { - background: var(--background-color-accent); - - path { - stroke: var(--text-button-color); - } - } - } - } - - .optimize-button, - .generate-report-button, - .button-save { - @include flex-center; - background: var(--background-color-button); - color: var(--text-button-color); - border-radius: #{$border-radius-large}; - padding: 2px; - gap: 4px; - margin: 4px 12px; - cursor: pointer; - font-size: var(--font-size-small); - margin-bottom: 8px; - } - - .custom-input-container { - @include flex-space-between; - - .split { - height: 20px; - width: 2px; - border-radius: 2px; - background: var(--text-disabled); - } - - .header { - @include flex-space-between; - border: none; - - .eyedrop-button { - @include flex-center; - } - } - - .inputs-container { - @include flex-space-between; .input-container { - padding: 0 4px; - gap: 6px; - } - } + @include flex-center; - .custom-input-label { - white-space: nowrap; - } + .remove-button { + @include flex-center; + height: 18px; + width: 18px; + margin-bottom: 6px; + border-radius: 8px 0 0 8px; + + &:hover { + background: var(--background-color-accent); + + path { + stroke: var(--text-button-color); + } + } + } + } + + .optimize-button, + .generate-report-button, + .button-save { + @include flex-center; + background: var(--background-color-button); + color: var(--text-button-color); + border-radius: #{$border-radius-large}; + padding: 2px; + gap: 4px; + margin: 4px 12px; + cursor: pointer; + font-size: var(--font-size-small); + margin-bottom: 8px; + } + + .custom-input-container { + @include flex-space-between; + + .split { + height: 20px; + width: 2px; + border-radius: 2px; + background: var(--text-disabled); + } + + .header { + @include flex-space-between; + border: none; + + .eyedrop-button { + @include flex-center; + } + } + + .inputs-container { + @include flex-space-between; + + .input-container { + padding: 0 4px; + gap: 6px; + } + } + + .custom-input-label { + white-space: nowrap; + } + } + + .analysis-content-container { + min-height: 48vh; + max-height: 56vh; + overflow-y: auto; + + .dropdown-header-container, + .dropdown-content-container { + padding: 6px 12px; + } + + .value-field-container { + padding: 6px; + + .dropdown { + min-width: 44px; + text-align: center; + } + } + + .input-range-container { + .input-container { + width: 75%; + } + } + } + + .buttons-container { + @include flex-space-between; + padding: 12px; + gap: 12px; + + input { + border: none; + outline: none; + cursor: pointer; + + &:hover { + box-shadow: #{$box-shadow-medium}; + outline: 1px solid var(--input-border-color); + } + } + + .cancel { + background: transparent; + background: var(--background-color-secondary); + color: var(--text-color); + } + + .submit { + background: var(--background-color-button); + color: var(--text-button-color); + } + } + + .create-custom-analysis-container { + margin: 6px; + background: var(--background-color); + padding: 12px; + border-radius: #{$border-radius-large}; + + .custom-analysis-header { + font-weight: var(--font-weight-medium); + } + + .content { + padding: 12px 0; + font-size: var(--font-size-small); + + span { + font-size: inherit; + color: var(--accent-color); + } + } + + .input { + display: flex; + flex-direction: row-reverse; + + input { + width: fit-content; + background: var(--background-color-button); + color: var(--text-button-color); + padding: 3px 10px; + cursor: pointer; + border: none; + outline: none; + } + } + } } - .analysis-content-container { - min-height: 48vh; - max-height: 56vh; - overflow-y: auto; - - .dropdown-header-container, - .dropdown-content-container { - padding: 6px 12px; - } - - .value-field-container { - padding: 6px; - - .dropdown { - min-width: 44px; - text-align: center; + .toggle-sidebar-ui-button { + svg { + transform: scaleX(-1); } - } - .input-range-container { - .input-container { - width: 75%; + .tooltip { + right: 56px; + + &::after { + left: 100%; + bottom: 50%; + } } - } } - - .buttons-container { - @include flex-space-between; - padding: 12px; - gap: 12px; - - input { - border: none; - outline: none; - cursor: pointer; - - &:hover { - box-shadow: #{$box-shadow-medium}; - outline: 1px solid var(--input-border-color); - } - } - - .cancel { - background: transparent; - background: var(--background-color-secondary); - color: var(--text-color); - } - - .submit { - background: var(--background-color-button); - color: var(--text-button-color); - } - } - - .create-custom-analysis-container { - margin: 6px; - background: var(--background-color); - padding: 12px; - border-radius: #{$border-radius-large}; - - .custom-analysis-header { - font-weight: var(--font-weight-medium); - } - - .content { - padding: 12px 0; - font-size: var(--font-size-small); - - span { - font-size: inherit; - color: var(--accent-color); - } - } - - .input { - display: flex; - flex-direction: row-reverse; - - input { - width: fit-content; - background: var(--background-color-button); - color: var(--text-button-color); - padding: 3px 10px; - cursor: pointer; - border: none; - outline: none; - } - } - } - } - - .toggle-sidebar-ui-button { - svg { - transform: scaleX(-1); - } - - .tooltip { - right: 56px; - - &::after { - left: 100%; - bottom: 50%; - } - } - } } .sidebar-right-wrapper { - .wall-properties-container { - .header { - - color: var(--background-color-button); - } - - .wall-properties { - padding: 12px 0; - - .value-field-container { - padding: 0; - - .input { - input { - text-align: center; - } - } - } - } - - section { - padding: 0; - margin: 0; - max-height: 50vh; - overflow: hidden; - - .header-wrapper { - display: flex; - justify-content: space-between; - padding: 12px; - } - - .material-preview { - display: flex; - flex-direction: column; - align-items: center; - gap: 15px; - background: var(--Grays-Gray-6, #F2F2F7); - padding: 18px 25px; - - .sides-wrapper { - display: flex; - justify-content: space-between; - width: 100%; - background-color: #FCFDFD; - border-radius: 4px; - overflow: hidden; - - .side-wrapper { - flex: 1; - display: flex; - justify-content: center; - align-items: center; - gap: 8px; - padding: 8px 0; - cursor: pointer; - - .label { - color: var(--background-color-button); - } - - &.active { - background-color: #E0DFFF; - } - - .texture-image { - width: 20px; - height: 20px; - border-radius: 50%; - overflow: hidden; - - img { - width: 100%; - height: 100%; - object-fit: cover; - } - } - } + .wall-properties-container { + .header { + color: var(--background-color-button); } - .preview { - width: 90%; - height: 111px; + .wall-properties { + padding: 12px 0; - img { - width: 100%; - height: 100%; - object-fit: cover; - } - } - } + .value-field-container { + padding: 0; - .materials { - max-height: 250px; - overflow: auto; - margin-bottom: 6px; - padding: 0 12px; - - .material-container { - display: flex; - flex-direction: column; - gap: 6px; - - .material-wrapper { - display: flex; - justify-content: space-between; - align-items: center; - padding: 4px 6px; - border-radius: 12px; - - &:hover { - background: var(--highlight-accent-color); - } - - &.selectedMaterial { - background: var(--highlight-accent-color); - } - - .material-property { - display: flex; - align-items: center; - gap: 6px; - - .material-image { - width: 34px; - height: 34px; - border-radius: 6px; - overflow: hidden; - - img { - width: 100%; - height: 100%; - object-fit: cover; + .input { + input { + text-align: center; + } } - } + } + } + + section { + padding: 0; + margin: 0; + max-height: 50vh; + overflow: hidden; + + .header-wrapper { + display: flex; + justify-content: space-between; + padding: 12px; } - .delete-material { - cursor: pointer; + .material-preview { + display: flex; + flex-direction: column; + align-items: center; + gap: 15px; + background: var(--Grays-Gray-6, #f2f2f7); + padding: 18px 25px; + + .sides-wrapper { + display: flex; + justify-content: space-between; + width: 100%; + background-color: #fcfdfd; + border-radius: 4px; + overflow: hidden; + + .side-wrapper { + flex: 1; + display: flex; + justify-content: center; + align-items: center; + gap: 8px; + padding: 8px 0; + cursor: pointer; + + .label { + color: var(--background-color-button); + } + + &.active { + background-color: #e0dfff; + } + + .texture-image { + width: 20px; + height: 20px; + border-radius: 50%; + overflow: hidden; + + img { + width: 100%; + height: 100%; + object-fit: cover; + } + } + } + } + + .preview { + width: 90%; + height: 111px; + + img { + width: 100%; + height: 100%; + object-fit: cover; + } + } + } + + .materials { + max-height: 250px; + overflow: auto; + margin-bottom: 6px; + padding: 0 12px; + + .material-container { + display: flex; + flex-direction: column; + gap: 6px; + + .material-wrapper { + display: flex; + justify-content: space-between; + align-items: center; + padding: 4px 6px; + border-radius: 12px; + + &:hover { + background: var(--highlight-accent-color); + } + + &.selectedMaterial { + background: var(--highlight-accent-color); + } + + .material-property { + display: flex; + align-items: center; + gap: 6px; + + .material-image { + width: 34px; + height: 34px; + border-radius: 6px; + overflow: hidden; + + img { + width: 100%; + height: 100%; + object-fit: cover; + } + } + } + + .delete-material { + cursor: pointer; + } + } + } } - } } - } } - } } .assets-container-main { - width: 100%; - display: flex; - flex-direction: row; - flex-wrap: wrap; - height: 100%; - gap: 3px; - - .assets-result { width: 100%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + height: 100%; + gap: 3px; + + .assets-result { + width: 100%; + + .assets-wrapper { + margin: 0; + } + } + + .assets-list-section { + width: 100%; + padding: 4px; + } .assets-wrapper { - margin: 0; - } - } - - .assets-list-section { - width: 100%; - padding: 4px; - } - - .assets-wrapper { - width: 100%; - position: relative; - max-height: 50vh; - overflow: auto; - - h2, - .searched-content { - color: var(--text-color); - font-family: $large; - font-weight: $bold-weight; - padding: 8px; - @include flex-space-between; - - .back-button { - cursor: pointer; - } - } - - .categories-container { - width: 100%; - display: flex; - flex-direction: row; - flex-wrap: wrap; - height: 100%; - gap: 4px; - padding: 2px; - - .category { - width: 123px; - height: 95px; - border-radius: #{$border-radius-large}; - background: var(--background-color); - outline: 1px solid var(--border-color); - outline-offset: -1px; - padding: 8px; - padding-top: 12px; - font-weight: $bold-weight; - position: relative; - overflow: hidden; - - &:hover { - outline: 1px solid var(--border-color-accent); - cursor: pointer; - - img { - transition: all 0.2s; - scale: 1.3; - } - - &::after { - top: 80px; - right: 0; - scale: 2; - } - } - - .category-name { - position: relative; - z-index: 3; - font-size: var(--font-size-regular); - } - - &::after { - content: ""; - width: 60px; - height: 60px; - border-radius: #{$border-radius-circle}; - background: var(--circle-color, #000); - position: absolute; - top: 60%; - right: -10px; - transform: translate(0, -50%); - transition: all 0.2s ease-in-out; - } - - &:nth-child(1), - &:nth-child(8) { - &::after { - @include gradient-by-child(1); // First child uses the first color - } - } - - &:nth-child(2), - &:nth-child(9) { - &::after { - @include gradient-by-child(2); // Second child uses the second color - } - } - - &:nth-child(3), - &:nth-child(10) { - &::after { - @include gradient-by-child(3); // Third child uses the third color - } - } - - &:nth-child(4), - &:nth-child(11) { - &::after { - @include gradient-by-child(4); // Fourth child uses the fourth color - } - } - - &:nth-child(5), - &:nth-child(12) { - &::after { - @include gradient-by-child(5); // Fifth child uses the fifth color - } - } - - &:nth-child(6), - &:nth-child(13) { - &::after { - @include gradient-by-child(6); // Fifth child uses the fifth color - } - } - - &:nth-child(7), - &:nth-child(14) { - &::after { - @include gradient-by-child(7); // Fifth child uses the fifth color - } - } - - .category-image { - position: absolute; - bottom: 0; - right: -10px; - transform: translate(0, 0%) scale(0.8); - z-index: 2; - height: 80%; - } - } - } - - .assets-container { - width: 100%; - display: flex; - flex-direction: row; - flex-wrap: wrap; - height: 100%; - gap: 6px; - padding: 2px; - - .no-asset { - text-align: center; - margin: 12px; width: 100%; - } - - .assets { - width: 122px; - height: 95px; - border-radius: #{$border-radius-large}; - background: var(--background-color); - outline: 1px solid var(--border-color); - font-weight: $medium-weight; position: relative; - overflow: hidden; - padding: 0; + max-height: 50vh; + overflow: auto; - &:hover { - .asset-name { - opacity: 1; - } + h2, + .searched-content { + color: var(--text-color); + font-family: $large; + font-weight: $bold-weight; + padding: 8px; + @include flex-space-between; - .asset-image { - scale: 1.2; - } + .back-button { + cursor: pointer; + } } - .asset-name { - position: absolute; - top: 0; - z-index: 3; - padding: 8px; - width: 100%; - height: 100%; - font-size: var(--font-size-regular); - background: linear-gradient(0deg, - rgba(37, 24, 51, 0) 0%, - rgba(52, 41, 61, 0.5) 100%); - pointer-events: none; - backdrop-filter: blur(8px); - opacity: 0; - transition: opacity 0.3s ease; - display: -webkit-box; - -webkit-line-clamp: 3; - line-clamp: 3; - -webkit-box-orient: vertical; - overflow: hidden; - text-overflow: ellipsis; + .categories-container { + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + height: 100%; + gap: 4px; + padding: 2px; + + .category { + width: 123px; + height: 95px; + border-radius: #{$border-radius-large}; + background: var(--background-color); + outline: 1px solid var(--border-color); + outline-offset: -1px; + padding: 8px; + padding-top: 12px; + font-weight: $bold-weight; + position: relative; + overflow: hidden; + + &:hover { + outline: 1px solid var(--border-color-accent); + cursor: pointer; + + img { + transition: all 0.2s; + scale: 1.3; + } + + &::after { + top: 80px; + right: 0; + scale: 2; + } + } + + .category-name { + position: relative; + z-index: 3; + font-size: var(--font-size-regular); + } + + &::after { + content: ""; + width: 60px; + height: 60px; + border-radius: #{$border-radius-circle}; + background: var(--circle-color, #000); + position: absolute; + top: 60%; + right: -10px; + transform: translate(0, -50%); + transition: all 0.2s ease-in-out; + } + + &:nth-child(1), + &:nth-child(8) { + &::after { + @include gradient-by-child( + 1 + ); // First child uses the first color + } + } + + &:nth-child(2), + &:nth-child(9) { + &::after { + @include gradient-by-child( + 2 + ); // Second child uses the second color + } + } + + &:nth-child(3), + &:nth-child(10) { + &::after { + @include gradient-by-child( + 3 + ); // Third child uses the third color + } + } + + &:nth-child(4), + &:nth-child(11) { + &::after { + @include gradient-by-child( + 4 + ); // Fourth child uses the fourth color + } + } + + &:nth-child(5), + &:nth-child(12) { + &::after { + @include gradient-by-child( + 5 + ); // Fifth child uses the fifth color + } + } + + &:nth-child(6), + &:nth-child(13) { + &::after { + @include gradient-by-child( + 6 + ); // Fifth child uses the fifth color + } + } + + &:nth-child(7), + &:nth-child(14) { + &::after { + @include gradient-by-child( + 7 + ); // Fifth child uses the fifth color + } + } + + .category-image { + position: absolute; + bottom: 0; + right: -10px; + transform: translate(0, 0%) scale(0.8); + z-index: 2; + height: 80%; + } + } } - .asset-image { - height: 100%; - width: 100%; - z-index: 2; - object-fit: cover; - transition: all 0.2s; + .assets-container { + width: 100%; + display: flex; + flex-direction: row; + flex-wrap: wrap; + height: 100%; + gap: 6px; + padding: 2px; + + .no-asset { + text-align: center; + margin: 12px; + width: 100%; + } + + .assets { + width: 122px; + height: 95px; + border-radius: #{$border-radius-large}; + background: var(--background-color); + outline: 1px solid var(--border-color); + font-weight: $medium-weight; + position: relative; + overflow: hidden; + padding: 0; + + &:hover { + .asset-name { + opacity: 1; + } + + .asset-image { + scale: 1.2; + } + } + + .asset-name { + position: absolute; + top: 0; + z-index: 3; + padding: 8px; + width: 100%; + height: 100%; + font-size: var(--font-size-regular); + background: linear-gradient( + 0deg, + rgba(37, 24, 51, 0) 0%, + rgba(52, 41, 61, 0.5) 100% + ); + pointer-events: none; + backdrop-filter: blur(8px); + opacity: 0; + transition: opacity 0.3s ease; + display: -webkit-box; + -webkit-line-clamp: 3; + line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + text-overflow: ellipsis; + } + + .asset-image { + height: 100%; + width: 100%; + z-index: 2; + object-fit: cover; + transition: all 0.2s; + } + } } - } } - } } .sidebar-left-wrapper, .sidebar-right-wrapper { - transition: height 0.2s ease-in-out; + transition: height 0.2s ease-in-out; } .sidebar-left-wrapper.closed, .sidebar-right-wrapper.closed { - animation: closeSidebar 0.2s linear forwards; + animation: closeSidebar 0.2s linear forwards; } .sidebar-left-wrapper.open, .sidebar-right-wrapper.open { - height: fit-content; - animation: openSidebar 0.2s linear; + height: fit-content; + animation: openSidebar 0.2s linear; - .sidebar-right-container, - .sidebar-left-container { - opacity: 0; - animation: revealSmooth 0.3s 0.1s linear forwards; - } + .sidebar-right-container, + .sidebar-left-container { + opacity: 0; + animation: revealSmooth 0.3s 0.1s linear forwards; + } } @keyframes revealSmooth { - from { - opacity: 0; - } + from { + opacity: 0; + } - to { - opacity: 1; - } + to { + opacity: 1; + } } @keyframes closeSidebar { - from { - height: 60%; - } + from { + height: 60%; + } - to { - height: 52px; - } + to { + height: 52px; + } } @keyframes openSidebar { - from { - height: 52px; - } + from { + height: 52px; + } - to { - height: 60%; - } + to { + height: 60%; + } } .versionSaved { - min-width: 449px; - position: fixed; - bottom: 45px; - right: 10px; - z-index: 10; - display: flex; - flex-direction: column; - gap: 18px; - - .versionSaved-wrapper { - border-radius: 20px; - - padding: 8px 10px; - background: var(--background-color); - backdrop-filter: blur(20px); - } - - .version-header { + min-width: 449px; + position: fixed; + bottom: 45px; + right: 10px; + z-index: 10; display: flex; - justify-content: space-between; - align-items: center; - - .header-wrapper { - display: flex; - align-items: center; - gap: 6px; - } - } - - .version-details { - width: 100%; - - display: flex; - justify-content: center; - align-items: center; flex-direction: column; gap: 18px; - .details { - width: 100%; + .versionSaved-wrapper { + border-radius: 20px; - background: var(--background-color); - backdrop-filter: blur(20px); - border-radius: 20px; - outline: 1px solid var(--border-color); - display: flex; - justify-content: space-between; - align-items: center; - padding: 7px 12px; + padding: 8px 10px; + background: var(--background-color); + backdrop-filter: blur(20px); + } - .details-wrapper { - font-size: var(--font-size-small); - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } + .version-header { + display: flex; + justify-content: space-between; + align-items: center; + + .header-wrapper { + display: flex; + align-items: center; + gap: 6px; + } + } + + .version-details { + width: 100%; - button { - font-size: var(--font-size-small); display: flex; justify-content: center; align-items: center; - background: var(--background-color-button); - color: var(--text-button-color); - border-radius: 12px; - padding: 5px 6px; - cursor: pointer; - } + flex-direction: column; + gap: 18px; + + .details { + width: 100%; + + background: var(--background-color); + backdrop-filter: blur(20px); + border-radius: 20px; + outline: 1px solid var(--border-color); + display: flex; + justify-content: space-between; + align-items: center; + padding: 7px 12px; + + .details-wrapper { + font-size: var(--font-size-small); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + button { + font-size: var(--font-size-small); + display: flex; + justify-content: center; + align-items: center; + background: var(--background-color-button); + color: var(--text-button-color); + border-radius: 12px; + padding: 5px 6px; + cursor: pointer; + } + } } - } } .dismissing { - display: none; + display: none; } .edit-version-popup-wrapper, .finishEdit-version-popup-wrapper { + height: 100vh; + width: 100vw; + background: var(--background-color-secondary); + @include flex-center; - - height: 100vh; - width: 100vw; - background: var(--background-color-secondary); - @include flex-center; - - .details-wrapper-popup-container, - .finishEdit-wrapper-popup-container { - min-width: 535px; - width: 520px; - background: var(--background-color); - border-radius: #{$border-radius-large}; - backdrop-filter: blur(15px); - outline: 1px solid var(--border-color); - display: flex; - flex-direction: column; - gap: 30px; - padding: 20px; - - .header-wrapper { - display: flex; - align-items: center; - gap: 6px; - } - - .details-wrapper { - display: flex; - flex-direction: column; - gap: 10px; - - .version-name, - .version-description { + .details-wrapper-popup-container, + .finishEdit-wrapper-popup-container { + min-width: 535px; + width: 520px; background: var(--background-color); - backdrop-filter: blur(20px); - border-radius: 20px; + border-radius: #{$border-radius-large}; + backdrop-filter: blur(15px); outline: 1px solid var(--border-color); display: flex; - justify-content: space-between; - align-items: center; - padding: 4px 12px; - position: relative; + flex-direction: column; + gap: 30px; + padding: 20px; - .label { - position: absolute; - right: 8px; - font-size: var(--font-size-tiny); - color: var(--text-disabled); + .header-wrapper { + display: flex; + align-items: center; + gap: 6px; } - input { - border: none; - background: none; - outline: none; - color: var(--text-color); - } - } + .details-wrapper { + display: flex; + flex-direction: column; + gap: 10px; - .version-description { - textarea { - padding: 4px 8px; - width: 100%; - min-height: 101px; - background: transparent; - border: none; - outline: none; + .version-name, + .version-description { + background: var(--background-color); + backdrop-filter: blur(20px); + border-radius: 20px; + outline: 1px solid var(--border-color); + display: flex; + justify-content: space-between; + align-items: center; + padding: 4px 12px; + position: relative; + + .label { + position: absolute; + right: 8px; + font-size: var(--font-size-tiny); + color: var(--text-disabled); + } + + input { + border: none; + background: none; + outline: none; + color: var(--text-color); + } + } + + .version-description { + textarea { + padding: 4px 8px; + width: 100%; + min-height: 101px; + background: transparent; + border: none; + outline: none; + } + } + } + + .btn-wrapper { + display: flex; + justify-content: flex-end; + gap: 20px; + + .save { + display: flex; + justify-content: center; + align-items: center; + background: var(--background-color-button); + color: var(--text-button-color); + border-radius: 12px; + padding: 5px 12px; + cursor: pointer; + } } - } } - .btn-wrapper { - display: flex; - justify-content: flex-end; - gap: 20px; - - .save { + .finishEdit-wrapper-popup-container { + min-height: 250px; display: flex; justify-content: center; align-items: center; - background: var(--background-color-button); - color: var(--text-button-color); - border-radius: 12px; - padding: 5px 12px; - cursor: pointer; - } - } - } + gap: 12px; - .finishEdit-wrapper-popup-container { - min-height: 250px; - display: flex; - justify-content: center; - align-items: center; - gap: 12px; - - .versionname { - font-size: var(--font-size-large); - color: var(--background-color-accent); - color: #CCACFF; - text-transform: capitalize; + .versionname { + font-size: var(--font-size-large); + color: var(--background-color-accent); + color: #ccacff; + text-transform: capitalize; + } } - } -} \ No newline at end of file +} diff --git a/app/src/types/builderTypes.d.ts b/app/src/types/builderTypes.d.ts index 5e91468..26dcf65 100644 --- a/app/src/types/builderTypes.d.ts +++ b/app/src/types/builderTypes.d.ts @@ -1,3 +1,15 @@ +// Version History +interface Version { + version: number; + versionId: string; + versionName: string; + versionDescription: string; + timeStamp: string; + createdBy: string; +} + +type VersionHistory = Version[]; + // Asset interface Asset { diff --git a/app/src/utils/shortcutkeys/handleShortcutKeys.ts b/app/src/utils/shortcutkeys/handleShortcutKeys.ts index cbfae82..5a4f924 100644 --- a/app/src/utils/shortcutkeys/handleShortcutKeys.ts +++ b/app/src/utils/shortcutkeys/handleShortcutKeys.ts @@ -1,7 +1,7 @@ import React, { useEffect } from "react"; -import useModuleStore, { useThreeDStore } from "../../store/useModuleStore"; +import useModuleStore, { useSubModuleStore, useThreeDStore } from "../../store/useModuleStore"; import { usePlayerStore, useToggleStore } from "../../store/useUIToggleStore"; -import { +import useVersionHistoryVisibleStore, { useActiveSubTool, useActiveTool, useAddAction, @@ -21,10 +21,12 @@ import { detectModifierKeys } from "./detectModifierKeys"; import { useSelectedZoneStore } from "../../store/visualization/useZoneStore"; import { useLogger } from "../../components/ui/log/LoggerContext"; import { useComparisonProduct } from "../../store/simulation/useSimulationStore"; +import { useVersionHistoryStore } from "../../store/builder/useVersionHistoryStore"; const KeyPressListener: React.FC = () => { const { comparisonProduct, clearComparisonProduct } = useComparisonProduct(); const { activeModule, setActiveModule } = useModuleStore(); + const { setSubModule } = useSubModuleStore(); const { setActiveSubTool } = useActiveSubTool(); const { toggleUILeft, toggleUIRight, setToggleUI } = useToggleStore(); const { setToggleThreeD } = useThreeDStore(); @@ -40,9 +42,11 @@ const KeyPressListener: React.FC = () => { const { setIsVersionSaved } = useSaveVersion(); const { isLogListVisible, setIsLogListVisible } = useLogger(); const { hidePlayer, setHidePlayer } = usePlayerStore(); - const { viewSceneLabels, setViewSceneLabels } = useViewSceneStore(); + const { setViewSceneLabels } = useViewSceneStore(); const { isRenameMode, setIsRenameMode } = useRenameModeStore(); const { selectedFloorItem } = useSelectedFloorItem(); + const { setCreateNewVersion } = useVersionHistoryStore(); + const { setVersionHistoryVisible } = useVersionHistoryVisibleStore(); const isTextInput = (element: Element | null): boolean => element instanceof HTMLInputElement || @@ -150,6 +154,13 @@ const KeyPressListener: React.FC = () => { updateLocalStorage(!toggleUILeft, toggleUIRight); break; + case "Ctrl+Alt+S": + setCreateNewVersion(true); + setVersionHistoryVisible(true); + setSubModule("properties"); + setActiveModule('builder'); + break; + default: break; }