Replace fa icons in file_type_icon_class helper

- Replace fa- icons with
GitLab SVGs and leverage
the sprite_icon helper

app/helpers/blob_helper.rb

@@ -148,7 +148,7 @@ module BlobHelper
   # mode - File unix mode
   # mode - File name
   def blob_icon(mode, name)
-    icon("#{file_type_icon_class('file', mode, name)} fw")
+    sprite_icon(file_type_icon_class('file', mode, name))
   end
 
   def blob_raw_url(**kwargs)

app/helpers/icons_helper.rb

@@ -124,7 +124,7 @@ module IconsHelper
 
   def file_type_icon_class(type, mode, name)
     if type == 'folder'
-      icon_class = 'folder'
+      icon_class = 'folder-o'
     elsif type == 'archive'
       icon_class = 'archive'
     elsif mode == '120000'
@@ -135,36 +135,36 @@ module IconsHelper
 
       case File.extname(name).downcase
       when '.pdf'
-        icon_class = 'file-pdf-o'
+        icon_class = 'document'
       when '.jpg', '.jpeg', '.jif', '.jfif',
           '.jp2', '.jpx', '.j2k', '.j2c',
           '.apng', '.png', '.gif', '.tif', '.tiff',
           '.svg', '.ico', '.bmp', '.webp'
-        icon_class = 'file-image-o'
+        icon_class = 'doc-image'
       when '.zip', '.zipx', '.tar', '.gz', '.gzip', '.tgz', '.bz', '.bzip',
           '.bz2', '.bzip2', '.car', '.tbz', '.xz', 'txz', '.rar', '.7z',
           '.lz', '.lzma', '.tlz'
-        icon_class = 'file-archive-o'
+        icon_class = 'doc-compressed'
       when '.mp3', '.wma', '.ogg', '.oga', '.wav', '.flac', '.aac', '.3ga',
           '.ac3', '.midi', '.m4a', '.ape', '.mpa'
-        icon_class = 'file-audio-o'
+        icon_class = 'volume-up'
       when '.mp4', '.m4p', '.m4v',
           '.mpg', '.mp2', '.mpeg', '.mpe', '.mpv',
           '.mpg', '.mpeg', '.m2v', '.m2ts',
           '.avi', '.mkv', '.flv', '.ogv', '.mov',
           '.3gp', '.3g2'
-        icon_class = 'file-video-o'
+        icon_class = 'live-preview'
       when '.doc', '.dot', '.docx', '.docm', '.dotx', '.dotm', '.docb',
           '.odt', '.ott', '.uot', '.rtf'
-        icon_class = 'file-word-o'
+        icon_class = 'doc-text'
       when '.xls', '.xlt', '.xlm', '.xlsx', '.xlsm', '.xltx', '.xltm',
           '.xlsb', '.xla', '.xlam', '.xll', '.xlw', '.ots', '.ods', '.uos'
-        icon_class = 'file-excel-o'
+        icon_class = 'document'
       when '.ppt', '.pot', '.pps', '.pptx', '.pptm', '.potx', '.potm',
           '.ppam', '.ppsx', '.ppsm', '.sldx', '.sldm', '.odp', '.otp', '.uop'
-        icon_class = 'file-powerpoint-o'
+        icon_class = 'doc-chart'
       else
-        icon_class = 'file-text-o'
+        icon_class = 'doc-text'
       end
     end
 

app/helpers/tree_helper.rb

@@ -31,7 +31,7 @@ module TreeHelper
   # mode - File unix mode
   # name - File name
   def tree_icon(type, mode, name)
-    icon([file_type_icon_class(type, mode, name), 'fw'])
+    sprite_icon(file_type_icon_class(type, mode, name))
   end
 
   # Using Rails `*_path` methods can be slow, especially when generating

changelogs/unreleased/246739-use-gitlab-svg-icons-in-file_type_icon_class-helper.yml

+---
+title: Use GitLab SVG icons in file_type_icon_class helper
+merge_request: 44580
+author:
+type: changed

spec/controllers/projects/merge_requests/conflicts_controller_spec.rb

@@ -156,7 +156,7 @@ RSpec.describe Projects::MergeRequests::ConflictsController do
 
         expect(json_response).to include('old_path' => path,
                                          'new_path' => path,
-                                         'blob_icon' => 'file-text-o',
+                                         'blob_icon' => 'doc-text',
                                          'blob_path' => a_string_ending_with(path),
                                          'content' => content)
       end

spec/helpers/icons_helper_spec.rb

@@ -114,128 +114,128 @@ RSpec.describe IconsHelper do
   end
 
   describe 'file_type_icon_class' do
-    it 'returns folder class' do
-      expect(file_type_icon_class('folder', 0, 'folder_name')).to eq 'folder'
+    it 'returns folder-o class' do
+      expect(file_type_icon_class('folder', 0, 'folder_name')).to eq 'folder-o'
     end
 
     it 'returns share class' do
       expect(file_type_icon_class('file', '120000', 'link')).to eq 'share'
     end
 
