-
+ )}
+
+ {/* simulation */}
+
+ {toggleUI && activeModule === "simulation" && (
+ <>
+ {activeList === "mechanics" && (
+
+
-
+
+
+ )}
+ {activeList === "analysis" && (
+
+
+
+
+ )}
+
)}
{/* realtime visualization */}
diff --git a/app/src/components/layout/sidebarRight/analysis/Analysis.tsx b/app/src/components/layout/sidebarRight/analysis/Analysis.tsx
new file mode 100644
index 0000000..8503bb9
--- /dev/null
+++ b/app/src/components/layout/sidebarRight/analysis/Analysis.tsx
@@ -0,0 +1,143 @@
+import React, { useState } from "react";
+import { AI_Icon } from "../../../icons/ExportCommonIcons";
+import RegularDropDown from "../../../ui/inputs/RegularDropDown";
+import { AnalysisPresetsType } from "../../../../types/analysis";
+import RenderAnalysisInputs from "./RenderAnalysisInputs";
+
+const Analysis: React.FC = () => {
+ const [selectedOption, setSelectedOption] = useState("Throughput time");
+
+ const handleSelect = (option: string) => {
+ setSelectedOption(option); // Normalize for key matching
+ };
+
+ const AnalysisPresets: AnalysisPresetsType = {
+ "Throughput time": [
+ { type: "default", inputs: { label: "Height", activeOption: "mm" } },
+ { type: "default", inputs: { label: "Width", activeOption: "mm" } },
+ { type: "default", inputs: { label: "Length", activeOption: "mtr" } },
+ { type: "default", inputs: { label: "Thickness", activeOption: "mm" } },
+ {
+ type: "default",
+ inputs: { label: "Raw Material", activeOption: "mm" },
+ },
+ {
+ type: "range",
+ inputs: { label: "Material flow", activeOption: "m/min" },
+ },
+ ],
+ "Production capacity": [
+ { type: "default", inputs: { label: "Height", activeOption: "mm" } },
+ { type: "default", inputs: { label: "Width", activeOption: "mm" } },
+ { type: "default", inputs: { label: "Length", activeOption: "mtr" } },
+ { type: "default", inputs: { label: "Thickness", activeOption: "mm" } },
+ {
+ type: "default",
+ inputs: { label: "Raw Material", activeOption: "mm" },
+ },
+ {
+ type: "range",
+ inputs: { label: "Material flow", activeOption: "m/min" },
+ },
+ {
+ type: "range",
+ inputs: { label: "Shift 1", activeOption: "hr(s)" },
+ },
+ {
+ type: "range",
+ inputs: { label: "Shift 2", activeOption: "hr(s)" },
+ },
+ {
+ type: "range",
+ inputs: { label: "Over time", activeOption: "hr(s)" },
+ },
+ ],
+ ROI: [
+ {
+ type: "default",
+ inputs: { label: "Equipment Cost", activeOption: "INR" },
+ },
+ {
+ type: "default",
+ inputs: { label: "Employee Salary", activeOption: "INR" },
+ },
+ {
+ type: "default",
+ inputs: { label: "Labor Cost", activeOption: "INR" },
+ },
+ {
+ type: "default",
+ inputs: { label: "Cost per unit", activeOption: "INR" },
+ },
+ {
+ type: "default",
+ inputs: { label: "Electricity cost", activeOption: "INR" },
+ },
+ {
+ type: "default",
+ inputs: { label: "Upkeep Cost", activeOption: "INR" },
+ },
+ {
+ type: "default",
+ inputs: { label: "Working Hours", activeOption: "Hrs" },
+ },
+ {
+ type: "default",
+ inputs: { label: "Power Usage", activeOption: "KWH" },
+ },
+ { type: "default", inputs: { label: "KWH", activeOption: "Mos" } },
+ {
+ type: "default",
+ inputs: { label: "Man Power", activeOption: "Person" },
+ },
+ ],
+ };
+
+ return (
+
+
+
+
+ );
+};
+
+export default Analysis;
diff --git a/app/src/components/layout/sidebarRight/analysis/RenderAnalysisInputs.tsx b/app/src/components/layout/sidebarRight/analysis/RenderAnalysisInputs.tsx
new file mode 100644
index 0000000..aea58eb
--- /dev/null
+++ b/app/src/components/layout/sidebarRight/analysis/RenderAnalysisInputs.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
+import InputRange from "../../../ui/inputs/InputRange";
+import { AnalysisPresetsType } from "../../../../types/analysis";
+
+interface InputRendererProps {
+ keyName: string;
+ presets: AnalysisPresetsType[keyof AnalysisPresetsType];
+}
+
+const RenderAnalysisInputs: React.FC
+
+ Object
+
+
+
+
+
+
+ Create Analysis
+
+
+ {/* Render only the selected option */}
+
+
+
+
+
+
+ Create Custom Analysis
+
+ Click 'Create' to enhances decision-making by
+ providing actionable insights, optimizing operations that adapts
+ to the unique challenges.
+
+
+
+
+
+ {presets.map((preset, index) => {
+ if (preset.type === "default") {
+ return (
+ {}}
+ />
+ );
+ }
+ if (preset.type === "range") {
+ return
+ );
+};
+
+export default RenderAnalysisInputs;
diff --git a/app/src/components/layout/sidebarRight/customInput/PositionInputs.tsx b/app/src/components/layout/sidebarRight/customInput/PositionInputs.tsx
new file mode 100644
index 0000000..b65d782
--- /dev/null
+++ b/app/src/components/layout/sidebarRight/customInput/PositionInputs.tsx
@@ -0,0 +1,41 @@
+import React from "react";
+
+interface PositionInputProps {
+ onChange: (value: string) => void; // Callback for value change
+ placeholder?: string; // Optional placeholder
+ type?: string; // Input type (e.g., text, number, email)
+}
+
+const PositionInput: React.FC
+
+ );
+};
+
+export default PositionInput;
diff --git a/app/src/components/layout/sidebarRight/customInput/RotationInput.tsx b/app/src/components/layout/sidebarRight/customInput/RotationInput.tsx
new file mode 100644
index 0000000..3ab01a4
--- /dev/null
+++ b/app/src/components/layout/sidebarRight/customInput/RotationInput.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+interface RotationInputProps {
+ onChange: (value: string) => void; // Callback for value change
+ placeholder?: string; // Optional placeholder
+ type?: string; // Input type (e.g., text, number, email)
+}
+
+const RotationInput: React.FCPosition
+
+
+
+
+ X :
+ onChange(e.target.value)}
+ placeholder={placeholder}
+ />
+
+
+ Y :
+ onChange(e.target.value)}
+ placeholder={placeholder}
+ />
+
+
+ );
+};
+
+export default RotationInput;
diff --git a/app/src/components/layout/sidebarRight/mechanics/MachineMechanics.tsx b/app/src/components/layout/sidebarRight/mechanics/MachineMechanics.tsx
index 803c96a..9aa27bb 100644
--- a/app/src/components/layout/sidebarRight/mechanics/MachineMechanics.tsx
+++ b/app/src/components/layout/sidebarRight/mechanics/MachineMechanics.tsx
@@ -10,6 +10,7 @@ import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
import LabledDropdown from "../../../ui/inputs/LabledDropdown";
import RegularDropDown from "../../../ui/inputs/RegularDropDown";
import { handleResize } from "../../../../functions/handleResizePannel";
+import EyeDropInput from "../../../ui/inputs/EyeDropInput";
const MachineMechanics: React.FC = () => {
const [actionList, setActionList] = useStateRotation
+
+
+
+
+ Rotate :
+ onChange(e.target.value)}
+ placeholder={placeholder}
+ />
+ Selected Object
Process:
+
@@ -168,7 +183,13 @@ const MachineMechanics: React.FC = () => {
defaultOption="On-hit"
options={["On-hit", "Buffer"]}
/>
- {}}
+ />
+
diff --git a/app/src/components/layout/sidebarRight/properties/AssetProperties.tsx b/app/src/components/layout/sidebarRight/properties/AssetProperties.tsx
new file mode 100644
index 0000000..a3a0d28
--- /dev/null
+++ b/app/src/components/layout/sidebarRight/properties/AssetProperties.tsx
@@ -0,0 +1,88 @@
+import React, { useState } from "react";
+import InputToggle from "../../../ui/inputs/InputToggle";
+import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
+import { RemoveIcon } from "../../../icons/ExportCommonIcons";
+import PositionInput from "../customInput/PositionInputs";
+import RotationInput from "../customInput/RotationInput";
+
+interface UserData {
+ id: number; // Unique identifier for the user data
+ label: string; // Label of the user data field
+ value: string; // Value of the user data field
+}
+
+const AssetProperties: React.FC = () => {
+ const [userData, setUserData] = useState
+ {}} />
+ {}} />
+
+
+
+
+ );
+};
+
+export default AssetProperties;
diff --git a/app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx b/app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx
new file mode 100644
index 0000000..672d847
--- /dev/null
+++ b/app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx
@@ -0,0 +1,81 @@
+import React, { useState } from "react";
+import InputRange from "../../../ui/inputs/InputRange";
+import InputToggle from "../../../ui/inputs/InputToggle";
+import { AI_Icon } from "../../../icons/ExportCommonIcons";
+import LabeledButton from "../../../ui/inputs/LabledButton";
+
+const GlobalProperties: React.FC = () => {
+ const [limitDistance, setLimitDistance] = useState(false);
+ const [distance, setDistance] = useStateSelected Object
+
+
+
+ User Data
+
+ {/* Map through userData and render InputWithDropDown for each entry */}
+ {userData.map((data) => (
+
+ handleUserDataChange(data.id, newValue)} // Pass the change handler
+ />
+
+ ))}
+
+ {/* Add new user data */}
+ handleRemoveUserData(data.id)}
+ >
+
+
+ + Add
+
+
+ {}} value="Reset"/>
+
+
+
+ {
+ setLimitDistance(!limitDistance);
+ }}
+ />
+ updateDistance(value)}
+ />
+
+
+
+ {
+ setLimitGridDistance(!limitGridDistance);
+ }}
+ />
+ updateGridDistance(value)}
+ />
+
+ );
+};
+
+export default GlobalProperties;
diff --git a/app/src/components/layout/sidebarRight/properties/Properties.tsx b/app/src/components/layout/sidebarRight/properties/Properties.tsx
deleted file mode 100644
index dc33645..0000000
--- a/app/src/components/layout/sidebarRight/properties/Properties.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from "react";
-
-const GlobalProperties: React.FC = () => {
- return (
- Environment
+
+
+
+
+
+ GlobalProperties
- );
-};
-
-export default GlobalProperties;
diff --git a/app/src/components/templates/CollaborationPopup.tsx b/app/src/components/templates/CollaborationPopup.tsx
new file mode 100644
index 0000000..34e3669
--- /dev/null
+++ b/app/src/components/templates/CollaborationPopup.tsx
@@ -0,0 +1,128 @@
+import React, { useState } from "react";
+import RenderOverlay from "./Overlay";
+import { ArrowIcon, CloseIcon } from "../icons/ExportCommonIcons";
+import { AccessOption, User } from "../../types/users";
+import RegularDropDown from "../ui/inputs/RegularDropDown";
+import { access } from "fs";
+import MultiEmailInvite from "../ui/inputs/MultiEmailInvite";
+
+interface UserListTemplateProps {
+ user: User;
+}
+
+const UserListTemplate: React.FC
+
+ );
+};
+
+const CollaborationPopup: React.FC = () => {
+ const users = [
+ {
+ name: "Alice Johnson",
+ email: "alice.johnson@example.com",
+ profileImage: "",
+ color: "#FF6600",
+ access: "Admin",
+ },
+ {
+ name: "Bob Smith",
+ email: "bob.smith@example.com",
+ profileImage: "",
+ color: "#488EF6",
+ access: "Viewer",
+ },
+ {
+ name: "Charlie Brown",
+ email: "charlie.brown@example.com",
+ profileImage: "",
+ color: "#48AC2A",
+ access: "Viewer",
+ },
+ {
+ name: "Diana Prince",
+ email: "diana.prince@example.com",
+ profileImage: "",
+ color: "#D44242",
+ access: "Viewer",
+ },
+ ];
+
+ return (
+
+
+
+ {user.profileImage ? (
+ 
+ ) : (
+
+
+ {user.name[0]}
+
+ )}
+ {user.name}
+
+ accessUpdate({ option })}
+ search={false}
+ />
+ {/*
+
+
+
+
+
+
+ Share this file
+
+
+ copy link
+
+
+
+
+
+
+
+ Who has access
+
+
+
+
+ Untitled
+
+ {users.length} persons
+
+
+
+
+
+ {users.map((user, index) => (
+ User 1
+ you
+
+
+
+
+ Untitled
+
+
+
+
+ Entering A New World of Dwinzo
+
+
+ {validatedProgress}%
+
+
+
+
+ {toasts.map((toast) => (
+
+ removeToast(toast.id)} // Allow manual dismissal
+ >
+ {toast.message}
+
+ ))}
+ {text.distance} m
+
+ ))}
+ {text.distance} m
+