Convert errors pages to svelte
Fallback non-existing error views to generic Error svelte component
This commit is contained in:
parent
66a696f40e
commit
76fa44c245
|
|
@ -1,2 +0,0 @@
|
|||
{% extends 'errors/error.njk' %}
|
||||
{% import 'macros.njk' as macros %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<script>
|
||||
import Error from "./Error.svelte";
|
||||
</script>
|
||||
|
||||
<Error code={400} message="Bad request." />
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
{% extends 'errors/error.njk' %}
|
||||
{% import 'macros.njk' as macros %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<script>
|
||||
import Error from "./Error.svelte";
|
||||
</script>
|
||||
|
||||
<Error code={401} message="Unauthorized." />
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
{% extends 'errors/error.njk' %}
|
||||
{% import 'macros.njk' as macros %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<script>
|
||||
import Error from "./Error.svelte";
|
||||
</script>
|
||||
|
||||
<Error code={403} message="Forbidden" />
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
{% extends 'errors/error.njk' %}
|
||||
{% import 'macros.njk' as macros %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<script>
|
||||
import Error from "./Error.svelte";
|
||||
</script>
|
||||
|
||||
<Error code={404} message="Page not found." />
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
{% extends 'errors/error.njk' %}
|
||||
{% import 'macros.njk' as macros %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<script>
|
||||
import Error from "./Error.svelte";
|
||||
</script>
|
||||
|
||||
<Error code={429} message="Too many requests." />
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
{% extends 'errors/error.njk' %}
|
||||
{% import 'macros.njk' as macros %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<script>
|
||||
import Error from "./Error.svelte";
|
||||
</script>
|
||||
|
||||
<Error code={500} message="Internal server error." />
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
{% extends 'errors/error.njk' %}
|
||||
{% import 'macros.njk' as macros %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<script>
|
||||
import Error from "./Error.svelte";
|
||||
</script>
|
||||
|
||||
<Error code={503} message="Service unavailable." />
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<script lang="ts">
|
||||
import {locals} from "../../ts/stores";
|
||||
|
||||
const previousUrl = $locals.getPreviousUrl();
|
||||
|
||||
export let code;
|
||||
code = $locals.error_code || code;
|
||||
|
||||
export let message;
|
||||
message = $locals.error_message || message;
|
||||
|
||||
export let instructions;
|
||||
instructions = $locals.error_instructions || instructions;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>{code + ' - ' + message}</title>
|
||||
<link rel="stylesheet" href="/css/error.css">
|
||||
</svelte:head>
|
||||
|
||||
<div class="logo"><a href="/">{$locals.app.name}</a></div>
|
||||
|
||||
<main>
|
||||
<!--TODO: flash messages-->
|
||||
|
||||
<div class="error-code">{code}</div>
|
||||
<div class="error-message">{message}</div>
|
||||
{#if instructions}
|
||||
<div class="error-instructions">{@html instructions}</div>
|
||||
{/if}
|
||||
|
||||
<nav>
|
||||
{#if previousUrl && previousUrl !== '/' && previousUrl !== $locals.url}
|
||||
<a href={previousUrl} class="button"><i data-feather="arrow-left"></i> Go back</a>
|
||||
{/if}
|
||||
|
||||
<a href="/" class="button"><i data-feather="home"></i> Go to homepage</a>
|
||||
</nav>
|
||||
</main>
|
||||
|
||||
<div class="contact">
|
||||
<p>Error ID: {$locals.error_id || 'Request has no indentifier.'}</p>
|
||||
<p>
|
||||
If you think this isn't right, please contact us with the above error ID at
|
||||
<a href="mailto:{$locals.app.contact_email}">{$locals.app.contact_email}</a>.
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
{% extends 'layouts/barebone.njk' %}
|
||||
|
||||
{% set title = error_code + ' - ' + error_message %}
|
||||
|
||||
{% block _stylesheets %}
|
||||
<link rel="stylesheet" href="/css/error.css">
|
||||
{% endblock %}
|
||||
|
||||
{% block _body %}
|
||||
<div class="logo"><a href="/">{{ app.name }}</a></div>
|
||||
|
||||
<main class="{% block class %}{% endblock %}">
|
||||
{% if flash %}
|
||||
{{ macros.messages(flash) }}
|
||||
{% endif %}
|
||||
|
||||
<div class="error-code">{{ error_code }}</div>
|
||||
<div class="error-message">{{ error_message }}</div>
|
||||
<div class="error-instructions">{{ error_instructions|safe }}</div>
|
||||
|
||||
<nav>
|
||||
{% set previousUrl = getPreviousUrl() %}
|
||||
{% if previousUrl and previousUrl != '/' and previousUrl != url %}
|
||||
<a href="{{ previousUrl }}" class="button"><i data-feather="arrow-left"></i> Go back</a>
|
||||
{% endif %}
|
||||
|
||||
<a href="/" class="button"><i data-feather="home"></i> Go to homepage</a>
|
||||
</nav>
|
||||
</main>
|
||||
|
||||
<div class="contact">
|
||||
Error ID: {{ error_id | default('Request has no indentifier.') }}
|
||||
<br>
|
||||
If you think this isn't right, please contact us with the above error ID at
|
||||
<a href="mailto:{{ app.contact_email }}">{{ app.contact_email }}</a>.
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
@ -182,11 +182,18 @@ export default abstract class Application implements Extendable<ApplicationCompo
|
|||
res.status(httpError.errorCode);
|
||||
res.format({
|
||||
html: () => {
|
||||
res.render('errors/' + httpError.errorCode + '.njk', {
|
||||
const locals = {
|
||||
error_code: httpError.errorCode,
|
||||
error_message: httpError.message,
|
||||
error_instructions: httpError.instructions,
|
||||
error_id: errorId,
|
||||
};
|
||||
res.render('errors/' + httpError.errorCode, locals, (err: Error | undefined, html) => {
|
||||
if (err) {
|
||||
res.render('errors/Error', locals);
|
||||
} else {
|
||||
res.send(html);
|
||||
}
|
||||
});
|
||||
},
|
||||
json: () => {
|
||||
|
|
|
|||
Loading…
Reference in New Issue