-    it 'returns file-pdf-o class with .pdf' do
-      expect(file_type_icon_class('file', 0, 'filename.pdf')).to eq 'file-pdf-o'
+    it 'returns document class with .pdf' do
+      expect(file_type_icon_class('file', 0, 'filename.pdf')).to eq 'document'
     end
 
-    it 'returns file-image-o class with .jpg' do
-      expect(file_type_icon_class('file', 0, 'filename.jpg')).to eq 'file-image-o'
+    it 'returns doc-image class with .jpg' do
+      expect(file_type_icon_class('file', 0, 'filename.jpg')).to eq 'doc-image'
     end
 
-    it 'returns file-image-o class with .JPG' do
-      expect(file_type_icon_class('file', 0, 'filename.JPG')).to eq 'file-image-o'
+    it 'returns doc-image class with .JPG' do
+      expect(file_type_icon_class('file', 0, 'filename.JPG')).to eq 'doc-image'
     end
 
-    it 'returns file-image-o class with .png' do
-      expect(file_type_icon_class('file', 0, 'filename.png')).to eq 'file-image-o'
+    it 'returns doc-image class with .png' do
+      expect(file_type_icon_class('file', 0, 'filename.png')).to eq 'doc-image'
     end
 
-    it 'returns file-image-o class with .apng' do
-      expect(file_type_icon_class('file', 0, 'filename.apng')).to eq 'file-image-o'
+    it 'returns doc-image class with .apng' do
+      expect(file_type_icon_class('file', 0, 'filename.apng')).to eq 'doc-image'
     end
 
-    it 'returns file-image-o class with .webp' do
-      expect(file_type_icon_class('file', 0, 'filename.webp')).to eq 'file-image-o'
+    it 'returns doc-image class with .webp' do
+      expect(file_type_icon_class('file', 0, 'filename.webp')).to eq 'doc-image'
     end
 
-    it 'returns file-archive-o class with .tar' do
-      expect(file_type_icon_class('file', 0, 'filename.tar')).to eq 'file-archive-o'
+    it 'returns doc-compressed class with .tar' do
+      expect(file_type_icon_class('file', 0, 'filename.tar')).to eq 'doc-compressed'
     end
 
-    it 'returns file-archive-o class with .TAR' do
-      expect(file_type_icon_class('file', 0, 'filename.TAR')).to eq 'file-archive-o'
+    it 'returns doc-compressed class with .TAR' do
+      expect(file_type_icon_class('file', 0, 'filename.TAR')).to eq 'doc-compressed'
     end
 
-    it 'returns file-archive-o class with .tar.gz' do
-      expect(file_type_icon_class('file', 0, 'filename.tar.gz')).to eq 'file-archive-o'
+    it 'returns doc-compressed class with .tar.gz' do
+      expect(file_type_icon_class('file', 0, 'filename.tar.gz')).to eq 'doc-compressed'
     end
 
-    it 'returns file-audio-o class with .mp3' do
-      expect(file_type_icon_class('file', 0, 'filename.mp3')).to eq 'file-audio-o'
+    it 'returns volume-up class with .mp3' do
+      expect(file_type_icon_class('file', 0, 'filename.mp3')).to eq 'volume-up'
     end
 
-    it 'returns file-audio-o class with .MP3' do
-      expect(file_type_icon_class('file', 0, 'filename.MP3')).to eq 'file-audio-o'
+    it 'returns volume-up class with .MP3' do
+      expect(file_type_icon_class('file', 0, 'filename.MP3')).to eq 'volume-up'
     end
 
-    it 'returns file-audio-o class with .m4a' do
-      expect(file_type_icon_class('file', 0, 'filename.m4a')).to eq 'file-audio-o'
+    it 'returns volume-up class with .m4a' do
+      expect(file_type_icon_class('file', 0, 'filename.m4a')).to eq 'volume-up'
     end
 
-    it 'returns file-audio-o class with .wav' do
-      expect(file_type_icon_class('file', 0, 'filename.wav')).to eq 'file-audio-o'
+    it 'returns volume-up class with .wav' do
+      expect(file_type_icon_class('file', 0, 'filename.wav')).to eq 'volume-up'
     end
 
-    it 'returns file-video-o class with .avi' do
-      expect(file_type_icon_class('file', 0, 'filename.avi')).to eq 'file-video-o'
+    it 'returns live-preview class with .avi' do
+      expect(file_type_icon_class('file', 0, 'filename.avi')).to eq 'live-preview'
     end
 
-    it 'returns file-video-o class with .AVI' do
-      expect(file_type_icon_class('file', 0, 'filename.AVI')).to eq 'file-video-o'
+    it 'returns live-preview class with .AVI' do
+      expect(file_type_icon_class('file', 0, 'filename.AVI')).to eq 'live-preview'
     end
 
-    it 'returns file-video-o class with .mp4' do
-      expect(file_type_icon_class('file', 0, 'filename.mp4')).to eq 'file-video-o'
+    it 'returns live-preview class with .mp4' do
+      expect(file_type_icon_class('file', 0, 'filename.mp4')).to eq 'live-preview'
     end
 
