Skip to content

Commit 2b99f5b

Browse files
author
Jonas Gauffin
committed
Moved intro to seperate page.
1 parent af42b80 commit 2b99f5b

File tree

8 files changed

+140
-110
lines changed

8 files changed

+140
-110
lines changed

src/Server/Coderr.Server.WebSite/ClientApp/src/app/home/home.component.html

Lines changed: 2 additions & 97 deletions
Original file line numberDiff line numberDiff line change
@@ -1,100 +1,4 @@
11
<div class="p-10 starter">
2-
<div *ngIf="activePane === 'onboarding'">
3-
<div class="row">
4-
<div class="col">
5-
<div class="mt-3">
6-
<h1 class="text-shadow-1 text-white">Welcome to Coderr!</h1>
7-
</div>
8-
<div class="pb-0 mb-0">
9-
&nbsp;&nbsp;
10-
<label>
11-
<input type="checkbox" (change)="hideOnboarding()" /> Hide introduction
12-
</label>
13-
14-
</div>
15-
</div>
16-
</div>
17-
<div class="panels">
18-
<div class="panel" *ngIf="firstApplicationId">
19-
<h3>Report errors</h3>
20-
<div class="fill">
21-
<div class="f-grow">
22-
<p>
23-
The best way to get started is to read our <a href="https://coderr.io/try#configuring-your-application">getting started guide</a>.
24-
</p>
25-
<p>
26-
Our nuget packages are used detect and report errors in your application. To get started you need to install and configure our of our packages.
27-
</p>
28-
<p>
29-
You can also read our <a href="https://coderr.io/documentation/pages/">wiki</a> or visit our <a href="https://coderr.io/guides-and-support">Guides and support</a> section at our homepage.
30-
</p>
31-
</div>
32-
</div>
33-
</div>
34-
<div class="panel">
35-
<h3>Before going to production</h3>
36-
<div class="fill">
37-
<p>
38-
Coderr will by default throw exceptions and try to report errors directly to be able to tell if something is configured incorrectly. That's great
39-
when you get started, but can have implications in production. To disable those features, do the following:
40-
</p>
41-
42-
<p>Turn off Coderr's internal exceptions before going to production.</p>
43-
<pre><code class="language-csharp">Err.Configuration.ThrowExceptions = false;</code></pre>
44-
45-
<p>Let Coderr report errors in the background (to not slow down your application while it tries to report errors).</p>
46-
<pre><code>Err.Configuration.QueueReports = true;</code></pre>
47-
</div>
48-
</div>
49-
<div class="panel">
50-
<h3>Disable Coderr in Development environments</h3>
51-
<div class="fill">
52-
<div class="f-grow">
53-
<p>You typically have full control over errors happening in development environments.</p>
54-
<p>Learn how to conditionally enable Coderr in different environments to reduce noise.</p>
55-
</div>
56-
<a class="" href="https://coderr.io/documentation/features/incidents/environments/">Learn more</a>
57-
</div>
58-
</div>
59-
60-
<div class="panel">
61-
<h3>Demo errors</h3>
62-
<div class="fill">
63-
<div class="f-grow">
64-
<p>
65-
Coderr can generate some demo errors so that you can quickly can see what Coderr provides for information.
66-
</p>
67-
</div>
68-
<a [routerLink]="['/demo-errors']">Generate demo errors</a>
69-
</div>
70-
</div>
71-
72-
<div class="panel">
73-
<h3>Application configuration (admin only)</h3>
74-
<div class="fill">
75-
<p>
76-
You can monitor multiple applications in Coderr. To make it easier for you, we created an application named "DemoApp".
77-
</p>
78-
<p>
79-
You can change its name and create more applications by clicking on the Cog wheel (<i class="fa fa-cog text-primary"></i>) at top right.
80-
</p>
81-
</div>
82-
</div>
83-
84-
<div class="panel">
85-
<h3>Invite co-workers (admin only)</h3>
86-
<div class="fill">
87-
<p>To invite co-workers, use the Cog wheel (<i class="fa fa-cog text-primary"></i>) found in top right menu, select one of your applications and then use the "Security" tab.</p>
88-
</div>
89-
</div>
90-
<script>
91-
document.querySelectorAll('pre code').forEach((block) => {
92-
hljs.highlightBlock(block);
93-
});
94-
</script>
95-
96-
</div>
97-
</div>
982

