udp-react-enterprise-component-library 25.18.1-beta.75 → 25.18.1-beta.76

package/dist/UI/forms/index.js

@@ -1,5 +1,5 @@
 import { n as UdpCrudFormFields, t as CrudForm } from "../../CrudForm-C9xMnPoA.js";
-import { n as PaymentReversalForm, r as LoginForm, t as UdpTransactionEmailForm } from "../../forms-lyNriVSn.js";
+import { n as PaymentReversalForm, r as LoginForm, t as UdpTransactionEmailForm } from "../../forms-sRKithEr.js";
 import { t as VirtualForm } from "../../VirtualForm-Cw3gjug-.js";
 
 export { CrudForm, LoginForm, PaymentReversalForm, UdpCrudFormFields, UdpTransactionEmailForm, VirtualForm };

package/dist/UI/index.js

@@ -38,7 +38,7 @@ import { t as FormControl } from "../FormControl-CkybPp4U.js";
 import { t as IndicatorChip } from "../IndicatorChip-Dmaib9uq.js";
 import { t as InputAdornment } from "../InputAdornment-CLuALIhc.js";
 import { n as UdpCrudFormFields, t as CrudForm } from "../CrudForm-C9xMnPoA.js";
-import { n as PaymentReversalForm, r as LoginForm, t as UdpTransactionEmailForm } from "../forms-lyNriVSn.js";
+import { n as PaymentReversalForm, r as LoginForm, t as UdpTransactionEmailForm } from "../forms-sRKithEr.js";
 import { t as Box } from "../Box-Colr5GEl.js";
 import { t as Grid } from "../Grid-D1-yWIw5.js";
 import { t as VirtualForm } from "../VirtualForm-Cw3gjug-.js";

package/dist/{UdpTransactionsPage-DXt_i8vP.js → UdpTransactionsPage-Dr3XbvFa.js}

@@ -1,6 +1,7 @@
 import { t as __exportAll } from "./chunk-BN_g-Awi.js";
 import { t as Form } from "./Form-DbOA5j38.js";
 import { t as Field } from "./Field-Cda5rJe2.js";
+import { a as FormSpy } from "./form-Dj1zVw6K.js";
 import { t as FluentButton } from "./FluentButton-BexKrnAp.js";
 import { t as ConfigService$1 } from "./configService-C4uoG3wj.js";
 import { i as useHandleAxiosSnackbar } from "./apiHelpers-WIR8pqy0.js";
@@ -40,12 +41,14 @@ import { t as Attachments } from "./uploader-BdeUKdYW.js";
 import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { CircularProgress, FormControlLabel, LinearProgress, Switch, makeStyles } from "@material-ui/core";
 import { useSnackbar } from "notistack";
+import { useLocation } from "react-router-dom";
 import { AddIcon, ContactIcon, DocumentIcon, FileImageIcon, PDFIcon, ViewIcon, WordDocumentIcon } from "@fluentui/react-icons";
 import { useTranslation } from "react-i18next";
 import { create } from "zustand";
 import { devtools } from "zustand/middleware";
 import jsonLogic from "json-logic-js";
 import { ConfigService, UdpAttachmentItem, UdpTimelineConnector, UdpTimelineDot, UdpTimelineItem, UdpTimelineSeparator } from "udp-react-stencil-component-library";
+import "date-fns";
 import "./udp/pages/UdpTransactionsPage/sidesheets/WorkflowActions.css";
 import "./udp/pages/UdpTransactionsPage/sidesheets/EditTransaction.css";
 import "./udp/pages/UdpTransactionsPage/components/EditTransactionDetailsFooterItem.css";
