df-ae-forms-package 1.1.6 → 1.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1 -0
- package/dist/index.esm.js +10 -3
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +10 -3
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -334,7 +334,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
334
334
|
'Maria Garcia',
|
|
335
335
|
'John Smith',
|
|
336
336
|
'Sarah Johnson'
|
|
337
|
-
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, isEdit }) => {
|
|
337
|
+
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, inEditMode = false, isEdit }) => {
|
|
338
338
|
// Determine if workflow actions should be enabled
|
|
339
339
|
// If explicitly provided, use that. Otherwise, default to isEdit (true if editing, false/undefined otherwise).
|
|
340
340
|
// Fallback to false if neither is provided.
|
|
@@ -350,6 +350,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
350
350
|
// State to hold both File objects and existing attachments
|
|
351
351
|
const [localAttachments, setLocalAttachments] = React.useState(attachments || []);
|
|
352
352
|
const [isDragging, setIsDragging] = React.useState(false);
|
|
353
|
+
const [isViewMode, setIsViewMode] = React.useState(!!issue && !inEditMode);
|
|
353
354
|
const fileInputRef = React.useRef(null);
|
|
354
355
|
const isEditMode = isEdit !== undefined ? isEdit : !!issue;
|
|
355
356
|
React.useEffect(() => {
|
|
@@ -371,6 +372,11 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
371
372
|
}
|
|
372
373
|
}
|
|
373
374
|
}, [isOpen, attachments, issue, isEditMode]);
|
|
375
|
+
React.useEffect(() => {
|
|
376
|
+
if (issue) {
|
|
377
|
+
setIsViewMode(!inEditMode);
|
|
378
|
+
}
|
|
379
|
+
}, [issue, inEditMode]);
|
|
374
380
|
const handleFileChange = (event) => {
|
|
375
381
|
if (event.target.files && event.target.files.length > 0) {
|
|
376
382
|
const newFiles = Array.from(event.target.files);
|
|
@@ -587,6 +593,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
587
593
|
await onUpdateIssue(issue._id, updateData);
|
|
588
594
|
}
|
|
589
595
|
toastService.showSuccess('Issue updated successfully');
|
|
596
|
+
setIsViewMode(true);
|
|
590
597
|
if (onSuccess) {
|
|
591
598
|
onSuccess();
|
|
592
599
|
}
|
|
@@ -668,7 +675,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
668
675
|
if (!isOpen) {
|
|
669
676
|
return null;
|
|
670
677
|
}
|
|
671
|
-
const modalContent = (jsxRuntime.jsx("div", { className: "raise-issue-modal-overlay", onClick: onClose, children: jsxRuntime.jsxs("div", { className: "raise-issue-modal", onClick: (e) => e.stopPropagation(), children: [jsxRuntime.jsxs("div", { className: "raise-issue-modal-header", children: [jsxRuntime.jsxs("div", { className: "raise-issue-modal-header-left", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "raise-issue-modal-icon", size: 20 }), jsxRuntime.jsx("div", { className: "raise-issue-modal-header-text", children: jsxRuntime.jsx("div", { className: "raise-issue-modal-title-main", children: isEditMode ? 'Issue Details' : 'Create Issue' }) })] }), jsxRuntime.jsx("button", { className: "raise-issue-modal-close", onClick: onClose, "aria-label": "Close", children: jsxRuntime.jsx(lucideReact.X, { size: 18 }) })] }), jsxRuntime.jsx("div", { className: "raise-issue-modal-content", children: jsxRuntime.jsxs("div", { className: "raise-issue-fields-grid", children: [isEditMode && issue?.issueNumber && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Issue ID" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: issue.issueNumber, readOnly: true })] })), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Task" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: isEditMode ? (issue?.component?.basic?.label || '') : (component?.basic?.label || ''), readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Task Value" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: isEditMode ? (issue?.component?.basic?.value || '') : (component?.basic?.value || ''), readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Title ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: title, onChange: (e) => setTitle(e.target.value), placeholder: "Enter issue title", readOnly: isEditMode })] }), !isStandalone && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Work Order ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: workOrderNumber, onChange: (e) => setWorkOrderNumber(e.target.value), placeholder: "N/A", readOnly: isEditMode })] })), !isStandalone && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Asset Number ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: assetNumber, onChange: (e) => setAssetNumber(e.target.value), placeholder: "Enter asset number", readOnly: isEditMode })] })), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Raised By ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field-value-with-icon", children: [jsxRuntime.jsx(lucideReact.User, { size: 16 }), jsxRuntime.jsx("span", { children: user ? `${user.firstName || ''} ${user.lastName || ''}`.trim() || 'User' : 'User' })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Created On" }), jsxRuntime.jsxs("div", { className: "raise-issue-field-value-with-icon", children: [jsxRuntime.jsx(lucideReact.Calendar, { size: 16 }), jsxRuntime.jsx("span", { children: isEditMode && issue?.createdAt
|
|
678
|
+
const modalContent = (jsxRuntime.jsx("div", { className: "raise-issue-modal-overlay", onClick: onClose, children: jsxRuntime.jsxs("div", { className: "raise-issue-modal", onClick: (e) => e.stopPropagation(), children: [jsxRuntime.jsxs("div", { className: "raise-issue-modal-header", children: [jsxRuntime.jsxs("div", { className: "raise-issue-modal-header-left", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "raise-issue-modal-icon", size: 20 }), jsxRuntime.jsx("div", { className: "raise-issue-modal-header-text", children: jsxRuntime.jsx("div", { className: "raise-issue-modal-title-main", children: isEditMode ? 'Issue Details' : 'Create Issue' }) })] }), jsxRuntime.jsx("button", { className: "raise-issue-modal-close", onClick: onClose, "aria-label": "Close", children: jsxRuntime.jsx(lucideReact.X, { size: 18 }) })] }), jsxRuntime.jsx("div", { className: "raise-issue-modal-content", children: jsxRuntime.jsxs("div", { className: "raise-issue-fields-grid", children: [isEditMode && issue?.issueNumber && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Issue ID" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: issue.issueNumber, readOnly: true })] })), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Task" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: isEditMode ? (issue?.component?.basic?.label || '') : (component?.basic?.label || ''), readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Task Value" }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: isEditMode ? (issue?.component?.basic?.value || '') : (component?.basic?.value || ''), readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Title ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: title, onChange: (e) => setTitle(e.target.value), placeholder: "Enter issue title", readOnly: isEditMode && isViewMode })] }), !isStandalone && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Work Order ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: workOrderNumber, onChange: (e) => setWorkOrderNumber(e.target.value), placeholder: "N/A", readOnly: isEditMode && isViewMode })] })), !isStandalone && (jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Asset Number ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: `raise-issue-field-input ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: assetNumber, onChange: (e) => setAssetNumber(e.target.value), placeholder: "Enter asset number", readOnly: isEditMode && isViewMode })] })), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Raised By ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field-value-with-icon", children: [jsxRuntime.jsx(lucideReact.User, { size: 16 }), jsxRuntime.jsx("span", { children: user ? `${user.firstName || ''} ${user.lastName || ''}`.trim() || 'User' : 'User' })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Created On" }), jsxRuntime.jsxs("div", { className: "raise-issue-field-value-with-icon", children: [jsxRuntime.jsx(lucideReact.Calendar, { size: 16 }), jsxRuntime.jsx("span", { children: isEditMode && issue?.createdAt
|
|
672
679
|
? (safeDate(issue.createdAt) || new Date()).toLocaleString('en-US', {
|
|
673
680
|
year: 'numeric',
|
|
674
681
|
month: 'short',
|
|
@@ -684,7 +691,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
684
691
|
hour: '2-digit',
|
|
685
692
|
minute: '2-digit',
|
|
686
693
|
hour12: true
|
|
687
|
-
}) })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("textarea", { className: `raise-issue-field-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Enter issue description", rows: 4, readOnly: isEditMode })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.
|
|
694
|
+
}) })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("textarea", { className: `raise-issue-field-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Enter issue description", rows: 4, readOnly: isEditMode && isViewMode })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: status, readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Assign to ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("select", { className: "raise-issue-field-select", value: assignee, onChange: (e) => setAssignee(e.target.value), disabled: isEditMode && isViewMode, children: [jsxRuntime.jsx("option", { value: "", children: "Unassigned" }), availableUsers.map(userName => (jsxRuntime.jsx("option", { value: userName, children: userName }, userName)))] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Priority ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("div", { className: "raise-issue-priority-buttons", children: [jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-low ${priority === 'Low' ? 'active' : ''}`, onClick: () => setPriority('Low'), disabled: isEditMode && isViewMode, children: "Low" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-medium ${priority === 'Medium' ? 'active' : ''}`, onClick: () => setPriority('Medium'), disabled: isEditMode && isViewMode, children: "Medium" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-high ${priority === 'High' ? 'active' : ''}`, onClick: () => setPriority('High'), disabled: isEditMode && isViewMode, children: "High" })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label-with-icon", children: [jsxRuntime.jsx(lucideReact.MessageSquare, { size: 16 }), jsxRuntime.jsx("span", { children: "Comments" })] }), !comments && (jsxRuntime.jsx("div", { className: "raise-issue-no-comments", children: "No comments yet" })), jsxRuntime.jsx("textarea", { className: `raise-issue-field-textarea raise-issue-comments-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: comments, onChange: (e) => setComments(e.target.value), placeholder: "Add a comment...", rows: 4, readOnly: isEditMode })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", style: { marginTop: '1rem' }, children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Attachments" }), jsxRuntime.jsxs("div", { className: "raise-issue-attachments-container", children: [!isEditMode && (jsxRuntime.jsxs("div", { className: `raise-issue-dropzone ${isDragging ? 'dragging' : ''}`, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: () => fileInputRef.current?.click(), children: [jsxRuntime.jsx("input", { type: "file", ref: fileInputRef, style: { display: 'none' }, onChange: handleFileChange, multiple: true }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-icon", children: jsxRuntime.jsx(lucideReact.UploadCloud, { size: 24 }) }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-text", children: "Click to upload or drag and drop" }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-hint", children: "PNG, JPG up to 10MB" })] })), localAttachments.length > 0 && (jsxRuntime.jsx("div", { className: "raise-issue-attachments-list", children: localAttachments.map((file, index) => (jsxRuntime.jsxs("div", { className: "raise-issue-attachment-item", children: [jsxRuntime.jsx("div", { className: "raise-issue-attachment-thumbnail", children: getAttachmentPreview(file) ? (jsxRuntime.jsx("img", { src: getAttachmentPreview(file), alt: "Thumbnail" })) : (jsxRuntime.jsx(lucideReact.Paperclip, { size: 20, color: "#9ca3af" })) }), jsxRuntime.jsxs("div", { className: "raise-issue-attachment-info", children: [jsxRuntime.jsx("span", { className: "attachment-name", title: getAttachmentName(file), children: getAttachmentName(file) }), file instanceof File && (jsxRuntime.jsxs("span", { className: "attachment-size", children: [(file.size / 1024).toFixed(1), " KB"] }))] }), !isEditMode && (jsxRuntime.jsx("button", { type: "button", className: "attachment-remove-btn", onClick: () => handleRemoveAttachment(index), title: "Remove", children: jsxRuntime.jsx(lucideReact.X, { size: 12 }) }))] }, index))) }))] })] })] }) }), jsxRuntime.jsx("div", { className: "raise-issue-modal-actions", children: jsxRuntime.jsxs("div", { className: "raise-issue-modal-actions-buttons", children: [isEditMode && issue && !isViewMode && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [status === EIssueStatus.OPEN && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-accept", onClick: handleAccept, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Accept' })), status === EIssueStatus.IN_PROGRESS && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-resolve", onClick: handleResolve, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Resolve' })), (status === EIssueStatus.OPEN) && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-reject", onClick: handleReject, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Reject' }))] })), !isEditMode && (jsxRuntime.jsx("button", { className: `raise-issue-modal-button raise-issue-modal-button-save ${!isFormValid ? 'disabled' : ''}`, onClick: handleSubmit, disabled: isSubmitting || !isFormValid, children: isSubmitting ? 'Creating...' : 'Create Issue' }))] }) })] }) }));
|
|
688
695
|
// Render modal using portal to document body for full-page overlay
|
|
689
696
|
return require$$0.createPortal(modalContent, document.body);
|
|
690
697
|
};
|