Skip to content

Commit a240d9f

Browse files
jgauffinjgauffin
authored
Refresh design (#79)
Tweaked the design to make it more uniform.
1 parent 64edd4c commit a240d9f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+826
-692
lines changed

‎src/Server/Coderr.Server.SqlServer/Core/Accounts/QueryHandlers/GetAccountEmailByIdHandler.cs‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,11 @@
11
using System;
22
using System.Threading.Tasks;
3-
using Coderr.Server.Abstractions.Boot;
43
using Coderr.Server.Api.Core.Accounts.Queries;
54
using Coderr.Server.Domain.Core.Account;
65
using DotNetCqs;
76

87
namespace Coderr.Server.SqlServer.Core.Accounts.QueryHandlers
98
{
10-
[ContainerService]
119
public class GetAccountEmailByIdHandler : IQueryHandler<GetAccountEmailById, string>
1210
{
1311
private readonly IAccountRepository _accountRepository;

‎src/Server/Coderr.Server.SqlServer/Core/ApiKeys/Queries/ListApiKeysHandler.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ public async Task<ListApiKeysResult> HandleAsync(IMessageContext context, ListAp
2323
var keys =
2424
await
2525
_unitOfWork.ToListAsync(_mapper,
26-
"SELECT ID, GeneratedKey ApiKey, ApplicationName FROM ApiKeys ORDER BY ApplicationName");
26+
"SELECT Id, GeneratedKey ApiKey, ApplicationName FROM ApiKeys ORDER BY ApplicationName");
2727
return new ListApiKeysResult {Keys = keys.ToArray()};
2828
}
2929
}

‎src/Server/Coderr.Server.Web/ClientApp/components/analyze/analyze.vue.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div>
33
<analyze-menu />
44
<div class="cold">
5-
<router-view></router-view>
5+
<router-view class="main-view"></router-view>
66
</div>
77
</div>
88
</template>

‎src/Server/Coderr.Server.Web/ClientApp/components/analyze/incidents/close.vue.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@
22
<div class="CloseView">
33
<div class="row">
44
<div class="col">
5-
<h2>Close incident</h2>
65
<div class="card">
6+
<div class="card-header">
7+
Close incident
8+
</div>
79
<div class="card-body rounded">
810
<textarea class="form-control" v-model="solution" placeholder="How did you solve this error?" rows="10" id="solution" autofocus=""></textarea>
911
<button class="btn btn-primary" v-on:click.prevent="close">Close incident</button>

‎src/Server/Coderr.Server.Web/ClientApp/components/analyze/incidents/feedback.vue.html‎

Lines changed: 26 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,37 @@
11
<template>
22
<div class="FeedbackView">
3-
<div class="row">
4-
<div class="col">
5-
<h2>
6-
Feedback
7-
</h2>
3+
<div class="card" v-show="feedbackList.length == 0" style="display: none">
4+
<div class="card-header">
5+
Feedback
86
</div>
9-
<hr />
10-
</div>
11-
<div class="row mb-2">
12-
<div class="col">
13-
<router-link :to="{ name: 'analyzeIncident', params: { incidentId: incidentId }}" class="btn btn-light">&lt;&lt; Back to incident..</router-link>
14-
</div>
15-
</div>
16-
<div class="row">
17-
<div class="col" v-show="feedbackList.length == 0" style="display: none">
18-
<div class="card">
19-
<div class="card-body">
20-
<h3>No feedback has been given.</h3>
21-
<p>This page can contain error descriptions written by your users when this error occur.</p>
22-
<p>Either write your own error page or activate one of our built in ones.</p>
23-
<pre><code>//Example for ASP.NET MVC5
7+
<div class="card-body">
8+
<h6>No feedback has been given.</h6>
9+
<p>This page can contain error descriptions written by your users when this error occur.</p>
10+
<p>Either write your own error page or activate one of our built in ones.</p>
11+
<pre><code>//Example for ASP.NET MVC5
2412
Err.Configuration.UserInteraction.AskForFeedback = true;
2513
Err.Configuration.DisplayErrorPages();
2614
</code></pre>
27-
<p>You can read more in our <a href="">documentation</a>.</p>
28-
</div>
29-
</div>
15+
<p>You can read more in our <a href="">documentation</a>.</p>
3016
</div>
31-
<div class="feedback col" v-for="feedback in feedbackList">
32-
<div class="card">
33-
<div class="card-header">
34-
Written {{feedback.writtenAtUtc|ago}}
35-
</div>
36-
<div class="card-body">
37-
<div>
38-
{{feedback.description}}
39-
</div>
40-
<div>
41-
</div>
42-
</div>
43-
<div class="card-footer" v-if="feedback.email">
44-
<a :href="'mailto:' + feedback.email">{{feedback.email}}</a>
45-
</div>
17+
</div>
18+
<div class="card" v-for="feedback in feedbackList">
19+
<div class="card-header">
20+
Written {{feedback.writtenAtUtc|ago}} for
21+
<span v-if="feedback.incidentId">
22+
<router-link :to="{name: 'discoverIncident', params: { incidentId: feedback.incidentId }}">{{feedback.incidentName}}</router-link>
23+
</span>
24+
<span v-else> <router-link :to="{name: 'discoverFeedback', params: { applicationId: feedback.applicationId }}">{{feedback.applicationName}}</router-link></span>
25+
</div>
26+
<div class="card-body">
27+
<div>
28+
{{feedback.description}}
4629
</div>
30+
<div>
31+
</div>
32+
</div>
33+
<div class="card-footer" v-if="feedback.email">
34+
<a :href="'mailto:' + feedback.email">{{feedback.email}}</a>
4735
</div>
4836
</div>
4937
</div>

‎src/Server/Coderr.Server.Web/ClientApp/components/analyze/incidents/incident.vue.html‎

Lines changed: 61 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -1,102 +1,84 @@
11
<template>
22
<div class="IncidentView">
3-
<div>
4-
<div class="row minimal-gutters">
5-
<div class="col">
6-
<div class="float-right">
7-
<div class="btn-group" role="group">
8-
<a class="btn btn-primary text-light" v-on:click="closeIncident">Close incident</a>
9-
<div class="dropdown" style="display: inline-block">
10-
<button type="button" class="btn btn-outline-dark dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
11-
<div class="dropdown-menu dropdown-menu-right">
12-
<span class="dropdown-item" v-on:click="reAssign"><i class="fa-redo fa text-muted"></i> Re-assign</span>
13-
<!--<span class="dropdown-item" v-on:click="addToTfs"><i class="fa-code-branch fa text-muted"></i> Add to TFS/VSTS</span>-->
14-
15-
</div>
3+
<div class="row" style="margin-bottom: 20px">
4+
<div class="col">
5+
<div class="float-right">
6+
<div class="btn-group" role="group">
7+
<a class="btn btn-blue shadow" href="#" v-if="incident.IncidentState == 0" v-on:click.prevent="assignToMe">Assign to me</a>
8+
<div class="dropdown" style="display: inline-block">
9+
<button class="btn btn-white shadow dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
10+
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
11+
<span class="dropdown-item" v-on:click="reAssign"><i class="fa-redo fa text-muted"></i> Re-assign</span>
1612
</div>
1713
</div>
1814
</div>
19-
20-
<h3>
21-
{{incident.Description}}
22-
<span class="lead text-muted">[{{incident.FullName}}] </span>
23-
</h3>
24-
<div class="tags">
25-
<span v-for="tag in incident.Tags" class="badge badge-dark">{{tag}}</span>
26-
</div>
2715
</div>
16+
<h3 class="text-gray">{{incident.Description}} <small class="text-gray4">[{{incident.FullName}}]</small></h3>
2817
</div>
29-
<div class="row minimal-gutters" v-if="incident.Solution">
30-
<div class="col">
31-
<div class="card">
32-
<div class="card-header">
33-
Previous solution ({{incident.SolvedAtUtc|ago}})
18+
</div>
19+
<div class="row">
20+
<div class="col-xl-8 col-lg-6">
21+
<div class="card">
22+
<div class="card-header">
23+
Stack trace
24+
</div>
25+
<div class="card-body pt-0">
26+
<div class="tags">
27+
<span v-for="tag in incident.Tags" class="badge badge-dark">{{tag}}</span>
3428
</div>
35-
<div class="card-body">
36-
<div v-html="incident.Solution"></div>
29+
<div v-if="highlights.length > 0" class="p-3">
30+
<table class="w-100">
31+
<tr>
32+
<th>Application</th>
33+
<td>{{applicationName}}</td>
34+
</tr>
35+
<tr v-for="high in highlights">
36+
<th>{{high.name}}</th>
37+
<td style="width: 100%">{{high.value}}</td>
38+
</tr>
39+
</table>
3740
</div>
41+
<pre style="min-height: 200px"><code>{{incident.StackTrace}}</code></pre>
3842
</div>
3943
</div>
40-
4144
</div>
42-
<div class="row minimal-gutters">
43-
<div class="col-xl-8 col-lg-6">
44-
<div class="card">
45-
<div class="card-body">
46-
47-
<div v-if="highlights.length > 0" class="p-3">
48-
<table class="w-100">
49-
<tr>
50-
<th>Application</th>
51-
<td>{{applicationName}}</td>
52-
</tr>
53-
<tr v-for="high in highlights">
54-
<th>{{high.name}}</th>
55-
<td style="width: 100%">{{high.value}}</td>
56-
</tr>
57-
</table>
58-
</div>
59-
60-
<h3>Stack trace</h3>
61-
<pre style="min-height: 200px"><code>{{incident.StackTrace}}</code></pre>
62-
</div>
45+
<div class="col-xl-4 col-lg-6">
46+
<div class="card" v-if="incident.Solution">
47+
<div class="card-header">
48+
Previous solution ({{incident.SolvedAtUtc|ago}})
49+
</div>
50+
<div class="card-body">
51+
<div v-html="incident.Solution"></div>
6352
</div>
6453
</div>
65-
<div class="col-xl-4 col-lg-6">
66-
<div class="card" v-if="incident.Facts && incident.Facts.length > 0">
67-
<div class="card-body">
68-
<h3>Quick facts</h3>
69-
<div>
70-
<table class="table table-borderless">
71-
<tbody>
72-
<tr v-for="prop in incident.Facts" v-if="prop.Value != '0'">
73-
<td>{{prop.Title}}</td>
74-
<td><span v-html="prop.Value"></span></td>
75-
</tr>
76-
<tr v-for="rel in incident.RelatedIncidents">
77-
<td>Related Incident</td>
78-
<td><a class="text-red" :href="'/discover/incidents/' + rel.ApplicationId + '/incident/' + rel.IncidentId">{{rel.Title}}</a></td>
79-
</tr>
54+
<div class="card" v-if="incident.Facts && incident.Facts.length > 0">
55+
<div class="card-header">
56+
Quick facts
57+
</div>
58+
<div class="card-body">
59+
<table class="table">
60+
<tbody>
61+
<tr v-for="prop in incident.Facts" v-if="prop.Value != '0'">
62+
<td>{{prop.Title}}</td>
63+
<td><span v-html="prop.Value"></span></td>
64+
</tr>
65+
<tr v-for="rel in incident.RelatedIncidents">
66+
<td>Related Incident</td>
67+
<td><a class="text-red" :href="'/discover/incidents/' + rel.ApplicationId + '/incident/' + rel.IncidentId">{{rel.Title}}</a></td>
68+
</tr>
8069

81-
</tbody>
82-
</table>
83-
</div>
84-
</div>
70+
</tbody>
71+
</table>
8572
</div>
8673
</div>
8774
</div>
88-
<div class="row">
89-
<div class="col">
90-
<div class="card">
91-
<div class="card-body">
92-
<context-navigator :incidentId="incidentId" :showAnalyzeFooter="true" />
93-
</div>
94-
</div>
95-
</div>
75+
</div>
76+
<div class="row">
77+
<div class="col">
78+
<context-navigator :incidentId="incidentId" :showAnalyzeFooter="true"/>
9679
</div>
97-
9880
</div>
99-
<div id="assignToModal" style="display:none">
81+
<div id="assignToModal" style="display: none">
10082
<div class="modal-body">
10183
<div v-for="user in team" class="mb-2">
10284
<button class="btn btn-primary btn-block" v-on:click.prevent="assignTo(user.id, $event)" :value="user.id" data-dismiss="modal">

‎src/Server/Coderr.Server.Web/ClientApp/components/analyze/incidents/report.ts‎

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -24,12 +24,12 @@ export default class AnalyzeReportComponent extends Vue {
2424
reportId: number;
2525
incidentId: number;
2626

27-
userFeedback: string|null = null;
27+
userFeedback: string | null = null;
2828
userOrEmail = 'user';
2929

3030
reports: GetReportListResultItem[] = [];
31-
showNextButton= true;
32-
showPrevButton=false;
31+
showNextButton = true;
32+
showPrevButton = false;
3333

3434
contextCollections: GetReportResultContextCollection[] = [];
3535
currentCollectionName = '';
@@ -62,7 +62,7 @@ export default class AnalyzeReportComponent extends Vue {
6262
this.loadReport(this.reports[this.currentIndex].Id);
6363
}
6464
}
65-
65+
6666
nextReport() {
6767
this.currentIndex++;
6868
this.indexInTotalSet++;
@@ -76,7 +76,7 @@ export default class AnalyzeReportComponent extends Vue {
7676
this.loadReport(this.reports[this.currentIndex].Id);
7777
}
7878

79-
79+
8080
}
8181

8282
private checkNavigationLinks() {
@@ -122,7 +122,7 @@ export default class AnalyzeReportComponent extends Vue {
122122
if (!isFound) {
123123
this.currentCollectionName = report.ContextCollections[0].Name;
124124
}
125-
125+
126126
this.loadCollection(this.currentCollectionName);
127127
} else {
128128
this.currentCollection = new GetReportResultContextCollection();
@@ -144,7 +144,7 @@ export default class AnalyzeReportComponent extends Vue {
144144
q.PageSize = this.pageSize;
145145
if (pageNumber) {
146146
q.PageNumber = pageNumber;
147-
147+
148148
}
149149

150150
AppRoot.Instance.apiClient.query<GetReportListResult>(q)
@@ -172,7 +172,7 @@ export default class AnalyzeReportComponent extends Vue {
172172

173173
this.checkNavigationLinks();
174174
}
175-
175+
176176
});
177177
}
178178

@@ -199,6 +199,16 @@ export default class AnalyzeReportComponent extends Vue {
199199
if (kvp.Value.substr(0, 1) !== '<') {
200200
kvp.Value = '<img src="data:image/png;base64, ' + kvp.Value + '" />';
201201
}
202+
if (kvp.Key === 'Cookie') {
203+
if (kvp.Value.length > 1000)
204+
kvp.Value = kvp.Value.substring(0, 1000) + "[...]";
205+
}
206+
}
207+
} else {
208+
for (var j = 0; j < this.currentCollection.Properties.length; j++) {
209+
var kvp = this.currentCollection.Properties[j];
210+
if (kvp.Value.length > 100)
211+
kvp.Value = kvp.Value.replace(/(.{100})/g, "$1<br>");
202212
}
203213
}
204214
return;

0 commit comments

Comments
 (0)