udp-react-enterprise-component-library 25.18.3 → 25.18.4-beta.2

package/dist/ImportDataFromFileMapping-B4D64b8N.js

@@ -0,0 +1,568 @@
+import { t as Form } from "./Form-kH10DtvM.js";
+import { t as Field } from "./Field-BSE8Fwr1.js";
+import { t as FluentButton } from "./FluentButton-BexKrnAp.js";
+import { n as SubmitButton, t as FormButtons } from "./FormButtons-BTCO-pzW.js";
+import { ConfigService } from "./configService/index.js";
+import { i as useHandleAxiosSnackbar } from "./apiHelpers-CQSnEbMA.js";
+import { t as useUser } from "./useUser-B_mCveqm.js";
+import { t as apiMutate } from "./useAxiosMutate-DfnYYAzN.js";
+import { t as FluentIcon } from "./FluentIcon-pwGrBtD8.js";
+import { r as getSanitizedName } from "./entityUtilities-COeBqY4z.js";
+import { n as SideSheet } from "./SideSheet-B7N-AM_z.js";
+import { t as useAxiosGet } from "./useAxiosGet-BtxSpEO3.js";
+import { t as executeQueryAdHoc } from "./methodUtils-PKTRJpSD.js";
+import { t as AmbientCard } from "./AmbientCard-D-le1ghN.js";
+import { t as usePromotedMethodEntity } from "./usePromotedMethodEntity-DBnWpEze.js";
+import { t as AmbientTextField } from "./AmbientTextField-CdYuItOr.js";
+import { t as Divider$1 } from "./Divider-DTby6br8.js";
+import { t as AmbientAutoComplete } from "./AmbientAutoComplete-DrhrqnYv.js";
+import { t as DragDropFileUpload } from "./DragDropFileUpload-j6JdxqDB.js";
+import { t as CompactDataListItem } from "./CompactDataListItem-DVNgHapB.js";
+import { t as AmbientStepper } from "./AmbientStepper-CuQRn0yM.js";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { Divider, Typography } from "@material-ui/core";
+import { ChromeBackMirroredIcon } from "@fluentui/react-icons";
+import * as XLSX from "xlsx";
+
+//#region src/udp/fileImportMapping/fileUtils.js
+const handleExcelFileUpload = (fileObject, fileProperties) => {
+	return new Promise((resolve, reject) => {
+		if (fileObject) {
+			const reader = new FileReader();
+			reader.onload = function(e) {
+				const data = new Uint8Array(e.target.result);
+				const workbook = XLSX.read(data, { type: "array" });
+				const sheetName = workbook.SheetNames[fileProperties?.worksheetNumber?.value - 1];
+				const worksheet = workbook.Sheets[sheetName];
+				const json = XLSX.utils.sheet_to_json(worksheet, { header: 1 });
+				if (json.length > 1) {
+					const headers = json[0];
+					const firstDataLine = json[1];
+					resolve({
+						headers,
+						sampleData: firstDataLine
+					});
+				} else reject("Could not get file headers");
+			};
+			reader.onerror = function() {
+				reject("Error reading the file.");
+			};
+			reader.readAsArrayBuffer(fileObject);
+		} else reject("No file provided");
+	});
+};
+const handleTextFileUpload = (fileObject, fileProperties) => {
+	return new Promise((resolve, reject) => {
+		if (fileObject) {
+			const chunkSize = 1024;
+			let offset = 0;
+			let accumulatedData = "";
+			const reader = new FileReader();
+			reader.onload = function(e) {
+				accumulatedData += e.target.result;
+				const lines = accumulatedData.split("\n");
+				if (lines.length > 2) resolve({
+					headers: lines[0].replace(/\r/g, "").split(fileProperties?.delimiter?.value),
+					sampleData: lines[1].replace(/\r/g, "").split(fileProperties?.delimiter?.value)
+				});
+				else if (offset < fileObject.size) readNextChunk();
+			};
+			reader.onerror = function() {
+				reject("Error reading the file.");
+			};
+			function readNextChunk() {
+				const blob = fileObject.slice(offset, offset + chunkSize);
+				reader.readAsText(blob);
+				offset += chunkSize;
+			}
+			readNextChunk();
+		} else reject("No file provided");
+	});
+};
+const handleJsonFileUpload = (fileObject, fileProperties) => {
+	return new Promise((resolve, reject) => {
+		if (fileObject) {
+			const reader = new FileReader();
+			reader.onload = function(e) {
+				try {
+					const jsonData = JSON.parse(e.target.result);
+					const dataAtPath = fileProperties?.jsonPath ? getValueByPath(jsonData, fileProperties?.jsonPath) : jsonData;
+					if (Array.isArray(dataAtPath) && dataAtPath.length > 0) resolve({
+						headers: Object.keys(dataAtPath[0]),
+						sampleData: dataAtPath[0]
+					});
+					else reject("The JSON file does not contain an array or is empty.");
+				} catch (err) {
+					reject("Error parsing JSON file:", err);
+				}
+			};
+			reader.onerror = function() {
+				reject("Error reading the file.");
+			};
+			reader.readAsText(fileObject);
+		} else reject("No file provided");
+	});
+};
+const getValueByPath = (obj, path) => {
+	return path.split(".").reduce((acc, key) => acc && acc[key], obj);
+};
+
+//#endregion
+//#region src/udp/fileImportMapping/FileImportConfigCard.jsx
+const FileImportConfigCard = (props) => {
+	const { fileMappingRecord, domain } = props;
+	const [showIndexNumbers, setShowIndexNumbers] = useState(false);
+	const parsedProperties = useMemo(() => {
+		if (fileMappingRecord) {
+			let parsedObject = fileMappingRecord?.properties;
+			if (typeof fileMappingRecord?.properties === "string") parsedObject = JSON.parse(fileMappingRecord?.properties);
+			if ("includesHeader" in parsedObject && parsedObject?.includesHeader === false) setShowIndexNumbers(true);
+			else setShowIndexNumbers(false);
+			return Object.entries(parsedObject).map(([key, value]) => ({
+				key,
+				value
+			}));
+		}
+	}, [fileMappingRecord]);
+	const parsedFieldMappings = useMemo(() => {
+		let parsedObject = fileMappingRecord?.mapping;
+		if (typeof fileMappingRecord?.mapping === "string") parsedObject = JSON.parse(fileMappingRecord?.mapping);
+		if (fileMappingRecord) return Object.entries(parsedObject);
+	}, [fileMappingRecord]);
+	return parsedFieldMappings && /* @__PURE__ */ React.createElement(AmbientCard, {
+		fullWidth: true,
+		title: "Mapping Configuration",
+		subtitle: domain
+	}, parsedProperties?.map((property) => /* @__PURE__ */ React.createElement(CompactDataListItem, {
+		label: property?.key.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/^./, function(char) {
+			return char.toUpperCase();
+		}),
+		value: property?.value === false ? "False" : property?.value === true ? "True" : property?.value
+	})), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		flexDirection: "row",
+		justifyContent: "space-between",
+		paddingTop: 20
+	} }, /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, showIndexNumbers ? "Column index's" : "File Headers"), /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, "Fields")), /* @__PURE__ */ React.createElement(Divider, { style: {
+		marginTop: 5,
+		marginBottom: -14
+	} }), parsedFieldMappings?.map((field) => /* @__PURE__ */ React.createElement("div", { style: { height: 42 } }, /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		flexDirection: "row",
+		gap: 10
+	} }, /* @__PURE__ */ React.createElement(Typography, { style: {
+		marginTop: 25,
+		width: "50%"
+	} }, showIndexNumbers ? "index " + field[1]?.headerIndex : field[1]?.importFileField), /* @__PURE__ */ React.createElement(FluentIcon, {
+		style: {
+			marginTop: 28,
+			width: "10%"
+		},
+		component: ChromeBackMirroredIcon
+	}), /* @__PURE__ */ React.createElement(Typography, { style: {
+		marginTop: 25,
+		width: "50%",
+		textAlign: "right"
+	} }, field[1]?.udpField.replace(/([A-Z])/g, " $1").trim())), /* @__PURE__ */ React.createElement(Divider, { style: { margin: "5px 0px" } })))));
+};
+
+//#endregion
+//#region src/udp/fileImportMapping/FileImportMappingWizard.jsx
+const FileImportMappingWizard = (props) => {
+	const { refetchMappings, setNewFileMappingSidesheetOpen, verifyRequiredFields } = props;
+	const user = useUser();
+	const [importHeaderData, setImportHeaderData] = useState();
+	const [udpObjectList, setUdpObjectList] = useState();
+	const [selectedDomain, setSelectedDomain] = useState();
+	const [selectedFileType, setSelectedFileType] = useState();
+	const [fileObject, setFileObject] = useState();
+	const [fileImportMappingObject, setFileImportMappingObject] = useState({});
+	const [activeStep, setActiveStep] = useState(0);
+	const [showIndexNumbers, setShowIndexNumbers] = useState(false);
+	const [errorText, setErrorText] = useState("");
+	const { handleErrorSnackbar, handleSuccessSnackbar } = useHandleAxiosSnackbar();
+	const executeCreateFileMapping = useCallback(async (data) => apiMutate(ConfigService.productV1ApiUrl, `UdpFileImportMapping`, { method: "post" }, { data }), []);
+	const { data: udpObjectEntity } = usePromotedMethodEntity("UdpObjectInfo", true);
+	const [{ data: allowedFileTypesData }, refetchAllowedFileTypes] = useAxiosGet(ConfigService.productV1ApiUrl, `UdpFileImportType`, {}, false);
+	const searchUdpObjectData = useCallback(async () => {
+		if (udpObjectEntity?.unityBaseSearchMethod?.apiMethodId && user?.id) {
+			const sapUserRes = await executeQueryAdHoc({ data: {
+				eagerLoad: true,
+				pageSize: 200,
+				filterElements: []
+			} }, udpObjectEntity?.unityBaseSearchMethod?.apiMethodId);
+			if (sapUserRes?.data?.pageList.length > 0) setUdpObjectList(sapUserRes?.data?.pageList);
+		}
+	}, [udpObjectEntity, user]);
+	const filterCatalogObjectList = useMemo(() => {
+		return udpObjectList;
+	}, [udpObjectList]);
+	const getNameFormattedOptionLabel = (option) => {
+		return option?.name.replace(/([A-Z])/g, " $1").trim();
+	};
+	const getNameOptionLabel = (option) => {
+		return option?.name;
+	};
+	const handleFileUpload = async (properties) => {
+		let result;
+		if (selectedFileType.extension === ".csv" || selectedFileType.extension === ".txt") result = await handleTextFileUpload(fileObject, properties);
+		else if (selectedFileType.extension === ".xlsx") result = await handleExcelFileUpload(fileObject, properties);
+		else if (selectedFileType.extension === ".json") result = await handleJsonFileUpload(fileObject, properties);
+		setImportHeaderData(result?.headers);
+	};
+	useEffect(() => {
+		searchUdpObjectData();
+	}, [searchUdpObjectData]);
+	const handleCreateNewFieldMapping = useCallback(async (values) => {
+		if ((await executeCreateFileMapping({
+			name: values.name,
+			objectInfoSanitizedName: getSanitizedName(selectedDomain.name),
+			fileImportType: selectedFileType.id,
+			mapping: JSON.stringify(fileImportMappingObject?.mapping),
+			properties: JSON.stringify(fileImportMappingObject?.properties)
+		}).catch((res) => {
+			handleErrorSnackbar(res);
+		}))?.status === 201) {
+			handleSuccessSnackbar("Created Mapping");
+			refetchMappings();
+			setNewFileMappingSidesheetOpen(false);
+		}
+	}, [
+		executeCreateFileMapping,
+		selectedDomain?.name,
+		selectedFileType?.id,
+		fileImportMappingObject?.mapping,
+		fileImportMappingObject?.properties,
+		handleErrorSnackbar,
+		handleSuccessSnackbar,
+		refetchMappings,
+		setNewFileMappingSidesheetOpen
+	]);
+	const handleUpdateFieldMapping = (values) => {
+		let valid = true;
+		selectedDomain?.objectFieldInfo?.forEach((option) => {
+			if (!option.dataType.endsWith("?") && !option.isPrimaryKey && !option.udpType) {
+				if (!Object.entries(values).some((obj) => obj[1].businessObjectKey === option.businessObjectKey)) {
+					if (verifyRequiredFields) valid = false;
+				}
+			}
+		});
+		if (!valid) {
+			setErrorText("All required Udp fields must have a mapping");
+			return;
+		}
+		const filteredMappings = Object.entries(values).filter(([key, value]) => value !== null).reduce((acc, [key, value]) => {
+			acc[key] = value;
+			return acc;
+		}, {});
+		const mappedFieldIndexes = Object.keys(filteredMappings).map((key) => parseInt(key.split("udpFieldMapping")[1], 10));
+		const fieldMappings = Object.values(filteredMappings).map((selectedUdpField, index) => {
+			return {
+				udpField: selectedUdpField.name,
+				importFileField: !showIndexNumbers ? importHeaderData[mappedFieldIndexes[index]] : null,
+				headerIndex: !showIndexNumbers ? -1 : mappedFieldIndexes[index]
+			};
+		});
+		setFileImportMappingObject((prev) => {
+			return {
+				...prev,
+				mapping: fieldMappings
+			};
+		});
+		setActiveStep((prev) => prev + 1);
+	};
+	const handleUpdateFileProperties = (values) => {
+		setFileImportMappingObject((prev) => {
+			let properties = {};
+			Object.keys(values).forEach((propKey) => properties[propKey] = "value" in values[propKey] ? values[propKey]?.value : values[propKey]);
+			return {
+				...prev,
+				properties
+			};
+		});
+		if ("includesHeader" in values && values?.includesHeader.value === false) setShowIndexNumbers(true);
+		handleFileUpload(values);
+		setActiveStep((prev) => prev + 1);
+	};
+	const getUdpFieldOptionLabel = (option) => {
+		if (!option.dataType.endsWith("?") && !option.isPrimaryKey && !option.udpType) return `${option.name.replace(/([A-Z])/g, " $1").trim()}*`;
+		return `${option.name} - ${option.dataType}`;
+	};
+	const handleAddFileToUpload = (fileObj) => {
+		setFileObject(fileObj[0]);
+	};
+	const formattedFileTypeProperties = useMemo(() => {
+		if (selectedFileType) return JSON.parse(selectedFileType?.properties);
+	}, [selectedFileType]);
+	return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(AmbientCard, { fullWidth: true }, /* @__PURE__ */ React.createElement("div", { style: { marginBottom: 20 } }, /* @__PURE__ */ React.createElement(AmbientStepper, {
+		activeStep,
+		steps: [
+			"File",
+			"Domain",
+			"Field Mappings",
+			"Review"
+		],
+		orientation: "vertical"
+	})), activeStep === 0 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(AmbientAutoComplete, {
+		isMultiple: false,
+		id: "fileImportType",
+		name: "fileImportType",
+		label: "File Type",
+		onChange: (val) => setSelectedFileType(val),
+		options: allowedFileTypesData,
+		size: "small",
+		getOptionLabelFunction: getNameOptionLabel,
+		value: selectedFileType,
+		required: true
+	}), selectedFileType && /* @__PURE__ */ React.createElement("div", { style: { marginTop: 5 } }, /* @__PURE__ */ React.createElement(DragDropFileUpload, {
+		handleUploadFile: handleAddFileToUpload,
+		accept: {
+			"text/csv": [".csv"],
+			"text/plain": [".txt"],
+			"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": [".xlsx"],
+			"application/json": [".json"]
+		}
+	})), /* @__PURE__ */ React.createElement(Form, { onSubmit: handleUpdateFileProperties }, formattedFileTypeProperties?.map((property) => property?.options ? /* @__PURE__ */ React.createElement(Field, {
+		component: AmbientAutoComplete,
+		isMultiple: false,
+		id: property.propertyName,
+		name: property.propertyName,
+		label: property.label,
+		options: property.options,
+		size: "small",
+		getOptionLabelFunction: getNameOptionLabel,
+		required: property?.required
+	}) : /* @__PURE__ */ React.createElement(Field, {
+		component: AmbientTextField,
+		isMultiple: false,
+		id: property.propertyName,
+		name: property.propertyName,
+		label: property.label,
+		size: "small",
+		getOptionLabelFunction: getNameOptionLabel,
+		required: property?.required
+	})), /* @__PURE__ */ React.createElement(FormButtons, { style: {
+		display: "flex",
+		float: "right",
+		marginRight: -16
+	} }, /* @__PURE__ */ React.createElement(SubmitButton, {
+		variant: "contained",
+		color: "secondary",
+		disablePristine: false,
+		disabled: !fileObject
+	}, "Next")))), activeStep === 1 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(AmbientAutoComplete, {
+		isMultiple: false,
+		id: "domain",
+		name: "domain",
+		label: "Domain",
+		onChange: (val) => setSelectedDomain(val),
+		options: filterCatalogObjectList,
+		size: "small",
+		getOptionLabelFunction: getNameFormattedOptionLabel,
+		value: selectedDomain,
+		required: true
+	}), /* @__PURE__ */ React.createElement("div", { style: {
+		float: "right",
+		display: "flex",
+		gap: 8,
+		marginTop: 8
+	} }, /* @__PURE__ */ React.createElement(FluentButton, {
+		variant: "contained",
+		onClick: () => setActiveStep((prev) => prev - 1),
+		disabled: activeStep === 0
+	}, "Prev"), /* @__PURE__ */ React.createElement(FluentButton, {
+		variant: "contained",
+		onClick: () => setActiveStep((prev) => prev + 1),
+		color: "secondary",
+		disabled: !selectedDomain
+	}, "Next"))), activeStep === 2 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		flexDirection: "row",
+		justifyContent: "space-between",
+		paddingTop: 20
+	} }, /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, showIndexNumbers ? "Column index's" : "File Headers"), /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, "UDP Fields")), /* @__PURE__ */ React.createElement(Divider$1, { style: { margin: "5px 0px" } }), /* @__PURE__ */ React.createElement(Form, {
+		onSubmit: handleUpdateFieldMapping,
+		style: { marginTop: -20 }
+	}, importHeaderData?.map((field, index) => /* @__PURE__ */ React.createElement("div", { style: { height: 42 } }, /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		flexDirection: "row",
+		gap: 10
+	} }, /* @__PURE__ */ React.createElement(Typography, { style: {
+		marginTop: 25,
+		width: "50%"
+	} }, showIndexNumbers ? "index " + index : field), /* @__PURE__ */ React.createElement(FluentIcon, {
+		style: {
+			marginTop: 28,
+			width: "10%"
+		},
+		component: ChromeBackMirroredIcon
+	}), /* @__PURE__ */ React.createElement(Field, {
+		style: { height: 30 },
+		component: AmbientAutoComplete,
+		isMultiple: false,
+		id: `udpFieldMapping${index}`,
+		name: `udpFieldMapping${index}`,
+		options: selectedDomain?.objectFieldInfo,
+		size: "small",
+		getOptionLabelFunction: getUdpFieldOptionLabel
+	})), /* @__PURE__ */ React.createElement(Divider$1, { style: { margin: "5px 0px" } }))), /* @__PURE__ */ React.createElement("div", { style: {
+		paddingTop: 20,
+		textAlign: "right",
+		color: "red"
+	} }, errorText), /* @__PURE__ */ React.createElement(FormButtons, { style: {
+		display: "flex",
+		float: "right",
+		paddingTop: 16,
+		marginRight: -16
+	} }, /* @__PURE__ */ React.createElement(FluentButton, {
+		variant: "contained",
+		onClick: () => setActiveStep((prev) => prev - 1),
+		disabled: activeStep === 0
+	}, "Prev"), /* @__PURE__ */ React.createElement(SubmitButton, {
+		variant: "contained",
+		color: "secondary",
+		disablePristine: false
+	}, "Next")))), activeStep === 3 && /* @__PURE__ */ React.createElement(Form, { onSubmit: handleCreateNewFieldMapping }, /* @__PURE__ */ React.createElement(Field, {
+		component: AmbientTextField,
+		id: `name`,
+		name: `name`,
+		label: "Mapping Name",
+		size: "small"
+	}), /* @__PURE__ */ React.createElement(FormButtons, { style: {
+		display: "flex",
+		float: "right",
+		marginRight: -16
+	} }, /* @__PURE__ */ React.createElement(FluentButton, {
+		variant: "contained",
+		onClick: () => setActiveStep((prev) => prev - 1),
+		disabled: activeStep === 0
+	}, "Prev"), /* @__PURE__ */ React.createElement(SubmitButton, {
+		variant: "contained",
+		color: "secondary",
+		disablePristine: false
+	}, "Create Mapping")))), fileImportMappingObject?.mapping && /* @__PURE__ */ React.createElement("div", { style: { marginTop: 10 } }, /* @__PURE__ */ React.createElement(FileImportConfigCard, {
+		fileMappingRecord: {
+			mapping: fileImportMappingObject?.mapping,
+			properties: fileImportMappingObject?.properties
+		},
+		domain: selectedDomain?.name.replace(/([A-Z])/g, " $1").trim()
+	})));
+};
+
+//#endregion
+//#region src/udp/fileImportMapping/ImportDataFromFileMapping.jsx
+const ImportDataFromFileMapping = (props) => {
+	const { onImportSuccess, onImportFail, verifyRequiredFields = true } = props;
+	const user = useUser();
+	const [selectedFileMapping, setSelectedFileMapping] = useState();
+	const [udpImportMappingData, setUdpImportMappingData] = useState();
+	const [newFileMappingSidesheetOpen, setNewFileMappingSidesheetOpen] = useState(false);
+	const [fileObject, setFileObject] = useState();
+	const [isLoading, setIsLoading] = useState(false);
+	const { handleErrorSnackbar, handleSuccessSnackbar } = useHandleAxiosSnackbar();
+	const { data: udpFileImportMappingEntity } = usePromotedMethodEntity("UdpFileImportMapping", true);
+	const executeImportDataFromFile = useCallback(async (data) => apiMutate(ConfigService.productV1ApiUrl, `${selectedFileMapping?.objectInfoSanitizedName}/fileImportMapping`, { method: "post" }, { data }), [selectedFileMapping]);
+	const searchFileImportMappingData = useCallback(async () => {
+		if (udpFileImportMappingEntity?.unityBaseSearchMethod?.apiMethodId) {
+			const res = await executeQueryAdHoc({ data: {
+				eagerLoad: true,
+				pageSize: 200,
+				filterElements: []
+			} }, udpFileImportMappingEntity?.unityBaseSearchMethod?.apiMethodId);
+			if (res?.data?.pageList.length > 0) setUdpImportMappingData(res?.data?.pageList);
+		}
+	}, [udpFileImportMappingEntity?.unityBaseSearchMethod?.apiMethodId]);
+	useEffect(() => {
+		searchFileImportMappingData();
+	}, [searchFileImportMappingData]);
+	const handleImportDataFromFile = useCallback(async () => {
+		setIsLoading(true);
+		const file = fileObject;
+		const blob = new Blob([file], { type: file.type });
+		const formData = new FormData();
+		formData.append("file", blob, file.name);
+		formData.append("tenantId", user?.currentTenantId);
+		formData.append("name", selectedFileMapping.name);
+		formData.append("objectInfoSanitizedName", selectedFileMapping.objectInfoSanitizedName);
+		formData.append("fileImportType", selectedFileMapping.fileImportType);
+		formData.append("mapping", selectedFileMapping.mapping);
+		formData.append("properties", selectedFileMapping.properties);
+		formData.append("id", selectedFileMapping.id);
+		if ((await executeImportDataFromFile(formData).catch((res) => {
+			setIsLoading(false);
+			handleErrorSnackbar(res);
+			onImportFail();
+		}))?.status === 201) {
+			handleSuccessSnackbar("Imported Data");
+			setIsLoading(false);
+			onImportSuccess && onImportSuccess();
+		}
+	}, [
+		fileObject,
+		selectedFileMapping,
+		executeImportDataFromFile,
+		handleErrorSnackbar,
+		handleSuccessSnackbar,
+		user,
+		onImportSuccess,
+		onImportFail
+	]);
+	const getFileMappingOptionlabel = (option) => {
+		return `${option.name} (${option?.udpFileImportMappingUdpFileImportType?.extension})`;
+	};
+	const handleAddFileToUpload = (fileObj) => {
+		setFileObject(fileObj[0]);
+	};
+	return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(AmbientCard, { fullWidth: true }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex" } }, /* @__PURE__ */ React.createElement(AmbientAutoComplete, {
+		isMultiple: false,
+		id: "fileMapping",
+		name: "fileMapping",
+		label: "File Mapping",
+		onChange: (val) => setSelectedFileMapping(val),
+		options: udpImportMappingData,
+		size: "small",
+		getOptionLabelFunction: getFileMappingOptionlabel,
+		value: selectedFileMapping,
+		required: true,
+		groupBy: (option) => option?.udpFileImportMappingUdpObjectInfo?.sanitizedName
+	})), selectedFileMapping && /* @__PURE__ */ React.createElement(DragDropFileUpload, {
+		handleUploadFile: handleAddFileToUpload,
+		accept: {
+			"text/csv": [".csv"],
+			"text/plain": [".txt"],
+			"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": [".xlsx"],
+			"application/json": [".json"]
+		}
+	}), /* @__PURE__ */ React.createElement("div", { style: {
+		display: "flex",
+		flexDirection: "row",
+		gap: 5,
+		float: "right",
+		marginTop: 10
+	} }, /* @__PURE__ */ React.createElement(FluentButton, {
+		onClick: () => setNewFileMappingSidesheetOpen(true),
+		variant: "outlined"
+	}, "Create New Mapping"), /* @__PURE__ */ React.createElement(FluentButton, {
+		variant: "contained",
+		color: "secondary",
+		onClick: handleImportDataFromFile,
+		progress: isLoading,
+		disabled: !fileObject
+	}, "Import Data")), /* @__PURE__ */ React.createElement(SideSheet, {
+		title: "Create New File Mapping",
+		open: newFileMappingSidesheetOpen,
+		onClose: () => setNewFileMappingSidesheetOpen(false),
+		width: "60%"
+	}, /* @__PURE__ */ React.createElement(FileImportMappingWizard, {
+		refetchMappings: searchFileImportMappingData,
+		setNewFileMappingSidesheetOpen,
+		verifyRequiredFields
+	}))), /* @__PURE__ */ React.createElement("div", { style: { marginTop: 10 } }, /* @__PURE__ */ React.createElement(FileImportConfigCard, {
+		fileMappingRecord: selectedFileMapping,
+		domain: selectedFileMapping?.udpFileImportMappingUdpObjectInfo?.sanitizedName.replace(/([A-Z])/g, " $1").trim()
+	})));
+};
+
+//#endregion
+export { handleTextFileUpload as a, handleJsonFileUpload as i, FileImportConfigCard as n, handleExcelFileUpload as r, ImportDataFromFileMapping as t };
+//# sourceMappingURL=ImportDataFromFileMapping-B4D64b8N.js.map