From 712d7857db621aaa11b67d37f56fb2eb310612b0 Mon Sep 17 00:00:00 2001
From: Luke Else <mail@luke-else.co.uk>
Date: Thu, 6 Feb 2025 10:55:26 +0000
Subject: [PATCH] #5 Started on creating page to handle API requests to
 https://git.luke-else.co.uk

---
 src/lib/api/git.ts                      | 26 +++++++++++++++++++++++++
 src/lib/components/Toasts/Toasts.svelte |  2 +-
 src/lib/{store.ts => stores.ts}         | 17 +++++++++++++++-
 src/lib/types.ts                        | 13 +++++++++++++
 src/main.svelte                         |  2 +-
 src/routes/contact/+page.svelte         |  2 +-
 src/routes/repos/+page.svelte           | 23 +++++++++++++++++++---
 7 files changed, 78 insertions(+), 7 deletions(-)
 create mode 100644 src/lib/api/git.ts
 rename src/lib/{store.ts => stores.ts} (68%)
 create mode 100644 src/lib/types.ts

diff --git a/src/lib/api/git.ts b/src/lib/api/git.ts
new file mode 100644
index 0000000..df39d44
--- /dev/null
+++ b/src/lib/api/git.ts
@@ -0,0 +1,26 @@
+import type { GitRepo } from "../types";
+
+const API_BASE_URL = "https://git.luke-else.co.uk/api/v1";
+// const ACCESS_TOKEN = import.meta.env.VITE_GITEA_TOKEN;
+
+export async function fetchRepos(): Promise<GitRepo[]> {
+    try {
+        console.log("Fetching repos...");
+        const response = await fetch(`${API_BASE_URL}/repos/search`, {
+            headers: {
+                // "Authorization": `token ${ACCESS_TOKEN}`,
+                "Content-Type": "application/json"
+            }
+        });
+
+        if (!response.ok) {
+            throw new Error(`Error: ${response.statusText}`);
+        }
+
+        const data: { data: GitRepo[] } = await response.json();
+        return data.data; // Extract the list of repositories
+    } catch (error) {
+        console.error("Failed to fetch repos:", error);
+        return [];
+    }
+}
\ No newline at end of file
diff --git a/src/lib/components/Toasts/Toasts.svelte b/src/lib/components/Toasts/Toasts.svelte
index 3977df4..5a0bc71 100644
--- a/src/lib/components/Toasts/Toasts.svelte
+++ b/src/lib/components/Toasts/Toasts.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
   import Toast from "./Toast.svelte";
 
-  import { dismissToast, toasts } from "$lib/store";
+  import { dismissToast, toasts } from "$lib/stores";
 </script>
 
 {#if $toasts}
diff --git a/src/lib/store.ts b/src/lib/stores.ts
similarity index 68%
rename from src/lib/store.ts
rename to src/lib/stores.ts
index 9d46f52..41f1da4 100644
--- a/src/lib/store.ts
+++ b/src/lib/stores.ts
@@ -1,6 +1,12 @@
 import { ToastType, type Toast } from "$lib/toast";
 import { writable, type Writable } from "svelte/store";
+import type { GitRepo } from "./types";
+import { fetchRepos } from "./api/git";
 
+
+////////////////////////////////////////
+// Toast Stores
+////////////////////////////////////////
 export const toasts: Writable<Toast[]> = writable([]);
 
 export const addToast = (toast: Toast) => {
@@ -25,4 +31,13 @@ export const addToast = (toast: Toast) => {
 
 export const dismissToast = (id: number) => {
   toasts.update((all) => all.filter((t) => t.id !== id));
-};
\ No newline at end of file
+};
+
+////////////////////////////////////////
+// Git Repo Stores
+////////////////////////////////////////
+export const repos = writable<GitRepo[]>([]);
+
+export async function loadRepos() {
+    repos.set(await fetchRepos());
+}
\ No newline at end of file
diff --git a/src/lib/types.ts b/src/lib/types.ts
new file mode 100644
index 0000000..93b1ebf
--- /dev/null
+++ b/src/lib/types.ts
@@ -0,0 +1,13 @@
+export interface GitRepo {
+    id: number;
+    name: string;
+    full_name: string;
+    description: string;
+    html_url: string;
+    private: boolean;
+    fork: boolean;
+    owner: {
+        login: string;
+        avatar_url: string;
+    };
+}
\ No newline at end of file
diff --git a/src/main.svelte b/src/main.svelte
index 5b3f3ff..87b57d1 100644
--- a/src/main.svelte
+++ b/src/main.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
     import { getJson } from "$lib/data";
 	import { Toast, ToastType } from "$lib/toast";
-    import { addToast } from "$lib/store";
+    import { addToast } from "$lib/stores";
 
     import Skills from './skills.svelte';
 
diff --git a/src/routes/contact/+page.svelte b/src/routes/contact/+page.svelte
index 396de60..a146d8d 100644
--- a/src/routes/contact/+page.svelte
+++ b/src/routes/contact/+page.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
     import Card from '$lib/components/Cards/Card.svelte';
     import { Toast, ToastType } from "$lib/toast";
-    import { addToast } from "$lib/store";
+    import { addToast } from "$lib/stores";
 
     import { page } from '$app/stores';
     const sent = $page.url.searchParams.get('sent');
diff --git a/src/routes/repos/+page.svelte b/src/routes/repos/+page.svelte
index 157c0b3..64e2911 100644
--- a/src/routes/repos/+page.svelte
+++ b/src/routes/repos/+page.svelte
@@ -1,3 +1,20 @@
-<h1>Repos</h1>
-<p>Stay tuned! This is still in development.</p>
-<p>Come back later to find out what projects I'm currently working on!</p>
\ No newline at end of file
+<script lang="ts">
+    import { onMount } from "svelte";
+    import { repos, loadRepos } from "$lib/stores";
+
+    onMount(loadRepos);
+</script>
+
+<h1>My Projects</h1>
+
+{#if $repos.length > 0}
+    <ul>
+        {#each $repos as repo}
+            <li>
+                <a href="{repo.html_url}" target="_blank">{repo.name}</a> - {repo.description}
+            </li>
+        {/each}
+    </ul>
+{:else}
+    <p>Loading repositories...</p>
+{/if}