diff --git a/packages/ui-components/src/__tests__/TanstackAppTable.test.ts b/packages/ui-components/src/__tests__/TanstackAppTable.test.ts
index d55017655..9d918df82 100644
--- a/packages/ui-components/src/__tests__/TanstackAppTable.test.ts
+++ b/packages/ui-components/src/__tests__/TanstackAppTable.test.ts
@@ -149,7 +149,7 @@ test('shows refresh icon', async () => {
 
 	resolve();
 
-	await waitFor(() => expect(screen.getByTestId('refreshButton')).toBeInTheDocument());
+	await waitFor(() => expect(screen.getByTestId('refresh-button')).toBeInTheDocument());
 });
 
 test('refetches data when refresh button is clicked', async () => {
@@ -170,7 +170,7 @@ test('refetches data when refresh button is clicked', async () => {
 		head: 'Test head'
 	});
 
-	const refreshButton = screen.getByTestId('refreshButton');
+	const refreshButton = screen.getByTestId('refresh-button');
 	await userEvent.click(refreshButton);
 
 	expect(mockRefetch).toHaveBeenCalled();
diff --git a/packages/ui-components/src/__tests__/TanstackOrderQuote.test.ts b/packages/ui-components/src/__tests__/TanstackOrderQuote.test.ts
index 0ce408abf..8813b44cd 100644
--- a/packages/ui-components/src/__tests__/TanstackOrderQuote.test.ts
+++ b/packages/ui-components/src/__tests__/TanstackOrderQuote.test.ts
@@ -102,7 +102,7 @@ test('refreshes the quote when the refresh icon is clicked', async () => {
 		}
 	]);
 
-	const refreshButton = screen.getByTestId('refreshButton');
+	const refreshButton = screen.getByTestId('refresh-button');
 	fireEvent.click(refreshButton);
 
 	await waitFor(() => {
diff --git a/packages/ui-components/src/__tests__/VaultDetail.test.ts b/packages/ui-components/src/__tests__/VaultDetail.test.ts
index f1cd524ad..1ac9fdedb 100644
--- a/packages/ui-components/src/__tests__/VaultDetail.test.ts
+++ b/packages/ui-components/src/__tests__/VaultDetail.test.ts
@@ -232,11 +232,10 @@ test('refresh button triggers query invalidation when clicked', async () => {
 		},
 		context: new Map([['$$_queryClient', queryClient]])
 	});
-	let refreshButton: HTMLButtonElement;
-	await waitFor(() => {
-		refreshButton = screen.getByTestId('refresh-button');
-		userEvent.click(refreshButton);
 
+	await waitFor(async () => {
+		const refreshButton = await screen.findAllByTestId('refresh-button');
+		await userEvent.click(refreshButton[0]);
 		expect(invalidateQueries).toHaveBeenCalledWith({
 			queryKey: ['100'],
 			refetchType: 'all',
diff --git a/packages/ui-components/src/lib/components/TanstackAppTable.svelte b/packages/ui-components/src/lib/components/TanstackAppTable.svelte
index d713081db..24206cc6a 100644
--- a/packages/ui-components/src/lib/components/TanstackAppTable.svelte
+++ b/packages/ui-components/src/lib/components/TanstackAppTable.svelte
@@ -18,10 +18,9 @@
 	<slot name="timeFilter" />
 	<slot name="title" />
 	<Refresh
-		data-testid="refreshButton"
 		class="ml-2 h-8 w-5 cursor-pointer text-gray-400 dark:text-gray-400"
 		spin={$query.isLoading || $query.isFetching}
-		on:click={() => {
+		onClick={() => {
 			$query.refetch();
 		}}
 	/>
diff --git a/packages/ui-components/src/lib/components/detail/TanstackOrderQuote.svelte b/packages/ui-components/src/lib/components/detail/TanstackOrderQuote.svelte
index e2db7ef67..e18d13961 100644
--- a/packages/ui-components/src/lib/components/detail/TanstackOrderQuote.svelte
+++ b/packages/ui-components/src/lib/components/detail/TanstackOrderQuote.svelte
@@ -69,9 +69,8 @@
 			{/if}
 			<span></span>
 			<Refresh
-				data-testid="refreshButton"
 				class="h-8 w-5 cursor-pointer text-gray-400 dark:text-gray-400"
-				on:click={refreshQuotes}
+				onClick={refreshQuotes}
 				spin={$orderQuoteQuery.isLoading || $orderQuoteQuery.isFetching}
 			/>
 			<PauseSolid