fix(ffe-file-upload-react): håndter iOS bildenavn og forbedre tilgjengelighet

- Legg til unik navngenerering for iOS kamerabilder som alltid får navnet 'image.jpg'
- Fiks ESLint feil med no-shadow ved å endre parameternavn
- Forbedre tilgjengelighet med tastatur og skjermleser støtte
- Legg til korrekt ARIA-roller og tastaturfunksjonalitet

Author: hagenek

packages/ffe-file-upload-react/src/FileUpload.tsx

@@ -4,53 +4,41 @@ import classNames from 'classnames';
 import { SecondaryButton } from '@sb1/ffe-buttons-react';
 import { Icon } from '@sb1/ffe-icons-react';
 
+// Helper function to generate a unique filename
+const generateUniqueFileName = (originalFile: File): File => {
+    // If it's not an iOS "image.jpg" case, return the original file
+    if (originalFile.name !== 'image.jpg') {
+        return originalFile;
+    }
+
+    // Create a unique name for iOS images
+    const timestamp = new Date().getTime();
+    const randomString = Math.random().toString(36).substring(2, 8);
+    const newName = `image_${timestamp}_${randomString}.jpg`;
+
+    // Create a new File object with the unique name
+    return new File([originalFile], newName, {
+        type: originalFile.type,
+        lastModified: originalFile.lastModified,
+    });
+};
+
 export interface FileUploadProps<Document> {
-    /** ID for the input field. The ID is used as a base for the label ID as well. */
     id: string;
-    /** Label for the button to trigger native upload handling. */
     label: string;
-    /**
-     * A map of files, indexed by file name (check file-shape on FileItem.js propTypes), that the user has uploaded.
-     * Must be maintained outside of `FileUpload`. It is up to the implementation to deny or accept file types, sizes, etc,
-     * and it is important that duplicates are not allowed.
-     * */
     files: Record<string, FileItemProps<Document>['file']>;
-    /**
-     * Will be called with `FileList`-object containing the `File`-objects the user selected.
-     * See MDN for documentation on
-     * [FileList](https://developer.mozilla.org/en-US/docs/Web/API/FileList) and
-     * [File](https://developer.mozilla.org/en-US/docs/Web/API/File).
-     */
     onFilesSelected(fileList: FileList | null): void;
-    /** Will be called when objects are dropped over the upload-section. */
     onFilesDropped(fileList: FileList | null): void;
-    /**
-     * Called when the user clicks the delete button for a given file. Is called with the `File`
-     * object of the file in question.
-     */
     onFileDeleted(file: FileItemProps<Document>['file']): void;
-    /** Whether or not uploading multiple files at once via the native file handler is allowed*/
     multiple?: boolean;
-    /** Title module */
     title: string;
-    /** Text on the info-section */
     infoText: string;
-    /** Subtext on the info-section */
     infoSubText?: string;
-    /** Label for the cancel button */
     cancelText?: string;
-    /** Label for the delete button */
     deleteText?: string;
-    /** Title on the upload-section */
     uploadTitle: string;
-    /** MicroText on the upload-section */
     uploadMicroText: string;
-    /** SubText on the upload-section */
     uploadSubText: string;
-    /** Unique file type specifier that describes a type of file that may be selected by the user, e.g. ".pdf"
-     *  See MDN for documentation on
-     *  [Unique file type specifiers](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers)
-     */
     accept?: string;
 }
 
