Added parent row link to files table

3 files changed, 46 insertions, 0 deletions

diff --git a/app/assets/javascripts/repository/components/table/index.vue b/app/assets/javascripts/repository/components/table/index.vue
index 758f4b88be2..2b0a4644bf6 100644
--- a/app/assets/javascripts/repository/components/table/index.vue
+++ b/app/assets/javascripts/repository/components/table/index.vue
@@ -7,6 +7,7 @@ import getFiles from '../../queries/getFiles.graphql';
 import getProjectPath from '../../queries/getProjectPath.graphql';
 import TableHeader from './header.vue';
 import TableRow from './row.vue';
+import ParentRow from './parent_row.vue';
 
 const PAGE_SIZE = 100;
 
@@ -15,6 +16,7 @@ export default {
     GlLoadingIcon,
     TableHeader,
     TableRow,
+    ParentRow,
   },
   mixins: [getRefMixin],
   apollo: {
@@ -47,6 +49,9 @@ export default {
         { path: this.path, ref: this.ref },
       );
     },
+    showParentRow() {
+      return !this.isLoadingFiles && this.path !== '';
+    },
   },
   watch: {
     $route: function routeChange() {
@@ -120,6 +125,7 @@ export default {
         </caption>
         <table-header v-once />
         <tbody>
+          <parent-row v-show="showParentRow" :commit-ref="ref" :path="path" />
           <template v-for="val in entries">
             <table-row
               v-for="entry in val"
diff --git a/app/assets/javascripts/repository/components/table/parent_row.vue b/app/assets/javascripts/repository/components/table/parent_row.vue
new file mode 100644
index 00000000000..b4433f00d8a
--- /dev/null
+++ b/app/assets/javascripts/repository/components/table/parent_row.vue
@@ -0,0 +1,37 @@
+<script>
+export default {
+  props: {
+    commitRef: {
+      type: String,
+      required: true,
+    },
+    path: {
+      type: String,
+      required: true,
+    },
+  },
+  computed: {
+    parentRoute() {
+      const splitArray = this.path.split('/');
+      splitArray.pop();
+
+      return { path: `/tree/${this.commitRef}/${splitArray.join('/')}` };
+    },
+  },
+  methods: {
+    clickRow() {
+      this.$router.push(this.parentRoute);
+    },
+  },
+};
+</script>
+
+<template>
+  <tr v-once @click="clickRow">
+    <td colspan="3" class="tree-item-file-name">
+      <router-link :to="parentRoute" :aria-label="__('Go to parent')">
+        ..
+      </router-link>
+    </td>
+  </tr>
+</template>
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index f16c00250a6..7bb44610c33 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -4647,6 +4647,9 @@ msgstr ""
 msgid "Go to %{link_to_google_takeout}."
 msgstr ""
 
+msgid "Go to parent"
+msgstr ""
+
 msgid "Go to project"
 msgstr ""