Dwinzo-Beta
/
Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor MachineInstances component: enhance rendering logic by adding MachineContentUi and improving structure; create MachineContentUi component for better separation of concerns.

This commit is contained in:
Vishnu 2025-05-09 13:48:39 +05:30
parent dd5f7faf34
commit ffb65b3369
3 changed files with 52 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/src/modules/simulation/machine/instances/machineInstances.tsx
View File

@ -1,17 +1,20 @@
import React from 'react' import React from "react";
import MachineInstance from './machineInstance/machineInstance' import MachineInstance from "./machineInstance/machineInstance";
import { useMachineStore } from '../../../../store/simulation/useMachineStore'; import { useMachineStore } from "../../../../store/simulation/useMachineStore";
import MachineContentUi from "../../ui3d/MachineContentUi";
function MachineInstances() { function MachineInstances() {
const { machines } = useMachineStore(); const { machines } = useMachineStore();
return ( return (
<> <>
{machines.map((machine: MachineStatus) => ( {machines.map((machine: MachineStatus) => (
<MachineInstance key={machine.modelUuid} machineDetail={machine} /> <React.Fragment key={machine.modelUuid}>
<MachineInstance machineDetail={machine} />
<MachineContentUi machine={machine} />
</React.Fragment>
))} ))}
</> </>
) );
} }
export default MachineInstances export default MachineInstances;

34
app/src/modules/simulation/ui3d/MachineContentUi.tsx Normal file
View File

@ -0,0 +1,34 @@
import { Html } from "@react-three/drei";
import React from "react";
import AssetDetailsCard from "../../../components/ui/simulation/AssetDetailsCard";
import { Vector3 } from "three";
type MachineContentUiProps = {
machine: MachineStatus;
};
const MachineContentUi: React.FC<MachineContentUiProps> = ({ machine }) => {
return (
<Html
// data
position={
new Vector3(
machine.position[0],
machine.point.position[1],
machine.position[2]
)
}
// class none
// other
zIndexRange={[1, 0]}
prepend
sprite
center
distanceFactor={20}
>
<AssetDetailsCard name={machine.modelName} status={machine.state} />
</Html>
);
};
export default MachineContentUi;

4
app/src/modules/simulation/ui3d/RoboticArmContentUi.tsx
View File

@ -3,11 +3,11 @@ import React from "react";
import AssetDetailsCard from "../../../components/ui/simulation/AssetDetailsCard"; import AssetDetailsCard from "../../../components/ui/simulation/AssetDetailsCard";
import { Vector3 } from "three"; import { Vector3 } from "three";
type VehicleContentUiProps = { type RoboticArmContentUiProps = {
roboticArm: ArmBotStatus; roboticArm: ArmBotStatus;
}; };
const RoboticArmContentUi: React.FC<VehicleContentUiProps> = ({ roboticArm }) => { const RoboticArmContentUi: React.FC<RoboticArmContentUiProps> = ({ roboticArm }) => {
return ( return (
<Html <Html
// data // data