@olenbetong/synergi-react 2.2.3 → 2.3.1

package/src/elements/{AddElementDialog → ElementLookupDialog}/index.tsx

@@ -23,26 +23,26 @@ export type AddElement = {
 
 type InitialTabProps = "camera" | "scanner" | "manual";
 
-export type AddElementDialogSharedProps = {
+export type ElementLookupDialogSharedProps = {
 	open: boolean;
 	onClose: () => void;
 	initialTab?: InitialTabProps | null;
 	useSearch?: boolean;
 };
 
-export type AddElementDialogSingleModeProps = AddElementDialogSharedProps & {
+export type ElementLookupDialogSingleModeProps = ElementLookupDialogSharedProps & {
 	mode: "single" | "search";
 	onAdd: (element: AddElement) => Promise<void>;
 };
 
-export type AddElementDialogMultiModeProps = AddElementDialogSharedProps & {
+export type ElementLookupDialogMultiModeProps = ElementLookupDialogSharedProps & {
 	mode: "multi";
 	onAdd: (element: AddElement[]) => Promise<void>;
 };
 
-export type AddElementDialogProps = AddElementDialogSingleModeProps | AddElementDialogMultiModeProps;
+export type ElementLookupDialogProps = ElementLookupDialogSingleModeProps | ElementLookupDialogMultiModeProps;
 
-export function AddElementDialog(props: AddElementDialogProps) {
+export function ElementLookupDialog(props: ElementLookupDialogProps) {
 	let { open, onClose, initialTab } = props;
 	let [tab, setTab] = useState<"camera" | "scanner" | "manual">("camera");
 	let [elements, setElements] = useState<Array<AddElement>>([]);
@@ -103,6 +103,10 @@ export function AddElementDialog(props: AddElementDialogProps) {
 		}
 	}
 
+	if (tab === "manual" && props.mode === "search") {
+		tab = "camera";
+	}
+
 	return (
 		<ResponsiveDialog
 			open={open}

package/src/elements/ProjectSelect.tsx

@@ -1,7 +1,7 @@
 import { Autocomplete, ListItem, ListItemText, type SxProps, TextField, type Theme } from "@mui/material";
 import { getLocalizedString } from "@olenbetong/appframe-core";
 import { useDataWithFilter, useDebounce } from "@olenbetong/appframe-react";
-import { useMemo, useState } from "react";
+import { useMemo, useRef, useState } from "react";
 import { dsProjects, type ProjectsRecord } from "./data/dsProjects";
 import { dsReportProjects } from "./data/dsReportProjects";
 
@@ -47,7 +47,11 @@ export function ProjectSelect({
 		search ? `[SearchColumn] LIKE '%${search}%'` : "",
 	);
 
+	let highlightRef = useRef<Partial<ProjectsRecord | null>>(null);
+
 	function handleSelect(value: Partial<ProjectsRecord> | null) {
+		highlightRef.current = null;
+
 		if (!disabled && !readOnly) {
 			if (onChange) {
 				onChange(value);
@@ -73,6 +77,8 @@ export function ProjectSelect({
 			<Autocomplete<Partial<ProjectsRecord>>
 				sx={sx}
 				autoHighlight
+				autoSelect
+				clearOnEscape
 				className={className}
 				options={projects}
 				disabled={disabled}
@@ -80,7 +86,6 @@ export function ProjectSelect({
 					option?.ProjectID !== undefined ? `${option.ProjectID}: ${option.ProjectName}` : ""
 				}
 				isOptionEqualToValue={(option, value) => option.Domain === value.Domain && option.ProjectID === value.ProjectID}
-				clearOnEscape
 				onChange={(_, value) => handleSelect(value)}
 				onClose={() => setQuery("")}
 				value={value !== undefined ? value : selected}
@@ -90,7 +95,12 @@ export function ProjectSelect({
 						label={label ? label : getLocalizedString("Project ID")}
 						id={id ?? "ProjectLookup"}
 						fullWidth
-						inputProps={{ readOnly, ...params.inputProps }}
+						slotProps={{
+							htmlInput: {
+								readOnly,
+								...params.inputProps,
+							},
+						}}
 						autoComplete="off"
 						variant="filled"
 						required={required}

package/src/elements/data/dsDamages.ts

@@ -32,8 +32,8 @@ export type DamagesRecord = {
 	Action: string | null;
 	RegisteredFix: Date | null;
 	RegisteredFixBy: string | null;
+	RegisteredFixFullName: string | null;
 	Cause: string | null;
-	FullName: string | null;
 	SearchColumn: string;
 	ElementRef: string | null;
 };
@@ -138,12 +138,12 @@ export const dsDamages = generateApiDataObject<DamagesRecord>({
 			nullable: true,
 		},
 		{
-			name: "Cause",
+			name: "RegisteredFixFullName",
 			type: "string",
 			nullable: true,
 		},
 		{
-			name: "FullName",
+			name: "Cause",
 			type: "string",
 			nullable: true,
 		},

package/src/elements/data/dsElements.ts

@@ -4,14 +4,16 @@ af resources generate aviw_Production_Elements_All \
  --id dsElements \
  --types \
  --max-records 100 \
- --fields PrimKey,ProjectID,ElementID
+ --fields PrimKey,ProjectID,ElementID,ProjectName,Name
 */
 import { generateApiDataObject } from "@olenbetong/appframe-data";
 
 export type ElementsRecord = {
 	PrimKey: string;
 	ProjectID: string;
+	ProjectName: string;
 	ElementID: string | null;
+	Name: string | null;
 };
 
 export const dsElements = generateApiDataObject<ElementsRecord>({
@@ -32,11 +34,21 @@ export const dsElements = generateApiDataObject<ElementsRecord>({
 			type: "string",
 			nullable: false,
 		},
+		{
+			name: "ProjectName",
+			type: "string",
+			nullable: false,
+		},
 		{
 			name: "ElementID",
 			type: "string",
 			nullable: true,
 		},
+		{
+			name: "Name",
+			type: "string",
+			nullable: true,
+		},
 	],
 	parameters: {
 		maxRecords: 100,

package/src/elements/data/dsTransportElements.ts

@@ -0,0 +1,68 @@
+/*
+auto-generated by CLI:
+af resources generate aviw_Fleet_DeliveryTickets_Elements \
+ --id dsTransportElements \
+ --types \
+ --max-records 100 \
+ --fields PrimKey,DeliveryTicketID,ProjectID,ProjectName,ElementID,Name,Domain
+*/
+import { generateApiDataObject } from "@olenbetong/appframe-data";
+
+export type TransportElementsRecord = {
+	PrimKey: string;
+	DeliveryTicketID: number;
+	Domain: string;
+	ProjectID: string;
+	ProjectName: string;
+	ElementID: string | null;
+	Name: string | null;
+};
+
+export const dsTransportElements = generateApiDataObject<TransportElementsRecord>({
+	resource: "aviw_Fleet_DeliveryTickets_Elements",
+	id: "dsTransportElements",
+	allowUpdate: false,
+	allowInsert: false,
+	allowDelete: false,
+	dynamicLoading: false,
+	fields: [
+		{
+			name: "PrimKey",
+			type: "string",
+			nullable: false,
+		},
+		{
+			name: "DeliveryTicketID",
+			type: "number",
+			nullable: false,
+		},
+		{
+			name: "Domain",
+			type: "string",
+			nullable: false,
+		},
+		{
+			name: "ProjectID",
+			type: "string",
+			nullable: false,
+		},
+		{
+			name: "ProjectName",
+			type: "string",
+			nullable: false,
+		},
+		{
+			name: "ElementID",
+			type: "string",
+			nullable: true,
+		},
+		{
+			name: "Name",
+			type: "string",
+			nullable: true,
+		},
+	],
+	parameters: {
+		maxRecords: 100,
+	},
+});

package/src/elements/data/index.ts

@@ -3,5 +3,9 @@ export * from "./dsCurrentAttachment.js";
 export * from "./dsDamages.js";
 export * from "./dsDamagesDuplicateCheck.js";
 export * from "./dsElements.js";
-export * from "./procApproveDamage.js";
 export * from "./dsProjects.js";
+export * from "./procApproveDamage.js";
+export * from "./procDeleteAttachment.js";
+export * from "./procDeleteDamage.js";
+export * from "./procRemoveDamageFix.js";
+export * from "./procRestoreAttachments.js";

package/src/elements/data/procDeleteAttachment.ts

@@ -0,0 +1,19 @@
+/*
+auto-generated by CLI:
+af resources generate astp_Production_ElementsDamages_DeleteAttachments \
+ --id procDeleteAttachment
+*/
+import { ProcedureAPI } from "@olenbetong/appframe-data";
+
+export const procDeleteAttachment = new ProcedureAPI({
+	procedureId: "astp_Production_ElementsDamages_DeleteAttachments",
+	parameters: [
+		{
+			name: "PrimKeyList",
+			type: "string",
+			hasDefault: false,
+			required: false,
+		},
+	],
+	timeout: 30000,
+});

package/src/elements/data/procDeleteDamage.ts

@@ -0,0 +1,19 @@
+/*
+auto-generated by CLI:
+af resources generate astp_Production_ElementsDamages_Delete \
+ --id procDeleteDamage
+*/
+import { ProcedureAPI } from "@olenbetong/appframe-data";
+
+export const procDeleteDamage = new ProcedureAPI({
+	procedureId: "astp_Production_ElementsDamages_Delete",
+	parameters: [
+		{
+			name: "ID",
+			type: "number",
+			hasDefault: false,
+			required: false,
+		},
+	],
+	timeout: 30000,
+});

package/src/elements/data/procRemoveDamageFix.ts

@@ -0,0 +1,19 @@
+/*
+auto-generated by CLI:
+af resources generate astp_Production_ElementsDamages_RemoveFix \
+ --id procRemoveDamageFix
+*/
+import { ProcedureAPI } from "@olenbetong/appframe-data";
+
+export const procRemoveDamageFix = new ProcedureAPI({
+	procedureId: "astp_Production_ElementsDamages_RemoveFix",
+	parameters: [
+		{
+			name: "ID",
+			type: "number",
+			hasDefault: false,
+			required: false,
+		},
+	],
+	timeout: 30000,
+});

package/src/elements/data/procRestoreAttachments.ts

@@ -0,0 +1,19 @@
+/*
+auto-generated by CLI:
+af resources generate astp_Production_ElementsDamages_RestoreAttachments \
+ --id procRestoreAttachments
+*/
+import { ProcedureAPI } from "@olenbetong/appframe-data";
+
+export const procRestoreAttachments = new ProcedureAPI({
+	procedureId: "astp_Production_ElementsDamages_RestoreAttachments",
+	parameters: [
+		{
+			name: "PrimKeyList",
+			type: "string",
+			hasDefault: false,
+			required: false,
+		},
+	],
+	timeout: 30000,
+});

package/src/elements/index.ts

@@ -1,4 +1,9 @@
 export * from "./data/index.js";
-
-export * from "./AddElementDialog/index.js";
-export * from "./ElementDamageForm/index.js";
+export * from "./ElementDamage/DescriptionInput.js";
+export * from "./ElementDamage/DuplicateDamage/index.js";
+export * from "./ElementDamage/ElementNumberTextField.js";
+export * from "./ElementDamage/HiddenDamageFields.js";
+export * from "./ElementDamage/RegisterFix.js";
+export * from "./ElementDamage/SubmitButtons.js";
+export * from "./ElementLookup.js";
+export * from "./ElementLookupDialog/index.js";

package/src/index.ts

@@ -1,6 +1,7 @@
 export { Checkbox, type CheckboxProps } from "./components/Checkbox/index.js";
 export { CardColumn, CardDetail, CardLabel, CardStep, CardStepList, ColorCard } from "./components/ColorCard/index.js";
 export { DateNavigator } from "./components/DateNavigator/index.js";
+export * from "./components/FilePond.js";
 export { Card, LinkedList, LinkedListItem } from "./components/LinkedCardList/index.js";
 export {
 	BannerImage as PageBannerImage,
@@ -20,5 +21,4 @@ export { Sidebar, type SidebarProps } from "./components/Sidebar/index.js";
 export { Spinner, type SpinnerProps } from "./components/Spinner/index.js";
 export { SplitContainer, type SplitContainerProps } from "./components/SplitContainer/index.js";
 export { ValueToggleGroup, type ValueToggleGroupProps } from "./components/ValueToggleGroup/index.js";
-export { ElementDamageForm } from "./elements/ElementDamageForm/index.js";
 export { useTranslation } from "./useTranslation/index.js";

package/es/elements/ElementDamageForm/DamageFormFields.d.ts

@@ -1,12 +0,0 @@
-import type { DamagesRecord, ElementsRecord, ProjectsRecord } from "../data";
-type DamageFormFieldsProps = {
-    editRecord: DamagesRecord | null;
-    project: Partial<ProjectsRecord> | null;
-    elementRecord: ElementsRecord[];
-    elementID: string;
-    attachmentPrimKeys: string[];
-    handleAddElement: () => void;
-    formName: string;
-};
-export declare function DamageFormFields({ editRecord, project, elementRecord, elementID, attachmentPrimKeys, handleAddElement, formName, }: DamageFormFieldsProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/es/elements/ElementDamageForm/DamageFormFields.js

@@ -1,39 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import AddAPhotoIcon from "@mui/icons-material/AddAPhoto";
-import { Autocomplete, Box, Button, TextField } from "@mui/material";
-import { getLocalizedString } from "@olenbetong/appframe-core";
-import { useState } from "react";
-export function DamageFormFields({ editRecord, project, elementRecord, elementID, attachmentPrimKeys, handleAddElement, formName, }) {
-    let [description, setDescription] = useState();
-    function handleCopyPreviousDamage() {
-        const form = document.forms.namedItem(formName);
-        if (form) {
-            form["Cause"].value = localStorage.getItem("ElementDamage_Cause")?.toString();
-            form["Action"].value = localStorage.getItem("ElementDamage_Action")?.toString();
-        }
-        setDescription(localStorage.getItem("ElementDamage_Description")?.toString());
-    }
-    return (_jsxs(_Fragment, { children: [_jsx("input", { type: "hidden", name: "ID", value: editRecord?.ID ?? "" }), _jsx("input", { type: "hidden", name: "PrimKey", value: editRecord?.PrimKey ?? "" }), _jsx("input", { type: "hidden", name: "ProjectID", value: project?.ProjectID ?? "" }), _jsx("input", { type: "hidden", name: "Domain", value: project?.Domain ?? "" }), _jsx("input", { type: "hidden", name: "ElementRef", value: elementRecord[0]?.PrimKey ?? "" }), _jsx("input", { type: "hidden", name: "AttachmentPrimkeys", value: attachmentPrimKeys }), _jsx(TextField, { name: "Date", type: "date", defaultValue: (editRecord?.Date ?? new Date()).toISOString().split("T")[0], id: "NewElementDamage_Date", label: getLocalizedString("Date"), fullWidth: true, required: true, slotProps: { inputLabel: { shrink: true } } }), _jsxs(Box, { display: "flex", gap: 2, justifyContent: "flex-end", children: [_jsx(Button, { variant: "contained", onClick: () => handleCopyPreviousDamage(), disabled: !localStorage.getItem("ElementDamage_Description"), children: getLocalizedString("Copy previous damage") }), _jsx(Button, { onClick: handleAddElement, endIcon: _jsx(AddAPhotoIcon, {}), variant: "contained", children: getLocalizedString("Add element") })] }), _jsx(TextField, { id: "NewElementDamage_Project", value: project ? `${project?.ProjectID}: ${project?.ProjectName}` : "", label: getLocalizedString("Project"), fullWidth: true, required: true, autoComplete: "off", slotProps: {
-                    htmlInput: { readOnly: true },
-                } }), _jsx(TextField, { name: "ElementID", id: "NewElementDamage_ElementID", value: elementID, label: getLocalizedString("Element ID"), fullWidth: true, autoComplete: "off", slotProps: {
-                    htmlInput: { readOnly: true },
-                } }), _jsx(TextField, { name: "ElementNumber", id: "NewElementDamage_ElementNr", defaultValue: editRecord?.ElementNumber ?? "", label: getLocalizedString("Element number"), fullWidth: true, autoComplete: "off", disabled: !!elementID }), _jsx(Autocomplete, { value: description ?? editRecord?.Description ?? "", options: [
-                    getLocalizedString("Tear in element"),
-                    getLocalizedString("Damage around lifting anchor"),
-                    getLocalizedString("Damage on underside"),
-                ], freeSolo: true, renderInput: (params) => (_jsx(TextField, { name: "Description", required: true, ...params, label: getLocalizedString("Description") })) }), _jsx(TextField, { name: "Cause", id: "NewElementDamage_Cause", defaultValue: editRecord?.Cause ?? "", label: getLocalizedString("Cause"), fullWidth: true, slotProps: {
-                    inputLabel: {
-                        shrink: (() => {
-                            const form = document.forms.namedItem(formName);
-                            return form?.["Cause"]?.value ? true : undefined;
-                        })(),
-                    },
-                } }), _jsx(TextField, { name: "Action", id: "NewElementDamage_Action", defaultValue: editRecord?.Action ?? "", label: getLocalizedString("Action"), fullWidth: true, slotProps: {
-                    inputLabel: {
-                        shrink: (() => {
-                            const form = document.forms.namedItem(formName);
-                            return form?.["Action"]?.value ? true : undefined;
-                        })(),
-                    },
-                } })] }));
-}

package/es/elements/ElementDamageForm/DuplicateDamage/DuplicateElementDamageDialog.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import Add from "@mui/icons-material/Add";
-import { Button, Dialog, DialogActions, DialogContent, DialogTitle, Grid, useMediaQuery } from "@mui/material";
-import { getLocalizedString } from "@olenbetong/appframe-core";
-import { theme } from "@olenbetong/appframe-mui";
-import { ElementDamagesHeader, ElementDamagesItem } from "./DesktopView";
-import { DuplicatePhoneViewItem } from "./PhoneView";
-export function DuplicateElementDamageDialog({ open, onClose, record, fallBack }) {
-    let matches = useMediaQuery(theme.breakpoints.up("lg"));
-    return (_jsxs(Dialog, { open: open, onClose: () => onClose(false), fullWidth: true, fullScreen: !matches, children: [_jsx(DialogTitle, { sx: { backgroundColor: "#e9ebee" }, children: getLocalizedString("This element has one or more unfixed registered damage") }), _jsx(DialogContent, { sx: { backgroundColor: "#e9ebee" }, children: _jsx(Grid, { container: true, children: matches ? (_jsxs(_Fragment, { children: [_jsx(ElementDamagesHeader, {}), record.map((record) => (_jsx(ElementDamagesItem, { record: record }, record.PrimKey)))] })) : (_jsx("div", { className: "flow", style: { width: "100%" }, children: record.map((record) => (_jsx(DuplicatePhoneViewItem, { record: record }, record.PrimKey))) })) }) }), _jsxs(DialogActions, { sx: { backgroundColor: "#e9ebee" }, children: [_jsx(Button, { onClick: fallBack, children: getLocalizedString("Cancel") }), _jsx(Button, { startIcon: _jsx(Add, {}), variant: "contained", type: "submit", children: getLocalizedString("Register damage anyway") })] })] }));
-}

package/es/elements/ElementDamageForm/index.d.ts

@@ -1,13 +0,0 @@
-import "./index.css";
-import { type DataObject } from "@olenbetong/appframe-data";
-import { type AttachmentsRecord, type CurrentAttachmentRecord, type DamagesRecord, type ElementsRecord } from "../data";
-type ElementDamageFormProps = {
-    editRecord: DamagesRecord | null;
-    elementsDataObject: DataObject<ElementsRecord>;
-    damagesDataObject: DataObject<DamagesRecord>;
-    attachmentsDataObject: DataObject<AttachmentsRecord>;
-    currentAttachmentDataObject: DataObject<CurrentAttachmentRecord>;
-    fallBack: () => void;
-};
-export declare function ElementDamageForm({ editRecord, elementsDataObject, damagesDataObject, attachmentsDataObject, currentAttachmentDataObject, fallBack, }: ElementDamageFormProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/es/elements/ElementDamageForm/index.js

@@ -1,219 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import "./index.css";
-import Add from "@mui/icons-material/Add";
-import CheckIcon from "@mui/icons-material/Check";
-import { Box, Button, Checkbox, FormControlLabel, Typography } from "@mui/material";
-import Alert from "@mui/material/Alert";
-import { getLocalizedString, localize } from "@olenbetong/appframe-core";
-import { formDataToDataObjectRecord } from "@olenbetong/appframe-data";
-import { PageContainer, PageTitle } from "@olenbetong/appframe-mui";
-import { useDataWithFilter } from "@olenbetong/appframe-react";
-import { useId, useRef, useState } from "react";
-import { FilePond } from "../../components/FilePond";
-import { AddElementDialog } from "../AddElementDialog";
-import { dsDamagesDuplicateCheck, procApproveDamage, } from "../data";
-import { DamageFormFields } from "./DamageFormFields";
-import { DuplicateElementDamageDialog } from "./DuplicateDamage/DuplicateElementDamageDialog";
-const formatter = new Intl.DateTimeFormat(af.userSession.culture, {
-    day: "numeric",
-    month: "long",
-    year: "numeric",
-    hour: "2-digit",
-    minute: "2-digit",
-    timeZone: "UTC",
-});
-function deleteAttachments(dataObject, primKeyArray) {
-    for (const primKey of primKeyArray) {
-        const index = dataObject.findIndex((record) => record.PrimKey === primKey);
-        if (index > -1) {
-            dataObject.deleteRow(index);
-        }
-    }
-}
-function RegisterFix({ editRecord, damageDataObject, fixedThisSession, setFixedThisSession }) {
-    const [loading, setLoading] = useState(false);
-    async function handleRegisterFix() {
-        try {
-            if (confirm(getLocalizedString("Are you sure you want to register a fix for this damage?"))) {
-                setLoading(true);
-                await procApproveDamage.execute({ ID: editRecord?.ID });
-                await damageDataObject.refreshCurrentRow();
-                setLoading(false);
-                setFixedThisSession(true);
-            }
-        }
-        catch (error) {
-            alert(error.message);
-        }
-    }
-    return (_jsxs(_Fragment, { children: [editRecord ? (_jsx(Box, { display: "flex", justifyContent: "flex-end", children: _jsx(Button, { loading: loading, loadingPosition: "end", endIcon: _jsx(CheckIcon, {}), onClick: handleRegisterFix, disabled: !!editRecord.RegisteredFix || fixedThisSession, variant: "contained", children: getLocalizedString("Register fix") }) })) : (_jsx(FormControlLabel, { control: _jsx(Checkbox, {}), label: getLocalizedString("Register fixed"), name: "RegisteredFix", id: "NewElementDamage_RegisteredFix" })), editRecord?.RegisteredFix && (_jsx(Typography, { mb: 1.5, color: "text.secondary", children: localize `Registered fix by ${editRecord.FullName ?? editRecord.RegisteredFixBy} on the ${formatter.format(editRecord.RegisteredFix)}` }))] }));
-}
-export function ElementDamageForm({ editRecord, elementsDataObject, damagesDataObject, attachmentsDataObject, currentAttachmentDataObject, fallBack, }) {
-    let formName = useId();
-    let formRef = useRef(null);
-    // Data object values
-    let [project, setProject] = useState(editRecord
-        ? { ProjectID: editRecord.ProjectID, ProjectName: editRecord.ProjectName, Domain: editRecord.Domain }
-        : null);
-    let [elementID, setElementID] = useState(editRecord?.ElementID ?? "");
-    let [attachmentPrimKeys, setAttachmentPrimKeys] = useState([]);
-    let [duplicateRecords, setDuplicateRecords] = useState([]);
-    let damagesDuplicateRecord = useDataWithFilter(dsDamagesDuplicateCheck, "1=1", "whereClause");
-    let elementRecord = useDataWithFilter(elementsDataObject, `ProjectID = '${project?.ProjectID}' AND ElementID = '${elementID}'`, "whereClause");
-    // Event values
-    let [addElementOpen, setAddElementOpen] = useState(!editRecord); // Opens by default when form is new
-    let [loading, setLoading] = useState(false);
-    let [uploadingFile, setUploadingFile] = useState(false);
-    let [fixedThisSession, setFixedThisSession] = useState(false); // Element is registered fixed during this editing session
-    let [duplicateDialog, setDuplicateDialog] = useState(false);
-    // Error values
-    let [error, setError] = useState(null);
-    async function handleAddElement(addElement) {
-        setProject({
-            ProjectID: addElement.element.ProjectID,
-            ProjectName: addElement.element.ProjectName,
-            Domain: addElement.element.ProjectDomain,
-        });
-        setElementID(addElement.element.ElementID);
-    }
-    async function handleDelete(row) {
-        try {
-            let index = damagesDataObject.findIndex((r) => r.PrimKey === row.PrimKey);
-            if (index >= 0 && confirm(getLocalizedString("Are you sure you want to delete this item?"))) {
-                let primKeyArray = currentAttachmentDataObject.map((record) => record.PrimKey);
-                deleteAttachments(currentAttachmentDataObject, primKeyArray);
-                await damagesDataObject.deleteRow(index);
-            }
-            fallBack();
-        }
-        catch (error) {
-            setError(error.message);
-        }
-    }
-    async function handleCancel() {
-        // Remove the registered fix if it was registered this session
-        if (editRecord && fixedThisSession) {
-            damagesDataObject.setCurrentIndex(damagesDataObject.findIndex((record) => record.ID === editRecord.ID));
-            await damagesDataObject.refreshCurrentRow();
-            await damagesDataObject.save({
-                RegisteredFix: null,
-                RegisteredFixBy: null,
-            });
-        }
-        // Remove attachments if they are not saved
-        if (attachmentPrimKeys) {
-            await attachmentsDataObject.refreshDataSource();
-            const primKeyArray = attachmentPrimKeys.toString().split(",");
-            deleteAttachments(attachmentsDataObject, primKeyArray);
-        }
-        fallBack();
-    }
-    // Returning true means a duplicate is found and confirmation dialog will open
-    function isDuplicate() {
-        // If we are editing a record, we don't need to check for duplicates
-        if (editRecord) {
-            return false;
-        }
-        const filteredRecord = damagesDuplicateRecord.filter((record) => record.ElementID === elementID && record.ProjectID === project?.ProjectID && !record.RegisteredFix);
-        if (filteredRecord.length > 0) {
-            setDuplicateRecords(filteredRecord);
-            setDuplicateDialog(true);
-            return true;
-        }
-        return false;
-    }
-    async function handleSubmit(event) {
-        event.preventDefault();
-        setLoading(true);
-        if (duplicateRecords.length <= 0) {
-            if (isDuplicate()) {
-                return;
-            }
-        }
-        try {
-            let formData = new FormData(event.currentTarget);
-            let attachmentPrimKeys = formData.get("AttachmentPrimkeys");
-            let elementID = formData.get("ElementID");
-            let elementNumber = formData.get("ElementNumber");
-            formData.delete("File");
-            formData.delete("AttachmentPrimkeys");
-            if (!elementID && !elementNumber) {
-                setError(getLocalizedString("Please fill in either Element ID or Element Number"));
-                return;
-            }
-            localStorage.setItem("ElementDamage_Description", formData.get("Description")?.toString() ?? "");
-            localStorage.setItem("ElementDamage_Cause", formData.get("Cause")?.toString() ?? "");
-            localStorage.setItem("ElementDamage_Action", formData.get("Action")?.toString() ?? "");
-            let record = Object.assign({ ...formDataToDataObjectRecord(formData, damagesDataObject) });
-            if (formData.get("ID")) {
-                record.ID = undefined;
-                await damagesDataObject.dataHandler.update(record);
-                submitReturn();
-                return;
-            }
-            else {
-                damagesDataObject.setCurrentIndex(-1);
-                // If the RegisteredFix Control Label is checked then it will exist in the record object
-                let newJob;
-                if ("RegisteredFix" in record) {
-                    newJob = await damagesDataObject.save({
-                        ...record,
-                        RegisteredFix: new Date(),
-                        RegisteredFixBy: af.userSession.login,
-                    });
-                }
-                else {
-                    newJob = await damagesDataObject.save(record);
-                }
-                await new Promise((res) => setTimeout(res, 1500));
-                if (newJob) {
-                    // Update ElementDamageID in attachments table
-                    if (attachmentPrimKeys) {
-                        await attachmentsDataObject.refreshDataSource();
-                        const primKeyArray = attachmentPrimKeys.toString().split(",");
-                        for (const primKey of primKeyArray) {
-                            attachmentsDataObject.setCurrentIndex(attachmentsDataObject.findIndex((record) => record.PrimKey === primKey));
-                            if (attachmentsDataObject.getCurrentIndex() > -1) {
-                                await attachmentsDataObject.save({
-                                    DamageID: newJob.ID,
-                                    ElementRef: newJob.ElementRef,
-                                    ProjectID: newJob.ProjectID,
-                                    ElementID: newJob.ElementID,
-                                    ElementNumber: newJob.ElementNumber,
-                                    Domain: formData.get("Domain")?.toString() ?? af.userSession.domain,
-                                    Damage: true,
-                                });
-                            }
-                        }
-                    }
-                    submitReturn();
-                    return;
-                }
-                else {
-                    setError(getLocalizedString("No job returned when creating new job."));
-                    return;
-                }
-            }
-        }
-        catch (error) {
-            submitReturn(error.message);
-            return;
-        }
-    }
-    function submitReturn(error) {
-        if (!error) {
-            fallBack();
-        }
-        else {
-            setError(error);
-        }
-        setLoading(false);
-    }
-    return (_jsxs(PageContainer, { maxWidth: "sm", children: [_jsx(PageTitle, { variant: "h1", gutterBottom: true, children: getLocalizedString("New element damage") }), _jsx(AddElementDialog, { open: addElementOpen, mode: "single", onClose: () => setAddElementOpen(false), onAdd: handleAddElement }), _jsxs("form", { name: formName, ref: formRef, method: "POST", onSubmit: handleSubmit, className: "flow", children: [_jsx(DuplicateElementDamageDialog, { open: duplicateDialog, onClose: setDuplicateDialog, record: duplicateRecords, fallBack: fallBack }), error && (_jsx(Alert, { severity: "error", variant: "filled", children: error })), _jsx(DamageFormFields, { editRecord: editRecord, project: project, elementRecord: elementRecord, attachmentPrimKeys: [], elementID: elementID, formName: formName, handleAddElement: () => setAddElementOpen(true) }), _jsxs(Box, { display: "flex", flexDirection: "column", children: [_jsx(Typography, { variant: "h3", children: getLocalizedString("Pictures") }), _jsx(FilePond, { multiple: true, dataObject: currentAttachmentDataObject, fields: {
-                                    DamageID: editRecord?.ID,
-                                    ElementID: editRecord?.ElementID,
-                                    ProjectID: editRecord?.ProjectID,
-                                    ElementRef: editRecord?.ElementRef,
-                                    Damage: true,
-                                }, onFileStart: () => editRecord ?? setUploadingFile(true), onFileProcessed: (_error, file) => setAttachmentPrimKeys([...attachmentPrimKeys, file.serverId]), onFilesProcessed: () => setUploadingFile(false), onError: () => setUploadingFile(false) })] }), _jsx(RegisterFix, { editRecord: editRecord, damageDataObject: damagesDataObject, fixedThisSession: fixedThisSession, setFixedThisSession: setFixedThisSession }), _jsxs(Box, { display: "flex", flexWrap: "wrap", gap: 2, justifyContent: "flex-end", children: [editRecord && _jsx(Button, { onClick: () => handleDelete(editRecord), children: getLocalizedString("Delete") }), _jsx(Button, { onClick: handleCancel, children: getLocalizedString("Cancel") }), _jsx(Button, { loading: loading || uploadingFile, loadingPosition: "start", startIcon: _jsx(Add, {}), type: "submit", variant: "contained", children: editRecord ? getLocalizedString("Save changes") : getLocalizedString("Register damage") })] })] })] }));
-}