diff --git a/my-app/src/routes/groups/[id=integer]/budgets/+page.svelte b/my-app/src/routes/groups/[id=integer]/budgets/+page.svelte
index 663e56b..6be2ed3 100644
--- a/my-app/src/routes/groups/[id=integer]/budgets/+page.svelte
+++ b/my-app/src/routes/groups/[id=integer]/budgets/+page.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { goto } from '$app/navigation';
 	import { getCategoryNameById, routes, title } from '$lib';
 	import CategoryFilter from '$lib/components/CategoryFilter.svelte';
 	import CssIcon from '$lib/components/CssIcon.svelte';
@@ -39,7 +40,7 @@
 </article>
 
 {#each filteredBudgets as budget}
-	{@const isReadOnly = data.categories.find((c) => c.id === budget.category_id)?.is_archived}
+	{@const isReadOnly = data.categories.find((c) => c.id === budget.category_id).is_archived}
 	<article>
 		<header class="row jc-space-between">
 			<b>{budget.description}</b>
@@ -58,15 +59,14 @@
 				<p class="t-right" style="margin-left: auto; padding-right:5%">
 					{formatMoney(budget.amount)}
 				</p>
-				<a
+				<button
 					class="secondary outline btn-sm"
-					href="{routes.budgetDetails}/{budget.id}"
-					role="button"
+					on:click={() => goto(`${routes.budgetDetails}/${budget.id}`)}
 					disabled={isReadOnly}
 					data-tooltip="Editar"
 				>
 					<CssIcon name="pen" />
-				</a>
+				</button>
 			</div>
 		</div>
 	</article>