diff --git a/src/Components/Assets/AssetImportModal.tsx b/src/Components/Assets/AssetImportModal.tsx index 7382c7eff4f..54ac25e2ac8 100644 --- a/src/Components/Assets/AssetImportModal.tsx +++ b/src/Components/Assets/AssetImportModal.tsx @@ -8,7 +8,6 @@ import { Cancel, Submit } from "../Common/components/ButtonV2"; import { listFacilityAssetLocation } from "../../Redux/actions"; import { useDispatch } from "react-redux"; import { Link } from "raviger"; -import SelectMenuV2 from "../Form/SelectMenuV2"; import readXlsxFile from "read-excel-file"; import { LocalStorageKeys, @@ -17,6 +16,7 @@ import { import { parseCsvFile } from "../../Utils/utils"; import useConfig from "../../Common/hooks/useConfig"; import DialogModal from "../Common/Dialog"; +import { SelectFormField } from "../Form/FormFields/SelectFormField"; interface Props { open: boolean; @@ -25,14 +25,18 @@ interface Props { } const AssetImportModal = ({ open, onClose, facility }: Props) => { - const [isImporting, setIsUploading] = useState(false); + const [isImporting, setIsImporting] = useState(false); const [selectedFile, setSelectedFile] = useState(); const [preview, setPreview] = useState<(AssetData & { notes?: string; last_serviced_on?: string })[]>(); const [location, setLocation] = useState(""); + const [errors, setErrors] = useState({ + location: "", + }); const [locations, setLocations] = useState([]); const dispatchAction: any = useDispatch(); const { sample_format_asset_import } = useConfig(); + const [locationsLoading, setLocationsLoading] = useState(false); const closeModal = () => { setPreview(undefined); @@ -41,9 +45,11 @@ const AssetImportModal = ({ open, onClose, facility }: Props) => { }; useEffect(() => { + setLocationsLoading(true); dispatchAction( listFacilityAssetLocation({}, { facility_external_id: facility.id }) ).then(({ data }: any) => { + setLocationsLoading(false); if (data.count > 0) { setLocations(data.results); } @@ -110,7 +116,16 @@ const AssetImportModal = ({ open, onClose, facility }: Props) => { closeModal(); return; } + if (!location) { + setErrors({ + ...errors, + location: "Please select a location", + }); + return; + } + setIsImporting(true); let error = false; + Notification.Success({ msg: "Importing assets..." }); for (const asset of preview || []) { const asset_data: any = { @@ -156,16 +171,22 @@ const AssetImportModal = ({ open, onClose, facility }: Props) => { }); error = true; } else { - if (preview) setPreview(preview.filter((a) => a.id !== asset.id)); + setPreview((preview) => { + return preview?.slice(1); + }); } } if (!error) { Notification.Success({ msg: "Assets imported successfully" }); await sleep(1000); - setIsUploading(false); - closeModal(); + setIsImporting(false); window.location.reload(); - } else Notification.Error({ msg: "Error importing some assets" }); + } else { + Notification.Error({ msg: "Error importing some assets" }); + await sleep(1000); + setIsImporting(false); + closeModal(); + } }; const dragProps = useDragAndDrop(); @@ -193,7 +214,7 @@ const AssetImportModal = ({ open, onClose, facility }: Props) => { fixedWidth={false} > {facility.name} - {locations.length === 0 ? ( + {!locationsLoading && locations.length === 0 ? ( <>

@@ -218,31 +239,28 @@ const AssetImportModal = ({ open, onClose, facility }: Props) => { {preview && preview?.length > 0 ? (

- {preview.length} assets will be imported + {preview.length} assets {isImporting ? "are being" : "will be"}{" "} + imported

-