llms-py 3.0.0b5__py3-none-any.whl → 3.0.0b7__py3-none-any.whl

llms/ui/ctx.mjs

@@ -19,6 +19,9 @@ export class ExtensionScope {
     setPrefs(o) {
         storageObject(this.storageKey, Object.assign(this.prefs, o))
     }
+    savePrefs() {
+        storageObject(this.storageKey, this.prefs)
+    }
     get(url, options) {
         return this.ctx.ai.get(combinePaths(this.baseUrl, url), options)
     }
@@ -28,6 +31,9 @@ export class ExtensionScope {
     post(url, options) {
         return this.ctx.ai.post(combinePaths(this.baseUrl, url), options)
     }
+    async postForm(url, options) {
+        return await this.ctx.ai.postForm(combinePaths(this.baseUrl, url), options)
+    }
     async postJson(url, options) {
         return this.ctx.ai.postJson(combinePaths(this.baseUrl, url), options)
     }
@@ -55,6 +61,8 @@ export class AppContext {
         this.left = {}
         this.layout = reactive(storageObject(`llms.layout`))
         this.prefs = reactive(storageObject(ai.prefsKey))
+        this._onRouterBeforeEach = []
+        this._onClass = []
 
         if (!Array.isArray(this.layout.hide)) {
             this.layout.hide = []
@@ -182,24 +190,74 @@ export class AppContext {
     layoutVisible(key) {
         return !this.layout.hide.includes(key)
     }
-    toggleTop(name) {
-        console.log('toggleTop', name)
-        this.layout.top = this.layout.top == name ? undefined : name
+    toggleTop(name, toggle) {
+        if (toggle === false) {
+            this.layout.top = undefined
+        } else if (toggle === true) {
+            this.layout.top = name
+        } else {
+            this.layout.top = this.layout.top == name ? undefined : name
+        }
         storageObject(`llms.layout`, this.layout)
+        console.log('toggleTop', name, toggle, this.layout.top, this.layout.top === name)
+        return this.layout.top === name
     }
-    togglePath(path) {
+    togglePath(path, toggle) {
         const currentPath = this.router.currentRoute.value?.path
-        console.log('togglePath', path, currentPath)
-        if (currentPath == path) {
-            this.toggleLayout('left')
-        } else {
+        console.log('togglePath', path, currentPath, toggle)
+        if (currentPath != path) {
+            if (toggle === undefined) {
+                toggle = true
+            }
             this.router.push({ path })
         }
+        this.toggleLayout('left', toggle)
+        return toggle
     }
-    getJson(url, options) {
-        return this.ai.getJson(url, options)
+    async getJson(url, options) {
+        return await this.ai.getJson(url, options)
+    }
+    async post(url, options) {
+        return await this.ai.post(url, options)
+    }
+    async postForm(url, options) {
+        return await this.ai.postForm(url, options)
+    }
+    async postJson(url, options) {
+        return await this.ai.postJson(url, options)
     }
-    postJson(url, options) {
-        return this.ai.postJson(url, options)
+    to(route) {
+        if (typeof route == 'string') {
+            route = route.startsWith(this.ai.base)
+                ? route
+                : combinePaths(this.ai.base, route)
+            const path = { path: route }
+            console.log('to', path)
+            this.router.push(path)
+        } else {
+            route.path = route.path.startsWith(this.ai.base)
+                ? route.path
+                : combinePaths(this.ai.base, route.path)
+            console.log('to', route)
+            this.router.push(route)
+        }
+    }
+
+    // Events
+    onRouterBeforeEach(callback) {
+        this._onRouterBeforeEach.push(callback)
+    }
+
+    onClass(callback) {
+        this._onClass.push(callback)
+    }
+
+    cls(id, cls) {
+        if (this._onClass.length) {
+            this._onClass.forEach(callback => {
+                cls = callback(id, cls) ?? cls
+            })
+        }
+        return cls
     }
 }

llms/ui/index.mjs

@@ -8,8 +8,6 @@ import LayoutModule from './modules/layout.mjs'
 import ChatModule from './modules/chat/index.mjs'
 import ThreadsModule from './modules/threads/index.mjs'
 import ModelSelectorModule from './modules/model-selector.mjs'
-import AnalyticsModule from './modules/analytics.mjs'
-import ToolsModule from './modules/tools.mjs'
 import { utilsFunctions, utilsFormatters } from './utils.mjs'
 import { markdownFormatters } from './markdown.mjs'
 import { AppContext } from './ctx.mjs'
@@ -22,8 +20,6 @@ const BuiltInModules = {
     ChatModule,
     ThreadsModule,
     ModelSelectorModule,
-    AnalyticsModule,
-    ToolsModule,
 }
 
 
@@ -48,13 +44,17 @@ export async function createContext() {
     ctx.modules = await Promise.all(validExtensions.map(async extension => {
         try {
             const module = await import(extension.path)
-            return { extension, module }
+            const order = module.default.order || 0
+            return { extension, module, order }
         } catch (e) {
             console.error(`Failed to load extension module ${extension.name}:`, e)
             return null
         }
     }))
 
+    // sort modules by order
+    ctx.modules.sort((a, b) => a.order - b.order)
+
     const installedModules = []
 
     // Install built-in modules sequentially
@@ -103,10 +103,15 @@ export async function createContext() {
         document.title = title
         return true
     })
+    ctx._onRouterBeforeEach.forEach(ctx.router.beforeEach)
 
-    if (ctx.layout.path && location.pathname === '/' && !location.search) {
-        console.log('redirecting to saved path: ', ctx.layout.path)
-        ctx.router.push({ path: ctx.layout.path })
+    if (ai.hasAccess) {
+        if (ctx.layout.path && location.pathname === '/' && !location.search) {
+            console.log('redirecting to saved path: ', ctx.layout.path)
+            ctx.router.push({ path: ctx.layout.path })
+        }
+    } else {
+        ctx.router.push({ path: '/' })
     }
 
     const loadModules = installedModules.filter(x => x.module.default && x.module.default.load)

llms/ui/modules/chat/ChatBody.mjs

@@ -14,58 +14,7 @@ export default {
                     <!-- Welcome message when no thread is selected -->
                     <div v-else-if="!currentThread" class="text-center py-12">
                         <Welcome />
-
-                        <!-- Chat input for new conversation -->
-                        <!-- Moved to bottom input area -->
-                        <div class="h-2"></div>
-
-                        <!-- Export/Import buttons -->
-                        <div class="mt-2 flex space-x-3 justify-center items-center">
-                            <button type="button"
-                                @click="(e) => e.altKey ? exportRequests() : exportThreads()"
-                                :disabled="isExporting"
-                                :title="'Export ' + threads?.threads?.value?.length + ' conversations'"
-                                class="inline-flex items-center px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
-                            >
-                                <svg v-if="!isExporting" class="size-5 mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                                    <path fill="currentColor" d="m12 16l-5-5l1.4-1.45l2.6 2.6V4h2v8.15l2.6-2.6L17 11zm-6 4q-.825 0-1.412-.587T4 18v-3h2v3h12v-3h2v3q0 .825-.587 1.413T18 20z"></path>
-                                </svg>
-                                <svg v-else class="size-5 mr-1 animate-spin" fill="none" viewBox="0 0 24 24">
-                                    <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-                                    <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
-                                </svg>
-                                {{ isExporting ? 'Exporting...' : 'Export' }}
-                            </button>
-
-                            <button type="button"
-                                @click="triggerImport"
-                                :disabled="isImporting"
-                                title="Import conversations from JSON file"
-                                class="inline-flex items-center px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed"
-                            >
-                                <svg v-if="!isImporting" class="size-5 mr-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
-                                    <path fill="currentColor" d="m14 12l-4-4v3H2v2h8v3m10 2V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v3h2V6h12v12H6v-3H4v3a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2"/>
-                                </svg>
-                                <svg v-else class="size-5 mr-1 animate-spin" fill="none" viewBox="0 0 24 24">
-                                    <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
-                                    <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
-                                </svg>
-                                {{ isImporting ? 'Importing...' : 'Import' }}
-                            </button>
-
-                            <!-- Hidden file input for import -->
-                            <input
-                                ref="fileInput"
-                                type="file"
-                                accept=".json"
-                                @change="handleFileImport"
-                                class="hidden"
-                            />
-
-                            <DarkModeToggle />
-
-                        </div>
-
+                        <HomeTools />
                     </div>
 
                     <!-- Messages -->
@@ -228,6 +177,15 @@ export default {
                                     </template>
                                 </div>
 
+                                <!-- Assistant Audios -->
+                                <div v-if="message.audios && message.audios.length > 0" class="mt-2 flex flex-wrap gap-2">
+                                    <template v-for="(audio, i) in message.audios" :key="i">
+                                        <div v-if="audio.type === 'audio_url'" class="flex items-center gap-2 p-2 rounded-lg border border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800">
+                                            <audio controls :src="resolveUrl(audio.audio_url.url)" class="h-8 w-64"></audio>
+                                        </div>
+                                    </template>
+                                </div>
+
                                 <!-- User Message with separate attachments -->
                                 <div v-else-if="message.role !== 'assistant' && message.role !== 'tool'">
                                     <div v-html="$fmt.markdown(message.content)" class="prose prose-sm max-w-none dark:prose-invert break-words"></div>
@@ -355,7 +313,7 @@ export default {
             </div>
 
             <!-- Input Area -->
-            <div v-if="$ai.hasAccess" class="flex-shrink-0 border-t border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 px-6 py-4">
+            <div v-if="$ai.hasAccess" :class="$ctx.cls('chat-input', 'flex-shrink-0 border-t border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 px-6 py-4')">
                 <ChatPrompt :model="$chat.getSelectedModel()" />
             </div>
             
@@ -395,9 +353,6 @@ export default {
             return models.find(m => m.name === selectedModel.value) || models.find(m => m.id === selectedModel.value)
         })
         const messagesContainer = ref(null)
-        const isExporting = ref(false)
-        const isImporting = ref(false)
-        const fileInput = ref(null)
         const copying = ref(null)
         const lightboxUrl = ref(null)
 
@@ -446,191 +401,6 @@ export default {
                 model: selectedModel.value,
             })
         })
-
-        async function exportThreads() {
-            if (isExporting.value) return
-
-            isExporting.value = true
-            try {
-                // Load all threads from IndexedDB
-                await threads.loadThreads()
-                const allThreads = threads.threads.value
-
-                // Create export data with metadata
-                const exportData = {
-                    exportedAt: new Date().toISOString(),
-                    version: '1.0',
-                    source: 'llmspy',
-                    threadCount: allThreads.length,
-                    threads: allThreads
-                }
-
-                // Create and download JSON file
-                const jsonString = JSON.stringify(exportData, null, 2)
-                const blob = new Blob([jsonString], { type: 'application/json' })
-                const url = URL.createObjectURL(blob)
-
-                const link = document.createElement('a')
-                link.href = url
-                link.download = `llmsthreads-export-${new Date().toISOString().split('T')[0]}.json`
-                document.body.appendChild(link)
-                link.click()
-                document.body.removeChild(link)
-                URL.revokeObjectURL(url)
-
-            } catch (error) {
-                console.error('Failed to export threads:', error)
-                alert('Failed to export threads: ' + error.message)
-            } finally {
-                isExporting.value = false
-            }
-        }
-
-        async function exportRequests() {
-            if (isExporting.value) return
-
-            isExporting.value = true
-            try {
-                // Load all threads from IndexedDB
-                const allRequests = await threads.getAllRequests()
-
-                // Create export data with metadata
-                const exportData = {
-                    exportedAt: new Date().toISOString(),
-                    version: '1.0',
-                    source: 'llmspy',
-                    requestsCount: allRequests.length,
-                    requests: allRequests
-                }
-
-                // Create and download JSON file
-                const jsonString = JSON.stringify(exportData, null, 2)
-                const blob = new Blob([jsonString], { type: 'application/json' })
-                const url = URL.createObjectURL(blob)
-
-                const link = document.createElement('a')
-                link.href = url
-                link.download = `llmsrequests-export-${new Date().toISOString().split('T')[0]}.json`
-                document.body.appendChild(link)
-                link.click()
-                document.body.removeChild(link)
-                URL.revokeObjectURL(url)
-
-            } catch (error) {
-                console.error('Failed to export requests:', error)
-                alert('Failed to export requests: ' + error.message)
-            } finally {
-                isExporting.value = false
-            }
-        }
-
-        function triggerImport() {
-            if (isImporting.value) return
-            fileInput.value?.click()
-        }
-
-        async function handleFileImport(event) {
-            const file = event.target.files?.[0]
-            if (!file) return
-
-            isImporting.value = true
-            var importType = 'threads'
-            try {
-                const text = await file.text()
-                const importData = JSON.parse(text)
-                importType = importData.threads
-                    ? 'threads'
-                    : importData.requests
-                        ? 'requests'
-                        : 'unknown'
-
-                // Import threads one by one
-                let importedCount = 0
-                let existingCount = 0
-
-                const db = await threads.initDB()
-
-                if (importData.threads) {
-                    if (!Array.isArray(importData.threads)) {
-                        throw new Error('Invalid import file: missing or invalid threads array')
-                    }
-
-                    const threadIds = new Set(await threads.getAllThreadIds())
-
-                    for (const threadData of importData.threads) {
-                        if (!threadData.id) {
-                            console.warn('Skipping thread without ID:', threadData)
-                            continue
-                        }
-
-                        try {
-                            // Check if thread already exists
-                            const existingThread = threadIds.has(threadData.id)
-                            if (existingThread) {
-                                existingCount++
-                            } else {
-                                // Add new thread directly to IndexedDB
-                                const tx = db.transaction(['threads'], 'readwrite')
-                                await tx.objectStore('threads').add(threadData)
-                                await tx.complete
-                                importedCount++
-                            }
-                        } catch (error) {
-                            console.error('Failed to import thread:', threadData.id, error)
-                        }
-                    }
-
-                    // Reload threads to reflect changes
-                    await threads.loadThreads()
-
-                    alert(`Import completed!\nNew threads: ${importedCount}\nExisting threads: ${existingCount}`)
-                }
-                if (importData.requests) {
-                    if (!Array.isArray(importData.requests)) {
-                        throw new Error('Invalid import file: missing or invalid requests array')
-                    }
-
-                    const requestIds = new Set(await threads.getAllRequestIds())
-
-                    for (const requestData of importData.requests) {
-                        if (!requestData.id) {
-                            console.warn('Skipping request without ID:', requestData)
-                            continue
-                        }
-
-                        try {
-                            // Check if request already exists
-                            const existingRequest = requestIds.has(requestData.id)
-                            if (existingRequest) {
-                                existingCount++
-                            } else {
-                                // Add new request directly to IndexedDB
-                                const db = await threads.initDB()
-                                const tx = db.transaction(['requests'], 'readwrite')
-                                await tx.objectStore('requests').add(requestData)
-                                await tx.complete
-                                importedCount++
-                            }
-                        } catch (error) {
-                            console.error('Failed to import request:', requestData.id, error)
-                        }
-                    }
-
-                    alert(`Import completed!\nNew requests: ${importedCount}\nExisting requests: ${existingCount}`)
-                }
-
-            } catch (error) {
-                console.error('Failed to import ' + importType + ':', error)
-                alert('Failed to import ' + importType + ': ' + error.message)
-            } finally {
-                isImporting.value = false
-                // Clear the file input
-                if (fileInput.value) {
-                    fileInput.value.value = ''
-                }
-            }
-        }
-
         function configUpdated() {
             console.log('configUpdated', selectedModel.value, models.length, models.includes(selectedModel.value))
             if (selectedModel.value && !models.includes(selectedModel.value)) {
@@ -884,13 +654,6 @@ export default {
             editMessage,
             cancelRequest,
             configUpdated,
-            exportThreads,
-            exportRequests,
-            isExporting,
-            triggerImport,
-            handleFileImport,
-            isImporting,
-            fileInput,
             tokensTitle,
             getAttachments,
             hasAttachments,