Merge pull request #695 from ollama-webui/refac

feat: remove hardcoded names

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

@@ -27,19 +27,19 @@
 					>
 						{#if model in modelfiles}
 							<img
-								src={modelfiles[model]?.imageUrl ?? '/ollama-dark.png'}
+								src={modelfiles[model]?.imageUrl ?? './favicon.png'}
 								alt="modelfile"
 								class=" w-20 mb-2 rounded-full {models.length > 1
-									? ' border-[5px] border-white dark:border-gray-800'
+									? ' border-[5px] border-white dark:border-gray-900'
 									: ''}"
 								draggable="false"
 							/>
 						{:else}
 							<img
-								src={models.length === 1 ? '/ollama.png' : 'ollama-dark.png'}
+								src={models.length === 1 ? '/favicon.png' : '/favicon.png'}
 								class=" w-20 mb-2 {models.length === 1
-									? 'invert-[10%] dark:invert-[100%]'
-									: 'border-[5px] border-white dark:border-gray-800'}  rounded-full"
+									? ''
+									: 'border-[5px] border-white dark:border-gray-900'}  rounded-full"
 								alt="ollama"
 								draggable="false"
 							/>

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

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { getOllamaVersion } from '$lib/apis/ollama';
-	import { WEB_UI_VERSION } from '$lib/constants';
+	import { WEBUI_NAME, WEB_UI_VERSION } from '$lib/constants';
 	import { config } from '$lib/stores';
 	import { onMount } from 'svelte';
 
@@ -15,7 +15,7 @@
 <div class="flex flex-col h-full justify-between space-y-3 text-sm mb-6">
 	<div class=" space-y-3">
 		<div>
-			<div class=" mb-2.5 text-sm font-medium">Ollama Web UI Version</div>
+			<div class=" mb-2.5 text-sm font-medium">{WEBUI_NAME} Version</div>
 			<div class="flex w-full">
 				<div class="flex-1 text-xs text-gray-700 dark:text-gray-200">
 					{$config && $config.version ? $config.version : WEB_UI_VERSION}

src/lib/components/layout/Navbar.svelte

@@ -8,9 +8,10 @@
 	import ShareChatModal from '../chat/ShareChatModal.svelte';
 	import TagInput from '../common/Tags/TagInput.svelte';
 	import Tags from '../common/Tags.svelte';
+	import { WEBUI_NAME } from '$lib/constants';
 
 	export let initNewChat: Function;
-	export let title: string = 'Ollama Web UI';
+	export let title: string = WEBUI_NAME;
 	export let shareEnabled: boolean = false;
 
 	export let tags = [];
@@ -97,7 +98,7 @@
 			</div>
 			<div class=" flex-1 self-center font-medium line-clamp-1">
 				<div>
-					{title != '' ? title : 'Ollama Web UI'}
+					{title != '' ? title : WEBUI_NAME}
 				</div>
 			</div>
 

src/lib/components/layout/Sidebar.svelte

@@ -19,7 +19,7 @@
 	let show = false;
 	let navElement;
 
-	let title: string = 'Ollama Web UI';
+	let title: string = 'UI';
 	let search = '';
 
 	let chatDeleteId = null;
@@ -88,7 +88,7 @@
 		<div class="px-2.5 flex justify-center space-x-2">
 			<button
 				id="sidebar-new-chat-button"
-				class="flex-grow flex justify-between rounded-md px-3 py-2 mt-1 hover:bg-gray-900 transition"
+				class="flex-grow flex justify-between rounded-md px-3 py-2 hover:bg-gray-900 transition"
 				on:click={async () => {
 					goto('/');
 
@@ -100,8 +100,8 @@
 				}}
 			>
 				<div class="flex self-center">
-					<div class="self-center mr-3.5">
-						<img src="/ollama.png" class=" w-5 invert-[100%] rounded-full" />
+					<div class="self-center mr-1.5">
+						<img src="/favicon.png" class=" w-7 -translate-x-1.5 rounded-full" alt="logo" />
 					</div>
 
 					<div class=" self-center font-medium text-sm">New Chat</div>

