chore: Send md5 hex to server action on submit instead of base64 (#6294)

* send md5 hex to server action on submit instead of base64

* remove async digest create so copyobject can run in hook

Author: bryan-robitaille

app/(gcforms)/[locale]/(form filler)/id/[...props]/lib/client/fileUploader.ts

@@ -4,7 +4,6 @@ import axios, { AxiosError, AxiosProgressEvent } from "axios";
 import { Responses, FileInputResponse, FileInput } from "@gcforms/types";
 import { FileUploadError } from "../client/exceptions";
 import { isMimeTypeValid } from "@gcforms/core";
-import { generateFileChecksums } from "@lib/utils/fileChecksum";
 
 const isFileInput = (response: unknown): response is FileInput => {
   return (
@@ -65,10 +64,7 @@ export const copyObjectExcludingFileContent = (
   };
   filterFileContent(originalObject, formValuesWithoutFileContent);
 
-  // Calculate checksums for all files key / value pairs
-  const fileChecksums = generateFileChecksums(fileObjsRef);
-
-  return { formValuesWithoutFileContent, fileObjsRef, fileChecksums };
+  return { formValuesWithoutFileContent, fileObjsRef };
 };
 
 export const uploadFile = async (

components/clientComponents/forms/Form/Form.tsx

@@ -36,6 +36,7 @@ import { ga } from "@lib/client/clientHelpers";
 import { SubmitProgress } from "@clientComponents/forms/SubmitProgress/SubmitProgress";
 import { handleUploadError } from "@lib/fileInput/handleUploadError";
 import { hasFiles } from "@lib/fileExtractor";
+import { generateFileChecksums } from "@lib/utils/fileChecksum";
 
 import {
   copyObjectExcludingFileContent,
@@ -300,9 +301,10 @@ export const Form = withFormik<FormProps, Responses>({
       );
 
       // Extract file content from formValues so they are not part of the submission call to the submit action
-      const { formValuesWithoutFileContent, fileObjsRef, fileChecksums } =
+      const { formValuesWithoutFileContent, fileObjsRef } =
         copyObjectExcludingFileContent(formValues);
 
+      const fileChecksums = await generateFileChecksums(fileObjsRef);
       let submitProgress = 0;
       let progressInterval: NodeJS.Timeout | undefined = undefined;
 

lib/utils/fileChecksum.ts

@@ -1,15 +1,14 @@
-import { createHash } from "crypto";
+import { md5 } from "hash-wasm";
 import { FileInput } from "@gcforms/types";
 import { logMessage } from "@lib/logger";
 
-export function calculateMD5Checksum(content: ArrayBuffer): string {
+// Creates Hexadecimal base MD5 hash
+export async function calculateMD5Checksum(content: ArrayBuffer): Promise<string> {
   const buffer = Buffer.from(content);
-  const hash = createHash("md5");
-  hash.update(buffer);
-  return hash.digest("base64");
+  return md5(buffer);
 }
 
-export function calculateFileChecksum(file: FileInput): string {
+export async function calculateFileChecksum(file: FileInput): Promise<string> {
   // Ensure file content is available
   if (!file.content) {
     throw new Error(`Unable to calculate checksum for file ${file.name}: no content available`);
@@ -22,19 +21,21 @@ export function calculateFileChecksum(file: FileInput): string {
  * @param fileObjsRef - Map of file IDs to FileInput objects
  * @returns Map of file IDs to their MD5 checksums
  */
-export function generateFileChecksums(
+export async function generateFileChecksums(
   fileObjsRef: Record<string, FileInput>
-): Record<string, string> {
+): Promise<Record<string, string>> {
   const checksums: Record<string, string> = {};
 
-  for (const [fileId, file] of Object.entries(fileObjsRef)) {
-    try {
-      checksums[fileId] = calculateFileChecksum(file);
-    } catch (error) {
-      logMessage.warn(`Failed to calculate checksum for file ${file.name}: ${error}`);
-      // Continue with other files, don't fail the entire process
-    }
-  }
+  await Promise.all(
+    Object.entries(fileObjsRef).map(async ([fileId, file]) => {
+      try {
+        checksums[fileId] = await calculateFileChecksum(file);
+      } catch (error) {
+        logMessage.warn(`Failed to calculate checksum for file ${file.name}: ${error}`);
+        // Continue with other files, don't fail the entire process
+      }
+    })
+  );
 
   return checksums;
 }

lib/utils/tests/fileChecksum.vitest.ts

@@ -1,126 +1,130 @@
-import { describe, it, expect } from 'vitest';
-import { calculateMD5Checksum, calculateFileChecksum, generateFileChecksums } from '../fileChecksum';
-import { FileInput } from '@gcforms/types';
-import { readFileSync } from 'fs';
-import { join } from 'path';
-
-describe('fileChecksum', () => {
+import { describe, it, expect } from "vitest";
+import {
+  calculateMD5Checksum,
+  calculateFileChecksum,
+  generateFileChecksums,
+} from "../fileChecksum";
+import { FileInput } from "@gcforms/types";
+import { readFileSync } from "fs";
+import { join } from "path";
+
+describe("fileChecksum", () => {
   // Helper function to load CSV fixtures
   const loadCsvFixture = (filename: string): ArrayBuffer => {
-    const csvPath = join(__dirname, 'fixtures', filename);
+    const csvPath = join(__dirname, "fixtures", filename);
     return readFileSync(csvPath).buffer;
   };
 
-  describe('calculateMD5Checksum', () => {
-    it('should calculate MD5 checksum for file content', () => {
-      const content = loadCsvFixture('sample.csv');
-      const checksum = calculateMD5Checksum(content);
+  describe("calculateMD5Checksum", () => {
+    it("should calculate MD5 checksum for file content", async () => {
+      const content = loadCsvFixture("sample.csv");
+      const checksum = await calculateMD5Checksum(content);
 
       // This checksum should be consistent for the sample.csv file
       expect(checksum).toBeTruthy();
-      expect(typeof checksum).toBe('string');
+      expect(typeof checksum).toBe("string");
     });
 
-    it('should return different checksums for different content', () => {
-      const content1 = loadCsvFixture('sample.csv');
-      const content2 = new TextEncoder().encode('Different content').buffer;
+    it("should return different checksums for different content", async () => {
+      const content1 = loadCsvFixture("sample.csv");
+      const content2 = new TextEncoder().encode("Different content").buffer;
 
-      const checksum1 = calculateMD5Checksum(content1);
-      const checksum2 = calculateMD5Checksum(content2);
+      const checksum1 = await calculateMD5Checksum(content1);
+      const checksum2 = await calculateMD5Checksum(content2);
 
       expect(checksum1).not.toBe(checksum2);
     });
 
-    it('should return same checksum for same content', () => {
-      const content1 = loadCsvFixture('sample.csv');
-      const content2 = loadCsvFixture('sample-copy.csv');
+    it("should return same checksum for same content", async () => {
+      const content1 = loadCsvFixture("sample.csv");
+      const content2 = loadCsvFixture("sample-copy.csv");
 
-      const checksum1 = calculateMD5Checksum(content1);
-      const checksum2 = calculateMD5Checksum(content2);
+      const checksum1 = await calculateMD5Checksum(content1);
+      const checksum2 = await calculateMD5Checksum(content2);
 
       expect(checksum1).toBe(checksum2);
     });
   });
 
-  describe('calculateFileChecksum', () => {
-    it('should calculate checksum for FileInput object', () => {
-      const csvContent = loadCsvFixture('sample.csv');
+  describe("calculateFileChecksum", () => {
+    it("should calculate checksum for FileInput object", async () => {
+      const csvContent = loadCsvFixture("sample.csv");
       const file: FileInput = {
-        name: 'sample.csv',
+        name: "sample.csv",
         size: csvContent.byteLength,
         content: csvContent,
       };
 
-      const checksum = calculateFileChecksum(file);
+      const checksum = await calculateFileChecksum(file);
       expect(checksum).toBeTruthy();
-      expect(typeof checksum).toBe('string');
+      expect(typeof checksum).toBe("string");
     });
 
-    it('should throw error for file without content', () => {
+    it("should throw error for file without content", async () => {
       const file = {
-        name: 'test.txt',
+        name: "test.txt",
         size: 0,
         content: null,
       } as unknown as FileInput;
 
-      expect(() => calculateFileChecksum(file)).toThrow(
-        'Unable to calculate checksum for file test.txt: no content available'
+      expect(calculateFileChecksum(file)).rejects.toThrow(
+        "Unable to calculate checksum for file test.txt: no content available"
       );
     });
   });
 
-  describe('generateFileChecksums', () => {
-    it('should generate checksums for multiple files', () => {
-      const csvContent1 = loadCsvFixture('sample.csv');
-      const csvContent2 = loadCsvFixture('sample-copy.csv');
+  describe("generateFileChecksums", () => {
+    it("should generate checksums for multiple files", async () => {
+      const csvContent1 = loadCsvFixture("sample.csv");
+      const csvContent2 = loadCsvFixture("sample-copy.csv");
 
       const fileObjsRef = {
-        'file1': {
-          name: 'sample.csv',
+        file1: {
+          name: "sample.csv",
           size: csvContent1.byteLength,
           content: csvContent1,
         } as FileInput,
-        'file2': {
-          name: 'sample-copy.csv',
+        file2: {
+          name: "sample-copy.csv",
           size: csvContent2.byteLength,
           content: csvContent2,
         } as FileInput,
       };
 
-      const checksums = generateFileChecksums(fileObjsRef);
+      const checksums = await generateFileChecksums(fileObjsRef);
 
-      expect(checksums).toHaveProperty('file1');
-      expect(checksums).toHaveProperty('file2');
+      expect(checksums).toHaveProperty("file1");
+      expect(checksums).toHaveProperty("file2");
       // Both files have identical content, so checksums should be the same
       expect(checksums.file1).toBe(checksums.file2);
     });
 
-    it('should handle empty file objects', () => {
-      const checksums = generateFileChecksums({});
+    it("should handle empty file objects", async () => {
+      const checksums = await generateFileChecksums({});
       expect(checksums).toEqual({});
     });
 
-    it('should continue processing when one file fails', () => {
-      const csvContent = loadCsvFixture('sample.csv');
+    it("should continue processing when one file fails", async () => {
+      const csvContent = loadCsvFixture("sample.csv");
 
       const fileObjsRef = {
-        'file1': {
-          name: 'sample.csv',
+        file1: {
+          name: "sample.csv",
           size: csvContent.byteLength,
           content: csvContent,
         } as FileInput,
-        'file2': {
-          name: 'broken.csv',
+        file2: {
+          name: "broken.csv",
           size: 0,
           content: null,
         } as unknown as FileInput,
       };
 
-      const checksums = generateFileChecksums(fileObjsRef);
+      const checksums = await generateFileChecksums(fileObjsRef);
 
-      expect(checksums).toHaveProperty('file1');
-      expect(checksums).not.toHaveProperty('file2');
-      expect(typeof checksums.file1).toBe('string');
+      expect(checksums).toHaveProperty("file1");
+      expect(checksums).not.toHaveProperty("file2");
+      expect(typeof checksums.file1).toBe("string");
     });
   });
-});
+});

package.json

@@ -88,6 +88,7 @@
     "formik": "2.4.6",
     "fuse.js": "^7.1.0",
     "got": "11",
+    "hash-wasm": "^4.12.0",
     "htmlparser2": "8.0.2",
     "i18next": "^25.5.2",
     "i18next-browser-languagedetector": "^8.2.0",
@@ -103,7 +104,6 @@
     "lodash.set": "4.3.2",
     "lodash.unset": "4.5.2",
     "markdown-to-jsx": "7.7.13",
-    "md5": "^2.3.0",
     "native-file-system-adapter": "^3.0.1",
     "next": "15.5.4",
     "next-auth": "5.0.0-beta.29",
@@ -155,7 +155,6 @@
     "@types/lodash.merge": "^4",
     "@types/lodash.set": "^4.3.9",
     "@types/lodash.unset": "^4.5.9",
-    "@types/md5": "^2.3.5",
     "@types/node": "^24.7.2",
     "@types/node-fetch": "^2.6.9",
     "@types/pg": "^8.10.9",