diff --git a/cypress/e2e/with_mock_data/items.cy.ts b/cypress/e2e/with_mock_data/items.cy.ts
index b7c8a214c..b9b0def19 100644
--- a/cypress/e2e/with_mock_data/items.cy.ts
+++ b/cypress/e2e/with_mock_data/items.cy.ts
@@ -909,6 +909,7 @@ describe('Items', () => {
         .should('be.visible')
         .within(() => {
           cy.findByLabelText('File Name *').clear();
+          cy.findByText('.png').should('exist');
           cy.findByLabelText('File Name *').type('test file');
 
           cy.findByLabelText('Title').clear();
@@ -930,7 +931,7 @@ describe('Items', () => {
         expect(patchRequests.length).equal(1);
         const request = patchRequests[0];
         expect(JSON.stringify(await request.json())).equal(
-          '{"file_name":"test file","description":"test description","title":"test title"}'
+          '{"file_name":"test file.png","description":"test description","title":"test title"}'
         );
       });
     });
diff --git a/src/common/editFileDialog.component.test.tsx b/src/common/editFileDialog.component.test.tsx
index abe94d589..0ec584598 100644
--- a/src/common/editFileDialog.component.test.tsx
+++ b/src/common/editFileDialog.component.test.tsx
@@ -87,6 +87,10 @@ describe('Edit file dialog', () => {
 
     it('Edits an image correctly', async () => {
       createView();
+
+      //Checks if file extension is displayed. If it's editable, actual value will not match expected.
+      expect(screen.getByText('.png')).toBeInTheDocument();
+
       modifyFileValues({
         file_name: 'test_file_name.jpeg',
         title: 'Test Title',
@@ -98,7 +102,7 @@ describe('Edit file dialog', () => {
       await user.click(saveButton);
 
       expect(axiosPatchSpy).toHaveBeenCalledWith('/images/1', {
-        file_name: 'test_file_name.jpeg',
+        file_name: 'test_file_name.jpeg.png',
         title: 'Test Title',
         description: 'Test Description',
       });
diff --git a/src/common/editFileDialog.component.tsx b/src/common/editFileDialog.component.tsx
index 965853863..4b0e58026 100644
--- a/src/common/editFileDialog.component.tsx
+++ b/src/common/editFileDialog.component.tsx
@@ -53,7 +53,7 @@ const EditFileDialog = (props: FileDialogProps) => {
 
   const selectedFileCopy: ObjectFilePatch = React.useMemo(
     () => (selectedFile ? { ...selectedFile, file_name: initialName } : {}),
-    [selectedFile]
+    [selectedFile, initialName]
   );
 
   const initialFile: ObjectFilePatch = React.useMemo(
@@ -109,7 +109,7 @@ const EditFileDialog = (props: FileDialogProps) => {
 
         const isTitleUpdated = fileData.title !== selectedFileCopy.title;
 
-        let fileToEdit: ObjectFilePatch = {};
+        const fileToEdit: ObjectFilePatch = {};
 
         if (isFileNameUpdated)
           fileToEdit.file_name = fileData.file_name + extension;
diff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts
index eafacac1c..744da8284 100644
--- a/src/mocks/handlers.ts
+++ b/src/mocks/handlers.ts
@@ -1084,7 +1084,7 @@ export const handlers = [
 
       const fullBody = { ...obj, ...body };
 
-      if (fullBody.file_name === 'Error 500') {
+      if (fullBody.file_name === 'Error 500.png') {
         return HttpResponse.json(
           { detail: 'Something went wrong' },
           { status: 500 }