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

feat: Integrate versioning support across visualization components

Browse Source 
- Added versionId parameter to API calls in Progress1Input and Progress2Input components to fetch widget data based on selected version.
- Updated Tools component to include versionId when emitting visualization socket events.
- Enhanced Dropped3dWidgets to handle versionId for 3D widget data retrieval and manipulation.
- Modified various chart components (BarGraph, DoughnutGraph, LineGraph, etc.) to include versionId in API requests for fetching widget data.
- Updated template handling functions to support versionId when saving and retrieving templates.
- Refactored get3dWidgetZoneData, getFloatingZoneData, getSelect2dZoneData, and getTemplateData services to accept and utilize versionId in their requests.
- Adjusted useDroppedObjectsStore to accommodate versionId in duplicateObject functionality.
- Ensured consistent versioning integration across all relevant components and services for improved data management.
This commit is contained in:
Jerald-Golden-B
2025-06-21 16:09:57 +05:30
parent ac5831f94e
commit f52ac74865
29 changed files with 210 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/src/components/layout/scenes/MainScene.tsx
View File

@@ -155,7 +155,8 @@ function MainScene() {
selectedZone,
setFloatingWidget,
event,
projectId
projectId,
versionId: selectedVersion?.versionId || '',
})
}
onDragOver={(event) => event.preventDefault()}

6
app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx
View File