src/lib/constants.ts

@@ -1,5 +1,6 @@
 import { dev } from '$app/environment';
 
+export const WEBUI_NAME = 'Ollama Web UI';
 export const WEBUI_BASE_URL = dev ? `http://${location.hostname}:8080` : ``;
 
 export const WEBUI_API_BASE_URL = `${WEBUI_BASE_URL}/api/v1`;
@@ -26,12 +27,57 @@ export const SUPPORTED_FILE_TYPE = [
 ];
 
 export const SUPPORTED_FILE_EXTENSIONS = [
-	'md', 'rst','go', 'py', 'java', 'sh', 'bat', 'ps1', 'cmd', 'js', 
-	'ts', 'css', 'cpp', 'hpp','h', 'c', 'cs', 'sql', 'log', 'ini',
-	'pl', 'pm', 'r', 'dart', 'dockerfile', 'env', 'php', 'hs',
-	'hsc', 'lua', 'nginxconf', 'conf', 'm', 'mm', 'plsql', 'perl',
-	'rb', 'rs', 'db2', 'scala', 'bash', 'swift', 'vue', 'svelte',
-	'doc','docx', 'pdf', 'csv', 'txt', 'xls', 'xlsx'
+	'md',
+	'rst',
+	'go',
+	'py',
+	'java',
+	'sh',
+	'bat',
+	'ps1',
+	'cmd',
+	'js',
+	'ts',
+	'css',
+	'cpp',
+	'hpp',
+	'h',
+	'c',
+	'cs',
+	'sql',
+	'log',
+	'ini',
+	'pl',
+	'pm',
+	'r',
+	'dart',
+	'dockerfile',
+	'env',
+	'php',
+	'hs',
+	'hsc',
+	'lua',
+	'nginxconf',
+	'conf',
+	'm',
+	'mm',
+	'plsql',
+	'perl',
+	'rb',
+	'rs',
+	'db2',
+	'scala',
+	'bash',
+	'swift',
+	'vue',
+	'svelte',
+	'doc',
+	'docx',
+	'pdf',
+	'csv',
+	'txt',
+	'xls',
+	'xlsx'
 ];
 
 // Source: https://kit.svelte.dev/docs/modules#$env-static-public

src/routes/+layout.svelte

@@ -10,6 +10,7 @@
 	import '../app.css';
 	import '../tailwind.css';
 	import 'tippy.js/dist/tippy.css';
+	import { WEBUI_NAME } from '$lib/constants';
 
 	let loaded = false;
 
@@ -54,7 +55,7 @@
 </script>
 
 <svelte:head>
-	<title>Ollama</title>
+	<title>{WEBUI_NAME}</title>
 
 	<link rel="stylesheet" type="text/css" href="/themes/rosepine.css" />
 	<link rel="stylesheet" type="text/css" href="/themes/rosepine-dawn.css" />

src/routes/auth/+page.svelte

@@ -1,7 +1,7 @@
 <script>
 	import { goto } from '$app/navigation';
 	import { userSignIn, userSignUp } from '$lib/apis/auths';
-	import { WEBUI_API_BASE_URL } from '$lib/constants';
+	import { WEBUI_API_BASE_URL, WEBUI_NAME } from '$lib/constants';
 	import { config, user } from '$lib/stores';
 	import { onMount } from 'svelte';
 	import toast from 'svelte-french-toast';
@@ -90,7 +90,7 @@
 					}}
 				>
 					<div class=" text-xl md:text-2xl font-bold">
-						{mode === 'signin' ? 'Sign in' : 'Sign up'} to Ollama Web UI
+						{mode === 'signin' ? 'Sign in' : 'Sign up'} to {WEBUI_NAME}
 					</div>
 
 					<div class="flex flex-col mt-4">