Fix buttons (#42)

src/lib/components/Icons/IconShare.svelte

@@ -1,12 +0,0 @@
-<script lang="ts">
-	export let classNames = "";
-</script>
-
-<svg class={classNames} width="1em" height="1em" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
-	<path
-		fill-rule="evenodd"
-		clip-rule="evenodd"
-		d="M5.41 9.41L4 8L12 0L20 8L18.59 9.41L13 3.83L13 17.5H11L11 3.83L5.41 9.41ZM22 17.5V23H2V17.5H0V23C0 23.5304 0.210714 24.0391 0.585786 24.4142C0.960859 24.7893 1.46957 25 2 25H22C22.5304 25 23.0391 24.7893 23.4142 24.4142C23.7893 24.0391 24 23.5304 24 23V17.5H22Z"
-		fill="currentColor"
-	/>
-</svg>

src/lib/components/InferencePlayground/InferencePlayground.svelte

@@ -15,18 +15,17 @@
 	import HFTokenModal from "./InferencePlaygroundHFTokenModal.svelte";
 	import ModelSelector from "./InferencePlaygroundModelSelector.svelte";
 	import Conversation from "./InferencePlaygroundConversation.svelte";
-	import IconShare from "../Icons/IconShare.svelte";
 	import IconDelete from "../Icons/IconDelete.svelte";
 	import IconCode from "../Icons/IconCode.svelte";
 
 	export let models: ModelEntryWithTokenizer[];
 
-	const startMessages: ChatCompletionInputMessage[] = [{ role: "user", content: "" }];
+	const startMessage: ChatCompletionInputMessage = { role: "user", content: "" };
 
 	let conversation: Conversation = {
 		model: models[0],
 		config: defaultGenerationConfig,
-		messages: startMessages,
+		messages: [{ ...startMessage }],
 		streaming: true,
 	};
 
@@ -58,7 +57,7 @@
 
 	function reset() {
 		systemMessage.content = "";
-		conversation.messages = [...startMessages];
+		conversation.messages = [{ ...startMessage }];
 	}
 
 	function abort() {
@@ -126,7 +125,7 @@
 	}
 
 	function onKeydown(event: KeyboardEvent) {
-		if (!event.shiftKey && event.key === "Enter") {
+		if ((event.ctrlKey || event.metaKey) && event.key === "Enter") {
 			submit();
 		}
 	}
@@ -184,17 +183,6 @@
 		<div
 			class="fixed inset-x-0 bottom-0 flex h-20 items-center gap-2 overflow-hidden whitespace-nowrap px-3 md:absolute"
 		>
-			<button
-				type="button"
-				class="flex h-[39px] flex-none gap-2 rounded-lg border border-gray-200 bg-white px-3 py-2.5 text-sm font-medium text-gray-900 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white dark:focus:ring-gray-700"
-			>
-				<div class="flex size-5 items-center justify-center rounded border border-black/5 bg-black/5 text-xs">
-					<IconShare />
-				</div>
-
-				Share</button
-			>
-
 			<button
 				type="button"
 				on:click={reset}
@@ -241,7 +229,7 @@
 					</div>
 				{:else}
 					Run <span class="inline-flex gap-0.5 rounded border border-white/20 bg-white/10 px-0.5 text-xs text-white/70"
-						>↵</span
+						>⌘<span class="translate-y-px">↵</span></span
 					>
 				{/if}
 			</button>