Skip to content

Commit a6bb982

Browse files
committed
UI updates
1 parent 8299c0c commit a6bb982

File tree

9 files changed

+106
-66784
lines changed

9 files changed

+106
-66784
lines changed
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
using System.Collections.Generic;
2+
using Coderr.Server.Abstractions.Config;
3+
using Coderr.Server.Infrastructure.Configuration;
4+
5+
namespace Coderr.Server.ReportAnalyzer.ErrorOrigins.Handlers
6+
{
7+
public class OriginsConfiguration : IConfigurationSection
8+
{
9+
public string ApiKey { get; set; }
10+
11+
string IConfigurationSection.SectionName { get; } = "Origins";
12+
13+
IDictionary<string, string> IConfigurationSection.ToDictionary()
14+
{
15+
return this.ToConfigDictionary();
16+
}
17+
18+
void IConfigurationSection.Load(IDictionary<string, string> settings)
19+
{
20+
this.AssignProperties(settings);
21+
}
22+
}
23+
}

src/Server/Coderr.Server.ReportAnalyzer/ErrorOrigins/Handlers/StorePositionFromNewReport.cs

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
using Coderr.Server.Abstractions.Boot;
1010
using log4net;
1111
using Newtonsoft.Json.Linq;
12+
using Coderr.Server.Abstractions.Config;
1213

