feat: recipe version selector

- fix recipe not show on overview
- fix recipe show late after select country
- disable queue message on no connection ws
- fix infinite topping(s) list if moving between pages

Signed-off-by: pakintada@gmail.com <Pakin>

src/routes/(authed)/tools/brew/+page.svelte

@@ -28,6 +28,7 @@
 	import { deviceCredentialManager } from '$lib/core/adb/deviceCredManager';
 	import { afterNavigate } from '$app/navigation';
 	import { env } from '$env/dynamic/public';
+	import { fade } from 'svelte/transition';
 
 	const sourceDir = '/sdcard/coffeevending';
 
@@ -41,6 +42,9 @@
 
 	let brew_status: string = $state('');
 
+	// refresh command
+	let refresh_counter: number = $state(0);
+
 	async function startFetchRecipeFromMachine() {
 		let instance = adb.getAdbInstance();
 		// recipeFromMachineLoading.set(true);
@@ -49,7 +53,7 @@
 		if (instance) {
 			console.log('instance passed!');
 			let dev_recipe = await adb.pull(`${sourceDir}/cfg/recipe_branch_dev.json`);
-			console.log('dev recipe ok', dev_recipe != undefined);
+			console.log('dev recipe ok', dev_recipe != undefined, dev_recipe);
 			if (dev_recipe) {
 				if (dev_recipe.length == 0) {
 					// case error, do last retry
@@ -69,7 +73,7 @@
 					// from recipe_branch_dev
 					devRecipe = JSON.parse(dev_recipe);
 					// recipeFromMachineLoading.set(false);
-					addNotification('INFO:Fetch recipe success!');
+					// addNotification('INFO:Fetch recipe success!');
 
 					buildOverviewForBrewing();
 				}
@@ -176,6 +180,7 @@
 	}
 
 	afterNavigate(async () => {
+		console.log('after navigate brew');
 		await startFetchRecipeFromMachine();
 	});
 
@@ -314,14 +319,14 @@
 
 			let currentQuery = get(recipeFromMachineQuery);
 			currentQuery = {
-				recipe: recipe01_query,
-				...currentQuery
+				...currentQuery,
+				recipe: recipe01_query
 			};
 
 			let currentMaterialsQuery = materialFromMachine;
 			currentQuery = {
-				material: currentMaterialsQuery,
-				...currentQuery
+				...currentQuery,
+				material: currentMaterialsQuery
 			};
 
 			recipeFromMachineQuery.set(currentQuery);
@@ -404,15 +409,17 @@
 
 		<!-- search bar -->
 
-		<div class="w-full">
-			{#if $recipeFromMachineLoading}
-				<div class="flex items-center justify-center">
-					<p class="mx-4">Please wait</p>
-					<Spinner />
-				</div>
-			{:else}
-				<DataTable data={data.recipes} refPage="brew" {columns} />
-			{/if}
-		</div>
+		{#key refresh_counter}
+			<div class="w-full">
+				{#if $recipeFromMachineLoading}
+					<div class="flex items-center justify-center">
+						<p class="mx-4">Please wait</p>
+						<Spinner />
+					</div>
+				{:else}
+					<DataTable data={data.recipes} refPage="brew" {columns} />
+				{/if}
+			</div>
+		{/key}
 	</div>
 </div>