added aria-label to buttons

updated variable name
removed un-used prop

app/assets/javascripts/ide/components/activity_bar.vue

@@ -1,7 +1,7 @@
 <script>
 import { mapActions, mapGetters, mapState } from 'vuex';
 import Icon from '~/vue_shared/components/icon.vue';
-import { ActivityBarViews } from '../constants';
+import { activityBarViews } from '../constants';
 
 export default {
   components: {
@@ -17,7 +17,7 @@ export default {
   methods: {
     ...mapActions(['updateActivityBarView']),
   },
-  ActivityBarViews,
+  activityBarViews,
 };
 </script>
 
@@ -41,9 +41,10 @@ export default {
           type="button"
           class="ide-sidebar-link js-ide-edit-mode"
           :class="{
-            active: currentActivityView === $options.ActivityBarViews.edit
+            active: currentActivityView === $options.activityBarViews.edit
           }"
-          @click.prevent="updateActivityBarView($options.ActivityBarViews.edit)"
+          @click.prevent="updateActivityBarView($options.activityBarViews.edit)"
+          :aria-label="s__('IDE|Edit mode')"
         >
           <icon
             name="code"
@@ -55,9 +56,10 @@ export default {
           type="button"
           class="ide-sidebar-link js-ide-commit-mode"
           :class="{
-            active: currentActivityView === $options.ActivityBarViews.commit
+            active: currentActivityView === $options.activityBarViews.commit
           }"
-          @click.prevent="updateActivityBarView($options.ActivityBarViews.commit)"
+          @click.prevent="updateActivityBarView($options.activityBarViews.commit)"
+          :aria-label="s__('IDE|Commit mode')"
         >
           <icon
             name="commit"

app/assets/javascripts/ide/components/ide.vue

@@ -17,12 +17,6 @@ export default {
     RepoEditor,
     FindFile,
   },
-  props: {
-    emptyStateSvgPath: {
-      type: String,
-      required: true,
-    },
-  },
   computed: {
     ...mapState([
       'changedFiles',
@@ -30,6 +24,7 @@ export default {
       'viewer',
       'currentMergeRequestId',
       'fileFindVisible',
+      'emptyStateSvgPath',
     ]),
     ...mapGetters(['activeFile', 'hasChanges']),
   },

app/assets/javascripts/ide/constants.js

@@ -7,7 +7,7 @@ export const FILE_FINDER_EMPTY_ROW_HEIGHT = 33;
 export const MAX_TITLE_LENGTH = 50;
 export const MAX_BODY_LENGTH = 72;
 
-export const ActivityBarViews = {
+export const activityBarViews = {
   edit: 'ide-tree',
   commit: 'commit-section',
 };

app/assets/javascripts/ide/index.js

@@ -22,11 +22,7 @@ function initIde(el) {
       });
     },
     render(createElement) {
-      return createElement('ide', {
-        props: {
-          emptyStateSvgPath: el.dataset.emptyStateSvgPath,
-        },
-      });
+      return createElement('ide');
     },
   });
 }

app/assets/javascripts/ide/stores/state.js

@@ -1,4 +1,4 @@
-import { ActivityBarViews } from '../constants';
+import { activityBarViews } from '../constants';
 
 export default () => ({
   currentProjectId: '',
@@ -20,6 +20,6 @@ export default () => ({
   entries: {},
   viewer: 'editor',
   delayViewerUpdated: false,
-  currentActivityView: ActivityBarViews.edit,
+  currentActivityView: activityBarViews.edit,
   fileFindVisible: false,
 });

spec/javascripts/ide/components/activity_bar_spec.js

@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import store from '~/ide/stores';
-import { ActivityBarViews } from '~/ide/constants';
+import { activityBarViews } from '~/ide/constants';
 import ActivityBar from '~/ide/components/activity_bar.vue';
 import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
 import { resetStore } from '../helpers';
@@ -54,13 +54,13 @@ describe('IDE activity bar', () => {
     it('calls updateActivityBarView with edit value on click', () => {
       vm.$el.querySelector('.js-ide-edit-mode').click();
 
-      expect(vm.updateActivityBarView).toHaveBeenCalledWith(ActivityBarViews.edit);
+      expect(vm.updateActivityBarView).toHaveBeenCalledWith(activityBarViews.edit);
     });
 
     it('calls updateActivityBarView with commit value on click', () => {
       vm.$el.querySelector('.js-ide-commit-mode').click();
 
-      expect(vm.updateActivityBarView).toHaveBeenCalledWith(ActivityBarViews.commit);
+      expect(vm.updateActivityBarView).toHaveBeenCalledWith(activityBarViews.commit);
     });
   });
 
@@ -74,7 +74,7 @@ describe('IDE activity bar', () => {
     });
 
     it('sets commit item active', done => {
-      vm.$store.state.currentActivityView = ActivityBarViews.commit;
+      vm.$store.state.currentActivityView = activityBarViews.commit;
 
       vm.$nextTick(() => {
         expect(vm.$el.querySelector('.js-ide-commit-mode').classList).toContain('active');

spec/javascripts/ide/components/ide_side_bar_spec.js

@@ -1,7 +1,7 @@
 import Vue from 'vue';
 import store from '~/ide/stores';
 import ideSidebar from '~/ide/components/ide_side_bar.vue';
-import { ActivityBarViews } from '~/ide/constants';
+import { activityBarViews } from '~/ide/constants';
 import { createComponentWithStore } from 'spec/helpers/vue_mount_component_helper';
 import { resetStore } from '../helpers';
 import { projectData } from '../mock_data';
@@ -45,7 +45,7 @@ describe('IdeSidebar', () => {
     });
 
     it('renders commit component', done => {
-      vm.$store.state.currentActivityView = ActivityBarViews.commit;
+      vm.$store.state.currentActivityView = activityBarViews.commit;
 
       vm.$nextTick(() => {
         expect(vm.$el.querySelector('.multi-file-commit-panel-section')).not.toBeNull();