Use project slug instead of name for display

Use the project slug on the error tracking settings dropdown in
Project Operations Settings

app/assets/javascripts/error_tracking_settings/utils.js

@@ -13,6 +13,6 @@ export const transformFrontendSettings = ({ apiHost, enabled, token, selectedPro
   return { api_host: apiHost || null, enabled, token: token || null, project };
 };
 
-export const getDisplayName = project => `${project.organizationName} | ${project.name}`;
+export const getDisplayName = project => `${project.organizationName} | ${project.slug}`;
 
 export default () => {};

ee/changelogs/unreleased/200009-bug-sentry-integration-shows-project-name-instead-of-slug.yml

+---
+title: Use project slug instead of name for Error Tracking Settings Display
+merge_request: 24176
+author:
+type: fixed

spec/features/projects/settings/operations_settings_spec.rb

@@ -61,7 +61,7 @@ describe 'Projects > Settings > For a forked project', :js do
 
           within('div#project-dropdown') do
             click_button('Select project')
-            click_button('Sentry | Internal')
+            click_button('Sentry | internal')
           end
 
           click_button('Save changes')

spec/frontend/error_tracking_settings/store/getters_spec.js

@@ -47,7 +47,7 @@ describe('Error Tracking Settings - Getters', () => {
     it('should display correctly when a project is selected', () => {
       [state.selectedProject] = projectList;
 
-      expect(getters.dropdownLabel(state, mockGetters)).toEqual('organizationName | name');
+      expect(getters.dropdownLabel(state, mockGetters)).toEqual('organizationName | slug');
     });
 
     it('should display correctly when no project is selected', () => {