diff --git a/frontend/src/lib/components/AddonCard.svelte b/frontend/src/lib/components/AddonCard.svelte
index aa3c8b8..81f2e58 100644
--- a/frontend/src/lib/components/AddonCard.svelte
+++ b/frontend/src/lib/components/AddonCard.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { GetAddonLocalVersion, GetAddonRemoteVersion } from "$wails/main/App";
+	import { GetAddonLocalVersion, GetAddonRemoteVersion, UpdateAddon } from "$wails/main/App";
 	import { type main } from "$wails/models";
 	export let addon: main.Addon;
 	let localVersion = "0.0.0";
@@ -12,6 +12,19 @@
 		remoteVersion = res.data;
 	});
 	$: upToDate = localVersion === remoteVersion;
+	
+	async function updateAddon() {
+		const res = await UpdateAddon(addon.name);
+		if (res.error) {
+			console.error(res.error);
+		}
+		GetAddonLocalVersion(addon.name).then((res) => {
+			localVersion = res.data;
+		});
+		GetAddonRemoteVersion(addon.name).then((res) => {
+			remoteVersion = res.data;
+		});
+	}
 </script>
 
 <div class="bg-gray-900 text-white p-4 m-3 mx-2 rounded-lg">
@@ -21,6 +34,6 @@
 	{#if upToDate}
 		<button class="bg-green-500 disabled text-white p-2 my-2 cursor-default rounded-lg">Up to date</button>
 	{:else}
-		<button class="bg-blue-500 text-white p-2 my-2 rounded-lg">Update</button>
+		<button class="bg-blue-500 text-white p-2 my-2 rounded-lg" on:click={updateAddon}>Update</button>
 	{/if}
 </div>