Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gitlab-ce
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
1
Merge Requests
1
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
nexedi
gitlab-ce
Commits
1524192f
Commit
1524192f
authored
Nov 24, 2020
by
Nicolò Maria Mezzopera
Committed by
Nathan Friend
Nov 24, 2020
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Use v-html to build the breadcrumb
parent
7d91cbfe
Changes
1
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
11 additions
and
6 deletions
+11
-6
app/assets/javascripts/registry/explorer/components/registry_breadcrumb.vue
...ipts/registry/explorer/components/registry_breadcrumb.vue
+11
-6
No files found.
app/assets/javascripts/registry/explorer/components/registry_breadcrumb.vue
View file @
1524192f
<
script
>
/* eslint-disable vue/no-v-html */
// We are forced to use `v-html` untill this gitlab-ui MR is merged: https://gitlab.com/gitlab-org/gitlab-ui/-/merge_requests/1869
// then we can re-write this to use gl-breadcrumb
import
{
initial
,
first
,
last
}
from
'
lodash
'
;
import
{
GlSafeHtmlDirective
as
SafeHtml
}
from
'
@gitlab/ui
'
;
import
{
sanitize
}
from
'
~/lib/dompurify
'
;
export
default
{
directives
:
{
SafeHtml
},
props
:
{
crumbs
:
{
type
:
Array
,
...
...
@@ -11,6 +13,9 @@ export default {
},
},
computed
:
{
parsedCrumbs
()
{
return
this
.
crumbs
.
map
(
c
=>
({
...
c
,
innerHTML
:
sanitize
(
c
.
innerHTML
)
}));
},
rootRoute
()
{
return
this
.
$router
.
options
.
routes
.
find
(
r
=>
r
.
meta
.
root
);
},
...
...
@@ -18,11 +23,11 @@ export default {
return
this
.
$route
.
name
===
this
.
rootRoute
.
name
;
},
rootCrumbs
()
{
return
initial
(
this
.
c
rumbs
);
return
initial
(
this
.
parsedC
rumbs
);
},
divider
()
{
const
{
classList
,
tagName
,
innerHTML
}
=
first
(
this
.
crumbs
).
querySelector
(
'
svg
'
);
return
{
classList
:
[...
classList
],
tagName
,
innerHTML
};
return
{
classList
:
[...
classList
],
tagName
,
innerHTML
:
sanitize
(
innerHTML
)
};
},
lastCrumb
()
{
const
{
children
}
=
last
(
this
.
crumbs
);
...
...
@@ -43,14 +48,14 @@ export default {
<li
v-for=
"(crumb, index) in rootCrumbs"
:key=
"index"
v-safe-html=
"crumb.innerHTML"
:class=
"crumb.className"
v-html=
"crumb.innerHTML"
></li>
<li
v-if=
"!isRootRoute"
>
<router-link
ref=
"rootRouteLink"
:to=
"rootRoute.path"
>
{{
rootRoute
.
meta
.
nameGenerator
(
$store
.
state
)
}}
</router-link>
<component
:is=
"divider.tagName"
v-safe-html=
"divider.innerHTML"
:class=
"divider.classList
"
/>
<component
:is=
"divider.tagName"
:class=
"divider.classList"
v-html=
"divider.innerHTML
"
/>
</li>
<li>
<component
:is=
"lastCrumb.tagName"
ref=
"lastCrumb"
:class=
"lastCrumb.className"
>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment