From 01bc0f2063e681bc774d3b2e57fb8af22d50d5a1 Mon Sep 17 00:00:00 2001
From: Ax333l <main@axelen.xyz>
Date: Fri, 21 Oct 2022 20:31:18 +0200
Subject: [PATCH 1/2] feat: hydration

---
 .../molecules/ContributorHost.svelte          |  3 +-
 src/lib/stores/ContributorsStore.js           | 10 ------
 src/lib/stores/PatchesStore.js                | 11 ------
 src/lib/types.ts                              | 34 +++++++++++++++++++
 src/routes/credits/+page.svelte               | 16 +++------
 src/routes/credits/+page.ts                   | 10 ++++++
 src/routes/patches/+page.svelte               | 32 +++--------------
 src/routes/patches/+page.ts                   | 24 +++++++++++++
 8 files changed, 79 insertions(+), 61 deletions(-)
 delete mode 100644 src/lib/stores/ContributorsStore.js
 delete mode 100644 src/lib/stores/PatchesStore.js
 create mode 100644 src/lib/types.ts
 create mode 100644 src/routes/credits/+page.ts
 create mode 100644 src/routes/patches/+page.ts

diff --git a/src/lib/components/molecules/ContributorHost.svelte b/src/lib/components/molecules/ContributorHost.svelte
index 6a747a8..19cac70 100644
--- a/src/lib/components/molecules/ContributorHost.svelte
+++ b/src/lib/components/molecules/ContributorHost.svelte
@@ -1,7 +1,8 @@
 <script lang="ts">
+  import type { Contributor } from '$lib/types';
 	import ContributorButton from '../atoms/ContributorPerson.svelte';
 
-	export let contribs;
+	export let contribs: Contributor[];
 	export let repo: string;
 
 	let repo_name = repo
diff --git a/src/lib/stores/ContributorsStore.js b/src/lib/stores/ContributorsStore.js
deleted file mode 100644
index 156080f..0000000
--- a/src/lib/stores/ContributorsStore.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import { readable } from "svelte/store";
-
-const fetchContributors = async () => {
-    const response = await fetch('https://releases.rvcd.win/contributors');
-    const json = await response.json();
-    return json;
-};
-
-const ContributorsStore = readable(fetchContributors());
-export default ContributorsStore;
\ No newline at end of file
diff --git a/src/lib/stores/PatchesStore.js b/src/lib/stores/PatchesStore.js
deleted file mode 100644
index 91042b3..0000000
--- a/src/lib/stores/PatchesStore.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { readable } from "svelte/store";
-
-const fetchPatches = async () => {
-    const response = await fetch('https://releases.rvcd.win/patches');
-    const json = await response.json();
-    console.log(typeof json)
-    return json;
-};
-
-const PatchesStore = readable(fetchPatches());
-export default PatchesStore;
\ No newline at end of file
diff --git a/src/lib/types.ts b/src/lib/types.ts
new file mode 100644
index 0000000..0e1a61d
--- /dev/null
+++ b/src/lib/types.ts
@@ -0,0 +1,34 @@
+export interface Contributor {
+  login: string;
+  avatar_url: string;
+  html_url: string;
+}
+
+export interface Repository {
+  name: string;
+  contributors: Contributor[];
+}
+
+export interface Patch {
+  name:               string;
+  description:        string;
+  version:            string;
+  excluded:           boolean;
+  deprecated:         boolean;
+  dependencies:       string[];
+  options:            PatchOption[];
+  compatiblePackages: CompatiblePackage[];
+}
+
+export interface CompatiblePackage {
+  name:     string;
+  versions: string[];
+}
+
+export interface PatchOption {
+  key:         string;
+  title:       string;
+  description: string;
+  required:    boolean;
+  choices:     string[];
+}
diff --git a/src/routes/credits/+page.svelte b/src/routes/credits/+page.svelte
index 911dc7f..8ee294d 100644
--- a/src/routes/credits/+page.svelte
+++ b/src/routes/credits/+page.svelte
@@ -1,28 +1,20 @@
 <script lang="ts">
+  import type { APIOutput } from './+page';
+
 	import ContributorHost from '$lib/components/molecules/ContributorHost.svelte';
-	import ContributorsStore from '../../lib/stores/ContributorsStore.js';
     import Footer from '$lib/components/molecules/Footer.svelte';
-	import { onMount } from 'svelte';
 	import { fly } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
 
-	let data;
-
-	onMount(() => {
-		ContributorsStore.subscribe(async (e) => {
-			data = await e;
-		});
-	});
+	export let data: APIOutput;
 </script>
 
 <div class="wrapper contrib-grid">
