so://phie

blob: bd676e586a22508fe3b0cbd85b5b0d924eb4d80c (1343 bytes)[doc][blame][raw]

 1import { html } from '../std/js/render.js';
 2import { Overview, Category, Message } from './component.js';
 3
 4export const App = async props => {
 5	let body;
 6	try {
 7		const data = await fetchPostData();
 8		if(!data || data.length === 0) {
 9			throw new Error('Response body is empty: 500');
10		}
11		body = html`<div>
12			${Overview(data)}
13			${data.map(Category)}
14		</div>`;
15	}
16	catch(error) {
17		console.error(error);
18		body = Message({
19			message: 'Something went wrong!',
20			description: error.message
21		});
22	}
23	return html`<div>
24		<header class="container-fluid">
25			<div class="row">
26				<div class="container">
27					<h1>git.typable</h1>
28					<p>A place for commonly used code snippets.</p>
29				</div>
30			</div>
31		</header>
32		<main class="container-fluid">
33			<div class="row">
34				<div class="container">${body}</div>
35			</div>
36		</main>
37		<footer class="container-fluid">
38			<div class="row">
39				<div class="container">
40					<span>&copy; typable ${new Date().getFullYear()}</span>
41					<a href="https://typable.dev/imprint">Imprint</a>
42					<a href="https://typable.dev/terms">Terms</a>
43				</div>
44			</div>
45		</footer>
46	</div>`;
47};
48
49async function fetchPostData() {
50	const response = await fetch('/data/post.json');
51	if(response.status !== 200) {
52		throw new Error('Invalid status code: ' + response.status);
53	}
54	return await response.json();