Integrate listing of existing custom headers into custom headers form for streaming audit events

What does this MR do and why?

This MR adds a read-only form on existing destinations to show the custom headers applied. This will be changed from read-only in the update mutation integration.

Overall it adds:

• Custom headers to GraphQL query for destinations retrieval
• Edit button to streaming items
• Editing mode to streaming items to toggle the editor
• Ability to set the editor to read-only when the item is passed in
• 'Save' button rather than 'Add' button on editing
• Section to the docs on the listing UI

Screenshots or screen recordings

Screen_Recording_2022-07-06_at_14.45.24

How to set up and validate locally

1. Enable the feature flag :custom_headers_streaming_audit_events_ui: echo "Feature.enable(:custom_headers_streaming_audit_events_ui)" | rails c.
2. Visit a group's audit events page e.g. http://gdk.test:3000/groups/gitlab-org/-/audit_events and look at the Streams tab.
3. Add a new destination without header values.
4. While adding, check the save button text is 'Add'.
5. Select the edit button on the destination item and check the fields are read-only and no header values exist.
6. Check the save button text is 'Save'.
7. Add a new destination with header values.
8. Select the edit button on the destination item and check the fields are read-only and the header values exist.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

Related to #361632 (closed)

spec/lib/gitlab/error_tracking/error_repository/open_api_strategy_spec.rb

@@ -17,10 +17,10 @@
 
   shared_examples 'exception logging' do
     it 'logs error' do
-      expect(Gitlab::AppLogger).to receive(:error).with(
+      expect(Gitlab::AppLogger).to receive(:error).with({
         'open_api.http_code' => api_exception.code,
         'open_api.response_body' => api_exception.response_body.truncate(100)
-      )
+      })
 
       subject
     end
@@ -66,11 +66,11 @@
           .and_return(error)
 
         allow(open_api).to receive(:list_events)
-          .with(project.id, error.fingerprint, sort: 'occurred_at_asc', limit: 1)
+          .with(project.id, error.fingerprint, { sort: 'occurred_at_asc', limit: 1 })
           .and_return(list_events_asc)
 
         allow(open_api).to receive(:list_events)
-          .with(project.id, error.fingerprint, sort: 'occurred_at_desc', limit: 1)
+          .with(project.id, error.fingerprint, { sort: 'occurred_at_desc', limit: 1 })
           .and_return(list_events_desc)
       end
     end