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