feat(interface): configurable Enter behavior in chat composer

interface/src/components/CortexChatPanel.tsx

@@ -1,5 +1,6 @@
 import {useCallback, useEffect, useRef, useState} from "react";
 import {useCortexChat, type ToolActivity} from "@/hooks/useCortexChat";
+import {useChatInputPrefs} from "@/hooks/useChatInputPrefs";
 import {Markdown} from "@/components/Markdown";
 import {ToolCall, type ToolCallPair} from "@/components/ToolCall";
 import {
@@ -184,6 +185,7 @@ function CortexChatInput({
 	isStreaming: boolean;
 }) {
 	const textareaRef = useRef<HTMLTextAreaElement>(null);
+	const {prefs} = useChatInputPrefs();
 
 	useEffect(() => {
 		textareaRef.current?.focus();
@@ -206,8 +208,17 @@ function CortexChatInput({
 		return () => textarea.removeEventListener("input", adjustHeight);
 	}, [value]);
 
+	const canSend = !isStreaming && value.trim().length > 0;
 	const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {
-		if (event.key === "Enter" && !event.shiftKey) {
+		if (event.key !== "Enter" || event.nativeEvent.isComposing) return;
+		const hasSubmitModifier =
+			event.metaKey || event.ctrlKey || event.altKey;
+		if (prefs.enterToSubmit) {
+			if (event.shiftKey) return;
+			event.preventDefault();
+			if (canSend) onSubmit();
+		} else if (hasSubmitModifier) {
+			if (!canSend) return;
 			event.preventDefault();
 			onSubmit();
 		}
@@ -222,7 +233,11 @@ function CortexChatInput({
 					onChange={(event) => onChange(event.target.value)}
 					onKeyDown={handleKeyDown}
 					placeholder={
-						isStreaming ? "Waiting for response..." : "Message the cortex..."
+						isStreaming
+							? "Waiting for response..."
+							: prefs.enterToSubmit
+								? "Message the cortex..."
+								: "Message the cortex... (⌘/Ctrl+Enter to send)"
 					}
 					disabled={isStreaming}
 					rows={1}

interface/src/components/portal/PortalComposer.tsx

@@ -2,6 +2,7 @@ import { useRef, useState } from "react";
 import { ChatComposer, type ModelOption } from "@spacedrive/ai";
 import { usePopover } from "@spacedrive/primitives";
 import { Paperclip, X } from "@phosphor-icons/react";
+import { useChatInputPrefs } from "@/hooks/useChatInputPrefs";
 
 interface PortalComposerProps {
 	agentName: string;
@@ -44,6 +45,7 @@ export function PortalComposer({
 	const fileInputRef = useRef<HTMLInputElement>(null);
 	const [isDragging, setIsDragging] = useState(false);
 	const dragCounter = useRef(0);
+	const {prefs} = useChatInputPrefs();
 
 	const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
 		const files = Array.from(e.target.files ?? []);
@@ -133,8 +135,15 @@ export function PortalComposer({
 				draft={draft}
 				onDraftChange={onDraftChange}
 				onSend={onSend}
-				placeholder={disabled ? "Waiting for response..." : `Message ${agentName}...`}
+				placeholder={
+					disabled
+						? "Waiting for response..."
+						: prefs.enterToSubmit
+							? `Message ${agentName}...`
+							: `Message ${agentName}... (⌘/Ctrl+Enter to send)`
+				}
 				isSending={disabled}
+				enterToSubmit={prefs.enterToSubmit}
 				toolbarExtra={paperclipButton}
 				projectSelector={
 					projectOptions.length > 0

interface/src/components/settings/CompositionSection.tsx

@@ -0,0 +1,62 @@
+import {useChatInputPrefs} from "@/hooks/useChatInputPrefs";
+
+export function CompositionSection() {
+	const {prefs, setEnterToSubmit} = useChatInputPrefs();
+
+	const options: {
+		value: boolean;
+		title: string;
+		description: string;
+	}[] = [
+		{
+			value: true,
+			title: "Enter to send",
+			description: "Enter sends the message. Shift+Enter inserts a new line.",
+		},
+		{
+			value: false,
+			title: "Enter for new line",
+			description:
+				"Enter inserts a new line. ⌘/Ctrl+Enter (or Option+Enter) sends.",
+		},
+	];
+
+	return (
+		<div className="mx-auto max-w-2xl px-6 py-6">
+			<div className="mb-6">
+				<h2 className="font-plex text-sm font-semibold text-ink">
+					Message input
+				</h2>
+				<p className="mt-1 text-sm text-ink-dull">
+					Choose how the Enter key behaves in the chat composer.
+				</p>
+			</div>
+			<div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
+				{options.map((opt) => {
+					const active = prefs.enterToSubmit === opt.value;
+					return (
+						<button
+							key={String(opt.value)}
+							type="button"
+							aria-pressed={active}
+							onClick={() => setEnterToSubmit(opt.value)}
+							className={`flex flex-col items-start rounded-lg border p-4 text-left transition-colors ${
+								active
+									? "border-accent bg-accent/10"
+									: "border-app-line bg-app-box hover:border-app-line/80 hover:bg-app-hover"
+							}`}
+						>
+							<div className="flex w-full items-center justify-between">
+								<span className="text-sm font-medium text-ink">
+									{opt.title}
+								</span>
+								{active && <span className="h-2 w-2 rounded-full bg-accent" />}
+							</div>
+							<p className="mt-1 text-sm text-ink-dull">{opt.description}</p>
+						</button>
+					);
+				})}
+			</div>
+		</div>
+	);
+}

interface/src/components/settings/constants.ts

@@ -61,6 +61,12 @@ export const SECTIONS = [
 		group: "general" as const,
 		description: "Theme and display settings",
 	},
+	{
+		id: "composition" as const,
+		label: "Composition",
+		group: "general" as const,
+		description: "Chat composer and message input behavior",
+	},
 	{
 		id: "config-file" as const,
 		label: "Config File",

interface/src/components/settings/index.ts

@@ -1,5 +1,6 @@
 export {InstanceSection} from "./InstanceSection";
 export {AppearanceSection} from "./AppearanceSection";
+export {CompositionSection} from "./CompositionSection";
 export {ChannelsSection} from "./ChannelsSection";
 export {SecretsSection} from "./SecretsSection";
 export {ApiKeysSection} from "./ApiKeysSection";

interface/src/components/settings/types.ts

@@ -3,6 +3,7 @@ import type {GlobalSettingsResponse} from "@/api/client";
 export type SectionId =
 	| "instance"
 	| "appearance"
+	| "composition"
 	| "providers"
 	| "channels"
 	| "api-keys"

interface/src/hooks/useChatInputPrefs.ts

@@ -0,0 +1,47 @@
+import {useCallback, useEffect, useState} from "react";
+
+export interface ChatInputPrefs {
+	enterToSubmit: boolean;
+}
+
+const STORAGE_KEY = "spacebot-chat-input-prefs";
+const DEFAULTS: ChatInputPrefs = {enterToSubmit: true};
+
+function readStored(): ChatInputPrefs {
+	if (typeof window === "undefined") return DEFAULTS;
+	try {
+		const raw = localStorage.getItem(STORAGE_KEY);
+		if (!raw) return DEFAULTS;
+		const parsed = JSON.parse(raw);
+		return {
+			enterToSubmit:
+				typeof parsed?.enterToSubmit === "boolean"
+					? parsed.enterToSubmit
+					: DEFAULTS.enterToSubmit,
+		};
+	} catch {
+		return DEFAULTS;
+	}
+}
+
+export function useChatInputPrefs() {
+	const [prefs, setPrefs] = useState<ChatInputPrefs>(readStored);
+
+	useEffect(() => {
+		const onStorage = (e: StorageEvent) => {
+			if (e.key === STORAGE_KEY) setPrefs(readStored());
+		};
+		window.addEventListener("storage", onStorage);
+		return () => window.removeEventListener("storage", onStorage);
+	}, []);
+
+	const setEnterToSubmit = useCallback((value: boolean) => {
+		setPrefs((prev) => {
+			const next = {...prev, enterToSubmit: value};
+			localStorage.setItem(STORAGE_KEY, JSON.stringify(next));
+			return next;
+		});
+	}, []);
+
+	return {prefs, setEnterToSubmit};
+}

interface/src/routes/Settings.tsx

@@ -17,6 +17,7 @@ import {ModelSelect} from "@/components/ModelSelect";
 import {
 	InstanceSection,
 	AppearanceSection,
+	CompositionSection,
 	ChannelsSection,
 	SecretsSection,
 	ApiKeysSection,
@@ -556,6 +557,8 @@ export function Settings() {
 						/>
 					) : activeSection === "appearance" ? (
 						<AppearanceSection />
+					) : activeSection === "composition" ? (
+						<CompositionSection />
 					) : activeSection === "providers" ? (
 						<div className="mx-auto max-w-2xl px-6 py-6">
 							{/* Section header */}