@evenicanpm/admin-integrate 2.4.1 → 2.5.0

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @evenicanpm/admin-integrate
 
+## 2.5.0
+
+## 2.4.2
+
+### Patch Changes
+
+- fix: bumping all versions and then re-publishing to properly strip out the workspace: deps.
+
 ## 2.4.1
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@evenicanpm/admin-integrate",
-  "version": "2.4.1",
+  "version": "2.5.0",
   "description": "e4Integrate Admin Panel",
   "type": "module",
   "exports": {
@@ -19,13 +19,21 @@
     "@mui/icons-material": "^6.1.7",
     "@mui/material": "^6.1.7",
     "@mui/system": "^6.3.1",
+    "@mui/x-date-pickers": "^6.20.2",
     "@tanstack/react-query": "^5.100.4",
     "@xyflow/react": "^12.8.4",
     "elkjs": "^0.10.0",
     "lodash": "^4.17.21",
+    "next": "^16.0.0",
+    "next-intl": "^4.3.4",
     "react": "^19.2.7",
     "react-dom": "^19.2.7"
   },
+  "dependencies": {
+    "date-fns": "^3.3.1",
+    "formik": "^2.4.5",
+    "zod": "^4.1.12"
+  },
   "devDependencies": {
     "@emotion/react": "^11.11.3",
     "@emotion/styled": "^11.11.0",

package/src/api/process/mutations/copy-process.mutation.ts

@@ -14,7 +14,7 @@ export const buildCopyProcessMutationKey = {
 	],
 };
 
