Use PascalCase for Vue components

app/assets/javascripts/performance_bar/components/detailed_metric.vue

 <script>
-import requestWarning from './request_warning.vue';
+import RequestWarning from './request_warning.vue';
 
 import DeprecatedModal2 from '~/vue_shared/components/deprecated_modal_2.vue';
 import Icon from '~/vue_shared/components/icon.vue';
 
 export default {
   components: {
-    requestWarning,
+    RequestWarning,
     GlModal: DeprecatedModal2,
     Icon,
   },

app/assets/javascripts/performance_bar/components/performance_bar_app.vue

 <script>
 import { glEmojiTag } from '~/emoji';
 
-import detailedMetric from './detailed_metric.vue';
-import requestSelector from './request_selector.vue';
+import DetailedMetric from './detailed_metric.vue';
+import RequestSelector from './request_selector.vue';
 import { s__ } from '~/locale';
 
 export default {
   components: {
-    detailedMetric,
-    requestSelector,
+    DetailedMetric,
+    RequestSelector,
   },
   props: {
     store: {

app/assets/javascripts/performance_bar/index.js

@@ -6,7 +6,7 @@ export default ({ container }) =>
   new Vue({
     el: container,
     components: {
-      performanceBarApp: () => import('./components/performance_bar_app.vue'),
+      PerformanceBarApp: () => import('./components/performance_bar_app.vue'),
     },
     data() {
       const performanceBarData = document.querySelector(this.$options.el).dataset;