diff --git a/app/assets/javascripts/ide/components/new_dropdown/index.vue b/app/assets/javascripts/ide/components/new_dropdown/index.vue
index 7fd6de7594d..7fb525ef16d 100644
--- a/app/assets/javascripts/ide/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/ide/components/new_dropdown/index.vue
@@ -4,6 +4,7 @@ import icon from '~/vue_shared/components/icon.vue';
 import newModal from './modal.vue';
 import upload from './upload.vue';
 import ItemButton from './button.vue';
+import { modalTypes } from '../../constants';
 
 export default {
   components: {
@@ -54,6 +55,7 @@ export default {
       this.dropdownOpen = !this.dropdownOpen;
     },
   },
+  modalTypes,
 };
 </script>
 
@@ -104,7 +106,7 @@ export default {
               class="d-flex"
               icon="folder-new"
               icon-classes="mr-2"
-              @click="createNewItem('tree')"
+              @click="createNewItem($options.modalTypes.tree)"
             />
           </li>
           <li class="divider"></li>
@@ -115,7 +117,7 @@ export default {
             class="d-flex"
             icon="pencil"
             icon-classes="mr-2"
-            @click="createNewItem('rename')"
+            @click="createNewItem($options.modalTypes.rename)"
           />
         </li>
         <li>
diff --git a/app/assets/javascripts/ide/components/new_dropdown/modal.vue b/app/assets/javascripts/ide/components/new_dropdown/modal.vue
index bb2dcf4f661..e500ef0e1b5 100644
--- a/app/assets/javascripts/ide/components/new_dropdown/modal.vue
+++ b/app/assets/javascripts/ide/components/new_dropdown/modal.vue
@@ -2,6 +2,7 @@
 import { __ } from '~/locale';
 import { mapActions, mapState } from 'vuex';
 import GlModal from '~/vue_shared/components/gl_modal.vue';
+import { modalTypes } from '../../constants';
 
 export default {
   components: {
@@ -16,7 +17,9 @@ export default {
     ...mapState(['entryModal']),
     entryName: {
       get() {
-        if (this.entryModal.type === 'rename') return this.name || this.entryModal.entry.name;
+        if (this.entryModal.type === modalTypes.rename) {
+          return this.name || this.entryModal.entry.name;
+        }
 
         return this.name || (this.entryModal.path !== '' ? `${this.entryModal.path}/` : '');
       },
@@ -25,19 +28,19 @@ export default {
       },
     },
     modalTitle() {
-      if (this.entryModal.type === 'tree') {
+      if (this.entryModal.type === modalTypes.tree) {
         return __('Create new directory');
-      } else if (this.entryModal.type === 'rename') {
-        return this.entryModal.entry.type === 'tree' ? __('Rename folder') : __('Rename file');
+      } else if (this.entryModal.type === modalTypes.rename) {
+        return this.entryModal.entry.type === modalTypes.tree ? __('Rename folder') : __('Rename file');
       }
 
       return __('Create new file');
     },
     buttonLabel() {
-      if (this.entryModal.type === 'tree') {
+      if (this.entryModal.type === modalTypes.tree) {
         return __('Create directory');
-      } else if (this.entryModal.type === 'rename') {
-        return this.entryModal.entry.type === 'tree' ? __('Rename folder') : __('Rename file');
+      } else if (this.entryModal.type === modalTypes.rename) {
+        return this.entryModal.entry.type === modalTypes.tree ? __('Rename folder') : __('Rename file');
       }
 
       return __('Create file');
@@ -46,7 +49,7 @@ export default {
   methods: {
     ...mapActions(['createTempEntry', 'renameEntry']),
     submitForm() {
-      if (this.entryModal.type === 'rename') {
+      if (this.entryModal.type === modalTypes.rename) {
         this.renameEntry({
           path: this.entryModal.entry.path,
           name: this.entryName,
diff --git a/app/assets/javascripts/ide/constants.js b/app/assets/javascripts/ide/constants.js
index 0b514f31467..d3ac57471c9 100644
--- a/app/assets/javascripts/ide/constants.js
+++ b/app/assets/javascripts/ide/constants.js
@@ -53,3 +53,8 @@ export const commitItemIconMap = {
     class: 'ide-file-deletion',
   },
 };
+
+export const modalTypes = {
+  rename: 'rename',
+  tree: 'tree',
+};