From eea607d2cabad6aee5ecb53b6a3391d0f8091c39 Mon Sep 17 00:00:00 2001 From: Kevin Burnett <18027+burnettk@users.noreply.github.com> Date: Wed, 5 Feb 2025 11:53:20 -0800 Subject: [PATCH] repair lint after refactor (#2229) * feat: Fix linting errors and add prop types to components. * feat: Fix: Move imports of PropTypes to the top of files. * refactor: Improve type safety and fix linting errors in ProcessModelShow.tsx * lint * Revert "lint" This reverts commit 9ee9488777fe425fe788d83c8cbbda3d60289cce. * functions * lint * types * lint * fixed lint issues w/ burnettk * fix file upload on model show page w/ burnettk --------- Co-authored-by: burnettk (aider) Co-authored-by: jasquat --- .../src/components/ProcessModelFileList.tsx | 13 ++--- .../ProcessModelFileUploadModal.tsx | 57 +++++++------------ .../src/components/ProcessModelReadmeArea.tsx | 13 ++--- .../src/components/ProcessModelTabs.tsx | 17 +++--- .../src/routes/ProcessModelShow.tsx | 12 ++-- 5 files changed, 49 insertions(+), 63 deletions(-) diff --git a/spiffworkflow-frontend/src/components/ProcessModelFileList.tsx b/spiffworkflow-frontend/src/components/ProcessModelFileList.tsx index a9d5a7db8..1260a89ed 100644 --- a/spiffworkflow-frontend/src/components/ProcessModelFileList.tsx +++ b/spiffworkflow-frontend/src/components/ProcessModelFileList.tsx @@ -1,3 +1,4 @@ +import React from 'react'; import { Link } from 'react-router-dom'; import { Download, Edit, Favorite, TrashCan, View } from '@carbon/icons-react'; import { @@ -10,14 +11,14 @@ import { TableRow, } from '@carbon/react'; import { Can } from '@casl/react'; -import { Ability } from '@casl/ability'; +import { PureAbility } from '@casl/ability'; import ButtonWithConfirmation from './ButtonWithConfirmation'; import ProcessModelTestRun from './ProcessModelTestRun'; import { ProcessFile } from '../interfaces'; interface ProcessModelFileListProps { processModel: any; - ability: Ability; + ability: PureAbility; targetUris: any; modifiedProcessModelId: string; onDeleteFile: (fileName: string) => void; @@ -25,7 +26,7 @@ interface ProcessModelFileListProps { isTestCaseFile: (processModelFile: ProcessFile) => boolean; } -const ProcessModelFileList: React.FC = ({ +export default function ProcessModelFileList({ processModel, ability, targetUris, @@ -33,7 +34,7 @@ const ProcessModelFileList: React.FC = ({ onDeleteFile, onSetPrimaryFile, isTestCaseFile, -}) => { +}: ProcessModelFileListProps) { const profileModelFileEditUrl = (processModelFile: ProcessFile) => { if (processModel) { if (processModelFile.name.match(/\.(dmn|bpmn)$/)) { @@ -214,6 +215,4 @@ const ProcessModelFileList: React.FC = ({ {tags} ); -}; - -export default ProcessModelFileList; +} diff --git a/spiffworkflow-frontend/src/components/ProcessModelFileUploadModal.tsx b/spiffworkflow-frontend/src/components/ProcessModelFileUploadModal.tsx index 6af32f28c..4cae0e56a 100644 --- a/spiffworkflow-frontend/src/components/ProcessModelFileUploadModal.tsx +++ b/spiffworkflow-frontend/src/components/ProcessModelFileUploadModal.tsx @@ -1,67 +1,61 @@ -import { useState } from 'react'; +import React, { useState } from 'react'; import { FileUploader, Modal } from '@carbon/react'; interface ProcessModelFileUploadModalProps { showFileUploadModal: boolean; processModel: any; - onFileUpload: (event: any) => void; handleFileUploadCancel: () => void; - checkDuplicateFile: (event: any) => void; -} -interface FileUploadState { - filesToUpload: File[] | null; + checkDuplicateFile: (files: File[], forceOverwrite?: boolean) => void; + doFileUpload: Function; + setShowFileUploadModal: Function; } -const ProcessModelFileUploadModal: React.FC< - ProcessModelFileUploadModalProps -> = ({ +export default function ProcessModelFileUploadModal({ showFileUploadModal, processModel, - onFileUpload, handleFileUploadCancel, checkDuplicateFile, -}) => { + doFileUpload, + setShowFileUploadModal, +}: ProcessModelFileUploadModalProps) { const [filesToUpload, setFilesToUpload] = useState(null); const [duplicateFilename, setDuplicateFilename] = useState(''); const [showOverwriteConfirmationPrompt, setShowOverwriteConfirmationPrompt] = useState(false); - const [fileUploadEvent, setFileUploadEvent] = useState(null); const handleOverwriteFileConfirm = () => { setShowOverwriteConfirmationPrompt(false); - if (fileUploadEvent) { - checkDuplicateFile(fileUploadEvent, true); // Force overwrite - } + doFileUpload(filesToUpload); }; const handleOverwriteFileCancel = () => { + setShowFileUploadModal(true); setShowOverwriteConfirmationPrompt(false); - setFilesToUpload(null); }; const displayOverwriteConfirmation = (filename: string) => { setDuplicateFilename(filename); + setShowFileUploadModal(false); setShowOverwriteConfirmationPrompt(true); }; - const handleLocalFileUpload = (event: any) => { - const newFiles: File[] = Array.from(event.target.files); - setFilesToUpload(newFiles); - + const handleLocalFileUpload = () => { + if (!filesToUpload) { + return; + } if (processModel) { let foundExistingFile = false; - if (processModel.files.length > 0) { + if (processModel.files && processModel.files.length > 0) { processModel.files.forEach((file: { name: string }) => { - if (file.name === newFiles[0].name) { + if (file.name === filesToUpload[0].name) { foundExistingFile = true; } }); } if (foundExistingFile) { - displayOverwriteConfirmation(newFiles[0].name); - setFileUploadEvent(event); + displayOverwriteConfirmation(filesToUpload[0].name); } else { - checkDuplicateFile(event); + checkDuplicateFile(filesToUpload); setShowOverwriteConfirmationPrompt(false); } } @@ -96,12 +90,7 @@ const ProcessModelFileUploadModal: React.FC< secondaryButtonText="Cancel" onSecondarySubmit={handleFileUploadCancel} onRequestClose={handleFileUploadCancel} - onRequestSubmit={() => { - if (filesToUpload) { - checkDuplicateFile(filesToUpload); - } - setShowOverwriteConfirmationPrompt(false); - }} + onRequestSubmit={handleLocalFileUpload} > setFilesToUpload(null)} - onChange={handleLocalFileUpload} + onChange={(event: any) => setFilesToUpload(event.target.files)} /> ); -}; - -export default ProcessModelFileUploadModal; +} diff --git a/spiffworkflow-frontend/src/components/ProcessModelReadmeArea.tsx b/spiffworkflow-frontend/src/components/ProcessModelReadmeArea.tsx index 674e7607c..490622c88 100644 --- a/spiffworkflow-frontend/src/components/ProcessModelReadmeArea.tsx +++ b/spiffworkflow-frontend/src/components/ProcessModelReadmeArea.tsx @@ -1,23 +1,24 @@ +import React from 'react'; import { Button, Column, Grid } from '@carbon/react'; import { Can } from '@casl/react'; import { Edit } from '@carbon/icons-react'; -import { Ability } from '@casl/ability'; +import { PureAbility } from '@casl/ability'; import MarkdownDisplayForFile from './MarkdownDisplayForFile'; import { ProcessFile } from '../interfaces'; interface ProcessModelReadmeAreaProps { readmeFile: ProcessFile | null; - ability: Ability; + ability: PureAbility; targetUris: any; modifiedProcessModelId: string; } -const ProcessModelReadmeArea: React.FC = ({ +export default function ProcessModelReadmeArea({ readmeFile, ability, targetUris, modifiedProcessModelId, -}) => { +}: ProcessModelReadmeAreaProps) { if (readmeFile) { return (
@@ -64,6 +65,4 @@ const ProcessModelReadmeArea: React.FC = ({ ); -}; - -export default ProcessModelReadmeArea; +} diff --git a/spiffworkflow-frontend/src/components/ProcessModelTabs.tsx b/spiffworkflow-frontend/src/components/ProcessModelTabs.tsx index ed34bfa27..37f8e03ea 100644 --- a/spiffworkflow-frontend/src/components/ProcessModelTabs.tsx +++ b/spiffworkflow-frontend/src/components/ProcessModelTabs.tsx @@ -1,3 +1,4 @@ +import React from 'react'; import { Column, Dropdown, @@ -10,7 +11,7 @@ import { } from '@carbon/react'; import { Can } from '@casl/react'; // Corrected import import { useNavigate } from 'react-router-dom'; -import { Ability } from '@casl/ability'; +import { PureAbility } from '@casl/ability'; import ProcessInstanceListTable from './ProcessInstanceListTable'; import ProcessModelFileList from './ProcessModelFileList'; import { ProcessFile } from '../interfaces'; @@ -18,7 +19,7 @@ import ProcessModelReadmeArea from './ProcessModelReadmeArea'; interface ProcessModelTabsProps { processModel: any; - ability: Ability; + ability: PureAbility; targetUris: any; modifiedProcessModelId: string; selectedTabIndex: number; @@ -27,9 +28,10 @@ interface ProcessModelTabsProps { onSetPrimaryFile: (fileName: string) => void; isTestCaseFile: (processModelFile: ProcessFile) => boolean; readmeFile: ProcessFile | null; + setShowFileUploadModal: Function; } -const ProcessModelTabs: React.FC = ({ +export default function ProcessModelTabs({ processModel, ability, targetUris, @@ -40,7 +42,8 @@ const ProcessModelTabs: React.FC = ({ onSetPrimaryFile, isTestCaseFile, readmeFile, -}) => { + setShowFileUploadModal, +}: ProcessModelTabsProps) { const navigate = useNavigate(); if (!processModel) { @@ -88,7 +91,7 @@ const ProcessModelTabs: React.FC = ({ // Handled by parent component via prop updateSelectedTab({ selectedIndex: 1 }); // Switch to Files tab // Open file upload modal (handled by parent) - // setShowFileUploadModal(true); + setShowFileUploadModal(true); } else if (a.selectedItem.text === 'New DMN File') { navigate( `/editor/process-models/${modifiedProcessModelId}/files?file_type=dmn`, @@ -181,6 +184,4 @@ const ProcessModelTabs: React.FC = ({ ); -}; - -export default ProcessModelTabs; +} diff --git a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx index 78e6b73fd..97a6a9d99 100644 --- a/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx +++ b/spiffworkflow-frontend/src/routes/ProcessModelShow.tsx @@ -1,4 +1,4 @@ -import { useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; import { Upload, Edit, TrashCan } from '@carbon/icons-react'; import { Button, Stack } from '@carbon/react'; @@ -56,7 +56,7 @@ export default function ProcessModelShow() { let hasTestCaseFiles: boolean = false; const isTestCaseFile = (processModelFile: ProcessFile) => { - return processModelFile.name.match(/^test_.*\.json$/); + return !!processModelFile.name.match(/^test_.*\.json$/); }; if (processModel) { @@ -212,9 +212,7 @@ export default function ProcessModelShow() { a={targetUris.processInstanceCreatePath} ability={ability} > - <> - - + ); @@ -223,9 +221,10 @@ export default function ProcessModelShow() { {permissionsLoaded ? (