diff --git a/app/assets/javascripts/diffs/components/diff_file.vue b/app/assets/javascripts/diffs/components/diff_file.vue
index bed29efb253..d397ffbefe3 100644
--- a/app/assets/javascripts/diffs/components/diff_file.vue
+++ b/app/assets/javascripts/diffs/components/diff_file.vue
@@ -176,6 +176,9 @@ export default {
       {{ __('This source diff could not be displayed because it is too large.') }}
       <span v-html="viewBlobLink"></span>
     </div>
+    <div v-if="file.empty" class="nothing-here-block">
+        {{ __('Empty file') }}
+    </div>
   </div>
 </template>
 
diff --git a/app/serializers/diff_file_entity.rb b/app/serializers/diff_file_entity.rb
index f0881829efd..b0aaec3326d 100644
--- a/app/serializers/diff_file_entity.rb
+++ b/app/serializers/diff_file_entity.rb
@@ -5,6 +5,7 @@ class DiffFileEntity < DiffFileBaseEntity
   include IconsHelper
 
   expose :too_large?, as: :too_large
+  expose :empty?, as: :empty
   expose :added_lines
   expose :removed_lines
 
diff --git a/changelogs/unreleased/54786-mr-empty-file-display.yml b/changelogs/unreleased/54786-mr-empty-file-display.yml
new file mode 100644
index 00000000000..b2ee9069234
--- /dev/null
+++ b/changelogs/unreleased/54786-mr-empty-file-display.yml
@@ -0,0 +1,5 @@
+---
+title: Display empty files properly on MR diffs
+merge_request:
+author: Sean Nichols
+type: fixed
diff --git a/lib/gitlab/diff/file.rb b/lib/gitlab/diff/file.rb
index 8ba44dff06f..0be463f16a2 100644
--- a/lib/gitlab/diff/file.rb
+++ b/lib/gitlab/diff/file.rb
@@ -245,6 +245,10 @@ module Gitlab
       end
       # rubocop: enable CodeReuse/ActiveRecord
 
+      def empty?
+        valid_blobs.map(&:empty?).all?
+      end
+
       def raw_binary?
         try_blobs(:raw_binary?)
       end