diff --git a/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx
index 7047713..da9659c 100644
--- a/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx
+++ b/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx
@@ -10,6 +10,7 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import useChartStore from "../../../../../store/visualization/useChartStore";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../../functions/getUserData";
interface ChartComponentProps {
id: string;
@@ -47,11 +48,10 @@ const BarGraphComponent = ({
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { projectId } = useParams();
+ const { userName, userId, organization, email } = getUserData();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
const defaultData = {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [
diff --git a/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx
index b322d8f..f0d73da 100644
--- a/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx
+++ b/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx
@@ -8,6 +8,7 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import useChartStore from "../../../../../store/visualization/useChartStore";
import { useParams } from "react-router-dom";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
+import { getUserData } from "../../../../../functions/getUserData";
interface ChartComponentProps {
id: string;
@@ -35,14 +36,13 @@ const DoughnutGraphComponent = ({
labels: [],
datasets: [],
});
- const { selectedChartId } = useWidgetStore();
- const { selectedZone } = useSelectedZoneStore();
- const { projectId } = useParams();
+ const { selectedChartId } = useWidgetStore();
+ const { selectedZone } = useSelectedZoneStore();
+ const { projectId } = useParams();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0]
+ const { userName, userId, organization, email } = getUserData();
const defaultData = {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [
@@ -57,8 +57,8 @@ const DoughnutGraphComponent = ({
};
useEffect(() => {
-
- },[])
+
+ }, [])
// Memoize Theme Colors
const buttonActionColor = useMemo(() => themeColor[0] || "#5c87df", [themeColor]);
@@ -86,34 +86,34 @@ const DoughnutGraphComponent = ({
[fontFamily, fontSizeValue, fontWeightValue]
);
- // Memoize Chart Options
- const options = useMemo(
- () => ({
- responsive: true,
- maintainAspectRatio: false,
- plugins: {
- title: {
- display: true,
- text: name,
- font: chartFontStyle,
- },
- legend: {
- display: false,
- },
+ // Memoize Chart Options
+ const options = useMemo(
+ () => ({
+ responsive: true,
+ maintainAspectRatio: false,
+ plugins: {
+ title: {
+ display: true,
+ text: name,
+ font: chartFontStyle,
},
- scales: {
- // x: {
- // ticks: {
- // display: true, // This hides the x-axis labels
- // },
- // },
+ legend: {
+ display: false,
},
- }),
- [title, chartFontStyle, name]
- );
+ },
+ scales: {
+ // x: {
+ // ticks: {
+ // display: true, // This hides the x-axis labels
+ // },
+ // },
+ },
+ }),
+ [title, chartFontStyle, name]
+ );
- // useEffect(() => {console.log(measurements);
- // },[measurements])
+ // useEffect(() => {console.log(measurements);
+ // },[measurements])
useEffect(() => {
if (!iotApiUrl || !measurements || Object.keys(measurements).length === 0) return;
@@ -127,7 +127,7 @@ const DoughnutGraphComponent = ({
};
- const startStream = () => {
+ const startStream = () => {
socket.emit("lineInput", inputData);
};
@@ -160,8 +160,8 @@ const DoughnutGraphComponent = ({
};
}, [measurements, duration, iotApiUrl]);
- const fetchSavedInputes = async() => {
-
+ const fetchSavedInputes = async () => {
+
if (id !== "") {
try {
const response = await axios.get(
@@ -198,7 +198,7 @@ const DoughnutGraphComponent = ({
fetchSavedInputes();
}
}
- ,[chartMeasurements, chartDuration, widgetName])
+ , [chartMeasurements, chartDuration, widgetName])
return
0 ? chartData : defaultData} options={options} />;
};
diff --git a/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx
index fe1a5de..c96037a 100644
--- a/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx
+++ b/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx
@@ -8,6 +8,7 @@ import useChartStore from "../../../../../store/visualization/useChartStore";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { useParams } from "react-router-dom";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
+import { getUserData } from "../../../../../functions/getUserData";
interface ChartComponentProps {
id: string;
@@ -48,8 +49,7 @@ const LineGraphComponent = ({
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
const defaultData = {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [
@@ -63,7 +63,7 @@ const LineGraphComponent = ({
],
};
- useEffect(() => {}, []);
+ useEffect(() => { }, []);
// Memoize Theme Colors
const buttonActionColor = useMemo(
diff --git a/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx
index 1062b00..9242cff 100644
--- a/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx
+++ b/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx
@@ -8,6 +8,7 @@ import useChartStore from "../../../../../store/visualization/useChartStore";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../../functions/getUserData";
interface ChartComponentProps {
id: string;
@@ -47,8 +48,7 @@ const PieChartComponent = ({
const { projectId } = useParams();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
const defaultData = {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [
@@ -62,7 +62,7 @@ const PieChartComponent = ({
],
};
- useEffect(() => {}, []);
+ useEffect(() => { }, []);
// Memoize Theme Colors
const buttonActionColor = useMemo(
diff --git a/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx
index f581dc5..7d758f1 100644
--- a/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx
+++ b/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx
@@ -8,6 +8,7 @@ import useChartStore from "../../../../../store/visualization/useChartStore";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../../functions/getUserData";
interface ChartComponentProps {
id: string;
@@ -47,8 +48,7 @@ const PolarAreaGraphComponent = ({
const { projectId } = useParams();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
const defaultData = {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [
@@ -62,7 +62,7 @@ const PolarAreaGraphComponent = ({
],
};
- useEffect(() => {}, []);
+ useEffect(() => { }, []);
// Memoize Theme Colors
const buttonActionColor = useMemo(
diff --git a/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx b/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx
index 5a908d9..df81941 100644
--- a/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx
+++ b/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx
@@ -8,6 +8,7 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { StockIncreseIcon } from "../../../../../components/icons/RealTimeVisulationIcons";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../../functions/getUserData";
const ProgressCard1 = ({ id, title }: { id: string; title: string }) => {
const {
@@ -24,8 +25,7 @@ const ProgressCard1 = ({ id, title }: { id: string; title: string }) => {
const { projectId } = useParams();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
useEffect(() => {
const socket = io(`http://${iotApiUrl}`);
diff --git a/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx b/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx
index 15e61a2..e14559f 100644
--- a/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx
+++ b/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx
@@ -8,6 +8,7 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { StockIncreseIcon } from "../../../../../components/icons/RealTimeVisulationIcons";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../../functions/getUserData";
const ProgressCard2 = ({ id, title }: { id: string; title: string }) => {
const {
@@ -25,8 +26,7 @@ const ProgressCard2 = ({ id, title }: { id: string; title: string }) => {
const { projectId } = useParams();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
useEffect(() => {
if (!iotApiUrl || !measurements || Object.keys(measurements).length === 0)
diff --git a/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx b/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx
index 56ec30c..44cb391 100644
--- a/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx
+++ b/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx
@@ -27,6 +27,7 @@ import Throughput from "./cards/Throughput";
import { useWidgetStore } from "../../../../store/useWidgetStore";
import useChartStore from "../../../../store/visualization/useChartStore";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../functions/getUserData";
type WidgetData = {
id: string;
@@ -78,13 +79,11 @@ export default function Dropped3dWidgets() {
const activeZoneWidgets = zoneWidgetData[selectedZone.zoneUuid] || [];
const { projectId } = useParams();
-
+ const { userId, organization, email } = getUserData();
useEffect(() => {
if (activeModule !== "visualization") return;
if (!selectedZone.zoneUuid) return;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
async function get3dWidgetData() {
const result = await get3dWidgetZoneData(
@@ -208,9 +207,6 @@ export default function Dropped3dWidgets() {
hasEntered.current = false;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
- const userId = localStorage.getItem("userId");
const newWidget = createdWidgetRef.current;
if (!newWidget || !widgetSelect.startsWith("ui")) return;
@@ -283,9 +279,7 @@ export default function Dropped3dWidgets() {
useEffect(() => {
if (!rightClickSelected) return;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
- const userId = localStorage.getItem("userId");
+
if (rightSelect === "Duplicate") {
async function duplicateWidget() {
@@ -310,7 +304,7 @@ export default function Dropped3dWidgets() {
},
};
const adding3dWidget = {
- organization: organization,
+ organization,
widget: newWidget,
zoneUuid: selectedZone.zoneUuid,
projectId, userId
@@ -380,9 +374,6 @@ export default function Dropped3dWidgets() {
const [prevX, setPrevX] = useState(0);
useEffect(() => {
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
- const userId = localStorage.getItem("userId");
const handleMouseDown = (event: MouseEvent) => {
if (!rightClickSelected || !rightSelect) return;
const selectedzoneUuid = Object.keys(zoneWidgetData).find(
@@ -634,7 +625,7 @@ export default function Dropped3dWidgets() {
// }
// })();
let updatingPosition = {
- organization: organization,
+ organization,
zoneUuid: selectedzoneUuid,
id: rightClickSelected,
position: lastPosition,
@@ -659,7 +650,7 @@ export default function Dropped3dWidgets() {
// }
// })();
let updatingRotation = {
- organization: organization,
+ organization,
zoneUuid: selectedzoneUuid,
id: rightClickSelected,
rotation: lastRotation,
diff --git a/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx b/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx
index a0df039..c4d55e0 100644
--- a/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx
+++ b/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx
@@ -16,6 +16,7 @@ import axios from "axios";
import io from "socket.io-client";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import useChartStore from "../../../../../store/visualization/useChartStore";
+import { getUserData } from "../../../../../functions/getUserData";
// Register ChartJS components
ChartJS.register(
@@ -67,8 +68,7 @@ const ProductionCapacity: React.FC = ({
datasets: [],
});
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
// Chart data for a week
const defaultChartData = {
labels: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], // Days of the week
@@ -197,7 +197,7 @@ const ProductionCapacity: React.FC = ({
}
}, [chartMeasurements, chartDuration, widgetName]);
- useEffect(() => {}, [rotation]);
+ useEffect(() => { }, [rotation]);
return (
<>
diff --git a/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx b/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx
index 65029b2..0ce8a0c 100644
--- a/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx
+++ b/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx
@@ -17,6 +17,7 @@ import io from "socket.io-client";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import useChartStore from "../../../../../store/visualization/useChartStore";
import { WavyIcon } from "../../../../../components/icons/3dChartIcons";
+import { getUserData } from "../../../../../functions/getUserData";
// Register Chart.js components
ChartJS.register(
@@ -77,8 +78,7 @@ const ReturnOfInvestment: React.FC = ({
datasets: [],
});
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
// Improved sample data for the smooth curve graph (single day)
const graphData: ChartData<"line"> = {
labels: [
@@ -243,16 +243,15 @@ const ReturnOfInvestment: React.FC = ({
scale={[0.5, 0.5, 0.5]}
transform
zIndexRange={[1, 0]}
- prepend
+ prepend
distanceFactor={20}
-
-
+
+
>
setSelectedChartId({ id: id, type: type })}
onContextMenu={onContextMenu}
>
diff --git a/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx b/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx
index b591a21..c945583 100644
--- a/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx
+++ b/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx
@@ -5,6 +5,7 @@ import axios from "axios";
import io from "socket.io-client";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import useChartStore from "../../../../../store/visualization/useChartStore";
+import { getUserData } from "../../../../../functions/getUserData";
// import image from "../../../../assets/image/temp/image.png";
interface StateWorkingProps {
@@ -38,8 +39,7 @@ const StateWorking: React.FC
= ({
const [name, setName] = useState("Widget");
const [datas, setDatas] = useState({});
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
// const datas = [
// { key: "Oil Tank:", value: "24/341" },
// { key: "Oil Refin:", value: 36.023 },
@@ -122,18 +122,17 @@ const StateWorking: React.FC = ({
transform
zIndexRange={[1, 0]}
// sprite={true}
- prepend
+ prepend
distanceFactor={20}
- // style={{
- // transform: transformStyle.transform,
- // transformStyle: "preserve-3d",
- // transition: "transform 0.1s ease-out",
- // }}
+ // style={{
+ // transform: transformStyle.transform,
+ // transformStyle: "preserve-3d",
+ // transition: "transform 0.1s ease-out",
+ // }}
>
setSelectedChartId({ id: id, type: type })}
onContextMenu={onContextMenu}
>
diff --git a/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx b/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx
index ef74f14..68138c3 100644
--- a/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx
+++ b/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx
@@ -19,6 +19,7 @@ import io from "socket.io-client";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import useChartStore from "../../../../../store/visualization/useChartStore";
import { ThroughputIcon } from "../../../../../components/icons/3dChartIcons";
+import { getUserData } from "../../../../../functions/getUserData";
// Register Chart.js components
ChartJS.register(
@@ -80,8 +81,7 @@ const Throughput: React.FC
= ({
datasets: [],
});
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
@@ -223,9 +223,9 @@ const Throughput: React.FC = ({
scale={[0.5, 0.5, 0.5]}
transform
zIndexRange={[1, 0]}
- prepend
+ prepend
distanceFactor={20}
- // sprite={true}
+ // sprite={true}
>
{
const chartWidget = useRef
(null);
const kebabRef = useRef(null);
-
+ const { userId, organization, email } = getUserData();
// Clean up animation frame on unmount
useEffect(() => {
return () => {
@@ -112,22 +113,19 @@ const DroppedObjects: React.FC = () => {
function handleDuplicate(zoneName: string, index: number) {
setOpenKebabId(null);
- duplicateObject(zoneName, index,projectId); // Call the duplicateObject method from the store
+ duplicateObject(zoneName, index, projectId); // Call the duplicateObject method from the store
setSelectedChartId(null);
}
async function handleDelete(zoneName: string, id: string) {
try {
setSelectedChartId(null);
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
- const userId = localStorage.getItem("userId");
let deleteFloatingWidget = {
floatWidgetID: id,
- organization: organization,
+ organization,
zoneUuid: zone.zoneUuid,
- userId,projectId
+ userId, projectId
};
if (visualizationSocket) {
@@ -296,8 +294,6 @@ const DroppedObjects: React.FC = () => {
try {
// Save to backend
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
const response = await addingFloatingWidgets(
zone.zoneUuid,
organization,
@@ -432,10 +428,8 @@ const DroppedObjects: React.FC = () => {
};
// Save to backend
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
let updateFloatingWidget = {
- organization: organization,
+ organization,
widget: {
...zone.objects[draggingIndex.index],
position: boundedPosition,
@@ -491,45 +485,40 @@ const DroppedObjects: React.FC = () => {
{zone?.objects?.map((obj, index) => {
const topPosition =
typeof obj?.position?.top === "number"
- ? `calc(${obj?.position?.top}px + ${
- isPlaying && selectedZone?.activeSides?.includes("top")
- ? `${heightMultiplier - 55}px`
- : "0px"
- })`
+ ? `calc(${obj?.position?.top}px + ${isPlaying && selectedZone?.activeSides?.includes("top")
+ ? `${heightMultiplier - 55}px`
+ : "0px"
+ })`
: "auto";
const leftPosition =
typeof obj?.position?.left === "number"
- ? `calc(${obj?.position?.left}px + ${
- isPlaying && selectedZone?.activeSides?.includes("left")
- ? `${widthMultiplier - 150}px`
- : "0px"
- })`
+ ? `calc(${obj?.position?.left}px + ${isPlaying && selectedZone?.activeSides?.includes("left")
+ ? `${widthMultiplier - 150}px`
+ : "0px"
+ })`
: "auto";
const rightPosition =
typeof obj?.position?.right === "number"
- ? `calc(${obj?.position?.right}px + ${
- isPlaying && selectedZone?.activeSides?.includes("right")
- ? `${widthMultiplier - 150}px`
- : "0px"
- })`
+ ? `calc(${obj?.position?.right}px + ${isPlaying && selectedZone?.activeSides?.includes("right")
+ ? `${widthMultiplier - 150}px`
+ : "0px"
+ })`
: "auto";
const bottomPosition =
typeof obj?.position?.bottom === "number"
- ? `calc(${obj?.position?.bottom}px + ${
- isPlaying && selectedZone?.activeSides?.includes("bottom")
- ? `${heightMultiplier - 55}px`
- : "0px"
- })`
+ ? `calc(${obj?.position?.bottom}px + ${isPlaying && selectedZone?.activeSides?.includes("bottom")
+ ? `${heightMultiplier - 55}px`
+ : "0px"
+ })`
: "auto";
return (
{
right: rightPosition,
bottom: bottomPosition,
pointerEvents: isPlaying ? "none" : "auto",
- minHeight: `${
- obj.className === "warehouseThroughput" && "150px !important"
- } `,
+ minHeight: `${obj.className === "warehouseThroughput" && "150px !important"
+ } `,
}}
onPointerDown={(event) => {
setSelectedChartId(obj);
diff --git a/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx b/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx
index 4115709..61ae499 100644
--- a/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx
+++ b/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx
@@ -5,14 +5,14 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import axios from "axios";
import io from "socket.io-client";
import { usePlayButtonStore } from "../../../../../store/usePlayButtonStore";
+import { getUserData } from "../../../../../functions/getUserData";
const FleetEfficiencyComponent = ({ object }: any) => {
const [progress, setProgress] = useState
(0);
const [measurements, setmeasurements] = useState({});
const [duration, setDuration] = useState("1h");
const [name, setName] = useState(object.header ? object.header : "");
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
const { header, flotingDuration, flotingMeasurements } = useChartStore();
const { selectedChartId } = useWidgetStore();
const { isPlaying } = usePlayButtonStore();
diff --git a/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx b/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx
index f3839c6..45583f8 100644
--- a/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx
+++ b/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx
@@ -10,15 +10,14 @@ import {
GlobeIcon,
WalletIcon,
} from "../../../../../components/icons/3dChartIcons";
+import { getUserData } from "../../../../../functions/getUserData";
const TotalCardComponent = ({ object }: any) => {
const [progress, setProgress] = useState(0);
const [measurements, setmeasurements] = useState({});
const [duration, setDuration] = useState("1h");
const [name, setName] = useState(object.header ? object.header : "");
-
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
const { header, flotingDuration, flotingMeasurements } = useChartStore();
const { selectedChartId } = useWidgetStore();
@@ -70,7 +69,7 @@ const TotalCardComponent = ({ object }: any) => {
} else {
echo.error("Failed to fetch saved inputs");
}
- } catch (error) {}
+ } catch (error) { }
}
};
diff --git a/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx b/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx
index fbc6eb6..82fb21e 100644
--- a/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx
+++ b/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx
@@ -4,6 +4,7 @@ import useChartStore from "../../../../../store/visualization/useChartStore";
import { useWidgetStore } from "../../../../../store/useWidgetStore";
import axios from "axios";
import io from "socket.io-client";
+import { getUserData } from "../../../../../functions/getUserData";
const WarehouseThroughputComponent = ({ object }: any) => {
const [measurements, setmeasurements] = useState({});
@@ -16,8 +17,7 @@ const WarehouseThroughputComponent = ({ object }: any) => {
labels: [],
datasets: [],
});
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
+ const { userName, userId, organization, email } = getUserData();
const { header, flotingDuration, flotingMeasurements } = useChartStore();
const { selectedChartId } = useWidgetStore();
diff --git a/app/src/modules/visualization/widgets/panel/AddButtons.tsx b/app/src/modules/visualization/widgets/panel/AddButtons.tsx
index 5a142d3..63be875 100644
--- a/app/src/modules/visualization/widgets/panel/AddButtons.tsx
+++ b/app/src/modules/visualization/widgets/panel/AddButtons.tsx
@@ -7,6 +7,7 @@ import {
import { AddIcon } from "../../../../components/icons/ExportCommonIcons";
import { useSocketStore } from "../../../../store/builder/store";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../functions/getUserData";
// Define the type for `Side`
type Side = "top" | "bottom" | "left" | "right";
@@ -70,6 +71,8 @@ const AddButtons: React.FC = ({
}) => {
const { visualizationSocket } = useSocketStore();
const { projectId } = useParams();
+ const { userId, organization, email } = getUserData();
+
// Function to toggle visibility of a panel
const toggleVisibility = (side: Side) => {
@@ -97,9 +100,6 @@ const AddButtons: React.FC = ({
// Function to toggle lock/unlock a panel
const toggleLockPanel = async (side: Side) => {
- const email = localStorage.getItem("email") ?? "";
- const organization = email?.split("@")[1]?.split(".")[0]; // Fallback value
- const userId = localStorage.getItem("userId");
//add api
const newLockedPanels = selectedZone.lockedPanels.includes(side)
? selectedZone.lockedPanels.filter((panel) => panel !== side)
@@ -111,7 +111,7 @@ const AddButtons: React.FC = ({
};
let lockedPanel = {
- organization: organization,
+ organization,
lockedPanel: newLockedPanels,
zoneUuid: selectedZone.zoneUuid,
userId, projectId
@@ -133,12 +133,10 @@ const AddButtons: React.FC = ({
)
return;
- const email = localStorage.getItem("email") ?? "";
- const organization = email?.split("@")[1]?.split(".")[0]; // Fallback value
- const userId = localStorage.getItem("userId");
+
let clearPanel = {
- organization: organization,
+ organization,
panelName: side,
zoneUuid: selectedZone.zoneUuid,
userId, projectId
@@ -169,10 +167,6 @@ const AddButtons: React.FC = ({
setTimeout(() => {
console.log("Removing after wait...");
- const email = localStorage.getItem("email") ?? "";
- const organization = email?.split("@")[1]?.split(".")[0] ?? "";
- const userId = localStorage.getItem("userId");
-
// Remove widgets for that side
const cleanedWidgets = selectedZone.widgets.filter(
(widget) => widget.panel !== side
@@ -215,10 +209,6 @@ const AddButtons: React.FC = ({
} else {
// Panel does not exist: Add it
try {
- const email = localStorage.getItem("email") ?? "";
- const organization = email?.split("@")[1]?.split(".")[0] ?? "";
- const userId = localStorage.getItem("userId");
-
const newActiveSides = selectedZone.activeSides.includes(side)
? [...selectedZone.activeSides]
: [...selectedZone.activeSides, side];
diff --git a/app/src/modules/visualization/widgets/panel/Panel.tsx b/app/src/modules/visualization/widgets/panel/Panel.tsx
index c9c62c9..27321ce 100644
--- a/app/src/modules/visualization/widgets/panel/Panel.tsx
+++ b/app/src/modules/visualization/widgets/panel/Panel.tsx
@@ -6,6 +6,7 @@ import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
import { useWidgetStore } from "../../../../store/useWidgetStore";
import { DraggableWidget } from "../2d/DraggableWidget";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../../functions/getUserData";
type Side = "top" | "bottom" | "left" | "right";
@@ -69,6 +70,8 @@ const Panel: React.FC = ({
height: 0,
});
const { projectId } = useParams();
+ const { userId, organization, email } = getUserData();
+
// Track canvas dimensions
useEffect(() => {
@@ -182,9 +185,7 @@ const Panel: React.FC = ({
// Add widget to panel
const addWidgetToPanel = async (asset: any, panel: Side) => {
- const email = localStorage.getItem("email") ?? "";
- const organization = email?.split("@")[1]?.split(".")[0];
- const userId = localStorage.getItem("userId");
+
const newWidget = {
...asset,
@@ -193,7 +194,7 @@ const Panel: React.FC = ({
};
let addWidget = {
- organization: organization,
+ organization,
zoneUuid: selectedZone.zoneUuid,
widget: newWidget,
projectId, userId
diff --git a/app/src/modules/visualization/zone/DisplayZone.tsx b/app/src/modules/visualization/zone/DisplayZone.tsx
index 9d88e65..fd91c5a 100644
--- a/app/src/modules/visualization/zone/DisplayZone.tsx
+++ b/app/src/modules/visualization/zone/DisplayZone.tsx
@@ -15,6 +15,7 @@ import {
import { InfoIcon } from "../../../components/icons/ExportCommonIcons";
import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
import { useParams } from "react-router-dom";
+import { getUserData } from "../../../functions/getUserData";
// Define the type for `Side`
type Side = "top" | "bottom" | "left" | "right";
@@ -91,7 +92,7 @@ const DisplayZone: React.FC = ({
const [showRightArrow, setShowRightArrow] = useState(false);
const { floatingWidget, setFloatingWidget } = useFloatingWidget();
const { isPlaying } = usePlayButtonStore();
-
+ const { userName, userId, organization, email } = getUserData();
const { setSelectedChartId } = useWidgetStore();
const { projectId } = useParams();
// Function to calculate overflow state
@@ -174,9 +175,7 @@ const DisplayZone: React.FC = ({
return;
}
// setSelectedChartId(null);
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
-
+
let response = await getSelect2dZoneData(zoneUuid, organization, projectId);
// console.log('response2d: ', response);
let res = await getFloatingZoneData(zoneUuid, organization, projectId);
@@ -212,9 +211,9 @@ const DisplayZone: React.FC = ({
ref={containerRef}
id="zone-container"
className={`zone-container ${selectedZone?.activeSides?.includes("bottom") &&
- !hiddenPanels[selectedZone.zoneUuid]?.includes("bottom")
- ? "bottom"
- : ""
+ !hiddenPanels[selectedZone.zoneUuid]?.includes("bottom")
+ ? "bottom"
+ : ""
} ${isPlaying ? "visualization-playing" : ""}`}
>
{/* Left Arrow */}
diff --git a/app/src/pages/Dashboard.tsx b/app/src/pages/Dashboard.tsx
index e8de9c3..9e26756 100644
--- a/app/src/pages/Dashboard.tsx
+++ b/app/src/pages/Dashboard.tsx
@@ -5,7 +5,7 @@ import {
import DashboardHome from "../components/Dashboard/DashboardHome";
import DashboardProjects from "../components/Dashboard/DashboardProjects";
import DashboardTrash from "../components/Dashboard/DashboardTrash";
-import { getUserData } from "../components/Dashboard/functions/getUserData";
+import { getUserData } from "../functions/getUserData";
import SidePannel from "../components/Dashboard/SidePannel";
import DashboardTutorial from "../components/Dashboard/DashboardTutorial";
import { useProductStore } from "../store/simulation/useProductStore";
diff --git a/app/src/pages/Project.tsx b/app/src/pages/Project.tsx
index cc984af..66de117 100644
--- a/app/src/pages/Project.tsx
+++ b/app/src/pages/Project.tsx
@@ -34,6 +34,7 @@ import { setFloorItemApi } from "../services/factoryBuilder/assest/floorAsset/se
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();
@@ -49,31 +50,22 @@ const Project: React.FC = () => {
const { setProducts } = useProductStore();
const { projectId } = useParams();
const { setProjectName } = useProjectName();
+ const { userId, email, organization, userName } = getUserData();
const generateThumbnail = async () => {
- const email = localStorage.getItem("email");
- const userId = localStorage.getItem("userId");
try {
if (!email || !userId) {
console.error("User data not found in localStorage");
return;
}
- const emailParts = email.split("@");
- if (emailParts.length < 2) {
- console.error("Invalid email format");
- return;
- }
-
- const domainParts = emailParts[1].split(".");
- const Organization = domainParts[0];
const projects = await getAllProjects(
- userId, Organization
+ userId, organization
);
const filterProject = projects?.Projects.find((val: any) => val.projectUuid === projectId || val._id
=== projectId)
const viewedProject = await viewProject(
- Organization,
+ organization,
filterProject._id,
userId,
);
@@ -106,17 +98,14 @@ const Project: React.FC = () => {
setZones([]);
setProducts([]);
setActiveModule("builder");
- const email = localStorage.getItem("email");
if (email) {
- const Organization = email.split("@")[1].split(".")[0];
const token = localStorage.getItem("token");
if (token) {
- useSocketStore.getState().initializeSocket(email, Organization, token);
+ useSocketStore.getState().initializeSocket(email, organization, token);
}
- const name = localStorage.getItem("userName");
- if (Organization && name) {
- setOrganization(Organization);
- setUserName(name);
+ if (organization && userName) {
+ setOrganization(organization);
+ setUserName(userName);
}
echo.success("Log in successful");
} else {
diff --git a/app/src/pages/UserAuth.tsx b/app/src/pages/UserAuth.tsx
index 9ecc018..13ca513 100644
--- a/app/src/pages/UserAuth.tsx
+++ b/app/src/pages/UserAuth.tsx
@@ -11,7 +11,7 @@ import { signInApi } from "../services/factoryBuilder/signInSignUp/signInApi";
import { signUpApi } from "../services/factoryBuilder/signInSignUp/signUpApi";
import FingerprintJS from "@fingerprintjs/fingerprintjs";
import { recentlyViewed } from "../services/dashboard/recentlyViewed";
-import { getUserData } from "../components/Dashboard/functions/getUserData";
+import { getUserData } from "../functions/getUserData";
const UserAuth: React.FC = () => {
const [email, setEmail] = useState("");
@@ -56,16 +56,16 @@ const UserAuth: React.FC = () => {
localStorage.setItem("refreshToken", res.message.refreshToken);
try {
- // console.log('res.message.userId: ', res.message.userId);
- // console.log('organization: ', organization);
const projects = await recentlyViewed(organization, res.message.userId);
- // console.log('projects: ', projects);
-
if (res.message.isShare) {
if (Object.values(projects.RecentlyViewed).length > 0) {
const firstId = (Object.values(projects?.RecentlyViewed || {})[0] as any)?._id;
- setLoadingProgress(1)
- navigate(`/${firstId}`)
+ if (Object.values(projects?.RecentlyViewed).filter((val: any) => val._id == firstId)) {
+ setLoadingProgress(1)
+ navigate(`/${firstId}`)
+ } else {
+ navigate("/Dashboard")
+ }
} else {
setLoadingProgress(1);
navigate("/Dashboard");
diff --git a/app/src/store/visualization/useDroppedObjectsStore.ts b/app/src/store/visualization/useDroppedObjectsStore.ts
index a11f1fd..a1fd673 100644
--- a/app/src/store/visualization/useDroppedObjectsStore.ts
+++ b/app/src/store/visualization/useDroppedObjectsStore.ts
@@ -1,6 +1,7 @@
import { create } from "zustand";
import { useSocketStore } from "../builder/store";
import useChartStore from "./useChartStore";
+import { getUserData } from "../../functions/getUserData";
type DroppedObject = {
className: string;
@@ -38,7 +39,11 @@ type DroppedObjectsState = {
}
) => void;
deleteObject: (zoneName: string, id: string) => void; // Add this line
- duplicateObject: (zoneName: string, index: number, projectId?: string) => void; // Add this line
+ duplicateObject: (
+ zoneName: string,
+ index: number,
+ projectId?: string
+ ) => void; // Add this line
};
export const useDroppedObjectsStore = create((set) => ({
@@ -47,7 +52,11 @@ export const useDroppedObjectsStore = create((set) => ({
setZone: (zoneName: string, zoneUuid: string) =>
set((state) => ({
zones: {
- [zoneName]: state.zones[zoneName] || { zoneName, zoneUuid, objects: [] }, // Keep existing zone if it exists
+ [zoneName]: state.zones[zoneName] || {
+ zoneName,
+ zoneUuid,
+ objects: [],
+ }, // Keep existing zone if it exists
},
})),
@@ -92,7 +101,11 @@ export const useDroppedObjectsStore = create((set) => ({
},
};
}),
- duplicateObject: async (zoneName: string, index: number, projectId?: string) => {
+ duplicateObject: async (
+ zoneName: string,
+ index: number,
+ projectId?: string
+ ) => {
const state = useDroppedObjectsStore.getState(); // Get the current state
const zone = state.zones[zoneName];
let socketState = useSocketStore.getState();
@@ -100,16 +113,13 @@ export const useDroppedObjectsStore = create((set) => ({
let visualizationSocket = socketState.visualizationSocket;
let iotMeasurements = iotData.flotingMeasurements;
let iotDuration = iotData.flotingDuration;
- let iotHeader = iotData.header
+ let iotHeader = iotData.header;
if (!zone) return;
const originalObject = zone.objects[index];
if (!originalObject) return;
-
- const email = localStorage.getItem("email") || "";
- const organization = email?.split("@")[1]?.split(".")[0];
- const userId = localStorage.getItem("userId");
+ const { userId, organization, email } = getUserData();
// Create a shallow copy of the object with a unique ID and slightly adjusted position
const duplicatedObject: DroppedObject = {
@@ -135,12 +145,12 @@ export const useDroppedObjectsStore = create((set) => ({
console.log("duplicated object", duplicatedObject);
let duplicateFloatingWidget = {
- organization: organization,
+ organization,
widget: duplicatedObject,
zoneUuid: zone.zoneUuid,
index: index,
- projectId, userId
-
+ projectId,
+ userId,
};
if (visualizationSocket) {