From e0736b26b90560034b9d327060399ba6516e6f91 Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Tue, 10 Jun 2025 11:54:57 +0530 Subject: [PATCH 1/3] enhance loading state management and streamline throughput data handling --- app/src/components/ui/analysis/ROISummary.tsx | 5 +- .../ui/analysis/ThroughputSummary.tsx | 15 +-- .../analysis/throughPut/throughPutData.tsx | 97 ++++++++++++++----- 3 files changed, 82 insertions(+), 35 deletions(-) diff --git a/app/src/components/ui/analysis/ROISummary.tsx b/app/src/components/ui/analysis/ROISummary.tsx index a03b15c..0de3c4a 100644 --- a/app/src/components/ui/analysis/ROISummary.tsx +++ b/app/src/components/ui/analysis/ROISummary.tsx @@ -86,8 +86,9 @@ const ROISummary = ({ useEffect(() => { if (roiSummary.productName) { - // If productName is set, assume data is loaded - setIsLoading(false); + setTimeout(() => { + setIsLoading(false); + }, 4000) } else { // If productName is empty, assume still loading setIsLoading(true); diff --git a/app/src/components/ui/analysis/ThroughputSummary.tsx b/app/src/components/ui/analysis/ThroughputSummary.tsx index a01ac61..6660e90 100644 --- a/app/src/components/ui/analysis/ThroughputSummary.tsx +++ b/app/src/components/ui/analysis/ThroughputSummary.tsx @@ -11,9 +11,6 @@ const ProductionCapacity = ({ throughputValue = 128, timeRange = { startTime: "08:00 AM", endTime: "09:00 AM" }, }) => { - - - const { machineActiveTime } = useMachineUptime(); const { materialCycleTime } = useMaterialCycle(); const { throughputData } = useThroughPutData() @@ -30,14 +27,10 @@ const ProductionCapacity = ({ const [isLoading, setIsLoading] = useState(false); useEffect(() => { - console.log('typeof throughputData:', typeof throughputData); - console.log('throughputData > 0: ', throughputData > 0); if (throughputData > 0) { - // console.log('machineActiveTime: ', machineActiveTime); - // console.log('materialCycleTime: ', materialCycleTime); - // console.log('throughputData: ', throughputData); - // console.log('productionCapacityData: ', productionCapacityData); - setIsLoading(false); + setTimeout(() => { + setIsLoading(false); + }, 3000) } else { setIsLoading(true); } @@ -60,7 +53,7 @@ const ProductionCapacity = ({ - {isLoading ? ( + {!isLoading ? ( <>
diff --git a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx index aa7fc19..6efc814 100644 --- a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx +++ b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx @@ -16,7 +16,7 @@ export default function ThroughPutData() { const { machines } = machineStore(); const { conveyors } = conveyorStore(); const { storageUnits } = storageUnitStore(); - const { materialHistory } = materialStore(); + const { materialHistory, materials } = materialStore(); const { machineCount, setMachineCount } = useMachineCount(); const { machineActiveTime, setMachineActiveTime } = useMachineUptime(); const { materialCycleTime, setMaterialCycleTime } = useMaterialCycle(); @@ -109,39 +109,92 @@ export default function ThroughPutData() { // if (materialCycleTime <= 0) return }, [products, selectedProduct, getProductById, setMachineCount, materialCycleTime, armBots, vehicles, machines]); - // Setting material cycle time useEffect(() => { - materialHistory.forEach((material) => { - const start = material.material.startTime ?? 0; - const end = material.material.endTime ?? 0; - if (start === 0 || end === 0) return; - const totalCycleTime = (end - start) / 1000; // Convert milliseconds to seconds - setMaterialCycleTime(Number(totalCycleTime.toFixed(2))); // Set the material cycle time in the store - }); - }, [materialHistory]); + async function getMachineActive() { + const productData = getProductById(selectedProduct.productUuid); + let anyArmActive; + let anyVehicleActive; + let anyMachineActive; + if (productData) { + const productSequenceData = await determineExecutionMachineSequences([productData]); + if (productSequenceData?.length > 0) { + productSequenceData.forEach(sequence => { + sequence.forEach(item => { + if (item.type === "roboticArm") { + armBots + .filter(arm => arm.modelUuid === item.modelUuid) + .forEach(arm => { + if (arm.isActive) { + anyArmActive = true; + } else { + anyArmActive = false; + } + }); + } + if (item.type === "vehicle") { + vehicles + .filter(vehicle => vehicle.modelUuid === item.modelUuid) + .forEach(vehicle => { + if (vehicle.isActive) { + anyVehicleActive = true; + } else { + anyVehicleActive = false; + } + }); + } + if (item.type === "machine") { + machines + .filter(machine => machine.modelUuid === item.modelUuid) + .forEach(machine => { + if (machine.isActive) { + anyMachineActive = true; + } else { + anyMachineActive = false; + } + }); + } + }); + }); + } + } + const allInactive = !anyArmActive && !anyVehicleActive && !anyMachineActive; + if (allInactive && materials.length === 0 && materialHistory.length > 0) { + console.log("inside allInactive condition"); + let totalCycleTimeSum = 0; + let cycleCount = 0; + + materialHistory.forEach((material) => { + const start = material.material.startTime ?? 0; + const end = material.material.endTime ?? 0; + if (start === 0 || end === 0) return; + + const totalCycleTime = (end - start) / 1000; // Convert milliseconds to seconds + totalCycleTimeSum += totalCycleTime; + cycleCount++; + }); + + if (cycleCount > 0) { + const averageCycleTime = totalCycleTimeSum / cycleCount; + setMaterialCycleTime(Number(averageCycleTime.toFixed(2))); + } + } + } + + getMachineActive(); + }, [armBots, materials, materialHistory, machines, vehicles, selectedProduct]) useEffect(() => { if (machineActiveTime > 0 && materialCycleTime > 0 && machineCount > 0) { const utilization = machineActiveTime / 3600; // Active time per hour const unitsPerMachinePerHour = 3600 / materialCycleTime; const throughput = unitsPerMachinePerHour * machineCount * utilization; - - setThroughputData(throughput.toFixed(2)); // Set throughput to state/store - - // console.log('---Throughput Results---'); - // console.log('Machine Active Time (s):', machineActiveTime); - // console.log('Material Cycle Time (s):', materialCycleTime); - // console.log('Machine Count:', machineCount); - // console.log('Utilization:', utilization); - // console.log('Throughput (units/hr):', throughput); + setThroughputData(Number(throughput.toFixed(2))); // Keep as number + // console.log('throughput ', Number(throughput.toFixed(2))); } }, [machineActiveTime, materialCycleTime, machineCount]); - - - return ( <> From 365d096d8e72ad8dcdba46114856478c20131e16 Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Tue, 10 Jun 2025 13:41:50 +0530 Subject: [PATCH 2/3] Update response message checks and enhance loading state management across components --- .../properties/ZoneProperties.tsx | 10 +++---- .../ui/analysis/ProductionCapacity.tsx | 5 +++- app/src/components/ui/analysis/ROISummary.tsx | 4 +-- .../ui/analysis/ThroughputSummary.tsx | 7 ++--- app/src/components/ui/list/List.tsx | 6 ++-- .../analysis/throughPut/throughPutData.tsx | 28 +++++++++++-------- .../instances/animator/vehicleAnimator.tsx | 2 +- app/src/pages/UserAuth.tsx | 6 ++-- 8 files changed, 37 insertions(+), 31 deletions(-) diff --git a/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx b/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx index 2cad712..b12a45f 100644 --- a/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx @@ -35,9 +35,9 @@ const ZoneProperties: React.FC = () => { viewPortCenter: zoneTarget, }; - let response = await zoneCameraUpdate(zonesdata, organization,projectId); + let response = await zoneCameraUpdate(zonesdata, organization, projectId); console.log('response: ', response); - if (response.message === "updated successfully") { + if (response.message === "zone updated") { setEdit(false); } else { // console.log(response); @@ -59,10 +59,10 @@ const ZoneProperties: React.FC = () => { zoneName: newName, }; // Call your API to update the zone - let response = await zoneCameraUpdate(zonesdata, organization,projectId); + let response = await zoneCameraUpdate(zonesdata, organization, projectId); console.log('response: ', response); - // console.log("response: ", response); - if (response.message === "updated successfully") { + if (response.message === "zone updated") { + setSelectedZone((prev) => ({ ...prev, zoneName: newName })); setZones((prevZones: any[]) => prevZones.map((zone) => zone.zoneUuid === selectedZone.zoneUuid diff --git a/app/src/components/ui/analysis/ProductionCapacity.tsx b/app/src/components/ui/analysis/ProductionCapacity.tsx index 7c2e883..e29a09a 100644 --- a/app/src/components/ui/analysis/ProductionCapacity.tsx +++ b/app/src/components/ui/analysis/ProductionCapacity.tsx @@ -93,7 +93,10 @@ const ThroughputSummary: React.FC = () => { useEffect(() => { // console.log('productionCapacityData > 0: ', productionCapacityData > 0); if (productionCapacityData > 0) { - setIsLoading(false); + setTimeout(() => { + + setIsLoading(false); + }, 3000) console.log("productionCapacityData: ", productionCapacityData); } else { setIsLoading(true); diff --git a/app/src/components/ui/analysis/ROISummary.tsx b/app/src/components/ui/analysis/ROISummary.tsx index 0de3c4a..56ac5dd 100644 --- a/app/src/components/ui/analysis/ROISummary.tsx +++ b/app/src/components/ui/analysis/ROISummary.tsx @@ -80,7 +80,7 @@ const ROISummary = ({ const year = now.getFullYear(); return `${day} ${month}, ${year}`; } - const [isLoading, setIsLoading] = useState(false); + const [isLoading, setIsLoading] = useState(true); const { roiSummary } = useROISummaryData(); @@ -88,7 +88,7 @@ const ROISummary = ({ if (roiSummary.productName) { setTimeout(() => { setIsLoading(false); - }, 4000) + }, 4500) } else { // If productName is empty, assume still loading setIsLoading(true); diff --git a/app/src/components/ui/analysis/ThroughputSummary.tsx b/app/src/components/ui/analysis/ThroughputSummary.tsx index 6660e90..fd3fb60 100644 --- a/app/src/components/ui/analysis/ThroughputSummary.tsx +++ b/app/src/components/ui/analysis/ThroughputSummary.tsx @@ -24,17 +24,14 @@ const ProductionCapacity = ({ const partialFillPercent = ((progressPercent / 100) * totalBars - barsToFill) * 100; - const [isLoading, setIsLoading] = useState(false); + const [isLoading, setIsLoading] = useState(true); useEffect(() => { if (throughputData > 0) { - setTimeout(() => { - setIsLoading(false); - }, 3000) + setIsLoading(false); } else { setIsLoading(true); } - }, [throughputData]) return ( diff --git a/app/src/components/ui/list/List.tsx b/app/src/components/ui/list/List.tsx index 8136a18..f85acfa 100644 --- a/app/src/components/ui/list/List.tsx +++ b/app/src/components/ui/list/List.tsx @@ -119,17 +119,15 @@ const List: React.FC = ({ items = [], remove }) => { alert("Zone name already exists. Please choose a different name."); return; // DO NOT update state } - const zonesdata = { zoneUuid: selectedZone.zoneUuid, zoneName: newName, }; - + console.log('zonesdata: ', zonesdata); const response = await zoneCameraUpdate(zonesdata, organization,projectId); console.log('response: ', response); - if (response.message === "updated successfully") { + if (response.message === "zone updated") { setSelectedZone((prev) => ({ ...prev, zoneName: newName })); - setZones((prevZones: any[]) => prevZones.map((zone) => zone.zoneUuid === selectedZone.zoneUuid diff --git a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx index 6efc814..5a03141 100644 --- a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx +++ b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx @@ -49,16 +49,15 @@ export default function ThroughPutData() { if (item.type === "roboticArm") { armBots.filter(arm => arm.modelUuid === item.modelUuid) .forEach(arm => { - if (arm.activeTime >= 0) { + if (arm.activeTime > 0) { process.push({ modelid: arm.modelUuid, modelName: arm.modelName, activeTime: arm?.activeTime }) totalActiveTime += arm.activeTime; - } }); } else if (item.type === "vehicle") { vehicles.filter(vehicle => vehicle.modelUuid === item.modelUuid) .forEach(vehicle => { - if (vehicle.activeTime >= 0) { + if (vehicle.activeTime > 0) { process.push({ modelid: vehicle.modelUuid, modelName: vehicle.modelName, activeTime: vehicle?.activeTime }) totalActiveTime += vehicle.activeTime; @@ -67,7 +66,7 @@ export default function ThroughPutData() { } else if (item.type === "machine") { machines.filter(machine => machine.modelUuid === item.modelUuid) .forEach(machine => { - if (machine.activeTime >= 0) { + if (machine.activeTime > 0) { process.push({ modelid: machine.modelUuid, modelName: machine.modelName, activeTime: machine?.activeTime }) totalActiveTime += machine.activeTime; } @@ -75,16 +74,16 @@ export default function ThroughPutData() { } else if (item.type === "transfer") { conveyors.filter(conveyor => conveyor.modelUuid === item.modelUuid) .forEach(conveyor => { - if (conveyor.activeTime >= 0) { - totalActiveTime += conveyor.activeTime; + if (conveyor.activeTime > 0) { + // totalActiveTime += conveyor.activeTime; } }); } else if (item.type === "storageUnit") { storageUnits.filter(storage => storage.modelUuid === item.modelUuid) .forEach(storage => { - if (storage.activeTime >= 0) { - totalActiveTime += storage.activeTime; - + if (storage.activeTime > 0) { + // totalActiveTime += storage.activeTime; +// } }); } @@ -93,6 +92,7 @@ export default function ThroughPutData() { totalItems += sequence.length; }); + console.log(totalActiveTime); setMachineCount(totalItems); setMachineActiveTime(totalActiveTime); let arr = process.map((item: any) => ({ @@ -181,12 +181,18 @@ export default function ThroughPutData() { } } } - - getMachineActive(); + if (isPlaying) { + setTimeout(() => { + getMachineActive(); + }, 500) + } }, [armBots, materials, materialHistory, machines, vehicles, selectedProduct]) useEffect(() => { if (machineActiveTime > 0 && materialCycleTime > 0 && machineCount > 0) { + console.log('machineActiveTime: ', machineActiveTime); + console.log('materialCycleTime: ', materialCycleTime); + console.log('machineCount: ', machineCount); const utilization = machineActiveTime / 3600; // Active time per hour const unitsPerMachinePerHour = 3600 / materialCycleTime; const throughput = unitsPerMachinePerHour * machineCount * utilization; diff --git a/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx b/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx index 4c76e71..9d45fd8 100644 --- a/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx +++ b/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx @@ -32,7 +32,7 @@ function VehicleAnimator({ path, handleCallBack, currentPhase, agvUuid, agvDetai useEffect(() => { if (currentPhase === 'stationed-pickup' && path.length > 0) { - console.log('path: ', path); + // console.log('path: ', path); setCurrentPath(path); setObjectRotation(agvDetail.point.action?.pickUpPoint?.rotation) } else if (currentPhase === 'pickup-drop' && path.length > 0) { diff --git a/app/src/pages/UserAuth.tsx b/app/src/pages/UserAuth.tsx index fb8de9e..dd6757f 100644 --- a/app/src/pages/UserAuth.tsx +++ b/app/src/pages/UserAuth.tsx @@ -38,13 +38,12 @@ const UserAuth: React.FC = () => { const { userId, organization } = getUserData(); - - const handleLogin = async (e: FormEvent) => { e.preventDefault(); const organization = email.split("@")[1].split(".")[0]; try { const res = await signInApi(email, password, organization, fingerprint); + console.log('res: ', res); if (res.message.message === "login successfull") { setError(""); setOrganization(organization); @@ -57,7 +56,10 @@ 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 (Object.values(projects.RecentlyViewed).length > 0) { const firstId = (Object.values(projects?.RecentlyViewed || {})[0] as any)?._id; From a316413e231fcbb85236188cb13592a354187d75 Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Tue, 10 Jun 2025 15:03:57 +0530 Subject: [PATCH 3/3] material cycle time calculated --- .../components/ui/analysis/ProductionCapacity.tsx | 4 ++-- .../analysis/throughPut/throughPutData.tsx | 12 ++++++------ 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/app/src/components/ui/analysis/ProductionCapacity.tsx b/app/src/components/ui/analysis/ProductionCapacity.tsx index e29a09a..5e2fc73 100644 --- a/app/src/components/ui/analysis/ProductionCapacity.tsx +++ b/app/src/components/ui/analysis/ProductionCapacity.tsx @@ -91,13 +91,13 @@ const ThroughputSummary: React.FC = () => { const [isLoading, setIsLoading] = useState(true); useEffect(() => { - // console.log('productionCapacityData > 0: ', productionCapacityData > 0); + // if (productionCapacityData > 0) { setTimeout(() => { setIsLoading(false); }, 3000) - console.log("productionCapacityData: ", productionCapacityData); + } else { setIsLoading(true); } diff --git a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx index 5a03141..bb548ba 100644 --- a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx +++ b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx @@ -92,7 +92,7 @@ export default function ThroughPutData() { totalItems += sequence.length; }); - console.log(totalActiveTime); + setMachineCount(totalItems); setMachineActiveTime(totalActiveTime); let arr = process.map((item: any) => ({ @@ -161,7 +161,7 @@ export default function ThroughPutData() { const allInactive = !anyArmActive && !anyVehicleActive && !anyMachineActive; if (allInactive && materials.length === 0 && materialHistory.length > 0) { - console.log("inside allInactive condition"); + let totalCycleTimeSum = 0; let cycleCount = 0; @@ -190,14 +190,14 @@ export default function ThroughPutData() { useEffect(() => { if (machineActiveTime > 0 && materialCycleTime > 0 && machineCount > 0) { - console.log('machineActiveTime: ', machineActiveTime); - console.log('materialCycleTime: ', materialCycleTime); - console.log('machineCount: ', machineCount); + + + const utilization = machineActiveTime / 3600; // Active time per hour const unitsPerMachinePerHour = 3600 / materialCycleTime; const throughput = unitsPerMachinePerHour * machineCount * utilization; setThroughputData(Number(throughput.toFixed(2))); // Keep as number - // console.log('throughput ', Number(throughput.toFixed(2))); + // } }, [machineActiveTime, materialCycleTime, machineCount]);