@@ -11,6 +11,7 @@ import { useParams } from "react-router-dom";
import { useSocketStore } from "../../../../../store/builder/store";
import { getUserData } from "../../../../../functions/getUserData";
import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets";
import { useVersionContext } from "../../../../../modules/builder/version/versionContext";
type Props = {};
@@ -29,7 +30,8 @@ const BarChartInput = (props: Props) => {
const [isLoading, setLoading] = useState<boolean>(true);
const { projectId } = useParams();
const { visualizationSocket } = useSocketStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
useEffect(() => {
const fetchZoneData = async () => {
@@ -56,7 +58,7 @@ const BarChartInput = (props: Props) => {
if (selectedChartId.id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

5
app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx
View File

@@ -127,6 +127,7 @@ import { useParams } from "react-router-dom";
import { useSocketStore } from "../../../../../store/builder/store";
import { getUserData } from "../../../../../functions/getUserData";
import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets";
import { useVersionContext } from "../../../../../modules/builder/version/versionContext";
type Props = {};
@@ -145,6 +146,8 @@ const LineGrapInput = (props: Props) => {
const [isLoading, setLoading] = useState<boolean>(true);
const { projectId } = useParams();
const { visualizationSocket } = useSocketStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
useEffect(() => {
const fetchZoneData = async () => {
@@ -171,7 +174,7 @@ const LineGrapInput = (props: Props) => {
if (selectedChartId.id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

48
app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx
View File

@@ -11,6 +11,7 @@ import { useParams } from "react-router-dom";
import { useSocketStore } from "../../../../../store/builder/store";
import { getUserData } from "../../../../../functions/getUserData";
import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets";
import { useVersionContext } from "../../../../../modules/builder/version/versionContext";
type Props = {};
@@ -29,7 +30,8 @@ const PieChartInput = (props: Props) => {
const [isLoading, setLoading] = useState<boolean>(true);
const { projectId } = useParams();
const { visualizationSocket } = useSocketStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
useEffect(() => {
const fetchZoneData = async () => {
@@ -41,11 +43,11 @@ const PieChartInput = (props: Props) => {
setDropDownData(response.data);
setLoading(false);
} else {
}
} catch (error) {
echo.error("Failed to fetch zone data");
}
};
fetchZoneData();
@@ -56,7 +58,7 @@ const PieChartInput = (props: Props) => {
if (selectedChartId.id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",
@@ -67,16 +69,16 @@ const PieChartInput = (props: Props) => {
}
);
if (response.status === 200) {
setSelections(response.data.Datastructure.measurements);
setDuration(response.data.Datastructure.duration);
setWidgetName(response.data.widgetName);
} else {
}
} catch (error) {
echo.error("Failed to fetch saved inputs");
}
}
};
@@ -100,12 +102,12 @@ const PieChartInput = (props: Props) => {
// const userId = localStorage.getItem("userId");
let newWidget = {
id: selectedChartId.id,
panel: selectedChartId.panel,
widgetName: inputName,
Data: {
measurements: inputMeasurement,
duration: inputDuration,
},
panel: selectedChartId.panel,
widgetName: inputName,
Data: {
measurements: inputMeasurement,
duration: inputDuration,
},
}
// const adding3dWidget = {
// organization: organization,
@@ -117,16 +119,16 @@ const PieChartInput = (props: Props) => {
// visualizationSocket.emit("v1:viz-3D-widget:add", adding3dWidget);
// }
let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget,projectId);
if(response.message==="Widget updated successfully"){
let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId);
return true;
}else{
return false;
}
if (response.message === "Widget updated successfully") {
return true;
} else {
return false;
}
// try {
// const response = await axios.post(
// `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/save`,
@@ -189,7 +191,7 @@ const PieChartInput = (props: Props) => {
};
const handleNameChange = async (name: any) => {
if (await sendInputes(selections, duration, name)) {
setWidgetName(name);

74
app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx
View File

@@ -11,6 +11,7 @@ import { useParams } from "react-router-dom";
import { useSocketStore } from "../../../../../store/builder/store";
import { getUserData } from "../../../../../functions/getUserData";
import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets";
import { useVersionContext } from "../../../../../modules/builder/version/versionContext";
type Props = {};
@@ -29,7 +30,8 @@ const Progress1Input = (props: Props) => {
const [isLoading, setLoading] = useState<boolean>(true);
const { projectId } = useParams();
const { visualizationSocket } = useSocketStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
useEffect(() => {
const fetchZoneData = async () => {
@@ -41,11 +43,11 @@ const Progress1Input = (props: Props) => {
setDropDownData(response.data);
setLoading(false);
} else {
}
} catch (error) {
echo.error("Failed to fetch zone data");
}
};
fetchZoneData();
@@ -56,7 +58,7 @@ const Progress1Input = (props: Props) => {
if (selectedChartId.id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",
@@ -67,16 +69,16 @@ const Progress1Input = (props: Props) => {
}
);
if (response.status === 200) {
setSelections(response.data.Datastructure.measurements);
setDuration(response.data.Datastructure.duration);
setWidgetName(response.data.widgetName);
} else {
}
} catch (error) {
echo.error("Failed to fetch saved inputs");
}
}
};
@@ -115,41 +117,41 @@ const Progress1Input = (props: Props) => {
// if (visualizationSocket) {
// visualizationSocket.emit("v1:viz-3D-widget:add", adding3dWidget);
// }
let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget,projectId);
if(response.message==="Widget updated successfully"){
let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId);
if (response.message === "Widget updated successfully") {
return true;
}else{
} else {
return false;
}
// try {
// const response = await axios.post(
// `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/save`,
// {
// headers: {
// Authorization: "Bearer <access_token>",
// "Content-Type": "application/json",
// token: localStorage.getItem("token") || "",
// refresh_token: localStorage.getItem("refreshToken") || "",
// },
// },
// {
// zoneUuid: selectedZone.zoneUuid,
// organization: organization,
// widget: {
// id: selectedChartId.id,
// panel: selectedChartId.panel,
// widgetName: inputName,
// Data: {
// measurements: inputMeasurement,
// duration: inputDuration,
// },
// },
// } as any
// );
// const response = await axios.post(
// `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/save`,
// {
// headers: {
// Authorization: "Bearer <access_token>",
// "Content-Type": "application/json",
// token: localStorage.getItem("token") || "",
// refresh_token: localStorage.getItem("refreshToken") || "",
// },
// },
// {
// zoneUuid: selectedZone.zoneUuid,
// organization: organization,
// widget: {
// id: selectedChartId.id,
// panel: selectedChartId.panel,
// widgetName: inputName,
// Data: {
// measurements: inputMeasurement,
// duration: inputDuration,
// },
// },
// } as any
// );
// } catch (error) {
// echo.error("Failed to send input");

6
app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx
View File

@@ -11,6 +11,7 @@ import { useParams } from "react-router-dom";
import { useSocketStore } from "../../../../../store/builder/store";
import { getUserData } from "../../../../../functions/getUserData";
import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets";
import { useVersionContext } from "../../../../../modules/builder/version/versionContext";
type Props = {};
@@ -29,7 +30,8 @@ const Progress2Input = (props: Props) => {
const [isLoading, setLoading] = useState<boolean>(true);
const { projectId } = useParams();
const { visualizationSocket } = useSocketStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
useEffect(() => {
const fetchZoneData = async () => {
@@ -56,7 +58,7 @@ const Progress2Input = (props: Props) => {
if (selectedChartId.id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${selectedChartId.id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

6
app/src/components/ui/Tools.tsx
View File

@@ -36,6 +36,7 @@ import {
useFloatingWidget,
} from "../../store/visualization/useDroppedObjectsStore";
import { useParams } from "react-router-dom";
import { useVersionContext } from "../../modules/builder/version/versionContext";
// Utility component
const ToolButton = ({
@@ -86,6 +87,8 @@ const Tools: React.FC = () => {
const dropdownRef = useRef<HTMLButtonElement>(null);
const [openDrop, setOpenDrop] = useState(false);
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { projectId } = useParams();
// 1. Set UI toggles on initial render
@@ -250,7 +253,8 @@ const Tools: React.FC = () => {
selectedZone,
templates,
visualizationSocket,
projectId
projectId,
versionId: selectedVersion?.versionId || ''
})
}
/>

1
app/src/modules/builder/geomentries/walls/addWallItems.ts
View File

@@ -141,7 +141,6 @@ async function AddWallItems(
userId,
};
console.log('data: ', data);
socket.emit("v1:wallItems:set", data);
setWallItems((prevItems) => {

3
app/src/modules/visualization/functions/handleSaveTemplate.ts
View File

@@ -13,6 +13,7 @@ type HandleSaveTemplateProps = {
templates?: Template[];
visualizationSocket: any;
projectId?: string;
versionId?: string
};
// Generate a unique ID
@@ -28,6 +29,7 @@ export const handleSaveTemplate = async ({
templates = [],
visualizationSocket,
projectId,
versionId
}: HandleSaveTemplateProps): Promise<void> => {
try {
const { userId, organization, email } = getUserData();
@@ -76,6 +78,7 @@ export const handleSaveTemplate = async ({
template: newTemplate,
userId,
projectId,
versionId
};
if (visualizationSocket) {
visualizationSocket.emit("v1:viz-template:add", saveTemplate);

13
app/src/modules/visualization/functions/handleUiDrop.ts
View File

@@ -10,7 +10,8 @@ interface HandleDropProps {
selectedZone: any;
setFloatingWidget: (value: any) => void;
event: React.DragEvent<HTMLDivElement>;
projectId?: string
projectId?: string,
versionId?: string
}
export const createHandleDrop = ({
@@ -18,7 +19,9 @@ export const createHandleDrop = ({
visualizationSocket,
selectedZone,
setFloatingWidget,
event, projectId
event,
projectId,
versionId
}: HandleDropProps) => {
event.preventDefault();
try {
@@ -95,11 +98,11 @@ export const createHandleDrop = ({
organization,
widget: newObject,
zoneUuid: selectedZone.zoneUuid,
projectId, userId
versionId,
projectId,
userId
};
console.log("addFloatingWidget: ", addFloatingWidget);
console.log("visualizationSocket: ", visualizationSocket);
if (visualizationSocket) {
visualizationSocket.emit("v1:viz-float:add", addFloatingWidget);
}

15
app/src/modules/visualization/template/Templates.tsx
View File

@@ -7,19 +7,22 @@ import { useDroppedObjectsStore } from "../../../store/visualization/useDroppedO
import RenameInput from "../../../components/ui/inputs/RenameInput";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../functions/getUserData";
import { useVersionContext } from "../../builder/version/versionContext";
const Templates = () => {
const { templates, removeTemplate, setTemplates } = useTemplateStore();
const { setSelectedZone, selectedZone } = useSelectedZoneStore();
const { visualizationSocket } = useSocketStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { projectId } = useParams();
const { userName, userId, organization, email } = getUserData();
useEffect(() => {
async function templateData() {
try {
let response = await getTemplateData(organization, projectId);
let response = await getTemplateData(organization, projectId, selectedVersion?.versionId || '');
setTemplates(response);
} catch (error) {
echo.error("Failed to fetching template data");
@@ -28,7 +31,7 @@ const Templates = () => {
}
templateData();
}, []);
}, [selectedVersion?.versionId]);
const handleDeleteTemplate = async (
e: React.MouseEvent<HTMLButtonElement>,
@@ -40,7 +43,9 @@ const Templates = () => {
let deleteTemplate = {
organization,
templateID: id,
userId, projectId
versionId: selectedVersion?.versionId || '',
userId,
projectId
};
if (visualizationSocket) {
visualizationSocket.emit(
@@ -64,7 +69,9 @@ const Templates = () => {
organization,
zoneUuid: selectedZone.zoneUuid,
templateID: template.id,
projectId, userId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {

16
app/src/modules/visualization/widgets/2d/DraggableWidget.tsx
View File

@@ -21,6 +21,7 @@ import { useParams } from "react-router-dom";
import { useSocketStore } from "../../../../store/builder/store";
import useChartStore from "../../../../store/visualization/useChartStore";
import { getUserData } from "../../../../functions/getUserData";
import { useVersionContext } from "../../../builder/version/versionContext";
gsap.registerPlugin(Draggable);
@@ -63,8 +64,8 @@ export const DraggableWidget = forwardRef<HTMLDivElement, DraggableWidgetProps>(
const { selectedChartId, setSelectedChartId } = useWidgetStore();
const { measurements, duration, name } = useChartStore();
const { userId, organization, email } = getUserData();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const handleKebabClick = (event: React.MouseEvent<HTMLDivElement>) => {
event.stopPropagation();
@@ -110,9 +111,10 @@ export const DraggableWidget = forwardRef<HTMLDivElement, DraggableWidgetProps>(
zoneUuid: selectedZone.zoneUuid,
widgetID: widget.id,
organization: organization,
projectId, userId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
console.log('deleteWidget: ', deleteWidget);
if (visualizationSocket) {
setSelectedChartId(null);
@@ -145,8 +147,6 @@ export const DraggableWidget = forwardRef<HTMLDivElement, DraggableWidgetProps>(
};
const duplicateWidget = async () => {
try {
const duplicatedWidget: Widget = {
...widget,
title: name === "" ? widget.title : name,
@@ -161,7 +161,9 @@ export const DraggableWidget = forwardRef<HTMLDivElement, DraggableWidgetProps>(
organization,
zoneUuid: selectedZone.zoneUuid,
widget: duplicatedWidget,
projectId, userId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {

14
app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx
View File

@@ -10,7 +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";
import { useVersionContext } from "../../../../builder/version/versionContext";
interface ChartComponentProps {
id: string;
@@ -47,9 +47,9 @@ const BarGraphComponent = ({
});
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { projectId } = useParams();
const { userName, userId, organization, email } = getUserData();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
const defaultData = {
@@ -183,7 +183,7 @@ const BarGraphComponent = ({
if (id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ''}`,
{
headers: {
Authorization: "Bearer <access_token>",
@@ -194,16 +194,16 @@ const BarGraphComponent = ({
}
);
if (response.status === 200) {
setmeasurements(response.data.Datastructure.measurements);
setDuration(response.data.Datastructure.duration);
setName(response.data.widgetName);
} else {
echo.error("Failed to fetch saved inputs");
}
} catch (error) {
}
}
};

6
app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx
View File

@@ -9,6 +9,7 @@ import useChartStore from "../../../../../store/visualization/useChartStore";
import { useParams } from "react-router-dom";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { getUserData } from "../../../../../functions/getUserData";
import { useVersionContext } from "../../../../builder/version/versionContext";
interface ChartComponentProps {
id: string;
@@ -39,7 +40,8 @@ const DoughnutGraphComponent = ({
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { projectId } = useParams();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
const { userName, userId, organization, email } = getUserData();
@@ -164,7 +166,7 @@ const DoughnutGraphComponent = ({
if (id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

6
app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx
View File

@@ -9,6 +9,7 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { useParams } from "react-router-dom";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { getUserData } from "../../../../../functions/getUserData";
import { useVersionContext } from "../../../../builder/version/versionContext";
interface ChartComponentProps {
id: string;
@@ -46,7 +47,8 @@ const LineGraphComponent = ({
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { projectId } = useParams();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
const { userName, userId, organization, email } = getUserData();
@@ -181,7 +183,7 @@ const LineGraphComponent = ({
if (id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

5
app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx
View File

@@ -9,6 +9,7 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../../../functions/getUserData";
import { useVersionContext } from "../../../../builder/version/versionContext";
interface ChartComponentProps {
id: string;
@@ -46,6 +47,8 @@ const PieChartComponent = ({
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { projectId } = useParams();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
const { userName, userId, organization, email } = getUserData();
@@ -180,7 +183,7 @@ const PieChartComponent = ({
if (id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

5
app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx
View File

@@ -9,6 +9,7 @@ import { useWidgetStore } from "../../../../../store/useWidgetStore";
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../../../functions/getUserData";
import { useVersionContext } from "../../../../builder/version/versionContext";
interface ChartComponentProps {
id: string;
@@ -46,6 +47,8 @@ const PolarAreaGraphComponent = ({
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { projectId } = useParams();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
const { userName, userId, organization, email } = getUserData();
@@ -180,7 +183,7 @@ const PolarAreaGraphComponent = ({
if (id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

5
app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx
View File

@@ -9,6 +9,7 @@ import { StockIncreseIcon } from "../../../../../components/icons/RealTimeVisula
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../../../functions/getUserData";
import { useVersionContext } from "../../../../builder/version/versionContext";
const ProgressCard1 = ({ id, title }: { id: string; title: string }) => {
const {
@@ -23,6 +24,8 @@ const ProgressCard1 = ({ id, title }: { id: string; title: string }) => {
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { projectId } = useParams();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
const { userName, userId, organization, email } = getUserData();
@@ -60,7 +63,7 @@ const ProgressCard1 = ({ id, title }: { id: string; title: string }) => {
if (id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",

7
app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx
View File

@@ -9,6 +9,7 @@ import { StockIncreseIcon } from "../../../../../components/icons/RealTimeVisula
import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../../../functions/getUserData";
import { useVersionContext } from "../../../../builder/version/versionContext";
const ProgressCard2 = ({ id, title }: { id: string; title: string }) => {
const {
@@ -24,6 +25,8 @@ const ProgressCard2 = ({ id, title }: { id: string; title: string }) => {
const { selectedChartId } = useWidgetStore();
const { selectedZone } = useSelectedZoneStore();
const { projectId } = useParams();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL;
const { userName, userId, organization, email } = getUserData();
@@ -64,7 +67,7 @@ const ProgressCard2 = ({ id, title }: { id: string; title: string }) => {
if (id !== "") {
try {
const response = await axios.get(
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}`,
`http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget/data?widgetID=${id}&zoneUuid=${selectedZone.zoneUuid}&projectId=${projectId}&versionId=${selectedVersion?.versionId || ""}`,
{
headers: {
Authorization: "Bearer <access_token>",
@@ -75,7 +78,7 @@ const ProgressCard2 = ({ id, title }: { id: string; title: string }) => {
}
);
if (response.status === 200) {
setmeasurements(response.data.Datastructure.measurements);
setDuration(response.data.Datastructure.duration);

31
app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx
View File

@@ -28,6 +28,7 @@ import { useWidgetStore } from "../../../../store/useWidgetStore";
import useChartStore from "../../../../store/visualization/useChartStore";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../../functions/getUserData";
import { useVersionContext } from "../../../builder/version/versionContext";
type WidgetData = {
id: string;
@@ -47,8 +48,8 @@ export default function Dropped3dWidgets() {
const { top, setTop } = useTopData();
const { left, setLeft } = useLeftData();
const { rightSelect, setRightSelect } = useRightSelected();
const { editWidgetOptions, setEditWidgetOptions } =useEditWidgetOptionsStore();
const {zoneWidgetData,setZoneWidgetData,addWidget,updateWidgetPosition,updateWidgetRotation,tempWidget,tempWidgetPosition,} = useZoneWidgetStore();
const { editWidgetOptions, setEditWidgetOptions } = useEditWidgetOptionsStore();
const { zoneWidgetData, setZoneWidgetData, addWidget, updateWidgetPosition, updateWidgetRotation, tempWidget, tempWidgetPosition, } = useZoneWidgetStore();
const { setWidgets3D } = use3DWidget();
const { visualizationSocket } = useSocketStore();
const { rightClickSelected, setRightClickSelected } = useRightClickSelected();
@@ -63,6 +64,8 @@ export default function Dropped3dWidgets() {
const [intersectcontextmenu, setintersectcontextmenu] = useState<number | undefined>();
const [horizontalX, setHorizontalX] = useState<number | undefined>();
const [horizontalZ, setHorizontalZ] = useState<number | undefined>();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const activeZoneWidgets = zoneWidgetData[selectedZone.zoneUuid] || [];
const { projectId } = useParams();
@@ -73,7 +76,7 @@ export default function Dropped3dWidgets() {
async function get3dWidgetData() {
const result = await get3dWidgetZoneData(selectedZone.zoneUuid,organization, projectId);
const result = await get3dWidgetZoneData(selectedZone.zoneUuid, organization, projectId, selectedVersion?.versionId || '');
setWidgets3D(result);
if (result.length < 0) return;
@@ -88,7 +91,7 @@ export default function Dropped3dWidgets() {
}
get3dWidgetData();
}, [selectedZone.zoneUuid, activeModule]);
}, [selectedZone.zoneUuid, activeModule, selectedVersion?.versionId]);
const createdWidgetRef = useRef<WidgetData | null>(null);
@@ -232,7 +235,9 @@ export default function Dropped3dWidgets() {
organization,
widget: newWidget,
zoneUuid: selectedZone.zoneUuid,
projectId, userId
version: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {
@@ -289,7 +294,9 @@ export default function Dropped3dWidgets() {
organization,
widget: newWidget,
zoneUuid: selectedZone.zoneUuid,
projectId, userId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {
visualizationSocket.emit("v1:viz-3D-widget:add", adding3dWidget);
@@ -311,7 +318,9 @@ export default function Dropped3dWidgets() {
organization,
id: rightClickSelected,
zoneUuid: selectedZone.zoneUuid,
projectId, userId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {
@@ -611,7 +620,9 @@ export default function Dropped3dWidgets() {
zoneUuid: selectedzoneUuid,
id: rightClickSelected,
position: lastPosition,
projectId, userId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {
visualizationSocket.emit(
@@ -636,7 +647,9 @@ export default function Dropped3dWidgets() {
zoneUuid: selectedzoneUuid,
id: rightClickSelected,
rotation: lastRotation,
projectId, userId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {
visualizationSocket.emit(

9
app/src/modules/visualization/widgets/floating/DroppedFloatingWidgets.tsx
View File

@@ -20,6 +20,7 @@ import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
import { useSelectedZoneStore } from "../../../../store/visualization/useZoneStore";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../../functions/getUserData";
import { useVersionContext } from "../../../builder/version/versionContext";
interface DraggingState {
zone: string;
index: number;
@@ -45,6 +46,8 @@ const DroppedObjects: React.FC = () => {
const { visualizationSocket } = useSocketStore();
const { isPlaying } = usePlayButtonStore();
const zones = useDroppedObjectsStore((state) => state.zones);
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { projectId } = useParams();
const [openKebabId, setOpenKebabId] = useState<string | null>(null);
@@ -113,7 +116,7 @@ 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, selectedVersion?.versionId ||''); // Call the duplicateObject method from the store
setSelectedChartId(null);
}
@@ -125,7 +128,9 @@ const DroppedObjects: React.FC = () => {
floatWidgetID: id,
organization,
zoneUuid: zone.zoneUuid,
userId, projectId
versionId: selectedVersion?.versionId || '',
userId,
projectId
};
if (visualizationSocket) {

14
app/src/modules/visualization/widgets/panel/AddButtons.tsx
View File

@@ -8,6 +8,7 @@ import { AddIcon } from "../../../../components/icons/ExportCommonIcons";
import { useSocketStore } from "../../../../store/builder/store";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../../functions/getUserData";
import { useVersionContext } from "../../../builder/version/versionContext";
// Define the type for `Side`
type Side = "top" | "bottom" | "left" | "right";
@@ -72,7 +73,8 @@ const AddButtons: React.FC<ButtonsProps> = ({
const { visualizationSocket } = useSocketStore();
const { projectId } = useParams();
const { userId, organization, email } = getUserData();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
// Function to toggle visibility of a panel
const toggleVisibility = (side: Side) => {
@@ -114,7 +116,9 @@ const AddButtons: React.FC<ButtonsProps> = ({
organization,
lockedPanel: newLockedPanels,
zoneUuid: selectedZone.zoneUuid,
userId, projectId
versionId: selectedVersion?.versionId || '',
projectId,
userId
};
if (visualizationSocket) {
visualizationSocket.emit("v1:viz-panel:locked", lockedPanel);
@@ -139,7 +143,9 @@ const AddButtons: React.FC<ButtonsProps> = ({
organization,
panelName: side,
zoneUuid: selectedZone.zoneUuid,
userId, projectId
versionId: selectedVersion?.versionId || '',
projectId,
userId,
};
if (visualizationSocket) {
visualizationSocket.emit("v1:viz-panel:clear", clearPanel);
@@ -187,6 +193,7 @@ const AddButtons: React.FC<ButtonsProps> = ({
panelName: side,
zoneUuid,
projectId,
versionId: selectedVersion?.versionId || '',
userId
};
@@ -223,6 +230,7 @@ const AddButtons: React.FC<ButtonsProps> = ({
organization,
zoneUuid,
projectId,
versionId: selectedVersion?.versionId || '',
userId,
panelOrder: newActiveSides,
};

5
app/src/modules/visualization/widgets/panel/Panel.tsx
View File

@@ -15,6 +15,7 @@ import { useParams } from "react-router-dom";
import { arrayMove } from "@dnd-kit/sortable";
import { clamp } from "three/src/math/MathUtils";
import { getUserData } from "../../../../functions/getUserData";
import { useVersionContext } from "../../../builder/version/versionContext";
gsap.registerPlugin(Draggable);
@@ -83,7 +84,8 @@ const Panel: React.FC<PanelProps> = ({
const { projectId } = useParams();
const panelRefs = useRef<{ [side in Side]?: HTMLDivElement }>({});
const { userId, organization, email } = getUserData();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
// function handleResize() {
// const canvas = document.getElementById("sceneCanvas");
@@ -366,6 +368,7 @@ const Panel: React.FC<PanelProps> = ({
organization,
zoneUuid: selectedZone.zoneUuid,
widget: newWidget,
versionId: selectedVersion?.versionId || '',
projectId,
userId,
};

7
app/src/modules/visualization/zone/DisplayZone.tsx
View File

@@ -16,6 +16,7 @@ import { InfoIcon } from "../../../components/icons/ExportCommonIcons";
import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
import { useParams } from "react-router-dom";
import { getUserData } from "../../../functions/getUserData";
import { useVersionContext } from "../../builder/version/versionContext";
// Define the type for `Side`
type Side = "top" | "bottom" | "left" | "right";
@@ -94,6 +95,8 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
const { isPlaying } = usePlayButtonStore();
const { userName, userId, organization, email } = getUserData();
const { setSelectedChartId } = useWidgetStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { projectId } = useParams();
// Function to calculate overflow state
const updateOverflowState = useCallback(() => {
@@ -176,9 +179,9 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
}
// setSelectedChartId(null);
let response = await getSelect2dZoneData(zoneUuid, organization, projectId);
let response = await getSelect2dZoneData(zoneUuid, organization, projectId, selectedVersion?.versionId || '');
// console.log('response2d: ', response);
let res = await getFloatingZoneData(zoneUuid, organization, projectId);
let res = await getFloatingZoneData(zoneUuid, organization, projectId, selectedVersion?.versionId || '');
// console.log("resFloating: ", res);
setFloatingWidget(res);

5
app/src/services/visulization/zone/get3dWidgetData.ts
View File

@@ -5,11 +5,12 @@ let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_UR
export const get3dWidgetZoneData = async (
zoneUuid?: string,
organization?: string,
projectId?: string
projectId?: string,
versionId?: string
) => {
try {
const response = await fetch(
`${url_Backend_dwinzo}/api/V1/widget3d/data/${zoneUuid}/${projectId}`,
`${url_Backend_dwinzo}/api/V1/widget3d/data/${zoneUuid}/${projectId}/${versionId}`,
{
method: "GET",
headers: {

5
app/src/services/visulization/zone/getFloatingData.ts
View File

@@ -3,11 +3,12 @@ let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_UR
export const getFloatingZoneData = async (
zoneUuid?: string,
organization?: string,
projectId?: string
projectId?: string,
versionId?: string
) => {
try {
const response = await fetch(
`${url_Backend_dwinzo}/api/V1/floatWidgets/${zoneUuid}/${projectId}`,
`${url_Backend_dwinzo}/api/V1/floatWidgets/${zoneUuid}/${projectId}/${versionId}`,
{
method: "GET",
headers: {

4
app/src/services/visulization/zone/getSelect2dZoneData.ts
View File

@@ -1,10 +1,10 @@
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 getSelect2dZoneData = async (zoneUuid?: string, organization?: string, projectId?: string) => {
export const getSelect2dZoneData = async (zoneUuid?: string, organization?: string, projectId?: string, versionId?: string) => {
try {
const response = await fetch(
`${url_Backend_dwinzo}/api/V1/zones/panel/${projectId}/${zoneUuid}`,
`${url_Backend_dwinzo}/api/V1/zones/panel/${projectId}/${zoneUuid}/${versionId}`,
{
method: "GET",
headers: {

4
app/src/services/visulization/zone/getTemplate.ts
View File

@@ -1,9 +1,9 @@
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 getTemplateData = async (organization?: string, projectId?: string) => {
export const getTemplateData = async (organization?: string, projectId?: string, versionId?: string) => {
try {
const response = await fetch(
`${url_Backend_dwinzo}/api/V1/template/data/${projectId}`,
`${url_Backend_dwinzo}/api/V1/template/data/${projectId}/${versionId}`,
{
method: "GET",
headers: {

8
app/src/store/visualization/useDroppedObjectsStore.ts
View File

@@ -42,7 +42,8 @@ type DroppedObjectsState = {
duplicateObject: (
zoneName: string,
index: number,
projectId?: string
projectId?: string,
versionId?: string
) => void; // Add this line
};
@@ -101,10 +102,12 @@ export const useDroppedObjectsStore = create<DroppedObjectsState>((set) => ({
},
};
}),
duplicateObject: async (
zoneName: string,
index: number,
projectId?: string
projectId?: string,
versionId?: string
) => {
const state = useDroppedObjectsStore.getState(); // Get the current state
const zone = state.zones[zoneName];
@@ -149,6 +152,7 @@ export const useDroppedObjectsStore = create<DroppedObjectsState>((set) => ({
widget: duplicatedObject,
zoneUuid: zone.zoneUuid,
index: index,
versionId,
projectId,
userId,
};