Improve the runner details title and breadcrumb

This change adds the ID of the runner to the title of the page
and breadcrumb, instead of the runner token.

app/views/admin/runners/show.html.haml

 - add_page_specific_style 'page_bundles/ci_status'
 
-= content_for :title do
-  %h3.project-title
-    Runner ##{@runner.id}
-    .float-right
-      - if @runner.instance_type?
-        %span.runner-state.runner-state-shared
-          Shared
-      - else
-        %span.runner-state.runner-state-specific
-          Specific
-
 - page_title @runner.short_sha
-- add_to_breadcrumbs _("Runners"), admin_runners_path
-- breadcrumb_title "##{@runner.id}"
+- add_to_breadcrumbs _('Runners'), admin_runners_path
+- breadcrumb_title page_title
+
+%h2.page-title
+  = sprintf(s_('Runners|Runner #%{runner_id}'), {runner_id: @runner.id})
 
 - if @runner.instance_type?
   .bs-callout.bs-callout-success

changelogs/unreleased/mrincon-runner-detail-breadcrumb-fix.yml

+---
+title: Add Runner ID as title in Runner details page
+merge_request: 57247
+author:
+type: changed

locale/gitlab.pot

@@ -26518,6 +26518,9 @@ msgstr ""
 msgid "Runners|Revision"
 msgstr ""
 
+msgid "Runners|Runner #%{runner_id}"
+msgstr ""
+
 msgid "Runners|Shared"
 msgstr ""
 

spec/features/admin/admin_runners_spec.rb

@@ -285,10 +285,18 @@ RSpec.describe "Admin Runners" do
     end
 
     describe 'runner page breadcrumbs' do
-      it 'contains the current runner’s short sha' do
+      it 'contains the current runner token' do
+        page.within '[data-testid="breadcrumb-links"]' do
           expect(page.find('h2')).to have_content(runner.short_sha)
         end
       end
+    end
+
+    describe 'runner page title' do
+      it 'contains the runner id' do
+        expect(find('.page-title')).to have_content("Runner ##{runner.id}")
+      end
+    end
 
     describe 'projects' do
       it 'contains project names' do