@@ -175,7 +178,7 @@ const useTransactionEngine = (transactionTypeId) => {
 //#endregion
 //#region src/udp/pages/UdpTransactionsPage/UdpTransactionGrid.jsx
 const UdpTransactionGrid = (props) => {
-	const { transactionTypeId, domainName, transactionTypeLoading, handleGridApiCallback, openAddTransaction, openViewTransaction, openEditTransaction, openAttachmentTransaction, openWorkflowActionTransaction, openCreateRevision, searchMethodObject, domainColumnFormatters = {}, refreshGridData, gridApi, initialFilterModel } = props;
+	const { transactionTypeId, domainName, transactionTypeLoading, handleGridApiCallback, openAddTransaction, openViewTransaction, openEditTransaction, openAttachmentTransaction, openWorkflowActionTransaction, openCreateRevision, searchMethodObject, domainColumnFormatters = {}, refreshGridData, gridApi, initialFilterModel, initialGridOptions = {} } = props;
 	const [dialogOpen, setDialogOpen] = useState(false);
 	const [selectedTransaction, setSelectedTransaction] = useState(null);
 	const { t } = useTranslation();
@@ -382,9 +385,10 @@ const UdpTransactionGrid = (props) => {
 	const gridOptions = useMemo(() => {
 		return {
 			pagination: true,
-			rowSelection: "none"
+			rowSelection: "none",
+			...initialGridOptions
 		};
-	}, []);
+	}, [initialGridOptions]);
 	const searchMethodConfig = useMemo(() => {
 		let combinedSearchObject = {
 			eagerLoad: true,
@@ -420,6 +424,7 @@ const UdpTransactionGrid = (props) => {
 			gridApi.onFilterChanged();
 		}
 	}, [gridApi, initialFilterModel]);
+	console.log(gridApi?.getFilterModel());
 	return /* @__PURE__ */ React.createElement(React.Fragment, null, transactionTypeLoading && /* @__PURE__ */ React.createElement(LinearProgress$1, null), /* @__PURE__ */ React.createElement(SearchMethodUdpGrid, {
 		gridHeaderConfig: headerConfig,
 		gridFunctions,
@@ -624,7 +629,7 @@ var AttachmentTransaction_default = AttachmentTransaction;
 //#endregion
 //#region src/udp/pages/UdpTransactionsPage/components/UdpTransactionCustomPage.jsx
 const UdpTransactionCustomPage = (props) => {
-	const { pageId, transactionTypeId, transactionUiActionType, formRef, transaction, transactionTypeTransactionActionId } = props;
+	const { pageId, transactionTypeId, transactionUiActionType, formRef, transaction, transactionTypeTransactionActionId, setHasUnsavedChanges } = props;
 	const { getUiActionRenderPageId, getHiddenFields, getRequiredFields } = useTransactionEngine(transactionTypeId);
 	const { handleErrorSnackbar, handleSuccessSnackbar } = useHandleAxiosSnackbar();
 	const { t } = useTranslation();
@@ -659,6 +664,11 @@ const UdpTransactionCustomPage = (props) => {
 			else handleErrorSnackbar(new Error(t(`Error ${errorMessagePart} Transaction. Please try again later.`)));
 		} catch (error) {
 			handleErrorSnackbar(error);
+		} finally {
+			if (setHasUnsavedChanges) {
+				formRef.current?.form?.restart(values);
+				setHasUnsavedChanges(false);
+			}
 		}
 	}, [
 		executeCreateTransactionAction,
@@ -669,7 +679,9 @@ const UdpTransactionCustomPage = (props) => {
 		transactionUiActionType,
 		executeSubmitCustomAction,
 		t,
-		transactionTypeTransactionActionId
+		transactionTypeTransactionActionId,
+		setHasUnsavedChanges,
+		formRef
 	]);
 	const isFieldRequired = useCallback((fieldName) => {
 		return getRequiredFields(transaction)?.includes(fieldName);
@@ -689,7 +701,9 @@ const UdpTransactionCustomPage = (props) => {
 	return /* @__PURE__ */ React.createElement(Form, {
 		onSubmit,
 		ref: formRef
-	}, /* @__PURE__ */ React.createElement(PageContainer, {
+	}, /* @__PURE__ */ React.createElement(FormSpy, { subscription: { dirty: true } }, ({ dirty }) => {
+		if (setHasUnsavedChanges) setHasUnsavedChanges(dirty);
+	}), /* @__PURE__ */ React.createElement(PageContainer, {
 		pageId: transactionPageId,
 		updateLocationState: false,
 		widgetParams: {
@@ -1442,7 +1456,7 @@ var EditTransactionDetailsForm_default = EditTransactionDetailsForm;
 //#endregion
 //#region src/udp/pages/UdpTransactionsPage/sidesheets/EditTransaction.jsx
 const EditTransaction = (props) => {
-	const { transaction: initialTransaction, transactionTypeId, transactionIsClosed, openInnerSidesheetState, setOpenInnerSidesheetState, refreshGridData, closeSideSheet, setSidesheetLoading } = props;
+	const { transaction: initialTransaction, transactionTypeId, transactionIsClosed, openInnerSidesheetState, setOpenInnerSidesheetState, refreshGridData, closeSideSheet, setSidesheetLoading, setHasUnsavedChanges } = props;
 	const { t } = useTranslation();
 	const [selectedTab, setSelectedTab] = useState(0);
 	const [transaction, setTransaction] = useState(initialTransaction);
@@ -1723,7 +1737,8 @@ const EditTransaction = (props) => {
 		transactionTypeId,
 		transactionUiActionType: TransactionUiActionTypeEnums.Render_Transaction_Details_Page,
 		formRef,
-		transaction
+		transaction,
+		setHasUnsavedChanges
 	}) : /* @__PURE__ */ React.createElement(EditTransactionDetailsForm_default, {
 		transaction,
 		formRef
@@ -1780,6 +1795,8 @@ const UdpTransactionSidesheet = (props) => {
 		notes: false
 	});
 	const [dialogOpen, setDialogOpen] = useState(false);
+	const [unsavedChangesDialogOpen, setUnsavedChangesDialogOpen] = useState(false);
+	const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
 	const { handleSuccessSnackbar, handleErrorSnackbar } = useHandleAxiosSnackbar();
 	const { hasClosedStatus, checkIfTransactionIsClosed, getTransactionTypeLabel, getUiActionRenderPageId } = useTransactionEngine(transactionTypeId);
 	const { t } = useTranslation();
@@ -1790,6 +1807,9 @@ const UdpTransactionSidesheet = (props) => {
 	const handleDialogClose = () => {
 		setDialogOpen(false);
 	};
+	const handleUnsavedChangesDialogClose = () => {
+		setUnsavedChangesDialogOpen(false);
+	};
 	const executeCloseTransaction = useCallback(async () => {
 		if ((await apiMutate(ConfigService$1.productV1ApiUrl, `udpTransaction/${transaction?.transactionId}/closeTransaction`, { method: "post" }))?.status === 200) {
 			handleSidesheet("edit", false);
@@ -1829,7 +1849,7 @@ const UdpTransactionSidesheet = (props) => {
 	]);
 	const handleCreateRevision = useCallback(async () => {
 		setSidesheetLoading(true);
-		formRef.current?.form?.submit();
+		await formRef.current?.form?.submit();
 		setSidesheetLoading(false);
 		handleSidesheet("createRevision", false);
 		refreshGridData();
@@ -1838,6 +1858,14 @@ const UdpTransactionSidesheet = (props) => {
 		refreshGridData,
 		formRef
 	]);
+	const handleNextStepsAction = useCallback(() => {
+		if (!hasUnsavedChanges) setEditTransactionOpenInnerSidesheetState({ workflowAction: true });
+		else setUnsavedChangesDialogOpen(true);
+	}, [hasUnsavedChanges]);
+	const handleConfirmUnsavedChangesDialog = useCallback(() => {
+		setUnsavedChangesDialogOpen(false);
+		setEditTransactionOpenInnerSidesheetState({ workflowAction: true });
+	}, []);
 	const pdfViewPageId = useMemo(() => {
 		return getUiActionRenderPageId(TransactionUiActionTypeEnums.Render_View_Pdf_Page);
 	}, [getUiActionRenderPageId]);
@@ -1918,7 +1946,7 @@ const UdpTransactionSidesheet = (props) => {
 				width: sidesheetWidth,
 				buttonLabel: "Next Steps",
 				buttonOneDisabled: transactionIsClosed,
-				onSubmit: () => setEditTransactionOpenInnerSidesheetState({ workflowAction: true }),
+				onSubmit: handleNextStepsAction,
 				buttonTwoLabel: "Close " + domainName,
 				buttonTwoDisabled: transactionIsClosed || !hasClosedStatus,
 				buttonTwoAction: () => setDialogOpen(true),
@@ -1930,7 +1958,8 @@ const UdpTransactionSidesheet = (props) => {
 					setOpenInnerSidesheetState: setEditTransactionOpenInnerSidesheetState,
 					refreshGridData,
 					closeSideSheet: () => handleSidesheet("edit", false),
-					setSidesheetLoading
+					setSidesheetLoading,
+					setHasUnsavedChanges
 				})
 			},
 			{
@@ -1965,7 +1994,8 @@ const UdpTransactionSidesheet = (props) => {
 		transactionIsClosed,
 		viewTransactionPage,
 		pdfViewPageId,
-		sidesheetWidth
+		sidesheetWidth,
+		handleNextStepsAction
 	]);
 	return /* @__PURE__ */ React.createElement(React.Fragment, null, openStates && sidesheetList.map((item) => {
 		return /* @__PURE__ */ React.createElement(SideSheet, {
@@ -1984,7 +2014,7 @@ const UdpTransactionSidesheet = (props) => {
 			buttonTwoDisabled: item?.buttonTwoDisabled,
 			progress: sidesheetLoading,
 			variant: "indeterminate"
-		}, sidesheetLoading && /* @__PURE__ */ React.createElement(LinearProgress$1, null), /* @__PURE__ */ React.createElement("div", null, item.children));
+		}, /* @__PURE__ */ React.createElement("div", null, item.children));
 	}), /* @__PURE__ */ React.createElement(FluentDialog, {
 		title: t(`Close Transaction`),
 		message: `Are you sure you want to close transaction for ${transaction?.entityBusinessKey || ""}?`,
@@ -1995,6 +2025,16 @@ const UdpTransactionSidesheet = (props) => {
 		open: dialogOpen,
 		handleClose: handleDialogClose,
 		loading: closingTransactionLoading
+	}), /* @__PURE__ */ React.createElement(FluentDialog, {
+		title: t(`Unsaved Changes`),
+		message: `You have unsaved changes. Are you sure you want to go to next steps?`,
+		labelOne: t("Confirm"),
+		actionOne: handleConfirmUnsavedChangesDialog,
+		labelTwo: t("Cancel"),
+		actionTwo: handleUnsavedChangesDialogClose,
+		open: unsavedChangesDialogOpen,
+		handleClose: handleUnsavedChangesDialogClose,
+		loading: closingTransactionLoading
 	}));
 };
 var UdpTransactionSidesheet_default = UdpTransactionSidesheet;
@@ -2063,10 +2103,63 @@ const useTransactionType = (options = {}) => {
 	};
 };
 
+//#endregion
+//#region src/hooks/useUdpGridFilterModel.js
+const useUdpGridFilterModel = () => {
+	const { search } = useLocation();
+	const searchParams = useMemo(() => new URLSearchParams(search), [search]);
+	return useMemo(() => {
+		const constructedFilterModel = {};
+		searchParams.forEach((value, key) => {
+			if (key.startsWith("udp_search-")) {
+				const paramBody = key.replace("udp_search-", "");
+				const lastHyphenIndex = paramBody.lastIndexOf("-");
+				if (lastHyphenIndex !== -1) {
+					const field = paramBody.substring(0, lastHyphenIndex);
+					const operator = paramBody.substring(lastHyphenIndex + 1).replace(/_([a-z])/g, (_, char) => char.toUpperCase());
+					const { filterType, filterKey, parsedValue } = parseFilterValue(value);
+					if (constructedFilterModel[field]) constructedFilterModel[field].conditions.push({
+						filterType,
+						type: operator,
+						[filterKey]: parsedValue
+					});
+					else constructedFilterModel[field] = {
+						filterType,
+						operator: "OR",
+						conditions: [{
+							filterType,
+							type: operator,
+							[filterKey]: parsedValue
+						}]
+					};
+				}
+			}
+		});
+		return constructedFilterModel;
+	}, [searchParams]);
+};
+const parseFilterValue = (value) => {
+	if (!isNaN(Date.parse(value)) && (value.includes("-") || value.includes("/"))) return {
+		filterType: "date",
+		filterKey: "dateFrom",
+		parsedValue: value
+	};
+	if (!isNaN(value) && !isNaN(parseFloat(value))) return {
+		filterType: "number",
+		filterKey: "filter",
+		parsedValue: Number(value)
+	};
+	return {
+		filterType: "text",
+		filterKey: "filter",
+		parsedValue: value
+	};
+};
+
 //#endregion
 //#region src/udp/pages/UdpTransactionsPage/UdpTransactionsPage.jsx
 const UdpTransactionsPage = (props) => {
-	const { transactionTypeId = "", domainName: initialDomainName = "", domainFieldType, domainFieldValue, searchMethodObject, domainColumnFormatters, initialFilterModel } = props;
+	const { transactionTypeId = "", domainName: initialDomainName = "", domainFieldType, domainFieldValue, searchMethodObject, domainColumnFormatters, gridOptions } = props;
 	const [sidesheetState, setSidesheetState] = useState({
 		workflowAction: false,
 		addTransaction: false,
@@ -2084,6 +2177,7 @@ const UdpTransactionsPage = (props) => {
 		domainFieldValue
 	});
 	useTransactionEngine(transactionType?.transactionTypeId);
+	const filterModel = useUdpGridFilterModel();
 	const handleSidesheet = (actionType, openStatus, transaction, width = 800) => {
 		if (actionType == "add") setSidesheetState({
 			addTransaction: openStatus,
@@ -2150,7 +2244,8 @@ const UdpTransactionsPage = (props) => {
 			gridApi?.refreshServerSide();
 		},
 		gridApi,
-		initialFilterModel
+		initialFilterModel: filterModel,
+		initialGridOptions: gridOptions
 	}), /* @__PURE__ */ React.createElement(UdpTransactionSidesheet_default, {
 		openStates: sidesheetState,
 		handleSidesheet,
@@ -2171,4 +2266,4 @@ var UdpTransactionsPage_exports = /* @__PURE__ */ __exportAll({ default: () => U
 
 //#endregion
 export { UdpTransactionsPage_default as n, UdpTransactionsPage_exports as t };
-//# sourceMappingURL=UdpTransactionsPage-DXt_i8vP.js.map
+//# sourceMappingURL=UdpTransactionsPage-Dr3XbvFa.js.map