993
<div *ngIf="noApps">
1004
<div class="col mb-2 mt-5">
@@ -105,12 +9,13 @@ <h2 class="text-white text-shadow-1">Getting started</h2>
1059
</div>
10610
</div>
10711

108-
<div class="row" *ngIf="activePane !== 'onboarding'">
12+
<div class="row">
10913
<div class="col fill f-grow">
11014
<h2 class="text-shadow-1 text-muted pointer" style="display: inline;" (click)="setPane('applications')" [ngClass]="{'active': activePane === 'applications'}">Applications</h2>
11115
&nbsp;
11216
<h2 id="myErrors" class="text-shadow-1 text-muted pointer" style="display: inline;" (click)="setPane('my-errors')" [ngClass]="{'active': activePane === 'my-errors'}">My errors</h2>
11317
</div>
18+
11419
<div class="col form" style="text-align: right" *ngIf="activePane === 'applications'">
11520
<a class="btn white" (click)="createApplication()"><i class="fa fa-plus"></i> New application</a> <br />
11621
<div class="mt-3">

src/Server/Coderr.Server.WebSite/ClientApp/src/app/home/home.component.ts

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -31,16 +31,7 @@ export class HomeComponent implements OnInit, OnDestroy {
3131
navMenuService: NavMenuService) {
3232
navMenuService.updateNav([]);
3333

34-
if (localStorage.getItem('showOnboarding') !== false.toString()) {
35-
this.activePane = 'onboarding';
36-
} else {
37-
this.activePane = localStorage.getItem('homeActivePane') || 'applications';
38-
}
39-
}
40-
41-
hideOnboarding() {
42-
localStorage.setItem('showOnboarding', false.toString());
43-
this.setPane('applications');
34+
this.activePane = localStorage.getItem('homeActivePane') || 'applications';
4435
}
4536