1314
namespace Coderr.Server.ReportAnalyzer.ErrorOrigins.Handlers
1415
{
@@ -19,16 +20,18 @@ public class StorePositionFromNewReport : IMessageHandler<ReportAddedToIncident>
1920
{
2021
private readonly ILog _logger = LogManager.GetLogger(typeof(StorePositionFromNewReport));
2122
private readonly IErrorOriginRepository _repository;
23+
private IConfiguration<OriginsConfiguration> _originConfiguration;
2224

2325
/// <summary>
2426
/// Creates a new instance of <see cref="StorePositionFromNewReport" />.
2527
/// </summary>
2628
/// <param name="repository">repos</param>
2729
/// <exception cref="ArgumentNullException">repository</exception>
28-
public StorePositionFromNewReport(IErrorOriginRepository repository)
30+
public StorePositionFromNewReport(IErrorOriginRepository repository, IConfiguration<OriginsConfiguration> originConfiguration)
2931
{
3032
if (repository == null) throw new ArgumentNullException("repository");
3133
_repository = repository;
34+
_originConfiguration = originConfiguration;
3235
}
3336

3437
/// <summary>
@@ -43,12 +46,16 @@ public async Task HandleAsync(IMessageContext context, ReportAddedToIncident e)
4346
if (string.IsNullOrEmpty(e.Report.RemoteAddress))
4447
return;
4548

49+
if (string.IsNullOrEmpty(_originConfiguration.Value?.ApiKey))
50+
return;
51+
4652
if (e.Report.RemoteAddress == "::1")
4753
return;
4854
if (e.Report.RemoteAddress == "127.0.0.1")
4955
e.Report.RemoteAddress = "94.254.57.227";
5056

51-
var request = WebRequest.CreateHttp("http://freegeoip.net/json/" + e.Report.RemoteAddress);
57+
var url = $"http://api.ipstack.com/{e.Report.RemoteAddress}?access_key={_originConfiguration.Value.ApiKey}";
58+
var request = WebRequest.CreateHttp(url);
5259
string json = "";
5360
try
5461
{
@@ -71,7 +78,7 @@ public async Task HandleAsync(IMessageContext context, ReportAddedToIncident e)
7178
CountryName = jsonObj["country_name"].ToString(),
7279
RegionCode = jsonObj["region_code"].ToString(),
7380
RegionName = jsonObj["region_name"].ToString(),
74-
ZipCode = jsonObj["zip_code"].ToString()
81+
ZipCode = jsonObj["zip"].ToString()
7582
};
7683

7784
await _repository.CreateAsync(cmd, e.Incident.ApplicationId, e.Incident.Id, e.Report.Id);

src/Server/Coderr.Server.Web/ClientApp/components/analyze/incidents/incident.ts

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,17 @@ export default class AnalyzeIncidentComponent extends Vue {
122122

123123
private loadCollection(name: string) {
124124
if (name === AnalyzeIncidentComponent.selectCollectionTitle || name === '') {
125-
name = this.currentReport.ContextCollections[0].Name;
125+
name = null;
126+
var namesToFind = ['ContextData', 'ViewModel', 'HttpRequest', 'ExceptionProperties'];
127+
this.currentReport.ContextCollections.forEach(x => {
128+
if (namesToFind.indexOf(x.Name) !== -1 && name == null) {
129+
name = x.Name;
130+
}
131+
});
132+
133+
if (name == null) {
134+
name = this.currentReport.ContextCollections[0].Name;
135+
}
126136
}
127137

128138
for (var i = 0; i < this.currentReport.ContextCollections.length; i++) {

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

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -91,8 +91,8 @@ <h6 class="dropdown-header">Select context collection</h6>
9191
</div>
9292
</div>
9393
</div>
94-
<div v-if="currentReport.Id > 0" style="overflow-x: scroll">
95-
<table class="table">
94+
<div v-if="currentReport.Id > 0" style="overflow: auto">
95+
<table class="table mt-3 mb-3">
9696
<tbody>
9797
<tr v-for="prop in currentCollection.Properties">
9898
<td>{{prop.Key}}</td>
@@ -102,8 +102,7 @@ <h6 class="dropdown-header">Select context collection</h6>
102102
</table>
103103
<hr />
104104
<em>
105-
<router-link :to="{ name: 'analyzeReport', params: { reportId: currentReport.Id, incidentId: incident.Id}}">View entire report</router-link> |
106-
<a href="#">Browse all reports</a>
105+
<router-link class="btn btn-primary btn-block":to="{ name: 'analyzeReport', params: { reportId: currentReport.Id, incidentId: incident.Id}}">View entire report</router-link>
107106
</em>
108107
</div>
109108
</div>

src/Server/Coderr.Server.Web/ClientApp/components/analyze/incidents/origins.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ export default class OriginsComponent extends Vue {
1212
private apiClient: ApiClient = AppRoot.Instance.apiClient;
1313

1414
mapScript: string = '';
15+
gotItems = false;
1516

1617
mounted() {
1718
var self = this;
@@ -45,6 +46,7 @@ export default class OriginsComponent extends Vue {
4546
query.IncidentId = incidentId;
4647
self.apiClient.query<GetOriginsForIncidentResult>(query)
4748
.then(response => {
49+
this.gotItems = response.Items.length > 0;
4850
if (response.Items.length < 50) {
4951
response.Items.forEach(item => {
5052
var point = new google.maps.LatLng(item.Latitude, item.Longitude);

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

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,25 @@ <h2>
66
Origins
77
</h2>
88
<div>
9+
<div v-if="!gotItems" class="alert alert-warning">
10+
You must create an account at <a href="https://ipstack.com/">https://ipstack.com/</a>. Then add a new row in the "Settings" table in your database:
11+
<table>
12+
<tr>
13+
<th>Section</th>
14+
<td>Origins</td>
15+
</tr>
16+
<tr>
17+
<th>Name</th>
18+
<td>ApiKey</td>
19+
</tr>
20+
<tr>
21+
<th>Value</th>
22+
<td><em>Your api key</em></td>
23+
</tr>
24+
</table>
25+
</div>
926
<p>Displays where we received the error reports from.</p>
27+
1028
</div>
1129
<div id="map" style="height: 800px; max-width: 100%; width: 4096px;">
1230
<!--<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBleXqcxCLRwuhcXk-3904HaJt9Vd1-CZc"></script>-->

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

Lines changed: 39 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -20,53 +20,60 @@ <h2>
2020
<button class="btn btn-light" v-on:click="nextReport" v-if="showNextButton">Next report &gt;&gt;</button>
2121
</div>
2222
</div>
23+
<div class="row" v-if="userFeedback != null">
24+
<div class="col">
25+
<div class="card">
26+
<div class="card-body">
27+
<h3>Error report from {{userOrEmail}}</h3>
28+
<div class="card-body">
29+
<pre style="min-height: 200px"><code>{{userFeedback}}</code></pre>
30+
</div>
31+
</div>
32+
</div>
33+
</div>
34+
</div>
2335
<div class="row">
2436

25-
<div class="col-lg-12 col-xl-8 contextCollections">
37+
<div class="col contextCollections">
2638
<div class="card">
2739
<div class="card-body">
28-
<h3>Context collections</h3>
2940
<div v-if="this.contextCollections.length == 0">
3041
<em>No context collections were attached to this error report.</em>
3142
<p>
3243
<em>Our documentation demonstrates how you can <a href="http://coderr.io/documentation/client/manual-reporting/">manually add context information</a> or <a href="http://coderr.io/documentation/client/context-provider/">create custom collections</a>.</em>
3344
</p>
3445
</div>
35-
<div v-else>
36-
<div class="dropdown" style="display: inline">
37-
<button type="button" class="btn btn-light dropdown-toggle btn-sm" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" id="reportChooser">
38-
{{currentCollectionName}}
39-
</button>
40-
<div class="dropdown-menu">
41-
<h6 class="dropdown-header">Select context collection</h6>
42-
<div v-for="collection in contextCollections">
43-
<span class="dropdown-item" v-on:click="loadCollection(collection.Name)"><i class="fa-table fa text-muted"></i> {{collection.Name}}</span>
44-
</div>
46+
<div v-else class="row">
47+
<div class="col-md-auto col-sm-6 collection">
48+
<h5>Select collection</h5>
49+
<div v-for="collection in contextCollections">
50+
<a href="#"
51+
:class="{'active': collection.Name === currentCollection.Name }"
52+
:data-name="collection.Name"
53+
v-on:click.prevent="loadCollection(collection.Name)">{{collection.Name}}</a>
54+
</div>
55+
</div>
56+
<div class="col">
57+
<div v-if="currentCollection">
58+
<h4>{{currentCollection.Name}}</h4>
59+
<table class="table table-borderless">
60+
<tbody>
61+
<tr v-for="prop in currentCollection.Properties">
62+
<th style="white-space: nowrap;">{{prop.Key}}</th>
63+
<td style="width: 100%;" class="value" v-html="prop.Value"></td>
64+
</tr>
65+
</tbody>
66+
</table>
4567
</div>
4668
</div>
47-
</div>
48-
<div v-if="this.contextCollections.length > 0">
49-
<table class="table table-borderless">
50-
<tbody>
51-
<tr v-for="prop in currentCollection.Properties">
52-
<th style="white-space: nowrap;">{{prop.Key}}</th>
53-
<td style="width:100%;" class="value" v-html="prop.Value"></td>
54-
</tr>
55-
</tbody>
56-
</table>
5769
</div>
5870
</div>
5971
</div>
6072
</div>
61-
<div class="col-lg-12 col-xl-4">
62-
<div class="card" v-if="userFeedback != null">
63-
<div class="card-body">
64-
<h3>Error report from {{userOrEmail}}</h3>
65-
<div class="card-body">
66-
<pre style="min-height: 200px"><code>{{userFeedback}}</code></pre>
67-
</div>
68-
</div>
69-
</div>
73+
74+
</div>
75+
<div class="row">
76+
<div class="col">
7077
<div class="card">
7178
<div class="card-body">
7279
<h3>Stack trace</h3>
@@ -76,6 +83,7 @@ <h3>Stack trace</h3>
7683
</div>
7784
</div>
7885
</div>
86+
7987
</div>
8088
<div class="row">
8189
<div class="col">

0 commit comments

Comments
 (0)