refactor: streamline Project component by removing unused imports and consolidating useEffect hooks
This commit is contained in:
parent
9edf2c1021
commit
e1213e6929
|
|
@ -1,22 +1,15 @@
|
|||
import React, { useEffect } from "react";
|
||||
import useModuleStore from "../store/useModuleStore";
|
||||
import {
|
||||
useSocketStore,
|
||||
useOrganization,
|
||||
useUserName,
|
||||
useWallItems,
|
||||
useSaveVersion,
|
||||
useViewSceneStore,
|
||||
useProjectName,
|
||||
useRenameModeStore,
|
||||
useSelectedFloorItem,
|
||||
useZones,
|
||||
useSocketStore,
|
||||
useOrganization,
|
||||
useUserName,
|
||||
useWallItems,
|
||||
useSaveVersion,
|
||||
useProjectName,
|
||||
useZones,
|
||||
} from "../store/builder/store";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import { usePlayButtonStore } from "../store/usePlayButtonStore";
|
||||
import MarketPlace from "../modules/market/MarketPlace";
|
||||
import LoadingPage from "../components/templates/LoadingPage";
|
||||
import KeyPressListener from "../utils/shortcutkeys/handleShortcutKeys";
|
||||
import { useSelectedUserStore } from "../store/collaboration/useCollabStore";
|
||||
import FollowPerson from "../components/templates/FollowPerson";
|
||||
import { useLogger } from "../components/ui/log/LoggerContext";
|
||||
|
|
@ -25,109 +18,92 @@ import LogList from "../components/ui/log/LogList";
|
|||
import Footer from "../components/footer/Footer";
|
||||
import { useToggleStore } from "../store/useUIToggleStore";
|
||||
import VersionSaved from "../components/layout/sidebarRight/versionHisory/VersionSaved";
|
||||
import SimulationPlayer from "../components/ui/simulation/simulationPlayer";
|
||||
import { useProductStore } from "../store/simulation/useProductStore";
|
||||
import { getAllProjects } from "../services/dashboard/getAllProjects";
|
||||
import { viewProject } from "../services/dashboard/viewProject";
|
||||
import RenameTooltip from "../components/ui/features/RenameTooltip";
|
||||
import { setFloorItemApi } from "../services/factoryBuilder/assest/floorAsset/setFloorItemApi";
|
||||
import { useAssetsStore } from "../store/builder/useAssetStore";
|
||||
import ComparisonSceneProvider from "../components/layout/scenes/ComparisonSceneProvider";
|
||||
import MainSceneProvider from "../components/layout/scenes/MainSceneProvider";
|
||||
import { getUserData } from "../functions/getUserData";
|
||||
|
||||
const Project: React.FC = () => {
|
||||
let navigate = useNavigate();
|
||||
const echo = useLogger();
|
||||
const { setToggleUI } = useToggleStore();
|
||||
const { activeModule, setActiveModule } = useModuleStore();
|
||||
const { setAssets } = useAssetsStore();
|
||||
const { setUserName } = useUserName();
|
||||
const { setOrganization } = useOrganization();
|
||||
const { setWallItems } = useWallItems();
|
||||
const { setZones } = useZones();
|
||||
const { isVersionSaved } = useSaveVersion();
|
||||
const { setProducts } = useProductStore();
|
||||
const { projectId } = useParams();
|
||||
const { setProjectName } = useProjectName();
|
||||
const { userId, email, organization, userName } = getUserData();
|
||||
let navigate = useNavigate();
|
||||
const echo = useLogger();
|
||||
const { setToggleUI } = useToggleStore();
|
||||
const { activeModule, setActiveModule } = useModuleStore();
|
||||
const { setAssets } = useAssetsStore();
|
||||
const { setUserName } = useUserName();
|
||||
const { setOrganization } = useOrganization();
|
||||
const { setWallItems } = useWallItems();
|
||||
const { setZones } = useZones();
|
||||
const { isVersionSaved } = useSaveVersion();
|
||||
const { setProducts } = useProductStore();
|
||||
const { projectId } = useParams();
|
||||
const { setProjectName } = useProjectName();
|
||||
const { userId, email, organization, userName } = getUserData();
|
||||
const { selectedUser } = useSelectedUserStore();
|
||||
const { isLogListVisible } = useLogger();
|
||||
|
||||
const generateThumbnail = async () => {
|
||||
try {
|
||||
if (!email || !userId) {
|
||||
console.error("User data not found in localStorage");
|
||||
return;
|
||||
}
|
||||
useEffect(() => {
|
||||
if (!email || !userId) {
|
||||
console.error("User data not found in localStorage");
|
||||
return;
|
||||
}
|
||||
|
||||
const projects = await getAllProjects(
|
||||
userId, organization
|
||||
);
|
||||
const filterProject = projects?.Projects.find((val: any) => val.projectUuid === projectId || val._id
|
||||
=== projectId)
|
||||
const viewedProject = await viewProject(
|
||||
organization,
|
||||
filterProject._id,
|
||||
userId,
|
||||
);
|
||||
// console.log('filterProject.projectName: ', filterProject.projectName);
|
||||
setProjectName(filterProject.projectName)
|
||||
getAllProjects(userId, organization).then((projects) => {
|
||||
const filterProject = projects?.Projects.find((val: any) => val.projectUuid === projectId || val._id === projectId)
|
||||
setProjectName(filterProject.projectName)
|
||||
|
||||
}
|
||||
catch {
|
||||
viewProject(organization, filterProject._id, userId).then((viewedProject) => {
|
||||
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
generateThumbnail();
|
||||
}, []);
|
||||
// console.log('isRenameMode: ', isRenameMode);
|
||||
});
|
||||
});
|
||||
|
||||
const { selectedUser } = useSelectedUserStore();
|
||||
const { isLogListVisible } = useLogger();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isVersionSaved) {
|
||||
setToggleUI(true, true);
|
||||
}
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [isVersionSaved]);
|
||||
useEffect(() => {
|
||||
if (!isVersionSaved) {
|
||||
setToggleUI(true, true);
|
||||
}
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [isVersionSaved]);
|
||||
|
||||
useEffect(() => {
|
||||
setAssets([]);
|
||||
setWallItems([]);
|
||||
setZones([]);
|
||||
setProducts([]);
|
||||
setActiveModule("builder");
|
||||
if (email) {
|
||||
const token = localStorage.getItem("token");
|
||||
if (token) {
|
||||
useSocketStore.getState().initializeSocket(email, organization, token);
|
||||
}
|
||||
if (organization && userName) {
|
||||
setOrganization(organization);
|
||||
setUserName(userName);
|
||||
}
|
||||
echo.success("Log in successful");
|
||||
} else {
|
||||
navigate("/");
|
||||
}
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
useEffect(() => {
|
||||
setAssets([]);
|
||||
setWallItems([]);
|
||||
setZones([]);
|
||||
setProducts([]);
|
||||
setActiveModule("builder");
|
||||
if (email) {
|
||||
const token = localStorage.getItem("token");
|
||||
if (token) {
|
||||
useSocketStore.getState().initializeSocket(email, organization, token);
|
||||
}
|
||||
if (organization && userName) {
|
||||
setOrganization(organization);
|
||||
setUserName(userName);
|
||||
}
|
||||
echo.success("Log in successful");
|
||||
} else {
|
||||
navigate("/");
|
||||
}
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="project-main">
|
||||
<ComparisonSceneProvider />
|
||||
<MainSceneProvider />
|
||||
{selectedUser && <FollowPerson />}
|
||||
{isLogListVisible && (
|
||||
<RenderOverlay>
|
||||
<LogList />
|
||||
</RenderOverlay>
|
||||
)}
|
||||
{activeModule !== "market" && !selectedUser && <Footer />}
|
||||
<VersionSaved />
|
||||
</div>
|
||||
);
|
||||
return (
|
||||
<div className="project-main">
|
||||
<ComparisonSceneProvider />
|
||||
<MainSceneProvider />
|
||||
{selectedUser && <FollowPerson />}
|
||||
{isLogListVisible && (
|
||||
<RenderOverlay>
|
||||
<LogList />
|
||||
</RenderOverlay>
|
||||
)}
|
||||
{activeModule !== "market" && !selectedUser && <Footer />}
|
||||
<VersionSaved />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Project;
|
||||
|
|
|
|||
Loading…
Reference in New Issue