From 013375f4bc853661031aeab067d6e9e86eb7ed3c Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Mon, 6 Jul 2026 23:29:47 -0500
Subject: [PATCH 1/5] refac

---
 cptr/frontend/src/lib/components/DropdownMenu.svelte         | 2 ++
 cptr/frontend/src/lib/components/common/ModelSelector.svelte | 1 +
 2 files changed, 3 insertions(+)

diff --git a/cptr/frontend/src/lib/components/DropdownMenu.svelte b/cptr/frontend/src/lib/components/DropdownMenu.svelte
index a7e4805..987c8a7 100644
--- a/cptr/frontend/src/lib/components/DropdownMenu.svelte
+++ b/cptr/frontend/src/lib/components/DropdownMenu.svelte
@@ -5,6 +5,7 @@
 
 	interface MenuItem {
 		label: string;
+		title?: string;
 		icon?: string;
 		onclick: () => void;
 		active?: boolean;
@@ -374,6 +375,7 @@
 					>
 						<button
 							class="flex items-center gap-2 min-w-0 flex-1 h-full px-2 text-inherit"
+							title={item.title}
 							onclick={() => {
 								item.onclick();
 								onclose();
diff --git a/cptr/frontend/src/lib/components/common/ModelSelector.svelte b/cptr/frontend/src/lib/components/common/ModelSelector.svelte
index 216ba05..74bed72 100644
--- a/cptr/frontend/src/lib/components/common/ModelSelector.svelte
+++ b/cptr/frontend/src/lib/components/common/ModelSelector.svelte
@@ -28,6 +28,7 @@
 	const menuItems = $derived(
 		filtered.map((m) => ({
 			label: m.name,
+			title: m.name,
 			active: m.id === selectedModel,
 			check: true,
 			onclick: () => {

From d148183d38a6895120ac768b789379bced1d6db8 Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Mon, 6 Jul 2026 23:33:00 -0500
Subject: [PATCH 2/5] refac

---
 .../src/lib/components/DropdownMenu.svelte    |  5 +-
 .../components/common/ModelSelector.svelte    |  2 +-
 cptr/frontend/src/lib/tooltip.ts              | 50 +++++++++++++------
 3 files changed, 38 insertions(+), 19 deletions(-)

diff --git a/cptr/frontend/src/lib/components/DropdownMenu.svelte b/cptr/frontend/src/lib/components/DropdownMenu.svelte
index 987c8a7..7bed1e4 100644
--- a/cptr/frontend/src/lib/components/DropdownMenu.svelte
+++ b/cptr/frontend/src/lib/components/DropdownMenu.svelte
@@ -1,11 +1,12 @@
 <script lang="ts">
 	import { onMount, type Snippet } from 'svelte';
+	import { tooltip } from '$lib/tooltip';
 	import Icon from './Icon.svelte';
 	import KeyPill from './KeyPill.svelte';
 
 	interface MenuItem {
 		label: string;
-		title?: string;
+		tooltip?: string;
 		icon?: string;
 		onclick: () => void;
 		active?: boolean;
@@ -375,7 +376,7 @@
 					>
 						<button
 							class="flex items-center gap-2 min-w-0 flex-1 h-full px-2 text-inherit"
-							title={item.title}
+							use:tooltip={item.tooltip ? { content: item.tooltip, placement: 'right' } : null}
 							onclick={() => {
 								item.onclick();
 								onclose();
diff --git a/cptr/frontend/src/lib/components/common/ModelSelector.svelte b/cptr/frontend/src/lib/components/common/ModelSelector.svelte
index 74bed72..107bf26 100644
--- a/cptr/frontend/src/lib/components/common/ModelSelector.svelte
+++ b/cptr/frontend/src/lib/components/common/ModelSelector.svelte
@@ -28,7 +28,7 @@
 	const menuItems = $derived(
 		filtered.map((m) => ({
 			label: m.name,
-			title: m.name,
+			tooltip: m.name,
 			active: m.id === selectedModel,
 			check: true,
 			onclick: () => {
diff --git a/cptr/frontend/src/lib/tooltip.ts b/cptr/frontend/src/lib/tooltip.ts
index 7bfd3fe..50eba8c 100644
--- a/cptr/frontend/src/lib/tooltip.ts
+++ b/cptr/frontend/src/lib/tooltip.ts
@@ -1,31 +1,49 @@
-import tippy, { type Props as TippyProps } from 'tippy.js';
+import tippy, { type Instance, type Props as TippyProps } from 'tippy.js';
 import 'tippy.js/dist/tippy.css';
 
+type TooltipParams = string | Partial<TippyProps> | null | undefined | false;
+
 /**
  * Svelte action for tippy.js tooltips.
  * Usage: <button use:tooltip={'New terminal'}>
  *    or: <button use:tooltip={{ content: 'New terminal', placement: 'bottom' }}>
  */
-export function tooltip(node: HTMLElement, params: string | Partial<TippyProps>) {
-	const opts: Partial<TippyProps> = typeof params === 'string' ? { content: params } : params;
+export function tooltip(node: HTMLElement, params: TooltipParams) {
+	function optsFor(value: TooltipParams): Partial<TippyProps> | null {
+		if (!value) return null;
+		const opts: Partial<TippyProps> = typeof value === 'string' ? { content: value } : value;
+		return opts.content ? opts : null;
+	}
+
+	function create(opts: Partial<TippyProps>) {
+		return tippy(node, {
+			arrow: false,
+			delay: [400, 0],
+			duration: [100, 75],
+			placement: 'bottom',
+			theme: 'cptr',
+			touch: false,
+			...opts
+		});
+	}
 
-	const instance = tippy(node, {
-		arrow: false,
-		delay: [400, 0],
-		duration: [100, 75],
-		placement: 'bottom',
-		theme: 'cptr',
-		touch: false,
-		...opts
-	});
+	let instance: Instance | null = null;
+	const opts = optsFor(params);
+	if (opts) instance = create(opts);
 
 	return {
-		update(newParams: string | Partial<TippyProps>) {
-			const newOpts = typeof newParams === 'string' ? { content: newParams } : newParams;
-			instance.setProps(newOpts);
+		update(newParams: TooltipParams) {
+			const newOpts = optsFor(newParams);
+			if (!newOpts) {
+				instance?.destroy();
+				instance = null;
+				return;
+			}
+			if (instance) instance.setProps(newOpts);
+			else instance = create(newOpts);
 		},
 		destroy() {
-			instance.destroy();
+			instance?.destroy();
 		}
 	};
 }

From d271bbd3810b4fde91946c1a657956c71e1f9b5b Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Mon, 6 Jul 2026 23:35:52 -0500
Subject: [PATCH 3/5] refac

---
 .../src/lib/components/DropdownMenu.svelte     |  2 +-
 .../src/lib/components/chat/ChatInput.svelte   | 18 +++++++++---------
 .../components/chat/FileSuggestionPopup.svelte |  4 +++-
 .../chat/SkillSuggestionPopup.svelte           |  5 +++--
 .../lib/components/common/ModelSelector.svelte |  2 +-
 5 files changed, 17 insertions(+), 14 deletions(-)

diff --git a/cptr/frontend/src/lib/components/DropdownMenu.svelte b/cptr/frontend/src/lib/components/DropdownMenu.svelte
index 7bed1e4..c0bebfe 100644
--- a/cptr/frontend/src/lib/components/DropdownMenu.svelte
+++ b/cptr/frontend/src/lib/components/DropdownMenu.svelte
@@ -376,7 +376,7 @@
 					>
 						<button
 							class="flex items-center gap-2 min-w-0 flex-1 h-full px-2 text-inherit"
-							use:tooltip={item.tooltip ? { content: item.tooltip, placement: 'right' } : null}
+							use:tooltip={item.tooltip ? { content: item.tooltip, placement: 'top' } : null}
 							onclick={() => {
 								item.onclick();
 								onclose();
diff --git a/cptr/frontend/src/lib/components/chat/ChatInput.svelte b/cptr/frontend/src/lib/components/chat/ChatInput.svelte
index 667d514..bb3bc9f 100644
--- a/cptr/frontend/src/lib/components/chat/ChatInput.svelte
+++ b/cptr/frontend/src/lib/components/chat/ChatInput.svelte
@@ -1124,7 +1124,7 @@
 
 	{#if showSlashCommands}
 		<div
-			class="app-theme app-surface absolute left-2 bottom-full mb-1 z-50 w-60 max-h-40 overflow-y-auto rounded-xl border shadow-xl p-0.5"
+			class="app-theme app-surface absolute left-2 bottom-full mb-1 z-50 w-64 max-h-40 overflow-y-auto rounded-xl border shadow-xl p-0.5"
 		>
 			{#if slashCommandIds.length > 0}
 				<div class="app-muted mb-0.5 px-2 pt-1 pb-0.5 text-[0.625rem] leading-none">
@@ -1137,7 +1137,7 @@
 					aria-label="Compact: shorten older messages so this chat can keep going."
 					use:tooltip={{
 						content: 'Shorten older messages so this chat can keep going.',
-						placement: 'right'
+						placement: 'top'
 					}}
 					class="slash-command-row flex items-center gap-2 w-full h-6 px-2 rounded-xl text-xs text-left transition-colors duration-75
 						{selectedSlashCommand('compact') ? 'app-interactive-active' : ''} disabled:opacity-50"
@@ -1186,7 +1186,7 @@
 					aria-label="Plan: work out a plan first, then wait before changing files."
 					use:tooltip={{
 						content: 'Work out a plan first, then wait before changing files.',
-						placement: 'right'
+						placement: 'top'
 					}}
 					class="slash-command-row flex items-center gap-2 w-full h-6 px-2 rounded-xl text-xs text-left transition-colors duration-75
 						{selectedSlashCommand('plan') ? 'app-interactive-active' : ''}"
@@ -1227,7 +1227,7 @@
 					aria-label="Fork: clone this chat into a new copy."
 					use:tooltip={{
 						content: 'Clone this chat into a new copy.',
-						placement: 'right'
+						placement: 'top'
 					}}
 					class="slash-command-row flex items-center gap-2 w-full h-6 px-2 rounded-xl text-xs text-left transition-colors duration-75
 						{selectedSlashCommand('fork') ? 'app-interactive-active' : ''} disabled:opacity-50"
@@ -1255,7 +1255,7 @@
 					aria-label="Status: check what is running in this chat."
 					use:tooltip={{
 						content: 'Check what is running in this chat.',
-						placement: 'right'
+						placement: 'top'
 					}}
 					class="slash-command-row flex items-center gap-2 w-full h-6 px-2 rounded-xl text-xs text-left transition-colors duration-75
 						{selectedSlashCommand('status') ? 'app-interactive-active' : ''}"
@@ -1294,7 +1294,7 @@
 					aria-label="List skills: see the skills available in this workspace."
 					use:tooltip={{
 						content: 'See the skills available in this workspace.',
-						placement: 'right'
+						placement: 'top'
 					}}
 					class="slash-command-row flex items-center gap-2 w-full h-6 px-2 rounded-xl text-xs text-left transition-colors duration-75
 						{selectedSlashCommand('skills:list') ? 'app-interactive-active' : ''}"
@@ -1319,7 +1319,7 @@
 					aria-label="Create skill: teach Computer a reusable workflow."
 					use:tooltip={{
 						content: 'Teach Computer a reusable workflow.',
-						placement: 'right'
+						placement: 'top'
 					}}
 					class="slash-command-row flex items-center gap-2 w-full h-6 px-2 rounded-xl text-xs text-left transition-colors duration-75
 						{selectedSlashCommand('skills:create') ? 'app-interactive-active' : ''}"
@@ -1345,8 +1345,8 @@
 						type="button"
 						aria-label={`Use skill: ${skill.label}`}
 						use:tooltip={{
-							content: skill.description || 'Use this skill in the message.',
-							placement: 'right'
+							content: skill.label,
+							placement: 'top'
 						}}
 						class="slash-command-row flex items-center gap-2 w-full h-6 px-2 rounded-xl text-xs text-left transition-colors duration-75
 							{selectedSlashSkill(skill.id) ? 'app-interactive-active' : ''}"
diff --git a/cptr/frontend/src/lib/components/chat/FileSuggestionPopup.svelte b/cptr/frontend/src/lib/components/chat/FileSuggestionPopup.svelte
index 4eac1ea..ef7a38d 100644
--- a/cptr/frontend/src/lib/components/chat/FileSuggestionPopup.svelte
+++ b/cptr/frontend/src/lib/components/chat/FileSuggestionPopup.svelte
@@ -2,6 +2,7 @@
 	import Icon from '../Icon.svelte';
 	import { fileIconName } from '$lib/utils/fileIcon';
 	import { t } from '$lib/i18n';
+	import { tooltip } from '$lib/tooltip';
 
 	interface SuggestionItem {
 		id: string;
@@ -35,7 +36,7 @@
 </script>
 
 <div
-	class="app-theme app-surface fixed z-50 w-60 max-h-40 overflow-y-auto rounded-xl border shadow-xl p-0.5"
+	class="app-theme app-surface fixed z-50 w-64 max-h-40 overflow-y-auto rounded-xl border shadow-xl p-0.5"
 >
 	{#if items.length === 0}
 		<div class="app-muted flex items-center h-6 px-2 text-xs">{$t('quickOpen.noFiles')}</div>
@@ -54,6 +55,7 @@
 						onselect(i);
 					}}
 					onmouseenter={() => (selectedIndex = i)}
+					use:tooltip={{ content: item.id, placement: 'top' }}
 				>
 					<span class="app-icon-muted flex items-center justify-center w-4 shrink-0">
 						<Icon name={fileIconName(item.label, item.type)} size={14} />
diff --git a/cptr/frontend/src/lib/components/chat/SkillSuggestionPopup.svelte b/cptr/frontend/src/lib/components/chat/SkillSuggestionPopup.svelte
index 8dfac47..ff61dfb 100644
--- a/cptr/frontend/src/lib/components/chat/SkillSuggestionPopup.svelte
+++ b/cptr/frontend/src/lib/components/chat/SkillSuggestionPopup.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
 	import Icon from '$lib/components/Icon.svelte';
 	import { t } from '$lib/i18n';
+	import { tooltip } from '$lib/tooltip';
 
 	interface SuggestionItem {
 		id: string;
@@ -28,7 +29,7 @@
 </script>
 
 <div
-	class="app-theme app-surface fixed z-50 w-60 max-h-40 overflow-y-auto rounded-xl border shadow-xl p-0.5"
+	class="app-theme app-surface fixed z-50 w-64 max-h-40 overflow-y-auto rounded-xl border shadow-xl p-0.5"
 >
 	{#if items.length === 0}
 		<div class="app-muted flex items-center h-6 px-2 text-xs">{$t('chat.noSkillsFound')}</div>
@@ -47,7 +48,7 @@
 						onselect(i);
 					}}
 					onmouseenter={() => (selectedIndex = i)}
-					title={item.description}
+					use:tooltip={{ content: item.label, placement: 'top' }}
 				>
 					<span class="app-icon-muted flex items-center justify-center w-4 shrink-0">
 						<Icon name="spark" size={13} strokeWidth={1.7} />
diff --git a/cptr/frontend/src/lib/components/common/ModelSelector.svelte b/cptr/frontend/src/lib/components/common/ModelSelector.svelte
index 107bf26..e3361ae 100644
--- a/cptr/frontend/src/lib/components/common/ModelSelector.svelte
+++ b/cptr/frontend/src/lib/components/common/ModelSelector.svelte
@@ -101,7 +101,7 @@
 			{preferAbove}
 			forceAbove={preferAbove}
 			maxHeight={selectorMaxHeight}
-			className="w-48"
+			className="w-52"
 			{align}
 		>
 			{#snippet header()}

From 5cd5519742d18b8adb198bda1cf9717a737fe777 Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Mon, 6 Jul 2026 23:57:30 -0500
Subject: [PATCH 4/5] refac

---
 LICENSE | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/LICENSE b/LICENSE
index 0c6b11b..bdc1bfd 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,6 +1,6 @@
 Open Use License
 
-Copyright © 2026 Open WebUI Inc. All rights reserved.
+Copyright © 2026 Open WebUI, Inc. All rights reserved.
 
 This software is licensed under the Open Use License, which incorporates the
 Elastic License 2.0 ("ELv2") in full with the additional conditions set forth
@@ -30,3 +30,7 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
+
+Commercial, organizational, or production use is subject to the applicable
+commercial terms published at https://openwebui.com/terms, unless Open WebUI,
+Inc. agrees otherwise in writing.

From 0ffb2234d86f30d1dde8ff4bccb08a92f7701807 Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Tue, 7 Jul 2026 00:35:12 -0500
Subject: [PATCH 5/5] refac

---
 CHANGELOG.md   | 7 +++++++
 pyproject.toml | 2 +-
 uv.lock        | 2 +-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0b40e44..4ae46b8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,13 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.8.3] - 2026-07-07
+
+### Fixed
+
+- 💬 **Cleaner chat suggestions.** Slash commands, file matches, skill matches, and model choices now have a little more room and clearer hover hints, so longer names are easier to understand.
+- 🧭 **Better menu hints.** Menus can now show helpful hover hints only when there is something useful to show, keeping empty tooltips out of the way.
+
 ## [0.8.2] - 2026-07-07
 
 ### Added
diff --git a/pyproject.toml b/pyproject.toml
index bb2af1e..1286aad 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -1,6 +1,6 @@
 [project]
 name = "cptr"
-version = "0.8.2"
+version = "0.8.3"
 description = "Your computer, from anywhere. Code, manage, and control your machine from the web."
 license = {file = "LICENSE"}
 readme = "README.md"
diff --git a/uv.lock b/uv.lock
index b1a10bf..541b6f8 100644
--- a/uv.lock
+++ b/uv.lock
@@ -284,7 +284,7 @@ wheels = [
 
 [[package]]
 name = "cptr"
-version = "0.8.2"
+version = "0.8.3"
 source = { editable = "." }
 dependencies = [
     { name = "aiosqlite" },