Commit fe07d8c4 authored by Olena Horal-Koretska's avatar Olena Horal-Koretska

Merge branch 'fix-project-list-item-v-html' into 'master'

Use v-safe-html in project_list_item.vue

See merge request gitlab-org/gitlab!70730
parents b52f21df b25f8c3c
import ProjectListItem from './project_list_item.vue';
export default {
component: ProjectListItem,
title: 'vue_shared/components/project_selector/project_list_item',
};
const Template = (args, { argTypes }) => ({
components: { ProjectListItem },
props: Object.keys(argTypes),
template: '<project-list-item v-bind="$props" />',
});
export const Default = Template.bind({});
Default.args = {
project: {
id: '1',
name: 'MyProject',
name_with_namespace: 'path / to / MyProject',
},
selected: false,
};
export const SelectedProject = Template.bind({});
SelectedProject.args = {
...Default.args,
selected: true,
};
export const MatchedProject = Template.bind({});
MatchedProject.args = {
...Default.args,
matcher: 'proj',
};
<script>
import { GlButton, GlIcon } from '@gitlab/ui';
import { GlButton, GlIcon, GlSafeHtmlDirective as SafeHtml } from '@gitlab/ui';
import { isString } from 'lodash';
import highlight from '~/lib/utils/highlight';
import { truncateNamespace } from '~/lib/utils/text_utility';
......@@ -8,6 +8,7 @@ import ProjectAvatar from '~/vue_shared/components/deprecated_project_avatar/def
export default {
name: 'ProjectListItem',
components: { GlIcon, ProjectAvatar, GlButton },
directives: { SafeHtml },
props: {
project: {
type: Object,
......@@ -58,9 +59,9 @@ export default {
<span v-if="truncatedNamespace" class="text-secondary">/&nbsp;</span>
</div>
<div
v-safe-html="highlightedProjectName"
:title="project.name"
class="js-project-name text-truncate"
v-html="highlightedProjectName /* eslint-disable-line vue/no-v-html */"
></div>
</div>
</gl-button>
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment