POC: New OWU chat route to start

.env.dev.example

@@ -0,0 +1,11 @@
+# .env for docker-compose.dev.yaml
+
+# False = no login screen, the developer is automatically logged in upon opening the root
+WEBUI_AUTH=False
+# Set this to an arbitrary random string if WEBUI_AUTH=True
+WEBUI_SECRET_KEY="< generate some random string >"
+
+# DO NOT TRACK
+SCARF_NO_ANALYTICS=true
+DO_NOT_TRACK=true
+ANONYMIZED_TELEMETRY=false

.gitignore

@@ -6,6 +6,7 @@ node_modules
 .env
 .env.*
 !.env.example
+!.env.dev.example
 vite.config.js.timestamp-*
 vite.config.ts.timestamp-*
 # Byte-compiled / optimized / DLL files

Dockerfile

@@ -31,6 +31,10 @@ RUN npm ci
 
 COPY . .
 ENV APP_BUILD_HASH=${BUILD_HASH}
+# Necessary on some systems, maybe only for Podman otherwise the build fails with
+# FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
+ENV NODE_OPTIONS=--max-old-space-size=3100
+RUN echo "PUBLIC_FEEDBACK_BASE_URL=" > .env
 RUN npm run build
 
 ######## WebUI backend ########

backend/open_webui/config.py

@@ -827,6 +827,8 @@ def load_oauth_providers():
     "WEBHOOK_URL", "webhook_url", os.environ.get("WEBHOOK_URL", "")
 )
 
+ENABLE_MODEL_INFOS = os.environ.get("ENABLE_MODEL_INFOS", "True").lower() == "true"
+
 ENABLE_ADMIN_EXPORT = os.environ.get("ENABLE_ADMIN_EXPORT", "True").lower() == "true"
 
 ENABLE_ADMIN_CHAT_ACCESS = (

backend/open_webui/main.py

@@ -72,6 +72,7 @@
     DEFAULT_LOCALE,
     ENABLE_ADMIN_CHAT_ACCESS,
     ENABLE_ADMIN_EXPORT,
+    ENABLE_MODEL_INFOS,
     ENABLE_OLLAMA_API,
     ENABLE_OPENAI_API,
     ENABLE_TAGS_GENERATION,
@@ -2439,6 +2440,7 @@ async def get_app_config(request: Request):
                     "enable_message_rating": webui_app.state.config.ENABLE_MESSAGE_RATING,
                     "enable_admin_export": ENABLE_ADMIN_EXPORT,
                     "enable_admin_chat_access": ENABLE_ADMIN_CHAT_ACCESS,
+                    "enable_model_infos": ENABLE_MODEL_INFOS,
                 }
                 if user is not None
                 else {}

docker-compose.dev.yaml

@@ -0,0 +1,42 @@
+name: open-webui-dev
+
+services:
+  frontend:
+    build:
+      context: .
+      target: build
+    command: ["sh", "/app/src/frontend-dev.sh"]
+    env_file: ".env"
+    depends_on:
+      - backend
+    ports:
+      - "3000:5173"
+    extra_hosts:
+      - host.docker.internal:127.0.0.1
+    volumes:
+      - ./src:/app/src
+      - ./package.json:/app/package.json
+      - ./package-lock.json:/app/package-lock.json
+      - ./vite.config.ts:/app/vite.config.ts
+      - ./svelte.config.js:/app/svelte.config.js
+      - ./tsconfig.json:/app/tsconfig.json
+      - ./tailwind.config.js:/app/tailwind.config.js
+
+  backend:
+    build:
+      context: .
+      target: base
+    command: ["bash", "dev.sh"]
+    env_file: ".env"
+    environment:
+      - ENV=dev
+    ports:
+      - "8080:8080"
+    extra_hosts:
+      - host.docker.internal:127.0.0.1
+    volumes:
+      - ./backend:/app/backend
+      - data:/app/backend/data
+
+volumes:
+  data: {}

src/app.css

@@ -61,7 +61,7 @@ math {
 }
 
 .font-primary {
-	font-family: 'Archivo', sans-serif;
+	font-family: var(--default-font-regular, 'OpenSansSemibold', arial, sans-serif);
 }
 
 iframe {
@@ -215,3 +215,7 @@ input[type='number'] {
 
 	@apply absolute inset-0 z-0 text-gray-500;
 }
+
+body {
+	background-color: var(--primary-background-color);
+}

src/app.html

@@ -28,6 +28,9 @@
 		<script>
 			// On page load or when changing themes, best to add inline in `head` to avoid FOUC
 			(() => {
+				// force exos theme
+				localStorage.theme = 'exos';
+
 				const metaThemeColorTag = document.querySelector('meta[name="theme-color"]');
 				const prefersDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
 
@@ -52,12 +55,18 @@
 					document.documentElement.classList.add('dark');
 					document.documentElement.classList.add('her');
 					metaThemeColorTag.setAttribute('content', '#983724');
+				} else if (localStorage.theme === 'exos') {
+					// disable else logic
 				} else {
 					document.documentElement.classList.add('dark');
 					metaThemeColorTag.setAttribute('content', '#171717');
 				}
 
 				window.matchMedia('(prefers-color-scheme: dark)').addListener((e) => {
+					if (localStorage.theme === 'exos') {
+						// no dark mode for exos
+						return;
+					}
 					if (localStorage.theme === 'system') {
 						if (e.matches) {
 							document.documentElement.classList.add('dark');