-    it 'returns file-word-o class with .odt' do
-      expect(file_type_icon_class('file', 0, 'filename.odt')).to eq 'file-word-o'
+    it 'returns doc-text class with .odt' do
+      expect(file_type_icon_class('file', 0, 'filename.odt')).to eq 'doc-text'
     end
 
-    it 'returns file-word-o class with .doc' do
-      expect(file_type_icon_class('file', 0, 'filename.doc')).to eq 'file-word-o'
+    it 'returns doc-text class with .doc' do
+      expect(file_type_icon_class('file', 0, 'filename.doc')).to eq 'doc-text'
     end
 
-    it 'returns file-word-o class with .DOC' do
-      expect(file_type_icon_class('file', 0, 'filename.DOC')).to eq 'file-word-o'
+    it 'returns doc-text class with .DOC' do
+      expect(file_type_icon_class('file', 0, 'filename.DOC')).to eq 'doc-text'
     end
 
-    it 'returns file-word-o class with .docx' do
-      expect(file_type_icon_class('file', 0, 'filename.docx')).to eq 'file-word-o'
+    it 'returns doc-text class with .docx' do
+      expect(file_type_icon_class('file', 0, 'filename.docx')).to eq 'doc-text'
     end
 
-    it 'returns file-excel-o class with .xls' do
-      expect(file_type_icon_class('file', 0, 'filename.xls')).to eq 'file-excel-o'
+    it 'returns document class with .xls' do
+      expect(file_type_icon_class('file', 0, 'filename.xls')).to eq 'document'
     end
 
-    it 'returns file-excel-o class with .XLS' do
-      expect(file_type_icon_class('file', 0, 'filename.XLS')).to eq 'file-excel-o'
+    it 'returns document class with .XLS' do
+      expect(file_type_icon_class('file', 0, 'filename.XLS')).to eq 'document'
     end
 
-    it 'returns file-excel-o class with .xlsx' do
-      expect(file_type_icon_class('file', 0, 'filename.xlsx')).to eq 'file-excel-o'
+    it 'returns document class with .xlsx' do
+      expect(file_type_icon_class('file', 0, 'filename.xlsx')).to eq 'document'
     end
 
-    it 'returns file-excel-o class with .odp' do
-      expect(file_type_icon_class('file', 0, 'filename.odp')).to eq 'file-powerpoint-o'
+    it 'returns doc-chart class with .odp' do
+      expect(file_type_icon_class('file', 0, 'filename.odp')).to eq 'doc-chart'
     end
 
-    it 'returns file-excel-o class with .ppt' do
-      expect(file_type_icon_class('file', 0, 'filename.ppt')).to eq 'file-powerpoint-o'
+    it 'returns doc-chart class with .ppt' do
+      expect(file_type_icon_class('file', 0, 'filename.ppt')).to eq 'doc-chart'
     end
 
-    it 'returns file-excel-o class with .PPT' do
-      expect(file_type_icon_class('file', 0, 'filename.PPT')).to eq 'file-powerpoint-o'
+    it 'returns doc-chart class with .PPT' do
+      expect(file_type_icon_class('file', 0, 'filename.PPT')).to eq 'doc-chart'
     end
 
-    it 'returns file-excel-o class with .pptx' do
-      expect(file_type_icon_class('file', 0, 'filename.pptx')).to eq 'file-powerpoint-o'
+    it 'returns doc-chart class with .pptx' do
+      expect(file_type_icon_class('file', 0, 'filename.pptx')).to eq 'doc-chart'
     end
 
-    it 'returns file-text-o class with .unknow' do
-      expect(file_type_icon_class('file', 0, 'filename.unknow')).to eq 'file-text-o'
+    it 'returns doc-text class with .unknow' do
+      expect(file_type_icon_class('file', 0, 'filename.unknow')).to eq 'doc-text'
     end
 
-    it 'returns file-text-o class with no extension' do
-      expect(file_type_icon_class('file', 0, 'CHANGELOG')).to eq 'file-text-o'
+    it 'returns doc-text class with no extension' do
+      expect(file_type_icon_class('file', 0, 'CHANGELOG')).to eq 'doc-text'
     end
   end
 

spec/lib/gitlab/conflict/file_spec.rb

@@ -262,7 +262,7 @@ RSpec.describe Gitlab::Conflict::File do
     end
 
     it 'includes the blob icon for the file' do
-      expect(conflict_file.as_json[:blob_icon]).to eq('file-text-o')
+      expect(conflict_file.as_json[:blob_icon]).to eq('doc-text')
     end
 
     context 'with the full_content option passed' do

spec/serializers/blob_entity_spec.rb

@@ -22,7 +22,7 @@ RSpec.describe BlobEntity do
         name: blob.name,
         mode: "100644",
         readable_text: true,
-        icon: "file-text-o",
+        icon: "doc-text",
         url: "/#{project.full_path}/-/blob/master/bar/branch-test.txt"
       })
     end