some ux fixes

src/lib/components/InferencePlayground/InferencePlayground.svelte

@@ -375,7 +375,8 @@
 							Compare
 						</button>
 						<a
-							href="https://huggingface.co/{$session.conversations[0].model.id}"
+							href="https://huggingface.co/{$session.conversations[0].model.id}?inference_provider={$session
+								.conversations[0].provider}"
 							target="_blank"
 							class="flex items-center gap-0.5 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300"
 						>

src/lib/components/InferencePlayground/InferencePlaygroundCodeSnippets.svelte

@@ -46,6 +46,10 @@
 	function getSnippet({ tokenStr, conversation, lang }: GetSnippetArgs) {
 		return getInferenceSnippet(conversation.model, conversation.provider as InferenceProvider, lang, tokenStr, {
 			messages: conversation.messages,
+			streaming: conversation.streaming,
+			max_tokens: conversation.config.max_tokens,
+			temparature: conversation.config.temperature,
+			top_p: conversation.config.top_p,
 		});
 	}
 

src/lib/components/InferencePlayground/InferencePlaygroundProviderSelect.svelte

@@ -89,14 +89,14 @@
 
 	<div {...$menu} use:menu class="rounded-lg border bg-gray-100/80 dark:border-gray-700 dark:bg-gray-800">
 		{#each conversation.model.inferenceProviderMapping as { provider }}
-			<div {...$option({ value: provider })} use:option class="group p-1 text-sm dark:text-white">
+			<button {...$option({ value: provider })} use:option class="group block w-full p-1 text-sm dark:text-white">
 				<div
 					class="flex items-center gap-2 rounded-md px-2 py-1.5 group-data-[highlighted]:bg-gray-200 dark:group-data-[highlighted]:bg-gray-700"
 				>
 					<IconProvider {provider} />
 					{formatName(provider)}
 				</div>
-			</div>
+			</button>
 		{/each}
 	</div>
 </div>