diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-02-18 09:09:24 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-02-18 09:09:24 +0000 |
commit | 4720b569f0fcbb47e9f1a60e95172ae63b6f065a (patch) | |
tree | 5c6bcecbca227e608753a57a9aad19ccfe0567b6 /app/assets/javascripts/registry/explorer/components | |
parent | cefe554b7ce2d0b52f9de855be832a47c2bc24ab (diff) | |
download | gitlab-ce-4720b569f0fcbb47e9f1a60e95172ae63b6f065a.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/registry/explorer/components')
-rw-r--r-- | app/assets/javascripts/registry/explorer/components/registry_breadcrumb.vue | 59 |
1 files changed, 59 insertions, 0 deletions
diff --git a/app/assets/javascripts/registry/explorer/components/registry_breadcrumb.vue b/app/assets/javascripts/registry/explorer/components/registry_breadcrumb.vue new file mode 100644 index 00000000000..f51948da8cc --- /dev/null +++ b/app/assets/javascripts/registry/explorer/components/registry_breadcrumb.vue @@ -0,0 +1,59 @@ +<script> +import { initial, first, last } from 'lodash'; + +export default { + props: { + crumbs: { + type: Array, + required: true, + }, + }, + computed: { + rootRoute() { + return this.$router.options.routes.find(r => r.meta.root); + }, + isRootRoute() { + return this.$route.name === this.rootRoute.name; + }, + rootCrumbs() { + return initial(this.crumbs); + }, + divider() { + const { classList, tagName, innerHTML } = first(this.crumbs).querySelector('svg'); + return { classList: [...classList], tagName, innerHTML }; + }, + lastCrumb() { + const { children } = last(this.crumbs); + const { tagName, classList } = first(children); + return { + tagName, + classList: [...classList], + text: this.$route.meta.nameGenerator(this.$route), + path: { to: this.$route.name }, + }; + }, + }, +}; +</script> + +<template> + <ul> + <li + v-for="(crumb, index) in rootCrumbs" + :key="index" + :class="crumb.classList" + v-html="crumb.innerHTML" + ></li> + <li v-if="!isRootRoute"> + <router-link ref="rootRouteLink" :to="rootRoute.path"> + {{ rootRoute.meta.nameGenerator(rootRoute) }} + </router-link> + <component :is="divider.tagName" :class="divider.classList" v-html="divider.innerHTML" /> + </li> + <li> + <component :is="lastCrumb.tagName" ref="lastCrumb" :class="lastCrumb.classList"> + <router-link ref="childRouteLink" :to="lastCrumb.path">{{ lastCrumb.text }}</router-link> + </component> + </li> + </ul> +</template> |