From 89caa7c849c471561dfd76140d0c3c3ce7a68df8 Mon Sep 17 00:00:00 2001
From: Timothy Jaeryang Baek <tim@openwebui.com>
Date: Mon, 27 Jul 2026 01:19:34 -0400
Subject: [PATCH] refac

---
 src/lib/components/admin/Settings/Models.svelte          | 1 +
 .../admin/Settings/Models/Manage/ManageOllama.svelte     | 5 +++++
 src/lib/components/calendar/CalendarSidebar.svelte       | 2 ++
 src/lib/components/channel/MessageInput.svelte           | 4 ++++
 src/lib/components/chat/Artifacts.svelte                 | 2 ++
 src/lib/components/chat/FileNav/FilePreview.svelte       | 2 ++
 src/lib/components/chat/FileNav/SqliteView.svelte        | 2 ++
 src/lib/components/chat/MessageInput.svelte              | 3 +++
 src/lib/components/chat/MessageInput/CallOverlay.svelte  | 9 ++++++++-
 src/lib/components/chat/MessageInput/TerminalMenu.svelte | 2 ++
 .../components/chat/MessageInput/VoiceRecording.svelte   | 1 +
 11 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/admin/Settings/Models.svelte b/src/lib/components/admin/Settings/Models.svelte
index cc807e0476..b5c572bb79 100644
--- a/src/lib/components/admin/Settings/Models.svelte
+++ b/src/lib/components/admin/Settings/Models.svelte
@@ -1096,6 +1096,7 @@
 									<button
 										class="hidden sm:flex self-center w-fit text-sm p-1.5 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
 										type="button"
+										aria-label={$i18n.t('Edit')}
 										on:click={() => {
 											selectedModelId = model.id;
 										}}
diff --git a/src/lib/components/admin/Settings/Models/Manage/ManageOllama.svelte b/src/lib/components/admin/Settings/Models/Manage/ManageOllama.svelte
index b1852ca02d..9319cb029d 100644
--- a/src/lib/components/admin/Settings/Models/Manage/ManageOllama.svelte
+++ b/src/lib/components/admin/Settings/Models/Manage/ManageOllama.svelte
@@ -625,6 +625,7 @@
 							<Tooltip content="Update All Models" placement="top">
 								<button
 									class="flex gap-2 items-center bg-transparent rounded-lg transition"
+									aria-label={$i18n.t('Update All Models')}
 									on:click={() => {
 										updateModelsHandler();
 									}}
@@ -729,6 +730,7 @@
 							<Tooltip content={$i18n.t('Cancel')}>
 								<button
 									class="text-gray-800 dark:text-gray-100"
+									aria-label={$i18n.t('Cancel')}
 									on:click={() => {
 										cancelUpdateModelHandler(updateModelId);
 									}}
@@ -777,6 +779,7 @@
 											<Tooltip content={$i18n.t('Cancel')}>
 												<button
 													class="text-gray-800 dark:text-gray-100"
+													aria-label={$i18n.t('Cancel')}
 													on:click={() => {
 														cancelModelPullHandler(model);
 													}}
@@ -834,6 +837,7 @@
 						<Tooltip content={$i18n.t('Delete Model')} placement="top">
 							<button
 								class={iconButtonClass}
+								aria-label={$i18n.t('Delete Model')}
 								on:click={() => {
 									showModelDeleteConfirm = true;
 								}}
@@ -882,6 +886,7 @@
 							<Tooltip content={$i18n.t('Create Model')} placement="top">
 								<button
 									class={iconButtonClass}
+									aria-label={$i18n.t('Create Model')}
 									on:click={() => {
 										createModelHandler();
 									}}
diff --git a/src/lib/components/calendar/CalendarSidebar.svelte b/src/lib/components/calendar/CalendarSidebar.svelte
index 9c7a96c575..f56a6d5937 100644
--- a/src/lib/components/calendar/CalendarSidebar.svelte
+++ b/src/lib/components/calendar/CalendarSidebar.svelte
@@ -110,6 +110,7 @@
 			<div class="flex items-center gap-0.5">
 				<button
 					class="p-0.5 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition"
+					aria-label={$i18n.t('Previous month')}
 					on:click={() => navigateMini(-1)}
 				>
 					<svg
@@ -128,6 +129,7 @@
 				</button>
 				<button
 					class="p-0.5 rounded hover:bg-gray-100 dark:hover:bg-gray-800 transition"
+					aria-label={$i18n.t('Next month')}
 					on:click={() => navigateMini(1)}
 				>
 					<svg
diff --git a/src/lib/components/channel/MessageInput.svelte b/src/lib/components/channel/MessageInput.svelte
index ae753e4fb1..77b5126214 100644
--- a/src/lib/components/channel/MessageInput.svelte
+++ b/src/lib/components/channel/MessageInput.svelte
@@ -722,6 +722,7 @@
 								class=" absolute -top-12 left-0 right-0 flex justify-center z-30 pointer-events-none"
 							>
 								<button
