Merge pull request open-webui#996 from open-webui/dev

0.1.107

CHANGELOG.md

@@ -5,6 +5,23 @@ 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.1.107] - 2024-03-01
+
+### Added
+
+- **🚀 Makefile and LLM Update Script**: Included Makefile and a script for LLM updates in the repository.
+
+### Fixed
+
+- Corrected issue where links in the settings modal didn't appear clickable (#960).
+- Fixed problem with web UI port not taking effect due to incorrect environment variable name in run-compose.sh (#996).
+- Enhanced user experience by displaying chat in browser title and enabling automatic scrolling to the bottom (#992).
+
+### Changed
+
+- Upgraded toast library from `svelte-french-toast` to `svelte-sonner` for a more polished UI.
+- Enhanced accessibility with the addition of dark mode on the authentication page.
+
 ## [0.1.106] - 2024-02-27
 
 ### Added

Makefile

@@ -0,0 +1,25 @@
+install:
+	@docker-compose up -d
+
+remove:
+	@chmod +x confirm_remove.sh
+	@./confirm_remove.sh
+
+
+start:
+	@docker-compose start
+
+stop:
+	@docker-compose stop
+
+update:
+	# Calls the LLM update script
+	chmod +x update_ollama_models.sh
+	@./update_ollama_models.sh
+	@git pull
+	@docker-compose down
+	# Make sure the ollama-webui container is stopped before rebuilding
+	@docker stop open-webui || true
+	@docker-compose up --build -d
+	@docker-compose start
+

confirm_remove.sh

@@ -0,0 +1,8 @@
+#!/bin/bash
+echo "Warning: This will remove all containers and volumes, including persistent data. Do you want to continue? [Y/N]"
+read ans
+if [ "$ans" == "Y" ] || [ "$ans" == "y" ]; then
+  docker-compose down -v
+else
+  echo "Operation cancelled."
+fi

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "open-webui",
-	"version": "0.1.106",
+	"version": "0.1.107",
 	"private": true,
 	"scripts": {
 		"dev": "vite dev --host",
@@ -49,7 +49,7 @@
 		"js-sha256": "^0.10.1",
 		"katex": "^0.16.9",
 		"marked": "^9.1.0",
-		"svelte-french-toast": "^1.2.0",
+		"svelte-sonner": "^0.3.19",
 		"tippy.js": "^6.3.7",
 		"uuid": "^9.0.1"
 	}

run-compose.sh

@@ -182,7 +182,7 @@ else
         export OLLAMA_DATA_DIR=$data_dir # Set OLLAMA_DATA_DIR environment variable
     fi
     if [[ -n $webui_port ]]; then
-        export OLLAMA_WEBUI_PORT=$webui_port # Set OLLAMA_WEBUI_PORT environment variable
+        export OPEN_WEBUI_PORT=$webui_port # Set OPEN_WEBUI_PORT environment variable
     fi
     DEFAULT_COMPOSE_COMMAND+=" up -d"
     DEFAULT_COMPOSE_COMMAND+=" --remove-orphans"

src/lib/components/admin/EditUserModal.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import dayjs from 'dayjs';
 	import { createEventDispatcher } from 'svelte';
 	import { onMount } from 'svelte';

src/lib/components/chat/MessageInput.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import { onMount, tick } from 'svelte';
 	import { settings } from '$lib/stores';
 	import { blobToFile, calculateSHA256, findWordIndices } from '$lib/utils';

src/lib/components/chat/MessageInput/Documents.svelte

@@ -4,7 +4,7 @@
 	import { documents } from '$lib/stores';
 	import { removeFirstHashWord, isValidHttpUrl } from '$lib/utils';
 	import { tick } from 'svelte';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	export let prompt = '';
 

src/lib/components/chat/MessageInput/Models.svelte

@@ -3,7 +3,7 @@
 	import { models } from '$lib/stores';
 	import { splitStream } from '$lib/utils';
 	import { tick } from 'svelte';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	export let prompt = '';
 	export let user = null;

src/lib/components/chat/MessageInput/PromptCommands.svelte

@@ -2,7 +2,7 @@
 	import { prompts } from '$lib/stores';
 	import { findWordIndices } from '$lib/utils';
 	import { tick } from 'svelte';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	export let prompt = '';
 	let selectedCommandIdx = 0;

src/lib/components/chat/Messages.svelte

@@ -4,7 +4,7 @@
 	import { chats, config, modelfiles, settings, user } from '$lib/stores';
 	import { tick } from 'svelte';
 
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import { getChatList, updateChatById } from '$lib/apis/chats';
 
 	import UserMessage from './Messages/UserMessage.svelte';

src/lib/components/chat/Messages/ResponseMessage.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import dayjs from 'dayjs';
 	import { marked } from 'marked';
 	import tippy from 'tippy.js';

src/lib/components/chat/ModelSelector.svelte

@@ -2,7 +2,7 @@
 	import { setDefaultModels } from '$lib/apis/configs';
 	import { models, showSettings, settings, user } from '$lib/stores';
 	import { onMount, tick } from 'svelte';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	export let selectedModels = [''];
 	export let disabled = false;

src/lib/components/chat/Settings/Account.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import { onMount } from 'svelte';
 
 	import { user } from '$lib/stores';

src/lib/components/chat/Settings/Account/UpdatePassword.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import { updateUserPassword } from '$lib/apis/auths';
 
 	let show = false;

src/lib/components/chat/Settings/Audio.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { createEventDispatcher, onMount } from 'svelte';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	const dispatch = createEventDispatcher();
 
 	export let saveSettings: Function;

src/lib/components/chat/Settings/Chats.svelte

@@ -15,7 +15,7 @@
 	import { getImportOrigin, convertOpenAIChats } from '$lib/utils';
 	import { onMount } from 'svelte';
 	import { goto } from '$app/navigation';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	export let saveSettings: Function;
 	// Chats

src/lib/components/chat/Settings/Connections.svelte

@@ -5,7 +5,7 @@
 
 	import { getOllamaAPIUrl, getOllamaVersion, updateOllamaAPIUrl } from '$lib/apis/ollama';
 	import { getOpenAIKey, getOpenAIUrl, updateOpenAIKey, updateOpenAIUrl } from '$lib/apis/openai';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	export let getModels: Function;
 

src/lib/components/chat/Settings/General.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import { createEventDispatcher, onMount } from 'svelte';
 	const dispatch = createEventDispatcher();
 

src/lib/components/chat/Settings/Images.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	import { createEventDispatcher, onMount } from 'svelte';
 	import { config, user } from '$lib/stores';

src/lib/components/chat/Settings/Interface.svelte

@@ -3,7 +3,7 @@
 	import { setDefaultPromptSuggestions } from '$lib/apis/configs';
 	import { config, models, user } from '$lib/stores';
 	import { createEventDispatcher, onMount } from 'svelte';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	const dispatch = createEventDispatcher();
 
 	export let saveSettings: Function;
@@ -191,10 +191,12 @@
 						placeholder="Select a model"
 					>
 						<option value="" selected>Current Model</option>
-						{#each $models.filter((m) => m.size != null) as model}
-							<option value={model.name} class="bg-gray-100 dark:bg-gray-700"
-								>{model.name + ' (' + (model.size / 1024 ** 3).toFixed(1) + ' GB)'}</option
-							>
+						{#each $models as model}
+							{#if model.size != null}
+								<option value={model.name} class="bg-gray-100 dark:bg-gray-700">
+									{model.name + ' (' + (model.size / 1024 ** 3).toFixed(1) + ' GB)'}
+								</option>
+							{/if}
 						{/each}
 					</select>
 				</div>

src/lib/components/chat/Settings/Models.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import queue from 'async/queue';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	import { createModel, deleteModel, getOllamaVersion, pullModel } from '$lib/apis/ollama';
 	import { WEBUI_API_BASE_URL, WEBUI_BASE_URL } from '$lib/constants';
@@ -432,7 +432,7 @@
 
 					<div class="mt-2 mb-1 text-xs text-gray-400 dark:text-gray-500">
 						To access the available model names for downloading, <a
-							class=" text-gray-500 dark:text-gray-300 font-medium"
+							class=" text-gray-500 dark:text-gray-300 font-medium underline"
 							href="https://ollama.com/library"
 							target="_blank">click here.</a
 						>
@@ -651,7 +651,7 @@
 						{/if}
 						<div class=" mt-1 text-xs text-gray-400 dark:text-gray-500">
 							To access the GGUF models available for downloading, <a
-								class=" text-gray-500 dark:text-gray-300 font-medium"
+								class=" text-gray-500 dark:text-gray-300 font-medium underline"
 								href="https://huggingface.co/models?search=gguf"
 								target="_blank">click here.</a
 							>
@@ -790,7 +790,7 @@
 					<div class="mb-2 text-xs text-gray-400 dark:text-gray-500">
 						Not sure what to add?
 						<a
-							class=" text-gray-300 font-medium"
+							class=" text-gray-300 font-medium underline"
 							href="https://litellm.vercel.app/docs/proxy/configs#quick-start"
 							target="_blank"
 						>
@@ -913,7 +913,7 @@
 					<div class="mt-2 text-xs text-gray-400 dark:text-gray-500">
 						Not sure what to add?
 						<a
-							class=" text-gray-300 font-medium"
+							class=" text-gray-300 font-medium underline"
 							href="https://litellm.vercel.app/docs/proxy/configs#quick-start"
 							target="_blank"
 						>

src/lib/components/chat/SettingsModal.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import { models, settings, user } from '$lib/stores';
 
 	import { getOllamaModels } from '$lib/apis/ollama';

src/lib/components/documents/AddDocModal.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import dayjs from 'dayjs';
 	import { onMount } from 'svelte';
 

src/lib/components/documents/EditDocModal.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 	import dayjs from 'dayjs';
 	import { onMount } from 'svelte';
 

src/lib/components/documents/Settings/General.svelte

@@ -9,7 +9,7 @@
 	} from '$lib/apis/rag';
 	import { documents } from '$lib/stores';
 	import { onMount } from 'svelte';
-	import toast from 'svelte-french-toast';
+	import { toast } from 'svelte-sonner';
 
 	export let saveHandler: Function;