-	{#if data}
 		{#each data.repositories as { contributors, name }}
 			<div in:fly={{ y: 10, easing: quintOut, duration: 750 }}>
 				<ContributorHost contribs={contributors} repo={name} />
 			</div>
 		{/each}
-	{/if}
 </div>
 
 <style>
@@ -34,4 +26,4 @@
 	}
 </style>
 
-<Footer />
\ No newline at end of file
+<Footer />
diff --git a/src/routes/credits/+page.ts b/src/routes/credits/+page.ts
new file mode 100644
index 0000000..dca1b46
--- /dev/null
+++ b/src/routes/credits/+page.ts
@@ -0,0 +1,10 @@
+import type { Repository } from '$lib/types';
+
+export type APIOutput = { repositories: Repository[] };
+
+export async function load({
+  fetch
+}): APIOutput {
+  const response = await fetch('https://releases.rvcd.win/contributors');
+  return await response.json();
+}
diff --git a/src/routes/patches/+page.svelte b/src/routes/patches/+page.svelte
index bfe66b0..e1f5da3 100644
--- a/src/routes/patches/+page.svelte
+++ b/src/routes/patches/+page.svelte
@@ -1,43 +1,24 @@
 <script lang="ts">
+    import type { Output } from "./+page";
     import Patch from "$lib/components/atoms/Patch.svelte";
-    import PatchesStore from "$lib/stores/PatchesStore";
     import Footer from "$lib/components/molecules/Footer.svelte";
-    import { onMount } from "svelte";
     import { fly } from 'svelte/transition';
     import { quintOut } from 'svelte/easing';
 
-    let patches: any;
-    let pkg_list: Object[] = [];
+    export let data: Output;
+
+    let { patches, packages } = data;
 
     let current: boolean | Object = false;
-
-    onMount (async () => {
-        PatchesStore.subscribe(async (e) => {
-            patches = await e;
-            console.log(patches);
-
-            for (let i = 0; i < patches.length; i++) {
-                patches[i].compatiblePackages.forEach(pkg => {
-                    let index = pkg_list.findIndex(x => x == pkg.name); 
-                    if (index === -1) {
-                        pkg_list.push(pkg.name);
-                        pkg_list = pkg_list;
-                    };
-                });
-            };
-        })
-    });
-    
 </script>
 
 <section>
     <aside class="menu">
-        {#if pkg_list}
         <div in:fly="{{ y: 10, easing: quintOut, duration: 750 }}">
             <h5>PACKAGES</h5>
             <hr/>
             <div class="package-list">
-                {#each pkg_list as pkg}
+                {#each packages as pkg}
                     <div 
                         class="package"
                         class:selected={ current === pkg }
@@ -48,10 +29,8 @@
                 {/each}
             </div>
         </div>
-        {/if}
     </aside>
 
-    {#if patches}
         <div class="patches-list patches-container">
             {#each patches as patch, i}
                 <div in:fly="{{ x: 10, easing: quintOut, duration: 750, delay: (80 * i)}}">
@@ -72,7 +51,6 @@
                 </div>
             {/each}
         </div>
-    {/if}
 </section>
 
 <Footer/>
diff --git a/src/routes/patches/+page.ts b/src/routes/patches/+page.ts
new file mode 100644
index 0000000..3633395
--- /dev/null
+++ b/src/routes/patches/+page.ts
@@ -0,0 +1,24 @@
+import type { Patch } from '$lib/types';
+
+export type Output = { patches: Patch[], packages: string[] };
+
+export async function load({
+  fetch
+}): Output {
+  const response = await fetch('https://releases.rvcd.win/patches');
+  const json = await response.json();
+
+  let pkg_list = [];
+
+  // yes
+  for (let i = 0; i < json.length; i++) {
+    json[i].compatiblePackages.forEach(pkg => {
+      let index = pkg_list.findIndex(x => x == pkg.name);
+      if (index === -1) {
+        pkg_list.push(pkg.name);
+      };
+    });
+  };
+
+  return { patches: json, packages: pkg_list };
+}

From 81bd5e041f3bc4c1016cb2ffa0f63bc277821264 Mon Sep 17 00:00:00 2001
From: Ax333l <main@axelen.xyz>
Date: Fri, 21 Oct 2022 22:00:27 +0200
Subject: [PATCH 2/2] refactor: move contrib hydration to layout

---
 src/routes/{credits/+page.ts => +layout.ts} | 0
 src/routes/credits/+page.svelte             | 4 ++--
 2 files changed, 2 insertions(+), 2 deletions(-)
 rename src/routes/{credits/+page.ts => +layout.ts} (100%)

diff --git a/src/routes/credits/+page.ts b/src/routes/+layout.ts
similarity index 100%
rename from src/routes/credits/+page.ts
rename to src/routes/+layout.ts
diff --git a/src/routes/credits/+page.svelte b/src/routes/credits/+page.svelte
index 8ee294d..7ee2608 100644
--- a/src/routes/credits/+page.svelte
+++ b/src/routes/credits/+page.svelte
@@ -1,11 +1,11 @@
 <script lang="ts">
-  import type { APIOutput } from './+page';
-
+  import type { APIOutput } from '../+layout';
 	import ContributorHost from '$lib/components/molecules/ContributorHost.svelte';
     import Footer from '$lib/components/molecules/Footer.svelte';
 	import { fly } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
 
+  // From the layout hydration. See +layout.ts
 	export let data: APIOutput;
 </script>