4637
filter(event) {
@@ -52,7 +43,7 @@ export class HomeComponent implements OnInit, OnDestroy {
5243
this.activePane = name;
5344
localStorage.setItem('homeActivePane', name);
5445
}
55-
46+
5647

5748
ngOnInit(): void {
5849
this.appSub = this.appService.applications.subscribe(apps => {

src/Server/Coderr.Server.WebSite/ClientApp/src/app/home/home.module.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,15 +12,17 @@ import { AuthorizeGuard } from "../../api-authorization/authorize.guard";
1212
import { AdminModule } from "../admin/admin.module";
1313
import { GroupModule } from "../admin/groups/group.module";
1414
import { DemoErrorsComponent } from './demo-errors/demo-errors.component';
15+
import { TipsComponent } from './tips/tips.component';
1516

1617
const incidentsRoutes: Routes = [
1718
{ path: '', pathMatch: 'full', component: HomeComponent, canActivate: [AuthorizeGuard] },
18-
{ path: 'demo-errors', component: DemoErrorsComponent }
19+
{ path: 'demo-errors', component: DemoErrorsComponent },
20+
{ path: 'tips', component: TipsComponent }
1921
];
2022

2123

2224
@NgModule({
23-
declarations: [LatestErrorsComponent, HomeComponent, DemoErrorsComponent],
25+
declarations: [LatestErrorsComponent, HomeComponent, DemoErrorsComponent, TipsComponent],
2426
imports: [
2527
ControlsModule,
2628
AdminModule,
Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
<div class="p-10 starter">
2+
<div>
3+
<div class="row">
4+
<div class="col">
5+
<div class="mt-3">
6+
<h1 class="text-shadow-1 text-white">Welcome to Coderr!</h1>
7+
</div>
8+
</div>
9+
</div>
10+
<div class="panels">
11+
<div class="panel" *ngIf="firstApplicationId">
12+
<h3>Report errors</h3>
13+
<div class="fill">
14+
<div class="f-grow">
15+
<p>
16+
The best way to get started is to read our <a href="https://coderr.io/try#configuring-your-application">getting started guide</a>.
17+
</p>
18+
<p>
19+
Our nuget packages are used detect and report errors in your application. To get started you need to install and configure our of our packages.
20+
</p>
21+
<p>
22+
You can also read our <a href="https://coderr.io/documentation/pages/">wiki</a> or visit our <a href="https://coderr.io/guides-and-support">Guides and support</a> section at our homepage.
23+
</p>
24+
</div>
25+
</div>
26+
</div>
27+
<div class="panel">
28+
<h3>Before going to production</h3>
29+
<div class="fill">
30+
<p>
31+
Coderr will by default throw exceptions and try to report errors directly to be able to tell if something is configured incorrectly. That's great
32+
when you get started, but can have implications in production. To disable those features, do the following:
33+
</p>
34+
35+
<p>Turn off Coderr's internal exceptions before going to production.</p>
36+
<pre><code class="language-csharp">Err.Configuration.ThrowExceptions = false;</code></pre>
37+
38+
<p>Let Coderr report errors in the background (to not slow down your application while it tries to report errors).</p>
39+
<pre><code>Err.Configuration.QueueReports = true;</code></pre>
40+
</div>
41+
</div>
42+
<div class="panel">
43+
<h3>Disable Coderr in Development environments</h3>
44+
<div class="fill">
45+
<div class="f-grow">
46+
<p>You typically have full control over errors happening in development environments.</p>
47+
<p>Learn how to conditionally enable Coderr in different environments to reduce noise.</p>
48+
</div>
49+
<a class="" href="https://coderr.io/documentation/features/incidents/environments/">Learn more</a>
50+
</div>
51+
</div>
52+
53+
<div class="panel">
54+
<h3>Demo errors</h3>
55+
<div class="fill">
56+
<div class="f-grow">
57+
<p>
58+
Coderr can generate some demo errors so that you can quickly can see what Coderr provides for information.
59+
</p>
60+
</div>
61+
<a [routerLink]="['/demo-errors']">Generate demo errors</a>
62+
</div>
63+
</div>
64+
65+
<div class="panel">
66+
<h3>Application configuration (admin only)</h3>
67+
<div class="fill">
68+
<p>
69+
You can monitor multiple applications in Coderr. To make it easier for you, we created an application named "DemoApp".
70+
</p>
71+
<p>
72+
You can change its name and create more applications by clicking on the Cog wheel (<i class="fa fa-cog text-primary"></i>) at top right.
73+
</p>
74+
</div>
75+
</div>
76+
77+
<div class="panel">
78+
<h3>Invite co-workers (admin only)</h3>
79+
<div class="fill">
80+
<p>To invite co-workers, use the Cog wheel (<i class="fa fa-cog text-primary"></i>) found in top right menu, select one of your applications and then use the "Security" tab.</p>
81+
</div>
82+
</div>
83+
<script>
84+
document.querySelectorAll('pre code').forEach((block) => {
85+
hljs.highlightBlock(block);
86+
});
87+
</script>
88+
89+
</div>
90+
</div>
91+
</div>

src/Server/Coderr.Server.WebSite/ClientApp/src/app/home/tips/tips.component.scss

Whitespace-only changes.
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { TipsComponent } from './tips.component';
4+
5+
describe('TipsComponent', () => {
6+
let component: TipsComponent;
7+
let fixture: ComponentFixture<TipsComponent>;
8+
9+
beforeEach(async () => {
10+
await TestBed.configureTestingModule({
11+
declarations: [ TipsComponent ]
12+
})
13+
.compileComponents();
14+
});
15+
16+
beforeEach(() => {
17+
fixture = TestBed.createComponent(TipsComponent);
18+
component = fixture.componentInstance;
19+
fixture.detectChanges();
20+
});
21+
22+
it('should create', () => {
23+
expect(component).toBeTruthy();
24+
});
25+
});
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { Component, OnInit } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-tips',
5+
templateUrl: './tips.component.html',
6+
styleUrls: ['./tips.component.scss']
7+
})
8+
export class TipsComponent implements OnInit {
9+
10+
constructor() { }
11+
12+
ngOnInit(): void {
13+
}
14+
15+
}

src/Server/Coderr.Server.WebSite/ClientApp/src/app/nav-menu/nav-menu.component.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@
2828
<div class="right-menu">
2929
<ul>
3030
<li *ngIf="showConfigure">
31+
<a [routerLink]="['/tips']">Introduction</a> |
3132
<a [routerLink]="['/application', configureAppId, 'configure']">Do you need help reporting errors?</a>
3233
</li>
3334
<li>

0 commit comments

Comments
 (0)