fixes

apps/api/src/routes/api/v1/services/handlers.ts

@@ -189,7 +189,7 @@ export async function parseAndFindServiceTemplates(service: any, workdir?: strin
                             const variable = foundTemplate.variables.find(v => v.id === proxyValue.domain)
                             if (variable) {
                                 const { id, name, label, description, defaultValue, required = false } = variable
-                                const found = await prisma.serviceSetting.findFirst({ where: { variableName: proxyValue.domain } })
+                                const found = await prisma.serviceSetting.findFirst({ where: { serviceId: service.id , variableName: proxyValue.domain } })
                                 parsedTemplate[realKey].fqdns.push(
                                     { id, name, value: found?.value || '', label, description, defaultValue, required }
                                 )

apps/ui/src/lib/components/svg/services/ServiceIcons.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	export let type: string;
-	export let isAbsolute = true;
+	export let isAbsolute = false;
 
 	let extension = 'png';
 	let svgs = [
@@ -35,7 +35,7 @@
 			case 'weblate':
 				return 'w-12 h-12 -mt-3';
 			default:
-				return isAbsolute ? 'w-10 h-10' : 'w-8 h-8 mx-auto';
+				return isAbsolute ? 'w-10 h-10 absolute -m-4 -mt-9 left-0' : 'w-10 h-10';
 		}
 	}
 </script>

apps/ui/src/routes/index.svelte

@@ -41,6 +41,7 @@
 	import ServiceIcons from '$lib/components/svg/services/ServiceIcons.svelte';
 	import { dev } from '$app/env';
 	import NewResource from './_NewResource.svelte';
+	import { onMount } from 'svelte';
 
 	let numberOfGetStatus = 0;
 	let status: any = {};
@@ -54,8 +55,13 @@
 		services: false,
 		databases: false
 	};
+	let searchInput: HTMLInputElement;
 	doSearch();
-
+	onMount(() => {
+		setTimeout(() => {
+			searchInput.focus();
+		}, 100);
+	});
 	async function refreshStatusApplications() {
 		noInitialStatus.applications = false;
 		numberOfGetStatus = 0;
@@ -563,6 +569,7 @@
 				</div>
 
 				<input
+					bind:this={searchInput}
 					id="search"
 					type="text"
 					placeholder="Search: You can search for names, domains, types, database types, version, servers etc..."

apps/ui/src/routes/services/[id]/configuration/type.svelte

@@ -30,15 +30,22 @@
 	let search = '';
 	let filteredServices = services;
 
-	import { page } from '$app/stores';
 	import { goto } from '$app/navigation';
+	import { page } from '$app/stores';
 	import { get, post } from '$lib/api';
 	import { errorNotification } from '$lib/common';
 	import ServiceIcons from '$lib/components/svg/services/ServiceIcons.svelte';
+	import { onMount } from 'svelte';
 
 	const { id } = $page.params;
 	const from = $page.url.searchParams.get('from');
+	let searchInput: HTMLInputElement;
 
+	onMount(() => {
+		setTimeout(() => {
+			searchInput.focus();
+		}, 100);
+	});
 	async function handleSubmit(service: any) {
 		try {
 			await post(`/services/${id}/configuration/type`, { type: service.type });
@@ -51,8 +58,10 @@
 		filteredServices = services.filter(
 			(service: any) =>
 				service.name.toLowerCase().includes(search.toLowerCase()) ||
-				service.labels?.some((label: string) => label.toLowerCase().includes(search.toLowerCase())) ||
-				service.description.toLowerCase().includes(search.toLowerCase()) 
+				service.labels?.some((label: string) =>
+					label.toLowerCase().includes(search.toLowerCase())
+				) ||
+				service.description.toLowerCase().includes(search.toLowerCase())
 		);
 	}
 	function cleanupSearch() {
@@ -95,8 +104,9 @@
 			</svg>
 		</div>
 		<input
+			bind:this={searchInput}
 			id="search"
-			class="input w-full"
+			class="input w-full input-primary"
 			type="text"
 			placeholder="Search for services"
 			bind:value={search}
@@ -110,7 +120,7 @@
 			{#key service.name}
 				<button
 					on:click={() => handleSubmit(service)}
-					class="box-selection relative text-xl font-bold hover:bg-primary	"
+					class="box-selection relative text-xl font-bold hover:bg-primary"
 				>
 					<div class="flex flex-col">
 						<div class="flex justify-center items-center gap-2 pb-4">