notfire/Iceshrimp.NET
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[frontend] Add ErrorBoundary based error display

Browse source
This commit is contained in:
Lilian 2024-08-06 23:47:13 +02:00
parent ba0d9f64f7
commit 87bcb23be9
No known key found for this signature in database
3 changed files with 118 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
Iceshrimp.Frontend/App.razor
View file

@ -1,19 +1,30 @@
@using Iceshrimp.Frontend.Components
@using Microsoft.AspNetCore.Components.Authorization
<Router AppAssembly="@typeof(App).Assembly">
<Found Context="routeData">
<AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)">
<NotAuthorized>
<RedirectToLogin/>
</NotAuthorized>
</AuthorizeRouteView>
@* <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)"/> *@
<FocusOnNavigate RouteData="@routeData" Selector="h1"/>
</Found>
<NotFound>
<PageTitle>Not found</PageTitle>
<LayoutView Layout="@typeof(MainLayout)">
<p role="alert">Page not found.</p>
</LayoutView>
</NotFound>
</Router>
<ErrorBoundary @ref=ErrorBoundary>
<ChildContent>
<Router AppAssembly="@typeof(App).Assembly">
<Found Context="routeData">
<AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)">
<NotAuthorized>
<RedirectToLogin/>
</NotAuthorized>
</AuthorizeRouteView>
@* <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)"/> *@
<FocusOnNavigate RouteData="@routeData" Selector="h1"/>
</Found>
<NotFound>
<PageTitle>Not found</PageTitle>
<LayoutView Layout="@typeof(MainLayout)">
<p role="alert">Page not found.</p>
</LayoutView>
</NotFound>
</Router>
</ChildContent>
<ErrorContent Context="Exception">
<ErrorUi Exception="Exception"></ErrorUi>
</ErrorContent>
</ErrorBoundary>
@code {
private ErrorBoundary? ErrorBoundary { get; set; }
}

49
Iceshrimp.Frontend/Components/ErrorUi.razor Normal file
View file

@ -0,0 +1,49 @@
@using Iceshrimp.Frontend.Core.Services
@using Iceshrimp.Frontend.Localization
@using Microsoft.Extensions.Localization
@inject IStringLocalizer<Localization> Loc;
@inject NavigationManager Navigation;
@inject VersionService Version;
<div class="error-ui">
<h3>@Loc["Unhandled Exception has occured"]</h3>
<div class="body">
<div class="text">
<div>
@Loc["If this issue happens more than once, please join our support chat at: "]<a href="https://chat.iceshrimp.dev/">https://chat.iceshrimp.dev/</a><br/>
@Loc["Providing the below stack trace and version information will aid in debugging."]
</div>
</div>
<div class="stacktrace">
<code>@Exception.GetType(): @Exception.Message @Exception.StackTrace</code>
</div>
<div class="version">
<span class="name">Iceshrimp.NET</span>
<span class="value">
<code>@Version.Version</code>
</span>
<span class="name">Codename</span>
<span class="value">
<code>@Version.Codename</code>
</span>
@if (Version.CommitHash != null)
{
<span class="name">Commit</span>
<span class="value">
<code>@Version.CommitHash</code>
</span>
}
</div>
</div>
<button class="btn" @onclick="Reload">@Loc["Reload Application"]</button>
</div>
@code {
[Parameter] [EditorRequired] public required Exception Exception { get; set; }
private void Reload()
{
Navigation.Refresh(true);
}
}

41
Iceshrimp.Frontend/Components/ErrorUi.razor.css Normal file
View file

@ -0,0 +1,41 @@
.stacktrace {
margin-top: 1rem;
align-self: center;
max-width: 80vw;
max-height: 50vh;
overflow: scroll;
background-color: black;
border-radius: 1rem;
padding: 0.5rem;
user-select: all;
}
.version {
max-width: 80vw;
display: flex;
flex-direction: column;
margin-top: 1rem;
}
.error-ui {
display: flex;
flex-direction: column;
align-items: center;
}
code {
color: lightgray;
user-select: all;
}
.value {
margin-bottom: 0.5rem;
max-width: 100vw;
overflow: scroll;
}
.body {
display: flex;
flex-direction: column;
padding: 1rem;
}