Merge branch '61078-empty-state-file-finder' into 'master'

Empty state for when there's no files found in search

See merge request gitlab-org/gitlab!16851

app/assets/javascripts/project_find_file.js

@@ -116,6 +116,9 @@ export default class ProjectFindFile {
       html = ProjectFindFile.makeHtml(filePath, matches, blobItemUrl);
       results.push(this.element.find('.tree-table > tbody').append(html));
     }
+
+    this.element.find('.empty-state').toggleClass('hidden', Boolean(results.length));
+
     return results;
   }
 

app/views/projects/find_file/show.html.haml

@@ -15,4 +15,12 @@
     .table-holder
       %table.table.files-slider{ class: "table_#{@hex_path} tree-table" }
         %tbody
+        .col-12.empty-state.hidden
+          .svg-250.svg-content
+            = image_tag('illustrations/profile-page/personal-projects.svg', alt: 'No files svg', lazy: true)
+          .text-center
+            %h4
+              = _('There are no matching files')
+            %p.text-secondary
+              = _('Try using a different search term to find the file you are looking for.')
       = spinner nil, true

changelogs/unreleased/61078-empty-state-file-finder.yml

+---
+title: Add empty state in file search
+merge_request: 16851
+author:
+type: changed

locale/gitlab.pot

@@ -15647,6 +15647,9 @@ msgstr ""
 msgid "There are no labels yet"
 msgstr ""
 
+msgid "There are no matching files"
+msgstr ""
+
 msgid "There are no open issues"
 msgstr ""
 
@@ -16569,6 +16572,9 @@ msgstr ""
 msgid "Try to fork again"
 msgstr ""
 
+msgid "Try using a different search term to find the file you are looking for."
+msgstr ""
+
 msgid "Trying to communicate with your device. Plug it in (if you haven't already) and press the button on the device now."
 msgstr ""