Remove reasoning

.env

@@ -36,8 +36,6 @@ AUTOMATIC_LOGIN=
 ### Local Storage ###
 MONGO_STORAGE_PATH= # where is the db folder stored
 
-REASONING_SUMMARY=false # Change this to false to disable reasoning summary
-
 ## Models overrides
 MODELS=
 

scripts/populate.ts

@@ -22,8 +22,6 @@ import { generateSearchTokens } from "../src/lib/utils/searchTokens.ts";
 import { ReviewStatus } from "../src/lib/types/Review.ts";
 import fs from "fs";
 import path from "path";
-import { MessageUpdateType } from "../src/lib/types/MessageUpdate.ts";
-import { MessageReasoningUpdateType } from "../src/lib/types/MessageUpdate.ts";
 
 const rl = readline.createInterface({
 	input: process.stdin,
@@ -62,7 +60,6 @@ async function generateMessages(preprompt?: string): Promise<Message[]> {
 		const convLength = faker.number.int({ min: 1, max: 25 }) * 2; // must always be even
 
 		for (let i = 0; i < convLength; i++) {
-			const hasReasoning = Math.random() < 0.2;
 			lastId = addChildren(
 				{
 					messages,
@@ -80,17 +77,6 @@ async function generateMessages(preprompt?: string): Promise<Message[]> {
 							: ""),
 					createdAt: faker.date.recent({ days: 30 }),
 					updatedAt: faker.date.recent({ days: 30 }),
-					reasoning: hasReasoning ? faker.lorem.paragraphs(2) : undefined,
-					updates: hasReasoning
-						? [
-								{
-									type: MessageUpdateType.Reasoning,
-									subtype: MessageReasoningUpdateType.Status,
-									uuid: crypto.randomUUID(),
-									status: "thinking",
-								},
-							]
-						: [],
 					interrupted: !isUser && i === convLength - 1 && isInterrupted,
 				},
 				lastId
@@ -101,7 +87,6 @@ async function generateMessages(preprompt?: string): Promise<Message[]> {
 		const convLength = faker.number.int({ min: 2, max: 200 });
 
 		for (let i = 0; i < convLength; i++) {
-			const hasReasoning = Math.random() < 0.2;
 			addChildren(
 				{
 					messages,
@@ -117,17 +102,6 @@ async function generateMessages(preprompt?: string): Promise<Message[]> {
 						(!isUser && Math.random() < 0.1
 							? "\n```\n" + faker.helpers.arrayElement(samples) + "\n```\n"
 							: ""),
-					reasoning: hasReasoning ? faker.lorem.paragraphs(2) : undefined,
-					updates: hasReasoning
-						? [
-								{
-									type: MessageUpdateType.Reasoning,
-									subtype: MessageReasoningUpdateType.Status,
-									uuid: crypto.randomUUID(),
-									status: "thinking",
-								},
-							]
-						: [],
 					createdAt: faker.date.recent({ days: 30 }),
 					updatedAt: faker.date.recent({ days: 30 }),
 					interrupted: !isUser && i === convLength - 1 && isInterrupted,

src/lib/components/NavMenu.svelte

@@ -192,7 +192,7 @@
 
 	<span class="flex gap-1">
 		<a
-			href="{base}/settings"
+			href="{base}/settings/application"
 			class="flex h-9 flex-none flex-grow items-center gap-1.5 rounded-lg pl-2.5 pr-2 text-gray-500 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-700"
 		>
 			Settings

src/lib/components/chat/ChatMessage.svelte

@@ -12,11 +12,7 @@
 	import CarbonPen from "~icons/carbon/pen";
 	import UploadedFile from "./UploadedFile.svelte";
 
-	import {
-		MessageUpdateType,
-		type MessageReasoningUpdate,
-		MessageReasoningUpdateType,
-	} from "$lib/types/MessageUpdate";
+	import { MessageUpdateType } from "$lib/types/MessageUpdate";
 	import MarkdownRenderer from "./MarkdownRenderer.svelte";
 	import OpenReasoningResults from "./OpenReasoningResults.svelte";
 	import Alternatives from "./Alternatives.svelte";
@@ -71,29 +67,9 @@
 	let editContentEl: HTMLTextAreaElement | undefined = $state();
 	let editFormEl: HTMLFormElement | undefined = $state();
 
-	let reasoningUpdates = $derived(
-		(message.updates?.filter(({ type }) => type === MessageUpdateType.Reasoning) ??
-			[]) as MessageReasoningUpdate[]
-	);
-
-	// const messageFinalAnswer = $derived(
-	// 	message.updates?.find(
-	// 		({ type }) => type === MessageUpdateType.FinalAnswer
-	// 	) as MessageFinalAnswerUpdate
-	// );
-	// const urlNotTrailing = $derived(page.url.pathname.replace(/\/$/, ""));
-	// let downloadLink = $derived(urlNotTrailing + `/message/${message.id}/prompt`);
-
 	// Zero-config reasoning autodetection: detect <think> blocks in content
 	const THINK_BLOCK_REGEX = /(<think>[\s\S]*?(?:<\/think>|$))/g;
-	let thinkSegments = $derived.by(() => message.content.split(THINK_BLOCK_REGEX));
-	let hasServerReasoning = $derived(
-		reasoningUpdates &&
-			reasoningUpdates.length > 0 &&
-			!!message.reasoning &&
-			message.reasoning.trim().length > 0
-	);
-	let hasClientThink = $derived(!hasServerReasoning && thinkSegments.length > 1);
+	let hasClientThink = $derived(message.content.split(THINK_BLOCK_REGEX).length > 1);
 
 	$effect(() => {
 		if (isCopied) {
@@ -143,18 +119,6 @@
 				</div>
 			{/if}
 
-			{#if hasServerReasoning}
-				{@const summaries = reasoningUpdates
-					.filter((u) => u.subtype === MessageReasoningUpdateType.Status)
-					.map((u) => u.status)}
-
-				<OpenReasoningResults
-					summary={summaries[summaries.length - 1] || ""}
-					content={message.reasoning || ""}
-					loading={loading && message.content.length === 0}
-				/>
-			{/if}
-
 			<div bind:this={contentEl}>
 				{#if isLast && loading && message.content.length === 0}
 					<IconLoading classNames="loading inline ml-2 first:ml-0" />

src/lib/constants/routerExamples.ts

@@ -55,8 +55,7 @@ export const routerExamples: RouterExample[] = [
 		followUps: [
 			{
 				title: "Dark mode",
-				prompt:
-					"Extend the Tailwind CSS landing page with a toggleable dark mode that remembers the user's choice.",
+				prompt: "Add dark mode and make it the default",
 			},
 			{
 				title: "Add blog teasers",

src/lib/server/api/routes/groups/models.ts

@@ -13,7 +13,6 @@ export type GETModelsResponse = Array<{
 	datasetUrl?: string;
 	displayName: string;
 	description?: string;
-	reasoning: boolean;
 	logoUrl?: string;
 	providers?: Array<{ provider: string } & Record<string, unknown>>;
 	promptExamples?: { title: string; prompt: string }[];
@@ -50,7 +49,6 @@ export const modelGroup = new Elysia().group("/models", (app) =>
 						datasetUrl: model.datasetUrl,
 						displayName: model.displayName,
 						description: model.description,
-						reasoning: !!model.reasoning,
 						logoUrl: model.logoUrl,
 						providers: model.providers as unknown as Array<
 							{ provider: string } & Record<string, unknown>

src/lib/server/models.ts

@@ -15,21 +15,6 @@ const sanitizeJSONEnv = (val: string, fallback: string) => {
 	return unquoted || fallback;
 };
 
-const reasoningSchema = z.union([
-	z.object({
-		type: z.literal("regex"), // everything is reasoning, extract the answer from the regex
-		regex: z.string(),
-	}),
-	z.object({
-		type: z.literal("tokens"), // use beginning and end tokens that define the reasoning portion of the answer
-		beginToken: z.string(), // empty string means the model starts in reasoning mode
-		endToken: z.string(),
-	}),
-	z.object({
-		type: z.literal("summarize"), // everything is reasoning, summarize the answer
-	}),
-]);
-
 const modelConfig = z.object({
 	/** Used as an identifier in DB */
 	id: z.string().optional(),
@@ -75,7 +60,6 @@ const modelConfig = z.object({
 	embeddingModel: z.never().optional(),
 	/** Used to enable/disable system prompt usage */
 	systemRoleSupported: z.boolean().default(true),
-	reasoning: reasoningSchema.optional(),
 });
 
 type ModelConfig = z.infer<typeof modelConfig>;

src/lib/server/router/endpoint.ts

@@ -86,12 +86,10 @@ function stripReasoningBlocks(text: string): string {
 }
 
 function stripReasoningFromMessage(message: EndpointMessage): EndpointMessage {
-	const { reasoning: _reasoning, ...rest } = message;
-	void _reasoning;
 	const content =
 		typeof message.content === "string" ? stripReasoningBlocks(message.content) : message.content;
 	return {
-		...rest,
+		...message,
 		content,
 	};
 }

src/lib/server/textGeneration/generate.ts

@@ -1,14 +1,10 @@
-import { config } from "$lib/server/config";
 import {
-	MessageReasoningUpdateType,
 	MessageUpdateType,
 	type MessageUpdate,
 } from "$lib/types/MessageUpdate";
 import { AbortedGenerations } from "../abortedGenerations";
 import type { TextGenerationContext } from "./types";
 import type { EndpointMessage } from "../endpoints/endpoints";
-import { generateFromDefaultEndpoint } from "../generateFromDefaultEndpoint";
-import { generateSummaryOfReasoning } from "./reasoning";
 import { logger } from "../logger";
 
 type GenerateContext = Omit<TextGenerationContext, "messages"> & { messages: EndpointMessage[] };
@@ -27,29 +23,6 @@ export async function* generate(
 	}: GenerateContext,
 	preprompt?: string
 ): AsyncIterable<MessageUpdate> {
-	// reasoning mode is false by default
-	let reasoning = false;
-	let reasoningBuffer = "";
-	let lastReasoningUpdate = new Date();
-	let status = "";
-	const startTime = new Date();
-	if (
-		model.reasoning &&
-		// if the beginToken is an empty string, the model starts in reasoning mode
-		(model.reasoning.type === "regex" ||
-			model.reasoning.type === "summarize" ||
-			(model.reasoning.type === "tokens" && model.reasoning.beginToken === ""))
-	) {
-		// if the model has reasoning in regex or summarize mode, it starts in reasoning mode
-		// and we extract the answer from the reasoning
-		reasoning = true;
-		yield {
-			type: MessageUpdateType.Reasoning,
-			subtype: MessageReasoningUpdateType.Status,
-			status: "Started reasoning...",
-		};
-	}
-
 	const stream = await endpoint({
 		messages,
 		preprompt,
@@ -89,161 +62,19 @@ export async function* generate(
 				text = text.slice(0, text.length - stopToken.length);
 			}
 
-			let finalAnswer = text;
-			if (model.reasoning && model.reasoning.type === "regex") {
-				const regex = new RegExp(model.reasoning.regex);
-				finalAnswer = regex.exec(reasoningBuffer)?.[1] ?? text;
-			} else if (model.reasoning && model.reasoning.type === "summarize") {
-				yield {
-					type: MessageUpdateType.Reasoning,
-					subtype: MessageReasoningUpdateType.Status,
-					status: "Summarizing reasoning...",
-				};
-				try {
-					const summary = yield* generateFromDefaultEndpoint({
-						messages: [
-							{
-								from: "user",
-								content: `Question: ${
-									messages[messages.length - 1].content
-								}\n\nReasoning: ${reasoningBuffer}`,
-							},
-						],
-						preprompt: `Your task is to summarize concisely all your reasoning steps and then give the final answer. Keep it short, one short paragraph at most. If the reasoning steps explicitly include a code solution, make sure to include it in your answer.
-
-If the user is just having a casual conversation that doesn't require explanations, answer directly without explaining your steps, otherwise make sure to summarize step by step, make sure to skip dead-ends in your reasoning and removing excess detail.
-
-Do not use prefixes such as Response: or Answer: when answering to the user.`,
-						generateSettings: {
-							max_tokens: 1024,
-						},
-						modelId: model.id,
-						locals,
-					});
-					finalAnswer = summary;
-					yield {
-						type: MessageUpdateType.Reasoning,
-						subtype: MessageReasoningUpdateType.Status,
-						status: `Done in ${Math.round((new Date().getTime() - startTime.getTime()) / 1000)}s.`,
-					};
-				} catch (e) {
-					finalAnswer = text;
-					logger.error(e);
-				}
-			} else if (model.reasoning && model.reasoning.type === "tokens") {
-				// make sure to remove the content of the reasoning buffer from
-				// the final answer to avoid duplication
-
-				// if the beginToken is an empty string, we don't need to remove anything
-				const beginIndex = model.reasoning.beginToken
-					? reasoningBuffer.indexOf(model.reasoning.beginToken)
-					: 0;
-				const endIndex = reasoningBuffer.lastIndexOf(model.reasoning.endToken);
-
-				if (beginIndex !== -1 && endIndex !== -1) {
-					// Remove the reasoning section (including tokens) from final answer
-					finalAnswer =
-						text.slice(0, beginIndex) + text.slice(endIndex + model.reasoning.endToken.length);
-				}
-			}
-
 			yield {
 				type: MessageUpdateType.FinalAnswer,
-				text: finalAnswer,
+				text: text,
 				interrupted,
 			};
 			continue;
 		}
 
-		if (model.reasoning && model.reasoning.type === "tokens") {
-			if (output.token.text === model.reasoning.beginToken) {
-				reasoning = true;
-				reasoningBuffer += output.token.text;
-				continue;
-			} else if (output.token.text === model.reasoning.endToken) {
-				reasoning = false;
-				reasoningBuffer += output.token.text;
-				yield {
-					type: MessageUpdateType.Reasoning,
-					subtype: MessageReasoningUpdateType.Status,
-					status: `Done in ${Math.round((new Date().getTime() - startTime.getTime()) / 1000)}s.`,
-				};
-				continue;
-			}
-		}
 		// ignore special tokens
 		if (output.token.special) continue;
 
-		// pass down normal token
-		if (reasoning) {
-			reasoningBuffer += output.token.text;
-
-			if (model.reasoning && model.reasoning.type === "tokens") {
-				// split reasoning buffer so that anything that comes after the end token is separated
-				// add it to the normal buffer, and yield two updates, one for the reasoning and one for the normal content
-				// also set reasoning to false
-
-				if (reasoningBuffer.lastIndexOf(model.reasoning.endToken) !== -1) {
-					const endTokenIndex = reasoningBuffer.lastIndexOf(model.reasoning.endToken);
-					const textBuffer = reasoningBuffer.slice(endTokenIndex + model.reasoning.endToken.length);
-					reasoningBuffer = reasoningBuffer.slice(
-						0,
-						endTokenIndex + model.reasoning.endToken.length + 1
-					);
-
-					yield {
-						type: MessageUpdateType.Reasoning,
-						subtype: MessageReasoningUpdateType.Stream,
-						token: output.token.text,
-					};
-
-					yield {
-						type: MessageUpdateType.Stream,
-						token: textBuffer,
-					};
-
-					yield {
-						type: MessageUpdateType.Reasoning,
-						subtype: MessageReasoningUpdateType.Status,
-						status: `Done in ${Math.round((new Date().getTime() - startTime.getTime()) / 1000)}s.`,
-					};
-
-					reasoning = false;
-					continue;
-				}
-			}
-			// yield status update if it has changed
-			if (status !== "") {
-				yield {
-					type: MessageUpdateType.Reasoning,
-					subtype: MessageReasoningUpdateType.Status,
-					status,
-				};
-				status = "";
-			}
-
-			// create a new status every 5 seconds
-			if (
-				config.REASONING_SUMMARY === "true" &&
-				new Date().getTime() - lastReasoningUpdate.getTime() > 4000
-			) {
-				lastReasoningUpdate = new Date();
-				try {
-					generateSummaryOfReasoning(reasoningBuffer, model.id, locals).then((summary) => {
-						status = summary;
-					});
-				} catch (e) {
-					logger.error(e);
-				}
-			}
-			yield {
-				type: MessageUpdateType.Reasoning,
-				subtype: MessageReasoningUpdateType.Stream,
-				token: output.token.text,
-			};
-		} else {
-			yield { type: MessageUpdateType.Stream, token: output.token.text };
-		}
+		// yield normal token
+		yield { type: MessageUpdateType.Stream, token: output.token.text };
 
 		// abort check
 		const date = AbortedGenerations.getInstance().getAbortTime(conv._id.toString());

src/lib/server/textGeneration/reasoning.ts

@@ -1,40 +0,0 @@
-import { generateFromDefaultEndpoint } from "../generateFromDefaultEndpoint";
-import { getReturnFromGenerator } from "$lib/utils/getReturnFromGenerator";
-
-export async function generateSummaryOfReasoning(
-	buffer: string,
-	modelId: string | undefined,
-	locals: App.Locals | undefined
-): Promise<string> {
-	let summary: string | undefined;
-
-	// Tools removed: no tool-based summarization path
-
-	if (!summary) {
-		summary = await getReturnFromGenerator(
-			generateFromDefaultEndpoint({
-				messages: [
-					{
-						from: "user",
-						content: buffer.slice(-300),
-					},
-				],
-				preprompt: `You are tasked with summarizing the latest reasoning steps. Never describe results of the reasoning, only the process. Remain vague in your summary.
-            The text might be incomplete, try your best to summarize it in one very short sentence, starting with a gerund and ending with three points. 
-            Example: "Thinking about life...", "Summarizing the results...", "Processing the input..."`,
-				generateSettings: {
-					max_tokens: 50,
-				},
-				modelId,
-				locals,
-			})
-		);
-	}
-
-	if (!summary) {
-		return "Reasoning...";
-	}
-
-	const parts = summary.split("...");
-	return parts[0].slice(0, 100) + "...";
-}

src/lib/types/Message.ts

@@ -8,7 +8,6 @@ export type Message = Partial<Timestamps> & {
 	content: string;
 	updates?: MessageUpdate[];
 
-	reasoning?: string;
 	score?: -1 | 0 | 1;
 	/**
 	 * Either contains the base64 encoded image data

src/routes/api/conversation/[id]/+server.ts

@@ -28,7 +28,6 @@ export async function GET({ locals, params }) {
 					// websearch removed
 					files: message.files,
 					updates: message.updates,
-					reasoning: message.reasoning,
 				})),
 			};
 			return Response.json(res);

src/routes/conversation/[id]/+page.svelte

@@ -9,11 +9,7 @@
 	import { ERROR_MESSAGES, error } from "$lib/stores/errors";
 	import { findCurrentModel } from "$lib/utils/models";
 	import type { Message } from "$lib/types/Message";
-	import {
-		MessageReasoningUpdateType,
-		MessageUpdateStatus,
-		MessageUpdateType,
-	} from "$lib/types/MessageUpdate";
+	import { MessageUpdateStatus, MessageUpdateType } from "$lib/types/MessageUpdate";
 	import titleUpdate from "$lib/stores/titleUpdate";
 	import file2base64 from "$lib/utils/file2base64";
 	import { addChildren } from "$lib/utils/tree/addChildren";
@@ -263,9 +259,6 @@
 			// Initialize lastUpdateTime outside the loop to persist between updates
 			let lastUpdateTime = new Date();
 
-			let reasoningBuffer = "";
-			let reasoningLastUpdate = new Date();
-
 			for await (const update of messageUpdatesIterator) {
 				if ($isAborted) {
 					messageUpdatesAbortController.abort();
@@ -279,8 +272,6 @@
 				}
 
 				const isHighFrequencyUpdate =
-					(update.type === MessageUpdateType.Reasoning &&
-						update.subtype === MessageReasoningUpdateType.Stream) ||
 					update.type === MessageUpdateType.Stream ||
 					(update.type === MessageUpdateType.Status &&
 						update.status === MessageUpdateStatus.KeepAlive);
@@ -324,21 +315,6 @@
 						...(messageToWriteTo.files ?? []),
 						{ type: "hash", value: update.sha, mime: update.mime, name: update.name },
 					];
-				} else if (update.type === MessageUpdateType.Reasoning) {
-					if (!messageToWriteTo.reasoning) {
-						messageToWriteTo.reasoning = "";
-					}
-					if (update.subtype === MessageReasoningUpdateType.Stream) {
-						reasoningBuffer += update.token;
-						if (
-							currentTime.getTime() - reasoningLastUpdate.getTime() >
-							updateDebouncer.maxUpdateTime
-						) {
-							messageToWriteTo.reasoning += reasoningBuffer;
-							reasoningBuffer = "";
-							reasoningLastUpdate = currentTime;
-						}
-					}
 				} else if (update.type === MessageUpdateType.RouterMetadata) {
 					// Update router metadata immediately when received
 					messageToWriteTo.routerMetadata = {

src/routes/conversation/[id]/+server.ts

@@ -8,7 +8,6 @@ import { error } from "@sveltejs/kit";
 import { ObjectId } from "mongodb";
 import { z } from "zod";
 import {
-	MessageReasoningUpdateType,
 	MessageUpdateStatus,
 	MessageUpdateType,
 	type MessageUpdate,
@@ -349,12 +348,6 @@ export async function POST({ request, locals, params, getClientAddress }) {
 						lastTokenTimestamp = new Date();
 					}
 					lastTokenTimestamp = new Date();
-				} else if (
-					event.type === MessageUpdateType.Reasoning &&
-					event.subtype === MessageReasoningUpdateType.Stream
-				) {
-					messageToWriteTo.reasoning ??= "";
-					messageToWriteTo.reasoning += event.token;
 				}
 
 				// Set the title
@@ -399,10 +392,6 @@ export async function POST({ request, locals, params, getClientAddress }) {
 					!(
 						event.type === MessageUpdateType.Status &&
 						event.status === MessageUpdateStatus.KeepAlive
-					) &&
-					!(
-						event.type === MessageUpdateType.Reasoning &&
-						event.subtype === MessageReasoningUpdateType.Stream
 					)
 				) {
 					messageToWriteTo?.updates?.push(event);

src/routes/conversation/[id]/message/[messageId]/prompt/+server.ts

@@ -59,7 +59,6 @@ export async function GET({ params, locals }) {
 			content: msg.content,
 			createdAt: msg.createdAt,
 			updatedAt: msg.updatedAt,
-			reasoning: msg.reasoning,
 			updates: msg.updates?.filter((u) => u.type === "title"),
 			files: msg.files,
 		})),

src/routes/models/+page.svelte

@@ -7,7 +7,9 @@
 
 	import CarbonHelpFilled from "~icons/carbon/help-filled";
 	import CarbonView from "~icons/carbon/view";
+	import CarbonSettings from "~icons/carbon/settings";
 	import { useSettingsStore } from "$lib/stores/settings";
+	import { goto } from "$app/navigation";
 	interface Props {
 		data: PageData;
 	}
@@ -98,27 +100,19 @@
 									<CarbonView class="text-xxs text-blue-700 dark:text-blue-500" />
 								</span>
 							{/if}
-							{#if model.reasoning}
-								<span
-									title="This model supports reasoning."
-									class="ml-auto grid size-[21px] place-items-center rounded-lg border border-purple-300 dark:border-purple-700"
-									aria-label="Model supports reasoning"
-									role="img"
-								>
-									<svg
-										xmlns="http://www.w3.org/2000/svg"
-										width="14"
-										height="14"
-										viewBox="0 0 32 32"
-									>
-										<path
-											class="stroke-purple-700"
-											style="stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 50;"
-											d="M16 6v3.33M16 6c0-2.65 3.25-4.3 5.4-2.62 1.2.95 1.6 2.65.95 4.04a3.63 3.63 0 0 1 4.61.16 3.45 3.45 0 0 1 .46 4.37 5.32 5.32 0 0 1 1.87 4.75c-.22 1.66-1.39 3.6-3.07 4.14M16 6c0-2.65-3.25-4.3-5.4-2.62a3.37 3.37 0 0 0-.95 4.04 3.65 3.65 0 0 0-4.6.16 3.37 3.37 0 0 0-.49 4.27 5.57 5.57 0 0 0-1.85 4.85 5.3 5.3 0 0 0 3.07 4.15M16 9.33v17.34m0-17.34c0 2.18 1.82 4 4 4m6.22 7.5c.67 1.3.56 2.91-.27 4.11a4.05 4.05 0 0 1-4.62 1.5c0 1.53-1.05 2.9-2.66 2.9A2.7 2.7 0 0 1 16 26.66m10.22-5.83a4.05 4.05 0 0 0-3.55-2.17m-16.9 2.18a4.05 4.05 0 0 0 .28 4.1c1 1.44 2.92 2.09 4.59 1.5 0 1.52 1.12 2.88 2.7 2.88A2.7 2.7 0 0 0 16 26.67M5.78 20.85a4.04 4.04 0 0 1 3.55-2.18"
-										/>
-									</svg>
-								</span>
-							{/if}
+							<button
+								type="button"
+								title="Model settings"
+								aria-label="Model settings for {model.displayName}"
+								class="flex size-[21px] items-center justify-center rounded-md border border-gray-300 text-xs text-gray-600 hover:bg-gray-100 dark:border-gray-600 dark:text-gray-300 dark:hover:bg-gray-700"
+								onclick={(e) => {
+									e.preventDefault();
+									e.stopPropagation();
+									goto(`${base}/settings/${model.id}`);
+								}}
+							>
+								<CarbonSettings class="text-xs" />
+							</button>
 							{#if model.id === $settings.activeModel}
 								<span
 									class="rounded-full bg-black px-2 py-0.5 text-xs text-white dark:bg-white dark:text-black"