udp-react-enterprise-component-library 1.0.4 → 1.0.5-beta.2

package/dist/MyExportsPage-CcO8Mf8y.cjs

@@ -0,0 +1,778 @@
+const require_chunk = require('./chunk-DoeelZqw.cjs');
+const require_AmbientGridTemplate = require('./AmbientGridTemplate-CvXWVsCb.cjs');
+const require_EnvironmentRibbon = require('./EnvironmentRibbon-CgKsTmQ7.cjs');
+const require_apiHelpers = require('./apiHelpers-Dyq5plHt.cjs');
+const require_SearchUtilities = require('./SearchUtilities-BYR03EFr.cjs');
+const react = require_chunk.__toESM(require("react"));
+const __material_ui_core = require_chunk.__toESM(require("@material-ui/core"));
+const react_jsx_runtime = require_chunk.__toESM(require("react/jsx-runtime"));
+const udp_react_stencil_component_library = require_chunk.__toESM(require("udp-react-stencil-component-library"));
+const __material_ui_lab_Autocomplete = require_chunk.__toESM(require("@material-ui/lab/Autocomplete"));
+const clsx = require_chunk.__toESM(require("clsx"));
+const __fluentui_react_icons = require_chunk.__toESM(require("@fluentui/react-icons"));
+const prop_types = require_chunk.__toESM(require("prop-types"));
+const lodash = require_chunk.__toESM(require("lodash"));
+const __material_ui_lab = require_chunk.__toESM(require("@material-ui/lab"));
+
+//#region src/utilities/aggrid/datasources/SearchServiceDatasource.js
+const SearchServiceDatasource = (queryData, apiMethodId, searchFilterElements, logicalSearchOperator = require_EnvironmentRibbon.LogicalSearchOperatorEnums.And, executeQuery, storeRowData, lookupsMap, eagerLoad = false, getCleanData = null) => {
+	return { async getRows(params) {
+		const { startRow, endRow, rowGroupCols, groupKeys, valueCols, filterModel, sortModel } = params.request;
+		const page = endRow / 20;
+		const originalSearchObject = require_SearchUtilities.getSearchObject(searchFilterElements, page, null, eagerLoad, logicalSearchOperator);
+		const searchObject = (0, lodash.cloneDeep)(originalSearchObject);
+		if (sortModel.length) {
+			const orderElements = searchObject.orderElements;
+			sortModel.forEach((sortItem) => {
+				const formattedPropertyName = sortItem.colId.charAt(0).toUpperCase() + sortItem.colId.slice(1);
+				const element = orderElements.find((element$1) => element$1.sortColumn === formattedPropertyName);
+				if (element) element.sortDirection = sortItem.sort.toUpperCase();
+				else orderElements.push({
+					sortColumn: formattedPropertyName,
+					sortDirection: sortItem.sort.toUpperCase()
+				});
+			});
+		}
+		if (Object.keys(filterModel).length) {
+			const filterElements = searchObject.filterElements;
+			Object.keys(filterModel).forEach((key) => {
+				const filterItem = filterModel[key];
+				const formattedPropertyName = key.charAt(0).toUpperCase() + key.slice(1);
+				filterElements.push({
+					searchField: formattedPropertyName,
+					searchValue: filterItem.filter,
+					searchOperator: require_AmbientGridTemplate.FilterOperators[filterItem.type]
+				});
+			});
+		}
+		if (rowGroupCols.length && !groupKeys.length) {
+			const formattedPropertyName = rowGroupCols[0].field.charAt(0).toUpperCase() + rowGroupCols[0].field.slice(1);
+			searchObject.groupingType = require_EnvironmentRibbon.SearchGroupingType.Distinct;
+			if (!searchObject.groupProperty.includes(formattedPropertyName)) {
+				searchObject.groupProperty.push(formattedPropertyName);
+				const orderElements = searchObject.orderElements;
+				const element = orderElements.find((element$1) => element$1.sortColumn === formattedPropertyName);
+				if (!element) orderElements.push({
+					sortColumn: formattedPropertyName,
+					sortDirection: require_EnvironmentRibbon.SearchSortDirection.Asc
+				});
+			}
+		}
+		if (groupKeys.length) if (groupKeys.length === rowGroupCols.length) {
+			searchObject.groupingType = "";
+			const filterElements = searchObject.filterElements;
+			groupKeys.forEach((key, index) => {
+				const rowGroupCol = rowGroupCols[index];
+				const formattedPropertyName = rowGroupCol.field.charAt(0).toUpperCase() + rowGroupCol.field.slice(1);
+				const element = filterElements.find((element$1) => element$1.searchField === formattedPropertyName);
+				let currentNode = null;
+				params.api.forEachNode((node) => {
+					var _node$data;
+					const nodeKey = node.field;
+					if ((nodeKey === null || nodeKey === void 0 ? void 0 : nodeKey.toLowerCase()) === (formattedPropertyName === null || formattedPropertyName === void 0 ? void 0 : formattedPropertyName.toLowerCase()) && (node === null || node === void 0 || (_node$data = node.data) === null || _node$data === void 0 ? void 0 : _node$data[nodeKey]) === key) {
+						currentNode = node;
+						return;
+					}
+				});
+				let searchValue = key;
+				if (currentNode) {
+					const cleanData = getCleanData ? getCleanData(currentNode.data, lookupsMap) : null;
+					if (cleanData) searchValue = cleanData[currentNode.field];
+				}
+				if (element) {
+					element.searchValue = searchValue;
+					element.searchOperator = "=";
+				} else filterElements.push({
+					searchField: formattedPropertyName,
+					searchValue,
+					searchOperator: "="
+				});
+			});
+		} else {
+			groupKeys.forEach((key, index) => {
+				const formattedPropertyNameForSearch = rowGroupCols[index].field.charAt(0).toUpperCase() + rowGroupCols[index].field.slice(1);
+				let currentNode = null;
+				params.api.forEachNode((node) => {
+					var _node$data2;
+					const nodeKey = node.field;
+					if ((nodeKey === null || nodeKey === void 0 ? void 0 : nodeKey.toLowerCase()) === (formattedPropertyNameForSearch === null || formattedPropertyNameForSearch === void 0 ? void 0 : formattedPropertyNameForSearch.toLowerCase()) && (node === null || node === void 0 || (_node$data2 = node.data) === null || _node$data2 === void 0 ? void 0 : _node$data2[nodeKey]) === key) {
+						currentNode = node;
+						return;
+					}
+				});
+				let searchValue = key;
+				if (currentNode) {
+					const cleanData = getCleanData ? getCleanData(currentNode.data, lookupsMap) : null;
+					if (cleanData) searchValue = cleanData[currentNode.field];
+				}
+				searchObject.filterElements.push({
+					searchField: formattedPropertyNameForSearch,
+					searchValue,
+					searchOperator: "="
+				});
+			});
+			searchObject.groupingType = require_EnvironmentRibbon.SearchGroupingType.Distinct;
+			const searchIndex = groupKeys.length;
+			const rowGroupCol = rowGroupCols[searchIndex];
+			const formattedPropertyName = rowGroupCol.field.charAt(0).toUpperCase() + rowGroupCol.field.slice(1);
+			if (!searchObject.groupProperty.includes(formattedPropertyName)) {
+				searchObject.groupProperty.push(formattedPropertyName);
+				const orderElements = searchObject.orderElements;
+				const element = orderElements.find((element$1) => element$1.sortColumn === formattedPropertyName);
+				if (!element) orderElements.push({
+					sortColumn: formattedPropertyName,
+					sortDirection: require_EnvironmentRibbon.SearchSortDirection.Asc
+				});
+			}
+		}
+		if (!startRow && rowGroupCols.length === 0 && !sortModel.length && !Object.keys(filterModel).length && !groupKeys.length && queryData) if (queryData.pageList && queryData.pageList) {
+			params.success({
+				rowData: queryData.pageList,
+				rowCount: parseInt(queryData.total)
+			});
+			if (storeRowData) storeRowData(queryData.pageList);
+		} else {
+			params.success({
+				rowData: [],
+				rowCount: 0
+			});
+			if (storeRowData) storeRowData([]);
+		}
+		else {
+			let response = null;
+			if (executeQuery) {
+				const data = { data: searchObject };
+				response = await executeQuery(data, apiMethodId, lookupsMap).catch((e) => params.success({
+					rowData: [],
+					rowCount: 0
+				}));
+			}
+			const rowData = (response === null || response === void 0 ? void 0 : response.status) === 200 ? response === null || response === void 0 ? void 0 : response.data : response;
+			if (rowData && response) {
+				var _rowData$pageList;
+				if ((rowData === null || rowData === void 0 || (_rowData$pageList = rowData.pageList) === null || _rowData$pageList === void 0 ? void 0 : _rowData$pageList.length) > 0) {
+					params.success({
+						rowData: rowData.pageList,
+						rowCount: parseInt(rowData.total)
+					});
+					if (storeRowData) storeRowData(rowData.pageList);
+				} else {
+					params.success({
+						rowData: [],
+						rowCount: 0
+					});
+					if (storeRowData) storeRowData([]);
+				}
+			} else {
+				params.success({
+					rowData: [],
+					rowCount: 0
+				});
+				if (storeRowData) storeRowData([]);
+			}
+		}
+	} };
+};
+
+//#endregion
+//#region src/maintenanceEngine/tableBrowser/TableColumnDefs.js
+const TableColumnDefs = (actionList) => {
+	const getterRowData = (0, react.useCallback)((params) => {
+		return params.data;
+	}, []);
+	const columnDefs = [{
+		headerName: "Name",
+		field: "entityName",
+		valueGetter: (params) => {
+			var _params$data, _params$data2, _params$data3;
+			return ((_params$data = params.data) === null || _params$data === void 0 || (_params$data = _params$data.properties) === null || _params$data === void 0 ? void 0 : _params$data.displayName) || ((_params$data2 = params.data) === null || _params$data2 === void 0 ? void 0 : _params$data2.sanitizedName) || require_AmbientGridTemplate.getSanitizedName((_params$data3 = params.data) === null || _params$data3 === void 0 ? void 0 : _params$data3.entityName);
+		},
+		wrapText: true,
+		autoHeight: false,
+		sortable: false
+	}, {
+		headerName: "Actions",
+		filter: false,
+		pinned: "right",
+		cellRenderer: "actionsRenderer",
+		width: 150,
+		cellRendererParams: { actionList },
+		valueGetter: getterRowData,
+		maxWidth: 180,
+		suppressMenu: true,
+		sortable: false,
+		cellStyle: {
+			display: "flex",
+			alignItems: "center"
+		}
+	}];
+	return columnDefs;
+};
+const defaultColumnActionsDef = {
+	resizable: true,
+	editable: false,
+	sortable: true,
+	filter: true,
+	floatingFilter: false,
+	enableRowGroup: true
+};
+
+//#endregion
+//#region src/maintenanceEngine/tableBrowser/TableContainer.jsx
+const TableContainer = (props) => {
+	const { actionList, loading, rowData, catalog, isServerSide = false, promotedEntity, filterElements, customColumnDefs, eagerLoad = false, logicalSearchOperator = 1, frameworkComponents = { actionsRenderer: require_AmbientGridTemplate.ActionsRenderer }, additionalGridOptions, headerBackgroundColor, api, columnApi, gridReady, dynamicSizing,...other } = props;
+	const { gridApi, gridColumnApi, onGridReady } = require_AmbientGridTemplate.useAgGridApi();
+	const gApi = api || gridApi;
+	const cApi = columnApi || gridColumnApi;
+	const gReady = gridReady || onGridReady;
+	const buildEnv = require_EnvironmentRibbon.useBuildEnvironment();
+	const columnDefs = customColumnDefs || TableColumnDefs(actionList);
+	const groupData = (0, react.useMemo)(() => {
+		return columnDefs === null || columnDefs === void 0 ? void 0 : columnDefs.map((item) => {
+			return {
+				groupItem: item.field,
+				label: item.headerName,
+				value: item.field
+			};
+		});
+	}, [columnDefs]);
+	(0, react.useEffect)(() => {
+		if (!gApi) return;
+		if (promotedEntity && isServerSide) {
+			var _promotedEntity$unity;
+			let datasource = SearchServiceDatasource(null, promotedEntity === null || promotedEntity === void 0 || (_promotedEntity$unity = promotedEntity.unityBaseSearchMethod) === null || _promotedEntity$unity === void 0 ? void 0 : _promotedEntity$unity.apiMethodId, filterElements, logicalSearchOperator, require_EnvironmentRibbon.executeQueryAdHoc, null, null, eagerLoad);
+			gApi === null || gApi === void 0 || gApi.setServerSideDatasource(datasource);
+		}
+	}, [
+		gApi,
+		promotedEntity,
+		isServerSide,
+		filterElements,
+		eagerLoad,
+		logicalSearchOperator
+	]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AmbientGridTemplate.AmbientGridTemplate, {
+		useNewHeader: true,
+		api: gApi,
+		onGridReady: gReady,
+		columnApi: cApi,
+		title: catalog === null || catalog === void 0 ? void 0 : catalog.name,
+		data: !isServerSide && rowData,
+		columnDefs,
+		groupingData: groupData,
+		height: `calc(100vh - ${buildEnv ? "139px" : "114px"})`,
+		frameworkComponents,
+		hideSearchBar: isServerSide,
+		loading,
+		suppressScrollOnNewData: true,
+		dynamicSizing: dynamicSizing !== null && dynamicSizing !== void 0 ? dynamicSizing : false,
+		disableRowSelection: true,
+		rowModelType: isServerSide ? "serverSide" : null,
+		serverSideStoreType: isServerSide ? "partial" : null,
+		cacheOverflowSize: isServerSide ? 2 : null,
+		cacheBlockSize: isServerSide ? 20 : null,
+		maxConcurrentDatasourceRequests: isServerSide ? 1 : null,
+		additionalGridOptions,
+		headerBackgroundColor,
+		...other
+	});
+};
+
+//#endregion
+//#region src/UI/inputs/textField/AmbientAutoComplete.jsx
+const useStyles$2 = (0, __material_ui_core.makeStyles)((theme) => ({
+	input: {
+		borderRadius: 2,
+		minHeight: 32,
+		padding: 0,
+		paddingTop: "0 !important",
+		paddingBottom: (props) => props.isMultiple ? "0 !important" : 10,
+		marginTop: 3,
+		"& .MuiFilledInput-inputMarginDense": { paddingTop: 8 },
+		"& .MuiFilledInput-root": { paddingTop: 0 },
+		"& .MuiInputAdornment-filled.MuiInputAdornment-positionStart:not(.MuiInputAdornment-hiddenLabel)": {
+			marginTop: theme.spacing(.5),
+			marginLeft: theme.spacing(1)
+		}
+	},
+	formTextInput: {
+		fontSize: 14,
+		marginTop: "2px !important",
+		paddingBottom: "2px !important"
+	},
+	labelRoot: { fontSize: 14 },
+	root: {
+		marginTop: 25,
+		"& .MuiFormLabel-root": {
+			marginTop: -30,
+			marginLeft: -11
+		},
+		"& .MuiInputAdornment-root": { paddingLeft: theme.spacing(1) }
+	},
+	noLabel: { marginTop: theme.spacing(1) },
+	formControl: { width: "100%" }
+}));
+const AutoCompletePopper = (props) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Popper, {
+		...props,
+		placement: "bottom-start"
+	});
+};
+const AmbientAutoComplete = (props) => {
+	const { getOptionLabelFunction, getOptionSelected, label, placeholder, options, textFieldProps, disabled, onChange: onChangeProp, value, additionalOnChangeAction, classes: classProps, variant = "filled", inputProps, inputPropClasses, customPopper, disableClearable = false, defaultValue, additionalOptionKey, isMultiple = false, limitTags, renderTags, size = "medium", groupBy = null, loading, disableCloseOnSelect = false,...other } = props;
+	const classes = useStyles$2(props);
+	const { autocompleteRoot } = classProps || {};
+	const onChange = (0, react.useCallback)((e, value$1) => {
+		if (additionalOnChangeAction) additionalOnChangeAction(value$1);
+		return onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(value$1);
+	}, [onChangeProp, additionalOnChangeAction]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_lab_Autocomplete.default, {
+		id: "autocomplete",
+		multiple: isMultiple,
+		limitTags,
+		disabled,
+		options: options || [],
+		loading,
+		getOptionLabel: getOptionLabelFunction,
+		getOptionSelected,
+		groupBy,
+		onChange,
+		value: value || (isMultiple ? [] : null),
+		className: autocompleteRoot,
+		classes: { root: classes.formControl },
+		PopperComponent: customPopper || AutoCompletePopper,
+		disableClearable,
+		defaultValue,
+		size,
+		disableCloseOnSelect,
+		renderInput: (params) => {
+			var _props$InputProps;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: label ? classes.root : classes.noLabel,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.TextField, {
+					...textFieldProps,
+					...params,
+					...other,
+					label,
+					margin: "dense",
+					variant,
+					size: "small",
+					InputProps: {
+						...params.InputProps,
+						classes: {
+							root: classes.input,
+							input: classes.formTextInput,
+							...(_props$InputProps = props.InputProps) === null || _props$InputProps === void 0 ? void 0 : _props$InputProps.classes
+						}
+					},
+					InputLabelProps: {
+						shrink: false,
+						classes: {
+							root: classes.labelRoot,
+							focused: classes.labelFocused
+						}
+					}
+				})
+			});
+		},
+		renderTags
+	});
+};
+
+//#endregion
+//#region src/UI/dataDisplay/EmptyStateDisplay.jsx
+const useStyles$1 = (0, __material_ui_core.makeStyles)((theme) => ({
+	container: {
+		display: "flex",
+		flexDirection: "column",
+		alignItems: "center",
+		justifyContent: "center",
+		height: "100%",
+		width: "100%"
+	},
+	secondaryText: { color: theme.palette.text.secondary },
+	image: { width: (props) => props === null || props === void 0 ? void 0 : props.imageWidth }
+}));
+const EmptyStateDisplay = (props) => {
+	const { icon, iconSize = 48, customIconSize = true, imageSrc, imageWidth = "100px", primaryText, secondaryText, actionLabel, action } = props;
+	const classes = useStyles$1({ imageWidth });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: classes.container,
+		children: [
+			imageSrc ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+				src: imageSrc,
+				alt: "logo",
+				className: classes.image
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.FluentIcon, {
+				component: icon !== null && icon !== void 0 ? icon : __fluentui_react_icons.ErrorIcon,
+				size: iconSize,
+				customSize: customIconSize
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.LayoutUnit, { unit: "xxs" }),
+			primaryText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
+				variant: "subtitle2",
+				align: "center",
+				children: primaryText
+			}) }),
+			secondaryText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
+				className: classes.secondaryText,
+				align: "center",
+				children: secondaryText
+			}) }),
+			(primaryText || secondaryText) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.LayoutUnit, { unit: "xxs" }),
+			action && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: primaryText || secondaryText ? classes.buttonWrapper : "",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.FluentButton, {
+					onClick: action,
+					variant: "outlined",
+					color: "secondary",
+					id: "udpRecord-EmptyStateDisplay-" + primaryText.replace(/\s+/g, "") + "-" + actionLabel.replace(/\s+/g, ""),
+					udprecordid: "udpRecord-EmptyStateDisplay-" + primaryText.replace(/\s+/g, "") + "-" + actionLabel.replace(/\s+/g, ""),
+					children: actionLabel
+				})
+			})
+		]
+	});
+};
+EmptyStateDisplay.propTypes = {
+	icon: prop_types.default.elementType,
+	iconSize: prop_types.default.number,
+	customIconSize: prop_types.default.bool,
+	imageSrc: prop_types.default.string,
+	imageWidth: prop_types.default.string,
+	primaryText: prop_types.default.string,
+	secondaryText: prop_types.default.string,
+	actionLabel: prop_types.default.string,
+	action: prop_types.default.func
+};
+EmptyStateDisplay.defaultProps = {
+	iconSize: 48,
+	customIconSize: true,
+	imageWidth: "100px"
+};
+
+//#endregion
+//#region src/UI/feedback/AmbientAlert.jsx
+const useStyles = (0, __material_ui_core.makeStyles)((theme) => ({
+	root: {},
+	"@global": { ".MuiPaper-rounded": { borderRadius: 0 } },
+	alertSuccess: { borderLeft: `4px solid ${theme.palette.success.main}` },
+	alertWarning: { borderLeft: `4px solid ${theme.palette.warning.main}` },
+	alertError: {
+		borderLeft: `4px solid ${theme.palette.error.main}`,
+		color: theme.palette.error.main
+	},
+	alertInfo: { borderLeft: `4px solid ${theme.palette.info.main}` },
+	square: { borderRadius: 0 }
+}));
+const AmbientAlert = ({ alertButton, alertMessage, alertTitle, showAlert, alertSeverity, closeAlert, alertAction, alertActionButton, alertHandleAction,...otherProps }) => {
+	const classes = useStyles();
+	const alertColor = () => {
+		if (alertSeverity === "success") {
+			let alertLevel = classes.alertSuccess;
+			return alertLevel;
+		} else if (alertSeverity === "warning") {
+			let alertLevel = classes.alertWarning;
+			return alertLevel;
+		} else if (alertSeverity === "error") {
+			let alertLevel = classes.alertError;
+			return alertLevel;
+		} else if (alertSeverity === "info") {
+			let alertLevel = classes.alertInfo;
+			return alertLevel;
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: showAlert && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__material_ui_lab.Alert, {
+		classes: { root: (0, clsx.default)(alertColor(), classes.square) },
+		...otherProps,
+		severity: alertSeverity,
+		onClose: closeAlert,
+		action: alertAction ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Button, {
+			onClick: alertHandleAction,
+			id: "udpRecord-AmbientAlert-alertActionButton",
+			udprecordid: "udpRecord-AmbientAlert-alertActionButton",
+			children: alertActionButton
+		}) : null,
+		children: [alertTitle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_lab.AlertTitle, { children: alertTitle }), alertMessage]
+	}) });
+};
+
+//#endregion
+//#region src/UI/templates/ui/renderers/StatusCellRenderer.jsx
+const StatusCellRenderer = (props) => {
+	const { value, getStatus, getLabel } = props;
+	const formattedLabel = (value$1) => {
+		var _value$replace;
+		return value$1 === null || value$1 === void 0 || (_value$replace = value$1.replace(/([a-z])([A-Z])/g, "$1 $2")) === null || _value$replace === void 0 ? void 0 : _value$replace.replace(/\b\w/g, (char) => char.toUpperCase());
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.StatusChip, {
+		status: getStatus(value),
+		label: getLabel ? formattedLabel(getLabel(value)) : formattedLabel(value)
+	});
+};
+
+//#endregion
+//#region src/udp/export/MyExportsPage.jsx
+const MyExportsPage = (props) => {
+	var _user$can, _udpJobEntity$unityBa3, _udpJobEntity$unityBa4;
+	const { productId } = props;
+	const user = require_EnvironmentRibbon.useUser();
+	const [product, setProduct] = (0, react.useState)();
+	const [downloadLinkLoading, setDownloadLinkLoading] = (0, react.useState)(false);
+	const [fileResultData, setFileResultData] = (0, react.useState)();
+	const [downloadOpen, setDownloadOpen] = (0, react.useState)(false);
+	const [noDownloadMethod, setNoDownloadMethod] = (0, react.useState)(false);
+	const { handleErrorSnackbar, handleSuccessSnackbar } = require_apiHelpers.useHandleAxiosSnackbar();
+	const [{ data: products, loading: productsLoading }] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.tenantV2ApiUrl, `tenant/products?tenantId=${user === null || user === void 0 ? void 0 : user.currentTenantId}&isSubscribable=${!(user === null || user === void 0 || (_user$can = user.can) === null || _user$can === void 0 ? void 0 : _user$can.CAN_MANAGE_CATALOGS_FOR_UNSUBSCRIBABLE_PRODUCTS)}`, {}, !user);
+	const [{ data: apiCatalog, loading: catalogLoading, error: catalogError }] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.integrationV1ApiUrl, `tenantProductApiCatalogBase/tenant/${user === null || user === void 0 ? void 0 : user.currentTenantId}/product/${productId ? productId : product === null || product === void 0 ? void 0 : product.productId}`, {}, !(product || productId), false);
+	const [{ data: udpJobEntity, loading: jobEntityLoading }] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.integrationV1ApiUrl, `apicatalog/${apiCatalog === null || apiCatalog === void 0 ? void 0 : apiCatalog.apiCatalogId}/promotedMethodEntities/udpJob/product/${apiCatalog === null || apiCatalog === void 0 ? void 0 : apiCatalog.productId}?compareSanitizedName=true`, {}, !(apiCatalog === null || apiCatalog === void 0 ? void 0 : apiCatalog.productId) || !(apiCatalog === null || apiCatalog === void 0 ? void 0 : apiCatalog.apiCatalogId), false);
+	const refetchfileResultData = (0, react.useCallback)(async (selectedRecord) => {
+		var _udpJobEntity$unityBa;
+		if (udpJobEntity === null || udpJobEntity === void 0 || (_udpJobEntity$unityBa = udpJobEntity.unityBaseGetFileResultMethod) === null || _udpJobEntity$unityBa === void 0 ? void 0 : _udpJobEntity$unityBa.apiMethodId) {
+			var _udpJobEntity$unityBa2;
+			setDownloadLinkLoading(true);
+			await require_EnvironmentRibbon.executeQueryWithParameters({ data: { JobId: selectedRecord === null || selectedRecord === void 0 ? void 0 : selectedRecord.id } }, udpJobEntity === null || udpJobEntity === void 0 || (_udpJobEntity$unityBa2 = udpJobEntity.unityBaseGetFileResultMethod) === null || _udpJobEntity$unityBa2 === void 0 ? void 0 : _udpJobEntity$unityBa2.apiMethodId).then((res) => {
+				setFileResultData(res.data);
+			}).catch((err) => {});
+			setDownloadLinkLoading(false);
+		} else setNoDownloadMethod(true);
+	}, [udpJobEntity === null || udpJobEntity === void 0 || (_udpJobEntity$unityBa3 = udpJobEntity.unityBaseGetFileResultMethod) === null || _udpJobEntity$unityBa3 === void 0 ? void 0 : _udpJobEntity$unityBa3.apiMethodId]);
+	const handleSelectRecord = (0, react.useCallback)((data) => {
+		refetchfileResultData(data);
+		setDownloadOpen(true);
+	}, [refetchfileResultData]);
+	const getOptionLabel = (val) => {
+		return val === null || val === void 0 ? void 0 : val.name;
+	};
+	const handleProductChange = (0, react.useCallback)((val) => {
+		setProduct(val);
+	}, []);
+	const handleFileDownload = (0, react.useCallback)(() => {
+		if (fileResultData === null || fileResultData === void 0 ? void 0 : fileResultData.link) {
+			const link = document.createElement("a");
+			link.href = fileResultData === null || fileResultData === void 0 ? void 0 : fileResultData.link;
+			link.download = "";
+			document.body.appendChild(link);
+			link.click();
+			document.body.removeChild(link);
+			setDownloadOpen(false);
+			handleSuccessSnackbar("File successfully downloaded");
+		}
+	}, [fileResultData === null || fileResultData === void 0 ? void 0 : fileResultData.link, handleSuccessSnackbar]);
+	const getJobStatus = (value) => {
+		if (value === 1) return null;
+		else if (value === 2) return "info";
+		else if (value === 3) return "success";
+		else if (value === 4) return "error";
+	};
+	const getJobLabel = (value) => {
+		if (value === 1) return "Pending";
+		else if (value === 2) return "Running";
+		else if (value === 3) return "Completed";
+		else if (value === 4) return "Failed";
+	};
+	(0, react.useEffect)(() => {
+		if (catalogError) handleErrorSnackbar("", "Error fetching catalog for the selected product");
+	}, [catalogError, handleErrorSnackbar]);
+	const filterElements = (0, react.useMemo)(() => {
+		return [{
+			searchField: "jobTypeId",
+			searchOperator: "=",
+			searchValue: 2
+		}];
+	}, []);
+	const actionList = (0, react.useMemo)(() => {
+		return [{
+			id: 1,
+			title: "Download",
+			icon: __fluentui_react_icons.DownloadIcon,
+			onClick: handleSelectRecord,
+			disabled: false,
+			checkDisabled: (value) => (value === null || value === void 0 ? void 0 : value.statusId) !== 3
+		}];
+	}, [handleSelectRecord]);
+	const columnDefs = (0, react.useMemo)(() => [
+		{
+			headerName: "Id",
+			sortable: true,
+			field: "id",
+			suppressMenu: true
+		},
+		{
+			headerName: "Name",
+			sortable: false,
+			field: "name",
+			minWidth: 140,
+			suppressMenu: true,
+			valueFormatter: (data) => require_AmbientGridTemplate.getSanitizedName(data.data.name)
+		},
+		{
+			headerName: "Date",
+			sortable: false,
+			valueFormatter: (data) => new Date(data.data.startTime).toLocaleString(),
+			minWidth: 130,
+			suppressMenu: true
+		},
+		{
+			headerName: "Status",
+			field: "statusId",
+			wrapText: true,
+			autoHeight: true,
+			sortable: false,
+			cellRenderer: "statusCellRenderer",
+			cellRendererParams: {
+				getStatus: getJobStatus,
+				getLabel: getJobLabel
+			},
+			minWidth: 130,
+			maxWidth: 130,
+			suppressMenu: true
+		},
+		{
+			headerName: "Actions",
+			filter: false,
+			pinned: "right",
+			cellRenderer: "actionsRenderer",
+			width: 120,
+			maxWidth: 120,
+			cellRendererParams: {
+				actionList,
+				value: (data) => data
+			},
+			suppressMenu: true,
+			sortable: false,
+			cellStyle: {
+				display: "flex",
+				alignItems: "center"
+			}
+		}
+	], [actionList]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [
+		udpJobEntity && !(udpJobEntity === null || udpJobEntity === void 0 || (_udpJobEntity$unityBa4 = udpJobEntity.unityBaseSearchMethod) === null || _udpJobEntity$unityBa4 === void 0 ? void 0 : _udpJobEntity$unityBa4.apiMethodId) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AmbientAlert, {
+			alertMessage: "UdpJob's search method must be promoted",
+			showAlert: true,
+			alertSeverity: "error"
+		}),
+		!productId && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			style: { margin: "0px 5px 5px 5px" },
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AmbientAutoComplete, {
+				isMultiple: false,
+				id: "product",
+				name: "product",
+				label: "Product",
+				onChange: handleProductChange,
+				options: products,
+				size: "small",
+				getOptionLabelFunction: getOptionLabel,
+				value: product,
+				required: true
+			})
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TableContainer, {
+			loading: productsLoading || catalogLoading || jobEntityLoading,
+			title: `Exports`,
+			isServerSide: true,
+			eagerLoad: false,
+			logicalSearchOperator: 2,
+			promotedEntity: udpJobEntity,
+			filterElements,
+			actionList,
+			customColumnDefs: columnDefs,
+			frameworkComponents: {
+				statusCellRenderer: StatusCellRenderer,
+				actionsRenderer: require_AmbientGridTemplate.ActionsRenderer
+			},
+			hideSearchBar: true,
+			hiddenActionButtons: [
+				"saveView",
+				"views",
+				"insights",
+				"importExport",
+				"group",
+				"filter",
+				"columns",
+				"clearFilters",
+				"fitGrid",
+				"expandGrid"
+			],
+			height: "calc(100vh - 167px)",
+			dynamicSizing: true
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AmbientGridTemplate.FluentDialog, {
+			actionOne: handleFileDownload,
+			actionTwo: () => setDownloadOpen(false),
+			labelOne: "Download",
+			labelTwo: "Cancel",
+			open: downloadOpen,
+			handleClose: () => setDownloadOpen(false),
+			disableOne: noDownloadMethod || downloadLinkLoading,
+			progress: downloadLinkLoading,
+			fullWidth: true,
+			children: noDownloadMethod ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AmbientAlert, {
+				alertMessage: "UdpJob's get file result method must be promoted",
+				showAlert: true,
+				alertSeverity: "error"
+			}) : downloadLinkLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmptyStateDisplay, { primaryText: "Fetching download link..." }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmptyStateDisplay, {
+				icon: noDownloadMethod ? __fluentui_react_icons.ErrorIcon : __fluentui_react_icons.StatusCircleCheckmarkIcon,
+				primaryText: !noDownloadMethod && "File is ready to download!"
+			})
+		})
+	] });
+};
+
+//#endregion
+Object.defineProperty(exports, 'AmbientAlert', {
+  enumerable: true,
+  get: function () {
+    return AmbientAlert;
+  }
+});
+Object.defineProperty(exports, 'AmbientAutoComplete', {
+  enumerable: true,
+  get: function () {
+    return AmbientAutoComplete;
+  }
+});
+Object.defineProperty(exports, 'EmptyStateDisplay', {
+  enumerable: true,
+  get: function () {
+    return EmptyStateDisplay;
+  }
+});
+Object.defineProperty(exports, 'MyExportsPage', {
+  enumerable: true,
+  get: function () {
+    return MyExportsPage;
+  }
+});
+Object.defineProperty(exports, 'SearchServiceDatasource', {
+  enumerable: true,
+  get: function () {
+    return SearchServiceDatasource;
+  }
+});
+Object.defineProperty(exports, 'StatusCellRenderer', {
+  enumerable: true,
+  get: function () {
+    return StatusCellRenderer;
+  }
+});
+Object.defineProperty(exports, 'TableColumnDefs', {
+  enumerable: true,
+  get: function () {
+    return TableColumnDefs;
+  }
+});
+Object.defineProperty(exports, 'TableContainer', {
+  enumerable: true,
+  get: function () {
+    return TableContainer;
+  }
+});
+Object.defineProperty(exports, 'defaultColumnActionsDef', {
+  enumerable: true,
+  get: function () {
+    return defaultColumnActionsDef;
+  }
+});
+//# sourceMappingURL=MyExportsPage-CcO8Mf8y.cjs.map