fix(SonarLint) : fileFormatCard proptypes

hotosm · Dec 27, 2023 · ddd9739 · ddd9739
1 parent 15ec239
commit ddd9739
Showing 1 changed file with 12 additions and 4 deletions.
diff --git a/frontend/src/components/projectDetail/fileFormatCard.js b/frontend/src/components/projectDetail/fileFormatCard.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import { AnimatedLoadingIcon } from '../button';
+import PropTypes from 'prop-types';
 
 /**
  * Renders a list of file formats as clickable links.
@@ -19,23 +20,23 @@ function FileFormatCard({ title, fileFormats, downloadS3Data, isDownloadingState
           isDownloadingState?.fileFormat === fileFormat?.format;
 
         return (
-          <React.Fragment key={index}>
-            <div
+          <React.Fragment key={fileFormat.title}>
+            <button
               tabIndex={0}
               style={
                 loadingState
                   ? { cursor: 'not-allowed', pointerEvents: 'none' }
                   : { cursor: 'pointer' }
               }
-              role="button"
               onClick={() => downloadS3Data(title, fileFormat.format)}
+              onKeyUp={() => downloadS3Data(title, fileFormat.format)}
               className="link hover-red color-inherit"
             >
               <p className="underline fw5" style={{ textUnderlineOffset: '5px' }}>
                 {fileFormat.format}
                 {loadingState ? <AnimatedLoadingIcon /> : null}
               </p>
-            </div>
+            </button>
             {index !== fileFormats.length - 1 && <hr className="file-list-separator" />}
           </React.Fragment>
         );
@@ -45,3 +46,10 @@ function FileFormatCard({ title, fileFormats, downloadS3Data, isDownloadingState
 }
 
 export default FileFormatCard;
+
+FileFormatCard.propTypes = {
+  title: PropTypes.string,
+  fileFormats: PropTypes.arrayOf(PropTypes.object),
+  downloadS3Data: PropTypes.func,
+  isDownloadingState: PropTypes.bool,
+};