-export const copyProcess = () => {
+export const useCopyProcess = () => {
 	const queryClient = getQueryClient();
 
 	return useMutation({
@@ -43,3 +43,5 @@ export const copyProcess = () => {
 		},
 	});
 };
+
+export const copyProcess = useCopyProcess;

package/src/api/process/mutations/index.ts

@@ -1,2 +1,5 @@
-export { copyProcess } from "./copy-process.mutation";
-export { runProcessWebhook } from "./run-process.mutation";
+export { copyProcess, useCopyProcess } from "./copy-process.mutation";
+export {
+	runProcessWebhook,
+	useRunProcessWebhook,
+} from "./run-process.mutation";

package/src/api/process/mutations/run-process.mutation.ts

@@ -10,7 +10,7 @@ export const buildRunProcessMutationKey = {
 	webhook: () => ["runProcessWebhook"] as const,
 };
 
-export const runProcessWebhook = () => {
+export const useRunProcessWebhook = () => {
 	const queryClient = getQueryClient();
 
 	return useMutation({
@@ -39,3 +39,5 @@ export const runProcessWebhook = () => {
 		},
 	});
 };
+
+export const runProcessWebhook = useRunProcessWebhook;

package/src/api/process-config/mutation/index.ts

@@ -1,2 +1,8 @@
-export { processConfigImport } from "./process-config-import.mutation";
-export { processConfigMerge } from "./process-config-merge.mutation";
+export {
+	processConfigImport,
+	useProcessConfigImport,
+} from "./process-config-import.mutation";
+export {
+	processConfigMerge,
+	useProcessConfigMerge,
+} from "./process-config-merge.mutation";

package/src/api/process-config/mutation/process-config-import.mutation.ts

@@ -11,7 +11,7 @@ export const buildProcessScheduleGroupDetailsQueryKey = {
 	],
 };
 
-export const processConfigImport = () => {
+export const useProcessConfigImport = () => {
 	const queryClient = useQueryClient();
 
 	return useMutation({
@@ -40,3 +40,5 @@ export const processConfigImport = () => {
 		},
 	});
 };
+
+export const processConfigImport = useProcessConfigImport;

package/src/api/process-config/mutation/process-config-merge.mutation.ts

@@ -10,7 +10,7 @@ export const buildProcessScheduleGroupDetailsQueryKey = {
 	],
 };
 
-export const processConfigMerge = () => {
+export const useProcessConfigMerge = () => {
 	const queryClient = useQueryClient();
 
 	return useMutation({
@@ -31,3 +31,5 @@ export const processConfigMerge = () => {
 		},
 	});
 };
+
+export const processConfigMerge = useProcessConfigMerge;

package/src/api/scheduler/mutation/create-process-schedule-group-details.mutation.ts

@@ -14,7 +14,7 @@ export const buildCreateProcessScheduleGroupDetailsMutationKey = {
 	],
 };
 
-export const createProcessScheduleGroupDetails = () => {
+export const useCreateProcessScheduleGroupDetails = () => {
 	const queryClient = getQueryClient();
 
 	return useMutation({
@@ -45,3 +45,6 @@ export const createProcessScheduleGroupDetails = () => {
 		},
 	});
 };
+
+export const createProcessScheduleGroupDetails =
+	useCreateProcessScheduleGroupDetails;

package/src/api/scheduler/mutation/index.ts

@@ -1,2 +1,8 @@
-export { createProcessScheduleGroupDetails } from "./create-process-schedule-group-details.mutation";
-export { updateProcessScheduleGroupDetails } from "./update-process-schedule-group-details.mutation";
+export {
+	createProcessScheduleGroupDetails,
+	useCreateProcessScheduleGroupDetails,
+} from "./create-process-schedule-group-details.mutation";
+export {
+	updateProcessScheduleGroupDetails,
+	useUpdateProcessScheduleGroupDetails,
+} from "./update-process-schedule-group-details.mutation";

package/src/api/scheduler/mutation/update-process-schedule-group-details.mutation.ts

@@ -14,7 +14,7 @@ export const buildUpdateProcessScheduleGroupDetailsMutationKey = {
 	],
 };
 
-export const updateProcessScheduleGroupDetails = () => {
+export const useUpdateProcessScheduleGroupDetails = () => {
 	const queryClient = getQueryClient();
 
 	return useMutation({
@@ -45,3 +45,6 @@ export const updateProcessScheduleGroupDetails = () => {
 		},
 	});
 };
+
+export const updateProcessScheduleGroupDetails =
+	useUpdateProcessScheduleGroupDetails;

package/src/components/data-table/table-header.tsx

@@ -12,7 +12,6 @@ const StyledTableCell = styled(TableCell)(({ theme }) => ({
 	padding: "16px 20px",
 	color: theme.palette.grey[900],
 }));
-
 // ==============================================================
 export type Head = {
 	id: string;
@@ -29,6 +28,30 @@ interface Props {
 	rowSx?: SxProps;
 }
 // ==============================================================
+interface SortIconProps {
+	order: "asc" | "desc";
+	orderBy: string;
+	columnId: string;
+	sx: SxProps<Theme>;
+}
+
+function SortIconComponent({
+	order,
+	orderBy,
+	columnId,
+	sx,
+}: Readonly<SortIconProps>) {
+	const isActive = orderBy === columnId;
+	const iconSx: SxProps<Theme> = {
+		...sx,
+		visibility: isActive ? "visible" : "hidden",
+	};
+	return order === "desc" && isActive ? (
+		<ExpandMore sx={iconSx} />
+	) : (
+		<ExpandLess sx={iconSx} />
+	);
+}
 
 export default function TableHeader({
 	order,
@@ -57,25 +80,14 @@ export default function TableHeader({
 								onClick={() => onRequestSort(headCell.id)}
 								direction={orderBy === headCell.id ? order : "asc"}
 								sx={styles.sortLabel}
-								IconComponent={() =>
-									order === "desc" && orderBy === headCell.id ? (
-										<ExpandMore
-											sx={{
-												...styles.sortIcon,
-												visibility:
-													orderBy === headCell.id ? "visible" : "hidden",
-											}}
-										/>
-									) : (
-										<ExpandLess
-											sx={{
-												...styles.sortIcon,
-												visibility:
-													orderBy === headCell.id ? "visible" : "hidden",
-											}}
-										/>
-									)
-								}
+								IconComponent={() => (
+									<SortIconComponent
+										order={order}
+										orderBy={orderBy}
+										columnId={headCell.id}
+										sx={styles.sortIcon}
+									/>
+								)}
 							>
 								{headCell.label}
 							</TableSortLabel>

package/src/components/integration-list/list/integration-list.tsx

@@ -90,7 +90,7 @@ const IntegrationList: React.FC<Props> = (props: Props) => {
 			integrationTags:
 				filters?.multiSelectFilter?.map((f) => `${f.id}`) || null,
 		});
-		setPerPage(itemsPerPage as number);
+		setPerPage(itemsPerPage || 10);
 		setPage(1);
 	};
 

package/src/components/integration-view/integration-view.tsx

@@ -37,7 +37,6 @@ import type { ElkExtendedEdgeWithFlow, ElkNodeWithFlow } from "./elk-types";
 import { edgeTypes, nodeTypes } from "./flow-types";
 
 import {
-	type AddHandler,
 	mapEmptyNodesAndEdges,
 	mapProcessConfigToNodesAndEdges,
 	mapProcessTasksToNodesAndEdges,
@@ -157,8 +156,6 @@ const calcYOffset = () => {
 };
 
 interface Props {
-	title?: string; // e.g. Executions
-	section?: string; // e.g. e4Integrate
 	data?: ProcessExecutionDetails;
 	config?: ConfigExport;
 	variant?: "process" | "process-execution";
@@ -169,7 +166,7 @@ interface Props {
 	drawerOpen?: boolean;
 	processTaskId?: string;
 	onConfigChange?: (processConfig: ConfigExport) => void;
-	onAdd?: AddHandler;
+	onAdd?: unknown;
 	canEdit?: boolean;
 }
 
@@ -206,6 +203,145 @@ function getOverlapX(
 	}
 }
 
+function findZoneY(
+	zonesY: ZoneY[],
+	nodeY: number,
+	nodeH: number,
+): ZoneY | undefined {
+	const direct = zonesY.find(
+		(z) =>
+			getOverlapY({ y: z.y, height: z.height }, { y: nodeY, height: nodeH }) >
+			0,
+	);
+	if (direct) return direct;
+	if (zonesY.length === 0) return undefined;
+
+	const maxZone = _.maxBy(zonesY, "y");
+	const minZone = _.minBy(zonesY, "y");
+	if (!minZone || !maxZone) return undefined;
+
+	if (nodeH && nodeY + nodeH < minZone.y) {
+		return { ...minZone, sort: minZone.sort - 1 };
+	}
+	if (nodeY > maxZone.y + maxZone.height) {
+		return { ...maxZone, sort: maxZone.sort + 1 };
+	}
+
+	const localZones = _.sortBy(zonesY, "y");
+	for (let i = 0; i < localZones.length - 1; i++) {
+		const currentZone = localZones[i];
+		const nextZone = localZones[i + 1];
+		if (nodeY > currentZone.y + currentZone.height && nodeY < nextZone.y) {
+			return { ...currentZone, sort: currentZone.sort + 0.5 };
+		}
+	}
+	return undefined;
+}
+
+function findZoneX(
+	zonesX: ZoneX[],
+	groupX: number,
+	nodeWidth: number,
+): ZoneX | undefined {
+	let zoneX: ZoneX | undefined;
+	let overlapX = 0;
+
+	for (const zone of zonesX) {
+		const overlap = getOverlapX(
+			{ x: zone.x, width: zone.width },
+			{ x: groupX, width: nodeWidth },
+		);
+		if (overlap > overlapX) {
+			overlapX = overlap;
+			zoneX = zone;
+		}
+	}
+	if (zoneX) return zoneX;
+	if (zonesX.length === 0) return undefined;
+
+	const maxZone = _.maxBy(zonesX, "x");
+	const minZone = _.minBy(zonesX, "x");
+	if (!minZone || !maxZone) return undefined;
+
+	if (groupX + nodeWidth < minZone.x) {
+		return {
+			...minZone,
+			parallelProcessingGroup: minZone.parallelProcessingGroup - 1,
+		};
+	}
+	if (groupX > maxZone.x + maxZone.width) {
+		return {
+			...maxZone,
+			parallelProcessingGroup: maxZone.parallelProcessingGroup + 1,
+		};
+	}
+
+	const localZones = _.sortBy(zonesX, "x");
+	for (let i = 0; i < localZones.length - 1; i++) {
+		const currentZone = localZones[i];
+		const nextZone = localZones[i + 1];
+		if (groupX > currentZone.x && groupX < nextZone.x + nextZone.width) {
+			return {
+				...currentZone,
+				parallelProcessingGroup: currentZone.parallelProcessingGroup + 0.5,
+			};
+		}
+	}
+	return undefined;
+}
+
+function reindexTasks(
+	tasks: Maybe<ProcessTaskExport>[] | undefined,
+): Maybe<ProcessTaskExport>[] {
+	if (!tasks) return [];
+
+	let prevParallelProcessingGroup: number | null = null;
+	let index = 0;
+
+	const sorted = _.sortBy(tasks, ["ParallelProcessingGroup", "Sort"]).map(
+		(task: Maybe<ProcessTaskExport>) => {
+			if (task) {
+				const ppg = task.ParallelProcessingGroup ?? null;
+				if (ppg !== prevParallelProcessingGroup) {
+					prevParallelProcessingGroup = ppg;
+					index++;
+				}
+				task.ParallelProcessingGroup = index;
+			}
+			return task;
+		},
+	);
+
+	const partitionedTasks = _.values(
+		_.groupBy(sorted, "ParallelProcessingGroup"),
+	);
+
+	let result: Maybe<ProcessTaskExport>[] = [];
+
+	partitionedTasks.forEach((partition: Maybe<ProcessTaskExport>[]) => {
+		let partIndex = 0;
+		let prevSort: number | null = null;
+
+		const sortedPartition = _.sortBy(partition, ["Sort", "Name"]).map(
+			(task: Maybe<ProcessTaskExport>) => {
+				if (task) {
+					const sortVal = task.Sort ?? null;
+					if (sortVal !== prevSort) {
+						prevSort = sortVal;
+						partIndex++;
+					}
+					task.Sort = partIndex;
+				}
+				return task;
+			},
+		);
+
+		result = result.concat(sortedPartition as Maybe<ProcessTaskExport>[]);
+	});
+
+	return result;
+}
+
 const IntegrationView: React.FC<Props> = ({
 	data: processExecutionInput,
 	variant,
@@ -217,9 +353,7 @@ const IntegrationView: React.FC<Props> = ({
 	onAdd,
 	canEdit,
 }: Props) => {
-	const [processExecutionDetails, _setProcess] = useState<
-		ProcessExecutionDetails | undefined
-	>(processExecutionInput);
+	const processExecutionDetails = processExecutionInput;
 
 	const [nodes, setNodes, onNodesChange] = useNodesState<FlowNode>([]);
 	const [edges, setEdges, onEdgesChange] = useEdgesState<FlowEdge>([]);
@@ -230,7 +364,7 @@ const IntegrationView: React.FC<Props> = ({
 
 	const onConnect = useCallback(() => {}, []);
 	const onLayout = useCallback(
-		(processInput: unknown) => {
+		(processInput: ConfigExport | ProcessExecutionDetails | undefined) => {
 			let tasks: (ProcessTask | ProcessTaskExecution)[] | undefined;
 
 			if (variant === "process") {
@@ -266,9 +400,9 @@ const IntegrationView: React.FC<Props> = ({
 				}
 
 				const mapped =
-					variant === "process"
+					variant === "process" && processInput && "Processes" in processInput
 						? mapProcessConfigToNodesAndEdges(
-								processInput as ConfigExport,
+								processInput,
 								width,
 								variant,
 								onAdd,
@@ -276,7 +410,7 @@ const IntegrationView: React.FC<Props> = ({
 						: mapProcessTasksToNodesAndEdges(
 								executionDetails as ProcessExecutionDetails,
 								width,
-								variant as "process" | "process-execution",
+								variant ?? "process-execution",
 							);
 
 				const opts = { ...elkOptions };
@@ -482,111 +616,13 @@ const IntegrationView: React.FC<Props> = ({
 	const handleNodeDragEnd = (_e: MouseEvent | TouchEvent, node: Node) => {
 		const nodeY = node?.position?.y ?? 0;
 		const nodeH = node?.height ?? 0;
-
-		let zoneY = zonesY.find(
-			(z) =>
-				getOverlapY({ y: z.y, height: z.height }, { y: nodeY, height: nodeH }) >
-				0,
-		);
-
-		if (!zoneY && zonesY.length > 0) {
-			const maxZone = _.maxBy(zonesY, "y");
-			const minZone = _.minBy(zonesY, "y");
-
-			if (minZone && maxZone) {
-				if (nodeH && nodeY + nodeH < minZone.y) {
-					zoneY = {
-						...minZone,
-						sort: minZone.sort - 1,
-					};
-				} else if (nodeY > maxZone.y + maxZone.height) {
-					zoneY = {
-						...maxZone,
-						sort: maxZone.sort + 1,
-					};
-				} else {
-					const localZones = _.sortBy(zonesY, "y");
-
-					for (let i = 0; i < localZones.length - 1; i++) {
-						const currentZone = localZones[i];
-						const nextZone = localZones[i + 1];
-
-						if (
-							nodeY > currentZone.y + currentZone.height &&
-							nodeY < nextZone.y
-						) {
-							zoneY = {
-								...currentZone,
-								sort: currentZone.sort + 0.5,
-							};
-							break;
-						}
-					}
-				}
-			}
-		}
-
 		const currentGroup = node?.parentId
 			? nodes.find((n) => n.id === node?.parentId)
 			: null;
+		const groupX = (currentGroup?.position?.x ?? 0) + node.position.x;
 
-		let zoneX: ZoneX | undefined;
-		let overlapX = 0;
-
-		for (const zone of zonesX) {
-			const overlap = getOverlapX(
-				{ x: zone.x, width: zone.width },
-				{
-					x: (currentGroup?.position?.x ?? 0) + node.position.x,
-					width: node.width ?? 0,
-				},
-			);
-
-			if (overlap > overlapX) {
-				overlapX = overlap;
-				zoneX = zone;
-			}
-		}
-
-		if (!zoneX && zonesX.length > 0) {
-			const maxZone = _.maxBy(zonesX, "x");
-			const minZone = _.minBy(zonesX, "x");
-
-			if (minZone && maxZone) {
-				const groupX = (currentGroup?.position?.x ?? 0) + node.position.x;
-
-				if (groupX + (node.width ?? 0) < minZone.x) {
-					zoneX = {
-						...minZone,
-						parallelProcessingGroup: minZone.parallelProcessingGroup - 1,
-					};
-				} else if (groupX > maxZone.x + maxZone.width) {
-					zoneX = {
-						...maxZone,
-						parallelProcessingGroup: maxZone.parallelProcessingGroup + 1,
-					};
-				} else {
-					const localZones = _.sortBy(zonesX, "x");
-
-					for (let i = 0; i < localZones.length - 1; i++) {
-						const currentZone = localZones[i];
-						const nextZone = localZones[i + 1];
-
-						if (
-							groupX > currentZone.x &&
-							groupX < nextZone.x + nextZone.width
-						) {
-							zoneX = {
-								...currentZone,
-								parallelProcessingGroup:
-									currentZone.parallelProcessingGroup + 0.5,
-							};
-							break;
-						}
-					}
-				}
-			}
-		}
+		const zoneY = findZoneY(zonesY, nodeY, nodeH);
+		const zoneX = findZoneX(zonesX, groupX, node.width ?? 0);
 
 		if (!zoneY && !zoneX) {
 			onLayout(processExecutionDetails);
@@ -600,93 +636,28 @@ const IntegrationView: React.FC<Props> = ({
 		const modifiedProcess: ConfigExport =
 			globalThis.structuredClone(configInput);
 
-		let updatedTasks = modifiedProcess.Processes?.[0]?.ProcessTasks?.map(
-			(task) => {
-				if (task && zoneX) {
-					const pt = (node?.data as { processTask?: ProcessTask })?.processTask;
-					const matches = pt?.id
-						? task.ProcessTaskId === pt.id
-						: task.Name === pt?.name;
-					if (matches) {
-						return {
-							...task,
-							ParallelProcessingGroup: zoneX.parallelProcessingGroup,
-						};
-					}
-				}
-				return task;
-			},
-		);
+		const pt = (node?.data as { processTask?: ProcessTask })?.processTask;
 
-		updatedTasks = updatedTasks?.map((task) => {
-			if (task && zoneY) {
-				const pt = (node?.data as { processTask?: ProcessTask })?.processTask;
+		const updatedTasks = modifiedProcess.Processes?.[0]?.ProcessTasks?.map(
+			(task) => {
+				if (!task) return task;
 				const matches = pt?.id
 					? task.ProcessTaskId === pt.id
 					: task.Name === pt?.name;
-				if (matches) {
-					return {
-						...task,
-						Sort: zoneY.sort,
-					};
-				}
-			}
-			return task;
-		});
-
-		let prevParallelProcessingGroup: number | null = null;
-		let index = 0;
-
-		updatedTasks = _.sortBy(updatedTasks, [
-			"ParallelProcessingGroup",
-			"Sort",
-		])?.map((task) => {
-			if (task) {
-				const ppg = task.ParallelProcessingGroup ?? null;
-				if (ppg !== prevParallelProcessingGroup) {
-					prevParallelProcessingGroup = ppg;
-					index++;
-				}
-
-				task.ParallelProcessingGroup = index;
-			}
-
-			return task;
-		});
-
-		const partitionedTasks = _.values(
-			_.groupBy(updatedTasks, "ParallelProcessingGroup"),
+				if (!matches) return task;
+
+				return {
+					...task,
+					...(zoneX && {
+						ParallelProcessingGroup: zoneX.parallelProcessingGroup,
+					}),
+					...(zoneY && { Sort: zoneY.sort }),
+				};
+			},
 		);
 
-		let processTaskValue: Maybe<ProcessTaskExport>[] = [];
-
-		partitionedTasks.forEach((partition) => {
-			index = 0;
-			let prevSort: number | null = null;
-
-			const sortedPartition = _.sortBy(partition, ["Sort", "Name"]).map(
-				(task) => {
-					if (task) {
-						const sortVal = task.Sort ?? null;
-						if (sortVal !== prevSort) {
-							prevSort = sortVal;
-							index++;
-						}
-
-						task.Sort = index;
-					}
-
-					return task;
-				},
-			);
-
-			processTaskValue = processTaskValue.concat(
-				sortedPartition as Maybe<ProcessTaskExport>[],
-			);
-		});
-
 		if (modifiedProcess?.Processes?.[0])
-			modifiedProcess.Processes[0].ProcessTasks = processTaskValue;
+			modifiedProcess.Processes[0].ProcessTasks = reindexTasks(updatedTasks);
 
 		if (onConfigChange) onConfigChange(modifiedProcess);
 	};