Commit bfadedb5 authored by Natalia Tepluhina's avatar Natalia Tepluhina

Merge branch '223196-update-design-management-documentation' into 'master'

Resolve "Update Design Management documentation"

Closes #223196

See merge request gitlab-org/gitlab!36681
parents 385ebd96 ebe38c7e
......@@ -91,20 +91,15 @@ export default {
data-testid="dropzone-area"
>
<gl-icon name="upload" :size="24" :class="hasDesigns ? 'gl-mb-2' : 'gl-mr-4'" />
<gl-sprintf
:message="
__(
'%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}',
)
"
>
<template #content="{ content }">
<span class="gl-font-weight-bold">{{ content }}&nbsp;</span>
</template>
<template #link="{ content }">
<gl-link @click.stop="openFileUpload">{{ content }}</gl-link>
</template>
</gl-sprintf>
<p class="gl-font-weight-bold gl-mb-0">
<gl-sprintf :message="__('Drop or %{linkStart}upload%{linkEnd} Designs to attach')">
<template #link="{ content }">
<gl-link class="gl-font-weight-normal" @click.stop="openFileUpload">
{{ content }}
</gl-link>
</template>
</gl-sprintf>
</p>
</div>
</button>
......
......@@ -267,7 +267,7 @@ export default {
</script>
<template>
<div data-testid="designs-root" class="gl-mt-2">
<div data-testid="designs-root" class="gl-mt-5">
<header v-if="showToolbar" class="row-content-block border-top-0 p-2 d-flex">
<div class="gl-display-flex gl-justify-content-space-between gl-align-items-center gl-w-full">
<div>
......
......@@ -7,6 +7,7 @@ export default [
name: DESIGNS_ROUTE_NAME,
path: '/',
component: Home,
alias: '/designs',
},
{
name: DESIGN_ROUTE_NAME,
......@@ -16,7 +17,7 @@ export default [
{
params: { id },
},
from,
_,
next,
) {
if (typeof id === 'string') {
......
- if @project.design_management_enabled?
- if Feature.enabled?(:design_management_moved, @project)
- if Feature.enabled?(:design_management_moved, @project, default_enabled: true)
.js-design-management-new{ data: { project_path: @project.full_path, issue_iid: @issue.iid, issue_path: project_issue_path(@project, @issue) } }
- else
.js-design-management{ data: { project_path: @project.full_path, issue_iid: @issue.iid, issue_path: project_issue_path(@project, @issue) } }
- else
- if Feature.enabled?(:design_management_moved, @project)
- if Feature.enabled?(:design_management_moved, @project, default_enabled: true)
.row.empty-state.design-dropzone-border.gl-mt-5
.text-content.center.gl-font-weight-bold
- requirements_link_url = help_page_path('user/project/issues/design_management', anchor: 'requirements')
......
......@@ -74,7 +74,7 @@
- if @issue.sentry_issue.present?
#js-sentry-error-stack-trace{ data: error_details_data(@project, @issue.sentry_issue.sentry_issue_identifier) }
- if Feature.enabled?(:design_management_moved, @project)
- if Feature.enabled?(:design_management_moved, @project, default_enabled: true)
= render 'projects/issues/design_management'
= render_if_exists 'projects/issues/related_issues'
......@@ -94,7 +94,7 @@
#js-vue-discussion-filter{ data: { default_filter: current_user&.notes_filter_for(@issue), notes_filters: UserPreference.notes_filters.to_json } }
= render 'new_branch' if show_new_branch_button?
- if Feature.enabled?(:design_management_moved, @project)
- if Feature.enabled?(:design_management_moved, @project, default_enabled: true)
= render 'projects/issues/discussion'
- else
= render 'projects/issues/tabs'
......
---
title: Make the Design Collection more visible in the Issue UI
merge_request: 36681
author:
type: changed
......@@ -60,20 +60,25 @@ and [PDFs](https://gitlab.com/gitlab-org/gitlab/-/issues/32811) is planned for a
- Only the latest version of the designs can be deleted.
- Deleted designs cannot be recovered but you can see them on previous designs versions.
## The Design Management page
## The Design Management section
Navigate to the **Design Management** page from any issue by clicking the **Designs** tab:
> [Introduced](https://gitlab.com/gitlab-org/gitlab/-/issues/223193) in GitLab 13.2, Designs are displayed directly on the issue description rather than on a separate tab.
![Designs tab](img/design_management_v12_3.png)
You can find to the **Design Management** section in the issue description:
![Designs section](img/design_management_v13_2.png)
## Adding designs
To upload design images, click the **Upload Designs** button and select images to upload.
To upload Design images, drag files from your computer and drop them in the Design Management section,
or click **upload** to select images from your file browser:
![Designs empty state](img/design_management_upload_v13.2.png)
[Introduced](https://gitlab.com/gitlab-org/gitlab/-/issues/34353) in [GitLab Premium](https://about.gitlab.com/pricing/) 12.9,
you can drag and drop designs onto the dedicated drop zone to upload them.
![Drag and drop design uploads](img/design_drag_and_drop_uploads_v12_9.png)
![Drag and drop design uploads](img/design_drag_and_drop_uploads_v13_2.png)
[Introduced](https://gitlab.com/gitlab-org/gitlab/-/issues/202634)
in GitLab 12.10, you can also copy images from your file system and
......
......@@ -304,9 +304,6 @@ msgstr ""
msgid "%{containerScanningLinkStart}Container Scanning%{containerScanningLinkEnd} and/or %{dependencyScanningLinkStart}Dependency Scanning%{dependencyScanningLinkEnd} must be enabled. %{securityBotLinkStart}GitLab-Security-Bot%{securityBotLinkEnd} will be the author of the auto-created merge request. %{moreInfoLinkStart}More information%{moreInfoLinkEnd}."
msgstr ""
msgid "%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}"
msgstr ""
msgid "%{cores} cores"
msgstr ""
......@@ -8409,6 +8406,9 @@ msgstr ""
msgid "Downvotes"
msgstr ""
msgid "Drop or %{linkStart}upload%{linkEnd} Designs to attach"
msgstr ""
msgid "Drop your designs to start your upload."
msgstr ""
......
......@@ -17,9 +17,13 @@ exports[`Design management dropzone component when dragging renders correct temp
size="24"
/>
<gl-sprintf-stub
message="%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}"
/>
<p
class="gl-font-weight-bold gl-mb-0"
>
<gl-sprintf-stub
message="Drop or %{linkStart}upload%{linkEnd} Designs to attach"
/>
</p>
</div>
</button>
......@@ -89,9 +93,13 @@ exports[`Design management dropzone component when dragging renders correct temp
size="24"
/>
<gl-sprintf-stub
message="%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}"
/>
<p
class="gl-font-weight-bold gl-mb-0"
>
<gl-sprintf-stub
message="Drop or %{linkStart}upload%{linkEnd} Designs to attach"
/>
</p>
</div>
</button>
......@@ -161,9 +169,13 @@ exports[`Design management dropzone component when dragging renders correct temp
size="24"
/>
<gl-sprintf-stub
message="%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}"
/>
<p
class="gl-font-weight-bold gl-mb-0"
>
<gl-sprintf-stub
message="Drop or %{linkStart}upload%{linkEnd} Designs to attach"
/>
</p>
</div>
</button>
......@@ -232,9 +244,13 @@ exports[`Design management dropzone component when dragging renders correct temp
size="24"
/>
<gl-sprintf-stub
message="%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}"
/>
<p
class="gl-font-weight-bold gl-mb-0"
>
<gl-sprintf-stub
message="Drop or %{linkStart}upload%{linkEnd} Designs to attach"
/>
</p>
</div>
</button>
......@@ -303,9 +319,13 @@ exports[`Design management dropzone component when dragging renders correct temp
size="24"
/>
<gl-sprintf-stub
message="%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}"
/>
<p
class="gl-font-weight-bold gl-mb-0"
>
<gl-sprintf-stub
message="Drop or %{linkStart}upload%{linkEnd} Designs to attach"
/>
</p>
</div>
</button>
......@@ -374,9 +394,13 @@ exports[`Design management dropzone component when no slot provided renders defa
size="24"
/>
<gl-sprintf-stub
message="%{contentStart}Drop files to attach, or %{contentEnd}%{linkStart}browse%{linkEnd}"
/>
<p
class="gl-font-weight-bold gl-mb-0"
>
<gl-sprintf-stub
message="Drop or %{linkStart}upload%{linkEnd} Designs to attach"
/>
</p>
</div>
</button>
......
......@@ -2,7 +2,7 @@
exports[`Design management index page designs does not render toolbar when there is no permission 1`] = `
<div
class="gl-mt-2"
class="gl-mt-5"
data-testid="designs-root"
>
<!---->
......@@ -87,7 +87,7 @@ exports[`Design management index page designs does not render toolbar when there
exports[`Design management index page designs renders designs list and header with upload button 1`] = `
<div
class="gl-mt-2"
class="gl-mt-5"
data-testid="designs-root"
>
<header
......@@ -227,7 +227,7 @@ exports[`Design management index page designs renders designs list and header wi
exports[`Design management index page designs renders error 1`] = `
<div
class="gl-mt-2"
class="gl-mt-5"
data-testid="designs-root"
>
<!---->
......@@ -258,7 +258,7 @@ exports[`Design management index page designs renders error 1`] = `
exports[`Design management index page designs renders loading icon 1`] = `
<div
class="gl-mt-2"
class="gl-mt-5"
data-testid="designs-root"
>
<!---->
......@@ -281,7 +281,7 @@ exports[`Design management index page designs renders loading icon 1`] = `
exports[`Design management index page when has no designs renders design dropzone 1`] = `
<div
class="gl-mt-2"
class="gl-mt-5"
data-testid="designs-root"
>
<!---->
......
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