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
d66489e4
Commit
d66489e4
authored
May 20, 2020
by
Olena Horal-Koretska
Committed by
Illya Klymov
May 20, 2020
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Create issue from alert
parent
2a15ea76
Changes
11
Hide whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
162 additions
and
34 deletions
+162
-34
app/assets/javascripts/alert_management/components/alert_details.vue
...javascripts/alert_management/components/alert_details.vue
+68
-12
app/assets/javascripts/alert_management/details.js
app/assets/javascripts/alert_management/details.js
+2
-2
app/assets/javascripts/alert_management/graphql/fragments/listItem.fragment.graphql
...rt_management/graphql/fragments/listItem.fragment.graphql
+1
-0
app/assets/javascripts/alert_management/graphql/mutations/create_issue_from_alert.graphql
...agement/graphql/mutations/create_issue_from_alert.graphql
+8
-0
app/assets/stylesheets/pages/alert_management/details.scss
app/assets/stylesheets/pages/alert_management/details.scss
+1
-1
app/controllers/projects/alert_management_controller.rb
app/controllers/projects/alert_management_controller.rb
+1
-1
app/helpers/projects/alert_management_helper.rb
app/helpers/projects/alert_management_helper.rb
+1
-1
locale/gitlab.pot
locale/gitlab.pot
+3
-0
spec/frontend/alert_management/components/alert_management_detail_spec.js
...ert_management/components/alert_management_detail_spec.js
+74
-15
spec/frontend/alert_management/mocks/alerts.json
spec/frontend/alert_management/mocks/alerts.json
+1
-0
spec/helpers/projects/alert_management_helper_spec.rb
spec/helpers/projects/alert_management_helper_spec.rb
+2
-2
No files found.
app/assets/javascripts/alert_management/components/alert_details.vue
View file @
d66489e4
...
...
@@ -20,6 +20,8 @@ import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
import
glFeatureFlagsMixin
from
'
~/vue_shared/mixins/gl_feature_flags_mixin
'
;
import
{
ALERTS_SEVERITY_LABELS
}
from
'
../constants
'
;
import
updateAlertStatus
from
'
../graphql/mutations/update_alert_status.graphql
'
;
import
createIssueQuery
from
'
../graphql/mutations/create_issue_from_alert.graphql
'
;
import
{
visitUrl
,
joinPaths
}
from
'
~/lib/utils/url_utility
'
;
export
default
{
statuses
:
{
...
...
@@ -60,7 +62,7 @@ export default {
type
:
String
,
required
:
true
,
},
newIssue
Path
:
{
projectIssues
Path
:
{
type
:
String
,
required
:
true
,
},
...
...
@@ -85,7 +87,13 @@ export default {
},
},
data
()
{
return
{
alert
:
null
,
errored
:
false
,
isErrorDismissed
:
false
};
return
{
alert
:
null
,
errored
:
false
,
isErrorDismissed
:
false
,
createIssueError
:
''
,
issueCreationInProgress
:
false
,
};
},
computed
:
{
loading
()
{
...
...
@@ -122,6 +130,33 @@ export default {
);
});
},
createIssue
()
{
this
.
issueCreationInProgress
=
true
;
this
.
$apollo
.
mutate
({
mutation
:
createIssueQuery
,
variables
:
{
iid
:
this
.
alert
.
iid
,
projectPath
:
this
.
projectPath
,
},
})
.
then
(({
data
:
{
createAlertIssue
:
{
errors
,
issue
}
}
})
=>
{
if
(
errors
?.
length
)
{
[
this
.
createIssueError
]
=
errors
;
this
.
issueCreationInProgress
=
false
;
}
else
if
(
issue
)
{
visitUrl
(
this
.
issuePath
(
issue
.
iid
));
}
})
.
catch
(
error
=>
{
this
.
createIssueError
=
error
;
this
.
issueCreationInProgress
=
false
;
});
},
issuePath
(
issueId
)
{
return
joinPaths
(
this
.
projectIssuesPath
,
issueId
);
},
},
};
</
script
>
...
...
@@ -130,6 +165,14 @@ export default {
<gl-alert
v-if=
"showErrorMsg"
variant=
"danger"
@
dismiss=
"dismissError"
>
{{
$options
.
i18n
.
errorMsg
}}
</gl-alert>
<gl-alert
v-if=
"createIssueError"
variant=
"danger"
data-testid=
"issueCreationError"
@
dismiss=
"createIssueError = null"
>
{{
createIssueError
}}
</gl-alert>
<div
v-if=
"loading"
><gl-loading-icon
size=
"lg"
class=
"gl-mt-5"
/></div>
<div
v-if=
"alert"
class=
"alert-management-details gl-relative"
>
<div
...
...
@@ -158,16 +201,29 @@ export default {
<
template
#tool
>
{{
alert
.
monitoringTool
}}
</
template
>
</gl-sprintf>
</div>
<gl-button
v-if=
"glFeatures.createIssueFromAlertEnabled"
class=
"gl-mt-3 mt-sm-0 align-self-center align-self-sm-baseline alert-details-create-issue-button"
data-testid=
"createIssueBtn"
:href=
"newIssuePath"
category=
"primary"
variant=
"success"
>
{{ s__('AlertManagement|Create issue') }}
</gl-button>
<div
v-if=
"glFeatures.alertManagementCreateAlertIssue"
>
<gl-button
v-if=
"alert.issueIid"
class=
"gl-mt-3 mt-sm-0 align-self-center align-self-sm-baseline alert-details-issue-button"
data-testid=
"viewIssueBtn"
:href=
"issuePath(alert.issueIid)"
category=
"primary"
variant=
"success"
>
{{ s__('AlertManagement|View issue') }}
</gl-button>
<gl-button
v-else
class=
"gl-mt-3 mt-sm-0 align-self-center align-self-sm-baseline alert-details-issue-button"
data-testid=
"createIssueBtn"
:loading=
"issueCreationInProgress"
category=
"primary"
variant=
"success"
@
click=
"createIssue()"
>
{{ s__('AlertManagement|Create issue') }}
</gl-button>
</div>
</div>
<div
v-if=
"alert"
...
...
app/assets/javascripts/alert_management/details.js
View file @
d66489e4
...
...
@@ -8,7 +8,7 @@ Vue.use(VueApollo);
export
default
selector
=>
{
const
domEl
=
document
.
querySelector
(
selector
);
const
{
alertId
,
projectPath
,
newIssue
Path
}
=
domEl
.
dataset
;
const
{
alertId
,
projectPath
,
projectIssues
Path
}
=
domEl
.
dataset
;
const
apolloProvider
=
new
VueApollo
({
defaultClient
:
createDefaultClient
(
...
...
@@ -39,7 +39,7 @@ export default selector => {
props
:
{
alertId
,
projectPath
,
newIssue
Path
,
projectIssues
Path
,
},
});
},
...
...
app/assets/javascripts/alert_management/graphql/fragments/listItem.fragment.graphql
View file @
d66489e4
...
...
@@ -6,4 +6,5 @@ fragment AlertListItem on AlertManagementAlert {
startedAt
endedAt
eventCount
issueIid
}
app/assets/javascripts/alert_management/graphql/mutations/create_issue_from_alert.graphql
0 → 100644
View file @
d66489e4
mutation
(
$projectPath
:
ID
!,
$iid
:
String
!)
{
createAlertIssue
(
input
:
{
iid
:
$iid
,
projectPath
:
$projectPath
})
{
errors
issue
{
iid
}
}
}
app/assets/stylesheets/pages/alert_management/details.scss
View file @
d66489e4
...
...
@@ -35,7 +35,7 @@
}
@include
media-breakpoint-down
(
xs
)
{
.alert-details-
create-
issue-button
{
.alert-details-issue-button
{
width
:
100%
;
}
}
...
...
app/controllers/projects/alert_management_controller.rb
View file @
d66489e4
...
...
@@ -4,7 +4,7 @@ class Projects::AlertManagementController < Projects::ApplicationController
before_action
:authorize_read_alert_management_alert!
before_action
do
push_frontend_feature_flag
(
:alert_list_status_filtering_enabled
)
push_frontend_feature_flag
(
:
create_issue_from_alert_enabled
)
push_frontend_feature_flag
(
:
alert_management_create_alert_issue
)
push_frontend_feature_flag
(
:alert_assignee
,
project
)
end
...
...
app/helpers/projects/alert_management_helper.rb
View file @
d66489e4
...
...
@@ -15,7 +15,7 @@ module Projects::AlertManagementHelper
{
'alert-id'
=>
alert_id
,
'project-path'
=>
project
.
full_path
,
'
new-issue-path'
=>
new_project_issue
_path
(
project
)
'
project-issues-path'
=>
project_issues
_path
(
project
)
}
end
end
locale/gitlab.pot
View file @
d66489e4
...
...
@@ -1847,6 +1847,9 @@ msgstr ""
msgid "AlertManagement|Unknown"
msgstr ""
msgid "AlertManagement|View issue"
msgstr ""
msgid "AlertService|%{linkStart}Learn more%{linkEnd} about configuring this endpoint to receive alerts."
msgstr ""
...
...
spec/frontend/alert_management/components/alert_management_detail_spec.js
View file @
d66489e4
...
...
@@ -2,7 +2,9 @@ import { mount, shallowMount } from '@vue/test-utils';
import
{
GlAlert
,
GlLoadingIcon
,
GlDropdownItem
,
GlTable
}
from
'
@gitlab/ui
'
;
import
AlertDetails
from
'
~/alert_management/components/alert_details.vue
'
;
import
updateAlertStatus
from
'
~/alert_management/graphql/mutations/update_alert_status.graphql
'
;
import
createIssueQuery
from
'
~/alert_management/graphql/mutations/create_issue_from_alert.graphql
'
;
import
createFlash
from
'
~/flash
'
;
import
{
joinPaths
}
from
'
~/lib/utils/url_utility
'
;
import
mockAlerts
from
'
../mocks/alerts.json
'
;
...
...
@@ -11,13 +13,15 @@ jest.mock('~/flash');
describe
(
'
AlertDetails
'
,
()
=>
{
let
wrapper
;
const
newIssuePath
=
'
root/alerts/-/issues/new
'
;
const
projectPath
=
'
root/alerts
'
;
const
projectIssuesPath
=
'
root/alerts/-/issues
'
;
const
findStatusDropdownItem
=
()
=>
wrapper
.
find
(
GlDropdownItem
);
const
findDetailsTable
=
()
=>
wrapper
.
find
(
GlTable
);
function
mountComponent
({
data
,
createIssueFromAlertEnabled
=
false
,
alertManagementCreateAlertIssue
=
false
,
loading
=
false
,
mountMethod
=
shallowMount
,
stubs
=
{},
...
...
@@ -25,14 +29,14 @@ describe('AlertDetails', () => {
wrapper
=
mountMethod
(
AlertDetails
,
{
propsData
:
{
alertId
:
'
alertId
'
,
projectPath
:
'
projectPath
'
,
newIssue
Path
,
projectPath
,
projectIssues
Path
,
},
data
()
{
return
{
alert
:
{
...
mockAlert
},
...
data
};
},
provide
:
{
glFeatures
:
{
createIssueFromAlertEnabled
},
glFeatures
:
{
alertManagementCreateAlertIssue
},
},
mocks
:
{
$apollo
:
{
...
...
@@ -50,11 +54,15 @@ describe('AlertDetails', () => {
afterEach
(()
=>
{
if
(
wrapper
)
{
wrapper
.
destroy
();
if
(
wrapper
)
{
wrapper
.
destroy
();
}
}
});
const
findCreatedIssueBtn
=
()
=>
wrapper
.
find
(
'
[data-testid="createIssueBtn"]
'
);
const
findCreateIssueBtn
=
()
=>
wrapper
.
find
(
'
[data-testid="createIssueBtn"]
'
);
const
findViewIssueBtn
=
()
=>
wrapper
.
find
(
'
[data-testid="viewIssueBtn"]
'
);
const
findIssueCreationAlert
=
()
=>
wrapper
.
find
(
'
[data-testid="issueCreationError"]
'
);
describe
(
'
Alert details
'
,
()
=>
{
describe
(
'
when alert is null
'
,
()
=>
{
...
...
@@ -118,17 +126,68 @@ describe('AlertDetails', () => {
describe
(
'
Create issue from alert
'
,
()
=>
{
describe
(
'
createIssueFromAlertEnabled feature flag enabled
'
,
()
=>
{
it
(
'
should display a button that links to new issue page
'
,
()
=>
{
mountComponent
({
createIssueFromAlertEnabled
:
true
});
expect
(
findCreatedIssueBtn
().
exists
()).
toBe
(
true
);
expect
(
findCreatedIssueBtn
().
attributes
(
'
href
'
)).
toBe
(
newIssuePath
);
it
(
'
should display "View issue" button that links the issue page when issue exists
'
,
()
=>
{
const
issueIid
=
'
3
'
;
mountComponent
({
alertManagementCreateAlertIssue
:
true
,
data
:
{
alert
:
{
...
mockAlert
,
issueIid
}
},
});
expect
(
findViewIssueBtn
().
exists
()).
toBe
(
true
);
expect
(
findViewIssueBtn
().
attributes
(
'
href
'
)).
toBe
(
joinPaths
(
projectIssuesPath
,
issueIid
),
);
expect
(
findCreateIssueBtn
().
exists
()).
toBe
(
false
);
});
it
(
'
should display "Create issue" button when issue doesn
\'
t exist yet
'
,
()
=>
{
const
issueIid
=
null
;
mountComponent
({
mountMethod
:
mount
,
alertManagementCreateAlertIssue
:
true
,
data
:
{
alert
:
{
...
mockAlert
,
issueIid
}
},
});
expect
(
findViewIssueBtn
().
exists
()).
toBe
(
false
);
expect
(
findCreateIssueBtn
().
exists
()).
toBe
(
true
);
});
it
(
'
calls `$apollo.mutate` with `createIssueQuery`
'
,
()
=>
{
const
issueIid
=
'
10
'
;
jest
.
spyOn
(
wrapper
.
vm
.
$apollo
,
'
mutate
'
)
.
mockResolvedValue
({
data
:
{
createAlertIssue
:
{
issue
:
{
iid
:
issueIid
}
}
}
});
findCreateIssueBtn
().
trigger
(
'
click
'
);
expect
(
wrapper
.
vm
.
$apollo
.
mutate
).
toHaveBeenCalledWith
({
mutation
:
createIssueQuery
,
variables
:
{
iid
:
mockAlert
.
iid
,
projectPath
,
},
});
});
it
(
'
shows error alert when issue creation fails
'
,
()
=>
{
const
errorMsg
=
'
Something went wrong
'
;
mountComponent
({
mountMethod
:
mount
,
alertManagementCreateAlertIssue
:
true
,
data
:
{
alert
:
{
...
mockAlert
,
alertIid
:
1
}
},
});
jest
.
spyOn
(
wrapper
.
vm
.
$apollo
,
'
mutate
'
).
mockRejectedValue
(
errorMsg
);
findCreateIssueBtn
().
trigger
(
'
click
'
);
setImmediate
(()
=>
{
expect
(
findIssueCreationAlert
().
text
()).
toBe
(
errorMsg
);
});
});
});
describe
(
'
createIssueFromAlertEnabled feature flag disabled
'
,
()
=>
{
it
(
'
should display a button that links to a new issue page
'
,
()
=>
{
mountComponent
({
createIssueFromAlertEnabled
:
false
});
expect
(
findCreatedIssueBtn
().
exists
()).
toBe
(
false
);
it
(
'
should not display a View or Create issue button
'
,
()
=>
{
mountComponent
({
alertManagementCreateAlertIssue
:
false
});
expect
(
findCreateIssueBtn
().
exists
()).
toBe
(
false
);
expect
(
findViewIssueBtn
().
exists
()).
toBe
(
false
);
});
});
});
...
...
@@ -223,7 +282,7 @@ describe('AlertDetails', () => {
variables
:
{
iid
:
'
alertId
'
,
status
:
'
TRIGGERED
'
,
projectPath
:
'
projectPath
'
,
projectPath
,
},
});
});
...
...
spec/frontend/alert_management/mocks/alerts.json
View file @
d66489e4
...
...
@@ -4,6 +4,7 @@
"title"
:
"SyntaxError: Invalid or unexpected token"
,
"severity"
:
"CRITICAL"
,
"eventCount"
:
7
,
"createdAt"
:
"2020-04-17T23:18:14.996Z"
,
"startedAt"
:
"2020-04-17T23:18:14.996Z"
,
"endedAt"
:
"2020-04-17T23:18:14.996Z"
,
"status"
:
"TRIGGERED"
...
...
spec/helpers/projects/alert_management_helper_spec.rb
View file @
d66489e4
...
...
@@ -69,13 +69,13 @@ describe Projects::AlertManagementHelper do
describe
'#alert_management_detail_data'
do
let
(
:alert_id
)
{
1
}
let
(
:
new_issue_path
)
{
new_project_issue
_path
(
project
)
}
let
(
:
issues_path
)
{
project_issues
_path
(
project
)
}
it
'returns detail page configuration'
do
expect
(
helper
.
alert_management_detail_data
(
project
,
alert_id
)).
to
eq
(
'alert-id'
=>
alert_id
,
'project-path'
=>
project_path
,
'
new-issue-path'
=>
new_issue
_path
'
project-issues-path'
=>
issues
_path
)
end
end
...
...
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