From 111cd9ee35a4910ac76fbe7da83a0eff6b9f3672 Mon Sep 17 00:00:00 2001
From: Ax333l <main@axelen.xyz>
Date: Thu, 22 Dec 2022 18:37:03 +0100
Subject: [PATCH] feat: blog (WIP)

---
 src/lib/blog.ts                        | 21 +++++++++++++++++++++
 src/routes/blog/+layout.svelte         |  3 +++
 src/routes/blog/+page.svelte           | 15 +++++++++++++++
 src/routes/blog/+page.ts               |  5 +++++
 src/routes/blog/[...slug]/+page.svelte | 14 ++++++++++++++
 src/routes/blog/[...slug]/+page.ts     |  8 ++++++++
 6 files changed, 66 insertions(+)
 create mode 100644 src/lib/blog.ts
 create mode 100644 src/routes/blog/+layout.svelte
 create mode 100644 src/routes/blog/+page.svelte
 create mode 100644 src/routes/blog/+page.ts
 create mode 100644 src/routes/blog/[...slug]/+page.svelte
 create mode 100644 src/routes/blog/[...slug]/+page.ts

diff --git a/src/lib/blog.ts b/src/lib/blog.ts
new file mode 100644
index 00000000..57932bfb
--- /dev/null
+++ b/src/lib/blog.ts
@@ -0,0 +1,21 @@
+import { error } from '@sveltejs/kit';
+
+const url = 'http://localhost:1337';
+
+export async function list(fetch_fn = fetch) {
+	// TODO: only get the fields we need.
+	const res = await fetch_fn(`${url}/api/posts?populate=*`);
+	const data = await res.json();
+
+	return data.data;
+}
+
+export async function get_one(slug: string, fetch_fn = fetch) {
+	const res = await fetch_fn(`${url}/api/posts?filters[slug][$eq]=${slug}`);
+	if (res.status === 404) {
+		throw error(404, `The post with slug ${slug} was not found`);
+	} else {
+		const response = await res.json();
+		return response.data[0].attributes;
+	}
+}
diff --git a/src/routes/blog/+layout.svelte b/src/routes/blog/+layout.svelte
new file mode 100644
index 00000000..a1cb1878
--- /dev/null
+++ b/src/routes/blog/+layout.svelte
@@ -0,0 +1,3 @@
+<main style="text-align: center; margin-top: 8rem;">
+  <slot />
+</main>
diff --git a/src/routes/blog/+page.svelte b/src/routes/blog/+page.svelte
new file mode 100644
index 00000000..6465ee9d
--- /dev/null
+++ b/src/routes/blog/+page.svelte
@@ -0,0 +1,15 @@
+<script lang="ts">
+export let data;
+</script>
+<h1>Blog posts</h1>
+<div>
+{#each data.posts as post}
+  <div>
+    <h2>{post.attributes.title}</h2>
+    <p>
+      {post.attributes.description}
+    </p>
+    <a href="/blog/{post.attributes.slug}">link</a>
+  </div>
+{/each}
+</div>
diff --git a/src/routes/blog/+page.ts b/src/routes/blog/+page.ts
new file mode 100644
index 00000000..ddca986d
--- /dev/null
+++ b/src/routes/blog/+page.ts
@@ -0,0 +1,5 @@
+import { list } from '$lib/blog';
+
+export const load = async ({ fetch }) => {
+	return { posts: await list(fetch) };
+};
diff --git a/src/routes/blog/[...slug]/+page.svelte b/src/routes/blog/[...slug]/+page.svelte
new file mode 100644
index 00000000..41d1b741
--- /dev/null
+++ b/src/routes/blog/[...slug]/+page.svelte
@@ -0,0 +1,14 @@
+<script>
+export let data;
+</script>
+
+<svelte:head>
+	<title>ReVanced | {data.post.title}</title>
+	<meta content="ReVanced | {data.post.title}" name="og:title" />
+	<meta content="ReVanced | {data.post.title}" name="twitter:title" />
+</svelte:head>
+<h1 style="color: var(--accent-color); font-size: 5rem;">
+  {data.post.title}
+</h1>
+
+{@html data.post.content}
diff --git a/src/routes/blog/[...slug]/+page.ts b/src/routes/blog/[...slug]/+page.ts
new file mode 100644
index 00000000..df4807d8
--- /dev/null
+++ b/src/routes/blog/[...slug]/+page.ts
@@ -0,0 +1,8 @@
+import { get_one } from '$lib/blog';
+import { parse } from 'marked';
+
+export const load = async ({ fetch, params }) => {
+	let post = await get_one(params.slug, fetch);
+	post.content = parse(post.content);
+	return { post };
+};