diff --git a/src/lib/components/atoms/ContributorButton.svelte b/src/lib/components/atoms/ContributorPerson.svelte
similarity index 95%
rename from src/lib/components/atoms/ContributorButton.svelte
rename to src/lib/components/atoms/ContributorPerson.svelte
index 58b3239..ec6c710 100644
--- a/src/lib/components/atoms/ContributorButton.svelte
+++ b/src/lib/components/atoms/ContributorPerson.svelte
@@ -6,8 +6,8 @@
 </script>
 
 <a href={url} target="_blank">
-	<button>
-		<img src={pfp} alt={alt}><slot/>
+	<button tabindex="-1">
+		<img src={pfp} {alt}>
 	</button>
 	<h2>{name}</h2>
 </a>
diff --git a/src/lib/components/molecules/ContributorHost.svelte b/src/lib/components/molecules/ContributorHost.svelte
index 51559f4..5aca2f1 100644
--- a/src/lib/components/molecules/ContributorHost.svelte
+++ b/src/lib/components/molecules/ContributorHost.svelte
@@ -1,21 +1,16 @@
 <script lang="ts">
-    import ContributorsStore from "../../stores/ContributorsStore.js";
-    import ContributorButton from "../atoms/ContributorButton.svelte";
-    import { onMount } from "svelte";
+    import ContributorButton from "../atoms/ContributorPerson.svelte";
     import { fly } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
    
-    let contribs: Object;
-    let repo_link: string;
+    export let contribs;
     export let repo: string;
-
-    onMount (() => {
-        ContributorsStore.subscribe(async (e) => {
-            let data = await e;
-            repo_link = 'https://github.com/' + data[repo].name;
-            contribs = data[repo].contributors
-        });
-    });
+    
+    let repo_name = repo.replace(/-/g, ' ')
+        .replace(/revanced\/revanced/g, 'ReVanced')
+        .replace(/cli/g, 'CLI')
+        .replace(/api/g, 'API')
+        .replace(/(?:^|\s)\S/g, x => x.toUpperCase())
 
     let usersIwantToExplodeSoBadly = [
         'semantic-release-bot',
@@ -24,10 +19,14 @@
 </script>
 
 {#if contribs}
-    <div class="container" in:fly="{{ y: 10, easing: quintOut, duration: 700 }}">
-        <a href={repo_link} target="_blank">
-            <h2>ReVanced {repo === 'cli' ? 'CLI' : repo.charAt(0).toUpperCase() + repo.slice(1)}</h2>
+    <div 
+        class="container" 
+        in:fly="{{ y: 10, easing: quintOut, duration: 700 }}"
+    >
+        <a href='https://github.com/{repo}' target="_blank">
+            <h2>{repo_name}</h2>
         </a>
+
         <div class="contrib-host">    
             {#each contribs as contrib}
                 {#if !usersIwantToExplodeSoBadly.includes(contrib.login)}
@@ -39,6 +38,7 @@
                 {/if}
             {/each}
         </div>
+
     </div>
 {/if}
 
diff --git a/src/lib/stores/ContributorsStore.js b/src/lib/stores/ContributorsStore.js
index 21d52f8..156080f 100644
--- a/src/lib/stores/ContributorsStore.js
+++ b/src/lib/stores/ContributorsStore.js
@@ -3,9 +3,7 @@ import { readable } from "svelte/store";
 const fetchContributors = async () => {
     const response = await fetch('https://releases.rvcd.win/contributors');
     const json = await response.json();
-
-    let { 0: cli, 1: patcher, 2: patches, 3: integrations, 4: manager } = json.repositories;
-    return {cli, patcher, patches, integrations, manager};
+    return json;
 };
 
 const ContributorsStore = readable(fetchContributors());
diff --git a/src/routes/credits/+page.svelte b/src/routes/credits/+page.svelte
index c3c1be7..30828c6 100644
--- a/src/routes/credits/+page.svelte
+++ b/src/routes/credits/+page.svelte
@@ -1,13 +1,24 @@
 <script lang="ts">
     import ContributorHost from '$lib/components/molecules/ContributorHost.svelte';
+    import ContributorsStore from '../../lib/stores/ContributorsStore.js';
+    import { onMount } from "svelte";
+
+    let data;
+
+    onMount (() => {
+        ContributorsStore.subscribe(async (e) => {
+            data = await e;
+            console.log(data);
+        });
+    });
 </script>
 
 <div class="wrapper contrib-grid">
-    <ContributorHost repo="cli"/>
-    <ContributorHost repo="patcher"/>
-    <ContributorHost repo="patches"/>
-    <ContributorHost repo="integrations"/>
-    <ContributorHost repo="manager"/>
+    {#if data}
+        {#each data.repositories as { contributors, name }}
+            <ContributorHost contribs={contributors} repo={name}/>
+        {/each}
+    {/if}
 </div>
 
 <style>