Display empty files properly on MR diffs

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>
 

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
 

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

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