[Perf_Bar] Create new Info button that show data in a modal

What does this MR do and why?

As part of the improvement to the local development experience for AI features, we wanted to add certain information about your development environment at runtime. We chose to add an info button to the performance bar that when clicked showed a layover with additional information about your current settings. For now, this includes two things only:

1. Hostname
2. Canary requests

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Before	After
-

How to set up and validate locally

1. Open GDK
2. Check that you see the new info button
3. Click on the info button
4. Notice the modal opens
5. Notice you see the host name
6. To see the canary icon, you can simply turn it on in the vue component for now:

diff --git a/app/assets/javascripts/performance_bar/components/info_section.vue b/app/assets/javascripts/performance_bar/components/info_section.vue
index ffe83b82a058..c27ca50c0989 100644
--- a/app/assets/javascripts/performance_bar/components/info_section.vue
+++ b/app/assets/javascripts/performance_bar/components/info_section.vue
@@ -63,7 +63,7 @@ export default {
             <gl-emoji id="host-emoji" data-name="computer" />
             <span>{{ hostInfo }} </span>
           </div>
-          <div v-if="isCanary">
+          <div v-if="true">
             <gl-emoji id="canary-emoji" data-name="baby_chick" />
             <span>{{ s__('PerformanceBar|Request made from Canary') }}</span>
           </div>

Related to #472086 (closed)