+									aria-label={$i18n.t('Scroll to bottom')}
 									class=" bg-white border border-gray-100 dark:border-none dark:bg-white/20 p-1.5 rounded-full pointer-events-auto"
 									on:click={() => {
 										scrollEnd = true;
@@ -851,6 +852,7 @@
 													<button
 														class=" bg-white text-black border border-white rounded-full group-hover:visible invisible transition"
 														type="button"
+														aria-label={$i18n.t('Remove file')}
 														on:click={() => {
 															files.splice(fileIdx, 1);
 															files = files;
@@ -1067,6 +1069,7 @@
 											<div class=" flex items-center">
 												<Tooltip content={$i18n.t('Stop')}>
 													<button
+														aria-label={$i18n.t('Stop')}
 														class="bg-white hover:bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-800 transition rounded-full p-[5px]"
 														on:click={() => {
 															onStop();
@@ -1092,6 +1095,7 @@
 												<Tooltip content={$i18n.t('Send message')}>
 													<button
 														id="send-message-button"
+														aria-label={$i18n.t('Send message')}
 														class="{content !== '' || files.length !== 0
 															? 'bg-black text-white hover:bg-gray-900 dark:bg-white dark:text-black dark:hover:bg-gray-100 '
 															: 'text-white bg-gray-200 dark:text-gray-900 dark:bg-gray-700 disabled'} transition rounded-full p-[5px] self-center"
diff --git a/src/lib/components/chat/Artifacts.svelte b/src/lib/components/chat/Artifacts.svelte
index 8f03bae886..49cd554984 100644
--- a/src/lib/components/chat/Artifacts.svelte
+++ b/src/lib/components/chat/Artifacts.svelte
@@ -134,6 +134,7 @@
 					<div class="flex items-center space-x-2">
 						<div class="flex items-center gap-0.5 self-center min-w-fit" dir="ltr">
 							<button
+								aria-label={$i18n.t('Previous version')}
 								class="self-center p-1 hover:bg-black/5 dark:hover:bg-white/5 dark:hover:text-white hover:text-black rounded-md transition disabled:cursor-not-allowed"
 								on:click={() => navigateContent('prev')}
 								disabled={contents.length <= 1}
@@ -162,6 +163,7 @@
 							</div>
 
 							<button
+								aria-label={$i18n.t('Next version')}
 								class="self-center p-1 hover:bg-black/5 dark:hover:bg-white/5 dark:hover:text-white hover:text-black rounded-md transition disabled:cursor-not-allowed"
 								on:click={() => navigateContent('next')}
 								disabled={contents.length <= 1}
diff --git a/src/lib/components/chat/FileNav/FilePreview.svelte b/src/lib/components/chat/FileNav/FilePreview.svelte
index aa9253f1c0..520c6473a8 100644
--- a/src/lib/components/chat/FileNav/FilePreview.svelte
+++ b/src/lib/components/chat/FileNav/FilePreview.svelte
@@ -348,6 +348,7 @@
 					class="flex items-center justify-center gap-3 py-2 px-3 border-t border-gray-100 dark:border-gray-800 text-xs text-gray-500"
 				>
 					<button
+						aria-label={$i18n.t('Previous slide')}
 						class="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30"
 						disabled={currentSlide === 0}
 						on:click={() => {
@@ -370,6 +371,7 @@
 					</button>
 					<span>{currentSlide + 1} / {fileOfficeSlides.length}</span>
 					<button
+						aria-label={$i18n.t('Next slide')}
 						class="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30"
 						disabled={currentSlide === fileOfficeSlides.length - 1}
 						on:click={() => {
diff --git a/src/lib/components/chat/FileNav/SqliteView.svelte b/src/lib/components/chat/FileNav/SqliteView.svelte
index f6c75059f7..2fb5fb6b73 100644
--- a/src/lib/components/chat/FileNav/SqliteView.svelte
+++ b/src/lib/components/chat/FileNav/SqliteView.svelte
@@ -254,6 +254,7 @@
 					class="flex items-center justify-center gap-3 py-1.5 px-3 border-t border-gray-100 dark:border-gray-800 text-xs text-gray-500 shrink-0"
 				>
 					<button
+						aria-label={$i18n.t('Previous page')}
 						class="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30"
 						disabled={page === 0}
 						on:click={() => {
@@ -276,6 +277,7 @@
 					</button>
 					<span>{page + 1} / {totalPages} ({totalRows.toLocaleString()} rows)</span>
 					<button
+						aria-label={$i18n.t('Next page')}
 						class="p-1 rounded hover:bg-gray-100 dark:hover:bg-gray-800 disabled:opacity-30"
 						disabled={page >= totalPages - 1}
 						on:click={() => {
diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index 0fe0bab2d9..44a4b49e55 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/src/lib/components/chat/MessageInput.svelte
@@ -1389,6 +1389,7 @@
 							class=" absolute -top-12 left-0 right-0 flex justify-center z-30 pointer-events-none"
 						>
 							<button
+								aria-label={$i18n.t('Scroll to bottom')}
 								class=" bg-white border border-gray-100 dark:border-none dark:bg-white/20 p-1.5 rounded-full pointer-events-auto"
 								on:click={() => {
 									autoScroll = true;
@@ -1473,6 +1474,7 @@
 					>
 						<button
 							id="generate-message-pair-button"
+							aria-label={$i18n.t('Generate message pair')}
 							class="hidden"
 							on:click={() => createMessagePair(prompt)}
 						/>
@@ -2264,6 +2266,7 @@
 										<div class=" flex items-center">
 											<Tooltip content={$i18n.t('Stop')}>
 												<button
+													aria-label={$i18n.t('Stop')}
 													class="bg-white hover:bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-800 transition rounded-full p-[5px]"
 													on:click={() => {
 														stopResponse();
diff --git a/src/lib/components/chat/MessageInput/CallOverlay.svelte b/src/lib/components/chat/MessageInput/CallOverlay.svelte
index 03c7103cc9..17003e6ad4 100644
--- a/src/lib/components/chat/MessageInput/CallOverlay.svelte
+++ b/src/lib/components/chat/MessageInput/CallOverlay.svelte
@@ -928,6 +928,7 @@
 					<div class=" absolute top-4 md:top-8 left-4">
 						<button
 							type="button"
+							aria-label={$i18n.t('Stop camera')}
 							class="p-1.5 text-white cursor-pointer backdrop-blur-xl bg-black/10 rounded-full"
 							on:click={() => {
 								stopCamera();
@@ -984,7 +985,11 @@
 							await startVideoStream();
 						}}
 					>
-						<button class="p-3 rounded-full bg-gray-50 dark:bg-gray-900" type="button">
+						<button
+							aria-label={$i18n.t('Switch camera')}
+							class="p-3 rounded-full bg-gray-50 dark:bg-gray-900"
+							type="button"
+						>
 							<svg
 								xmlns="http://www.w3.org/2000/svg"
 								viewBox="0 0 20 20"
@@ -1002,6 +1007,7 @@
 				{:else}
 					<Tooltip content={$i18n.t('Camera')}>
 						<button
+							aria-label={$i18n.t('Camera')}
 							class="p-3 rounded-full bg-gray-50 dark:bg-gray-900"
 							type="button"
 							on:click={async () => {
@@ -1087,6 +1093,7 @@
 				</Tooltip>
 
 				<button
+					aria-label={$i18n.t('End call')}
 					class="p-3 rounded-full bg-gray-50 dark:bg-gray-900"
 					on:click={async () => {
 						await stopAudioStream();
diff --git a/src/lib/components/chat/MessageInput/TerminalMenu.svelte b/src/lib/components/chat/MessageInput/TerminalMenu.svelte
index c74ab4208d..1291f749da 100644
--- a/src/lib/components/chat/MessageInput/TerminalMenu.svelte
+++ b/src/lib/components/chat/MessageInput/TerminalMenu.svelte
@@ -122,6 +122,7 @@
 						<Tooltip content={$i18n.t('Add Terminal')} placement="top">
 							<button
 								type="button"
+								aria-label={$i18n.t('Add Terminal')}
 								class="p-0.5 rounded-md text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300 transition"
 								on:click|stopPropagation={() => {
 									show = false;
@@ -189,6 +190,7 @@
 							<Tooltip content={$i18n.t('Add Terminal')} placement="top">
 								<button
 									type="button"
+									aria-label={$i18n.t('Add Terminal')}
 									class="p-0.5 rounded-md text-gray-400 hover:text-gray-600 dark:text-gray-500 dark:hover:text-gray-300 transition"
 									on:click|stopPropagation={() => {
 										show = false;
diff --git a/src/lib/components/chat/MessageInput/VoiceRecording.svelte b/src/lib/components/chat/MessageInput/VoiceRecording.svelte
index b5a882f67c..22f085dcb0 100644
--- a/src/lib/components/chat/MessageInput/VoiceRecording.svelte
+++ b/src/lib/components/chat/MessageInput/VoiceRecording.svelte
@@ -620,6 +620,7 @@
 				<button
 					id="confirm-recording-button"
 					type="button"
+					aria-label={$i18n.t('Confirm recording')}
 					class="p-1.5 bg-indigo-500 text-white dark:bg-indigo-500 dark:text-blue-950 rounded-full"
 					on:click={async () => {
 						await confirmRecording();