@@ -77,26 +65,48 @@ export function FileUpload<Document>({
     const downloadIcon =
         'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik00ODAtMzQzLjUzOXEtNy4yMzEgMC0xMy40NjEtMi4zMDgtNi4yMzEtMi4zMDctMTEuODQ2LTcuOTIzTDMzMC4zMDktNDc4LjE1M3EtOC45MjMtOC45MjMtOC44MDctMjAuODg0LjExNS0xMS45NjEgOC44MDctMjEuMjY5IDkuMzA4LTkuMzA3IDIxLjM4NC05LjYxNSAxMi4wNzctLjMwOCAyMS4zODUgOWw3Ni45MjMgNzYuOTIzdi0zMDYuMDAxcTAtMTIuNzY5IDguNjE1LTIxLjM4NCA4LjYxNS04LjYxNiAyMS4zODQtOC42MTZ0MjEuMzg0IDguNjE2cTguNjE1IDguNjE1IDguNjE1IDIxLjM4NHYzMDYuMDAxbDc2LjkyMy03Ni45MjNxOC45MjMtOC45MjMgMjEuMTkyLTguODA4IDEyLjI2OS4xMTYgMjEuNTc3IDkuNDIzIDguNjkyIDkuMzA4IDguOTk5IDIxLjA3Ny4zMDggMTEuNzY5LTguOTk5IDIxLjA3Nkw1MDUuMzA3LTM1My43N3EtNS42MTUgNS42MTYtMTEuODQ2IDcuOTIzLTYuMjMgMi4zMDgtMTMuNDYxIDIuMzA4Wk0yNTIuMzA5LTE4MC4wMDFxLTMwLjMwOCAwLTUxLjMwOC0yMXQtMjEtNTEuMzA4di03OC40NjFxMC0xMi43NjkgOC42MTYtMjEuMzg0IDguNjE1LTguNjE1IDIxLjM4NC04LjYxNXQyMS4zODQgOC42MTVRMjQwLTM0My41MzkgMjQwLTMzMC43N3Y3OC40NjFxMCA0LjYxNiAzLjg0NiA4LjQ2MyAzLjg0NyAzLjg0NiA4LjQ2MyAzLjg0Nmg0NTUuMzgycTQuNjE2IDAgOC40NjMtMy44NDYgMy44NDYtMy44NDcgMy44NDYtOC40NjN2LTc4LjQ2MXEwLTEyLjc2OSA4LjYxNS0yMS4zODR0MjEuMzg0LTguNjE1cTEyLjc2OSAwIDIxLjM4NCA4LjYxNSA4LjYxNiA4LjYxNSA4LjYxNiAyMS4zODR2NzguNDYxcTAgMzAuMzA4LTIxIDUxLjMwOHQtNTEuMzA4IDIxSDI1Mi4zMDlaIi8+PC9zdmc+';
 
+    const processFiles = (inputFiles: FileList | null): FileList | null => {
+        if (!inputFiles) return null;
+
+        // Create a new array of processed files
+        const processedFiles = Array.from(inputFiles).map(
+            generateUniqueFileName,
+        );
+
+        // Convert back to FileList-like object
+        const dataTransfer = new DataTransfer();
+        processedFiles.forEach(file => dataTransfer.items.add(file));
+        return dataTransfer.files;
+    };
+
     const handleFilesDropped = (event: React.DragEvent<HTMLDivElement>) => {
         event.preventDefault();
         setIsHover(false);
-        onFilesDropped(event.dataTransfer.files);
+        const processedFiles = processFiles(event.dataTransfer.files);
+        onFilesDropped(processedFiles);
     };
 
     const handleFileDeleted = (event: React.MouseEvent<HTMLButtonElement>) => {
         onFileDeleted(files[event.currentTarget.id]);
     };
 
     const triggerUploadFileNativeHandler = () => {
-        // clear file input to trigger onChange when uploading same filename
         if (fileInputElement.current) {
             fileInputElement.current.value = '';
             fileInputElement.current.click();
         }
     };
 
     const handleFileSelected = (event: React.ChangeEvent<HTMLInputElement>) => {
-        onFilesSelected(event.target.files);
+        const processedFiles = processFiles(event.target.files);
+        onFilesSelected(processedFiles);
+    };
+
+    const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            triggerUploadFileNativeHandler();
+        }
     };
 
     return (
@@ -124,7 +134,6 @@ export function FileUpload<Document>({
                     </div>
                 </div>
             )}
-            {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}
             <div
                 className="ffe-file-upload__upload-section"
                 onDrop={handleFilesDropped}
@@ -133,6 +142,10 @@ export function FileUpload<Document>({
                     setIsHover(true);
                 }}
                 onDragLeave={() => setIsHover(false)}
+                role="button"
+                tabIndex={0}
+                onKeyDown={handleKeyDown}
+                aria-label={label}
             >
                 <div
                     className={classNames(