[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_429":430,"_431":432},"routes/_app.x.$handle.$name",{"_97":96,"_31":44,"_105":87,"_26":52,"_13":14,"_106":-5,"_11":107,"_108":109,"_110":111,"_112":113,"_114":115,"_20":-5,"_116":-5,"_117":-5,"_118":24,"_119":120,"_121":24,"_122":-5,"_123":-5,"_124":125},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_42":43,"_31":44,"_37":45,"_46":-5,"_47":24,"_48":49,"_50":49,"_51":52,"_53":-5,"_18":54,"_55":-5,"_56":24,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":64,"_65":66,"_67":68,"_69":-5,"_70":71,"_72":71,"_73":74,"_75":74,"_76":74,"_77":71,"_78":71,"_79":80,"_81":82,"_83":84,"_85":24},"version",32,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":-7,"_23":24,"_25":24,"_26":27,"_28":27},"file",{"_29":30,"_31":32,"_33":34,"_35":36,"_37":38,"_39":14,"_40":41,"_23":24},"previous","deleted",false,"deletedHere","path","frontend/app/storage.js","latestPath","fileId","0be9b5fa-e2e9-11f0-b39b-42dde27851f2","name","storage.js","fileType","script","content","/**\n * Chat App Storage - LocalStorage persistence\n * \n * Unified chat structure: chats = { [chatId]: { messages: [], metadata: {...} } }\n */\n\nconst STORAGE_KEY = 'chatapp-data';\nconst API_KEYS_STORAGE_KEY = 'chatapp-api-keys'; // Separate storage for API keys\n\nimport { createChatMetadata, createChatData } from './state.js';\n\nexport function createStorageMethods() {\n return {\n // Migrate old storage format to new unified format\n migrateStorageFormat(data) {\n // Check if already in new format (chats have .messages property)\n var firstChatId = Object.keys(data.chats || {})[0];\n if (firstChatId && data.chats[firstChatId] && data.chats[firstChatId].messages !== undefined) {\n console.log('[Storage] Already in new unified format');\n return data;\n }\n \n // Old format detected - migrate\n console.log('[Storage] Migrating from old format to unified chat structure...');\n var migratedChats = {};\n var oldChats = data.chats || {};\n var oldMetadata = data.chatMetadata || {};\n \n Object.keys(oldChats).forEach(function(chatId) {\n var messages = oldChats[chatId];\n var metadata = oldMetadata[chatId] || createChatMetadata();\n migratedChats[chatId] = {\n messages: Array.isArray(messages) ? messages : [],\n metadata: metadata\n };\n });\n \n // Also migrate any metadata that exists without corresponding messages\n Object.keys(oldMetadata).forEach(function(chatId) {\n if (!migratedChats[chatId]) {\n migratedChats[chatId] = {\n messages: [],\n metadata: oldMetadata[chatId]\n };\n }\n });\n \n data.chats = migratedChats;\n delete data.chatMetadata; // Remove old format\n \n console.log('[Storage] Migration complete, migrated', Object.keys(migratedChats).length, 'chats');\n return data;\n },\n \n loadFromStorage() {\n var self = this;\n console.log('[Storage] Loading from storage...');\n \n // CRITICAL: Ensure messages is ALWAYS an array before any async operations\n // This prevents Alpine template errors during initialization\n if (!Array.isArray(self.messages)) {\n self.messages = [];\n }\n \n try {\n var stored = localStorage.getItem(STORAGE_KEY);\n if (stored) {\n var data = JSON.parse(stored);\n \n // Migrate old format if necessary\n data = self.migrateStorageFormat(data);\n \n console.log('[Storage] Parsed data, activeChatId:', data.activeChatId, 'items count:', (data.items || []).length);\n \n self.folders = Array.isArray(data.folders) ? data.folders : [];\n self.items = Array.isArray(data.items) ? data.items : [];\n self.chats = (data.chats && typeof data.chats === 'object') ? data.chats : {};\n self.nextFolderId = data.nextFolderId || 1;\n self.nextItemId = data.nextItemId || 1;\n // Store the saved active chat ID but don't set it yet\n var savedActiveChatId = data.activeChatId || null;\n \n // Ensure all messages in all chats have valid IDs\n Object.keys(self.chats).forEach(function(chatId) {\n var chat = self.chats[chatId];\n if (chat && chat.messages) {\n chat.messages = self.ensureMessageIds(chat.messages);\n }\n });\n \n // Defer active chat selection to after Alpine initializes\n var chatData = savedActiveChatId ? self.chats[savedActiveChatId] : null;\n if (savedActiveChatId && chatData && chatData.messages) {\n console.log('[Storage] Deferring chat selection to $nextTick');\n self.$nextTick(function() {\n console.log('[Storage] In $nextTick, setting activeChatId:', savedActiveChatId);\n var chatMessages = chatData.messages;\n console.log('[Storage] Chat messages count:', chatMessages.length);\n if (Array.isArray(chatMessages)) {\n var processedMessages = self.ensureMessageIds(JSON.parse(JSON.stringify(chatMessages)));\n // Use Alpine's array replacement to ensure reactivity\n self.messages.length = 0; // Clear array\n processedMessages.forEach(function(msg) {\n self.messages.push(msg);\n });\n self.activeChatId = savedActiveChatId;\n console.log('[Storage] Loaded', self.messages.length, 'messages');\n \n // CRITICAL: Restore chat-specific model and settings after loading\n if (self.restoreChatModel) {\n self.restoreChatModel(savedActiveChatId);\n }\n if (self.loadCurrentChatSettings) {\n self.loadCurrentChatSettings();\n }\n } else {\n // Invalid chat data, reset\n console.log('[Storage] Invalid chat data, resetting');\n self.messages.length = 0;\n self.activeChatId = null;\n }\n });\n } else {\n console.log('[Storage] No active chat, messages already initialized as empty array');\n self.activeChatId = null;\n }\n } else {\n console.log('[Storage] No stored data found, messages already initialized');\n self.activeChatId = null;\n }\n } catch (e) {\n console.warn('Failed to load chat data:', e);\n // Reset to safe state on error\n self.messages.length = 0;\n self.chats = {};\n self.folders = [];\n self.items = [];\n self.activeChatId = null;\n }\n \n // Load API keys separately\n self.loadApiKeys();\n },\n \n // Ensure all messages have valid and UNIQUE IDs (required for x-for :key)\n ensureMessageIds(messages) {\n if (!Array.isArray(messages)) return [];\n var baseTime = Date.now();\n var usedIds = new Set();\n \n return messages.filter(function(msg) {\n // Filter out completely invalid messages\n return msg && typeof msg === 'object';\n }).map(function(msg, index) {\n // Clone to avoid mutating original\n var clone = Object.assign({}, msg);\n // Ensure role exists first (default to 'user')\n if (!clone.role) clone.role = 'user';\n \n // Ensure id is a valid primitive (number or string) and UNIQUE\n var currentId = clone.id;\n if (currentId === undefined || currentId === null || typeof currentId === 'object' || usedIds.has(currentId)) {\n // Generate unique ID with role prefix to prevent collisions\n var randomPart = Math.random().toString(36).substr(2, 9);\n clone.id = clone.role + '-' + baseTime + '-' + index + '-' + randomPart;\n }\n usedIds.add(clone.id);\n // Ensure content exists\n if (clone.content === undefined) clone.content = '';\n return clone;\n });\n },\n \n saveToStorage() {\n // Check if auto-save is enabled\n if (!this.settings?.autoSave) {\n return;\n }\n \n try {\n // Save current messages to active chat (unified structure)\n if (this.activeChatId && Array.isArray(this.messages)) {\n // Ensure chat exists with proper structure\n if (!this.chats[this.activeChatId]) {\n this.chats[this.activeChatId] = createChatData();\n }\n // Update messages\n this.chats[this.activeChatId].messages = JSON.parse(JSON.stringify(this.messages));\n }\n \n const data = {\n folders: this.folders,\n items: this.items,\n chats: this.chats,\n nextFolderId: this.nextFolderId,\n nextItemId: this.nextItemId,\n activeChatId: this.activeChatId,\n };\n localStorage.setItem(STORAGE_KEY, JSON.stringify(data));\n } catch (e) {\n console.warn('Failed to save chat data:', e);\n }\n },\n \n // Force save regardless of auto-save setting\n forceSave() {\n try {\n // Save current messages to active chat (unified structure)\n if (this.activeChatId && Array.isArray(this.messages)) {\n if (!this.chats[this.activeChatId]) {\n this.chats[this.activeChatId] = createChatData();\n }\n this.chats[this.activeChatId].messages = JSON.parse(JSON.stringify(this.messages));\n }\n \n const data = {\n folders: this.folders,\n items: this.items,\n chats: this.chats,\n nextFolderId: this.nextFolderId,\n nextItemId: this.nextItemId,\n activeChatId: this.activeChatId,\n };\n localStorage.setItem(STORAGE_KEY, JSON.stringify(data));\n } catch (e) {\n console.warn('Failed to save chat data:', e);\n }\n },\n \n // Clear all storage data (for testing/debugging)\n clearStorage() {\n try {\n localStorage.removeItem(STORAGE_KEY);\n // Clear arrays without replacing references\n this.messages.length = 0;\n this.folders.length = 0;\n this.items.length = 0;\n this.chats = {};\n this.activeChatId = null;\n this.nextFolderId = 1;\n this.nextItemId = 1;\n console.log('[Storage] Cleared all chat data');\n } catch (e) {\n console.warn('Failed to clear storage:', e);\n }\n },\n \n // Helper to get chat metadata (from unified structure)\n getChatMetadata(chatId) {\n if (!chatId || !this.chats[chatId]) {\n return null;\n }\n return this.chats[chatId].metadata || null;\n },\n \n // Helper to update chat metadata\n updateChatMetadata(chatId, updates) {\n if (!chatId) return;\n \n // Ensure chat exists\n if (!this.chats[chatId]) {\n this.chats[chatId] = createChatData();\n }\n \n // Ensure metadata exists\n if (!this.chats[chatId].metadata) {\n this.chats[chatId].metadata = createChatMetadata();\n }\n \n // Apply updates\n Object.assign(this.chats[chatId].metadata, updates);\n this.chats[chatId].metadata.updatedAt = new Date().toISOString();\n },\n \n // =========================================================================\n // API Key Management\n // =========================================================================\n \n loadApiKeys() {\n try {\n var stored = localStorage.getItem(API_KEYS_STORAGE_KEY);\n if (stored) {\n var keys = JSON.parse(stored);\n this.apiKeys = Object.assign({\n groq: '',\n openai: '',\n anthropic: ''\n }, keys);\n console.log('[Storage] Loaded API keys for providers:', Object.keys(this.apiKeys).filter(k => this.apiKeys[k]));\n }\n } catch (e) {\n console.warn('Failed to load API keys:', e);\n }\n },\n \n saveApiKeys() {\n try {\n localStorage.setItem(API_KEYS_STORAGE_KEY, JSON.stringify(this.apiKeys));\n console.log('[Storage] Saved API keys');\n } catch (e) {\n console.warn('Failed to save API keys:', e);\n }\n },\n \n updateApiKey(provider, key) {\n this.apiKeys[provider] = key;\n this.saveApiKeys();\n // Show toast notification\n if (window.toast) {\n window.toast('API key saved!', { type: 'success' });\n }\n },\n \n getApiKey(provider) {\n return this.apiKeys[provider] || '';\n },\n \n clearApiKeys() {\n this.apiKeys = {\n groq: '',\n openai: '',\n anthropic: ''\n };\n localStorage.removeItem(API_KEYS_STORAGE_KEY);\n console.log('[Storage] Cleared all API keys');\n },\n };\n}\n","createdAt",["D",1766815100356],"branchVersion","branchId","eb028344-e2e8-11f0-bb4a-42dde27851f2","id","eb0227b4-e2e8-11f0-bb4a-42dde27851f2","chat",["D",1766815045152],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","","imageUrl","a8270e74-6479-475a-8025-9b69544ee0e7","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","8319defa-6e1a-46d4-ba66-2114ffd3360b","tursoName","eb0227b4e2e811f0bb4a42dde27851f2","tursoHostname","eb0227b4e2e811f0bb4a42dde27851f2-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789530642963],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_97":96,"_104":100},"org",{"_97":96,"_98":-5,"_99":100,"_18":54,"_101":102,"_103":24},"branch",{"_13":86,"_31":87,"_42":41,"_88":43,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":44,"_95":96},"isOwned",206,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","yawnxyz","handle","displayName","avatar","https://images.clerk.dev/oauth_github/img_2NnaHhpxNuH1xWRIRjQNoo16TVc.jpeg","tier","pro","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_42":43,"_31":44,"_37":424,"_46":-5,"_47":24,"_48":49,"_50":49,"_51":52,"_53":-5,"_18":54,"_55":-5,"_56":24,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":64,"_65":66,"_67":425,"_69":-5,"_70":71,"_72":71,"_73":74,"_75":74,"_76":74,"_77":71,"_78":71,"_79":426,"_81":427,"_83":428,"_85":24},"tree",[182,185,186,187,212,213],"files",[182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200,201,202,203,204,205,206,207,208,209,210,211,212,213],"counts",{"_172":60,"_173":152,"_174":60,"_175":176,"_177":178},"contents",[126,127,128,129,130,131],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_42":166,"_31":167,"_29":168,"_135":-5,"_40":41,"_39":169,"_137":145,"_37":170,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_26":171},{"_42":161,"_31":44,"_29":162,"_135":-5,"_40":41,"_39":163,"_137":24,"_37":164,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_26":165},{"_42":155,"_31":156,"_29":157,"_135":-5,"_40":41,"_39":158,"_137":24,"_37":159,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_26":160},{"_42":149,"_31":150,"_29":151,"_135":-5,"_40":41,"_39":152,"_137":145,"_37":153,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_26":154},{"_42":142,"_31":49,"_29":143,"_135":-5,"_40":41,"_39":144,"_137":145,"_37":146,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_26":148},{"_42":132,"_31":133,"_29":134,"_135":-5,"_40":41,"_39":136,"_137":24,"_37":138,"_13":60,"_33":34,"_35":139,"_23":24,"_140":-5,"_26":141},"0b7e66a6-e2e9-11f0-9dc9-42dde27851f2","main.tsx","0b7e6782-e2e9-11f0-9dc9-42dde27851f2","parentId",19,"latest",["D",1766815099653],"// Chat App - Standalone Hono Server with Monaco support\n// Can run independently with: deno task serve\nimport { createApp } from \"./backend/index.ts\";\n\nconst app = createApp(import.meta.url);\n\n// Export app.fetch for Val Town, otherwise export app — this is only for hono apps\nexport default (typeof Deno !== \"undefined\" && Deno.env.get(\"valtown\")) ? app.fetch : app;\n","label",[133],"0a230460-e2e9-11f0-b141-42dde27851f2","0a230546-e2e9-11f0-b141-42dde27851f2",5,true,["D",1766815097374],"directory",[49],"09c1524c-e2e9-11f0-b941-42dde27851f2","frontend","09c152e2-e2e9-11f0-b941-42dde27851f2",1,["D",1766815096734],[150],"09f10fa0-e2e9-11f0-8ff9-42dde27851f2","chatter","09f11054-e2e9-11f0-8ff9-42dde27851f2",3,["D",1766815097047],[156],"09d7d6ca-e2e9-11f0-a5e5-42dde27851f2","09d7d7ba-e2e9-11f0-a5e5-42dde27851f2",2,["D",1766815096882],[44],"0a094de0-e2e9-11f0-8ff9-42dde27851f2","backend","0a094ebc-e2e9-11f0-8ff9-42dde27851f2",4,["D",1766815097206],[167],"pulls","branches","forks","envVars",{"_179":60,"_181":60},"connections",{"_179":60,"_180":60},"count","unfilledCount","emptyCount",{"_42":166,"_31":167,"_29":168,"_135":-5,"_40":41,"_39":169,"_137":145,"_37":421,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":422,"_26":423},{"_42":414,"_31":415,"_29":416,"_135":168,"_40":41,"_39":417,"_137":145,"_37":418,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":419,"_26":420},{"_42":407,"_31":408,"_29":409,"_135":168,"_40":41,"_39":410,"_137":145,"_37":411,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":412,"_26":413},{"_42":161,"_31":44,"_29":162,"_135":-5,"_40":41,"_39":163,"_137":24,"_37":404,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":405,"_26":406},{"_42":155,"_31":156,"_29":157,"_135":-5,"_40":41,"_39":158,"_137":24,"_37":401,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":402,"_26":403},{"_42":149,"_31":150,"_29":151,"_135":-5,"_40":41,"_39":152,"_137":145,"_37":398,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":399,"_26":400},{"_42":393,"_31":300,"_29":294,"_135":151,"_40":41,"_39":394,"_137":145,"_37":395,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":396,"_26":397},{"_42":385,"_31":386,"_29":387,"_135":294,"_40":41,"_39":388,"_137":24,"_37":389,"_13":60,"_33":34,"_35":390,"_23":24,"_140":-5,"_215":391,"_26":392},{"_42":377,"_31":378,"_29":379,"_135":294,"_40":41,"_39":380,"_137":24,"_37":381,"_13":60,"_33":34,"_35":382,"_23":24,"_140":-5,"_215":383,"_26":384},{"_42":369,"_31":370,"_29":371,"_135":294,"_40":41,"_39":372,"_137":24,"_37":373,"_13":60,"_33":34,"_35":374,"_23":24,"_140":-5,"_215":375,"_26":376},{"_42":361,"_31":362,"_29":363,"_135":294,"_40":41,"_39":364,"_137":145,"_37":365,"_13":60,"_33":34,"_35":366,"_23":24,"_140":-5,"_215":367,"_26":368},{"_42":353,"_31":354,"_29":355,"_135":294,"_40":41,"_39":356,"_137":24,"_37":357,"_13":60,"_33":34,"_35":358,"_23":24,"_140":-5,"_215":359,"_26":360},{"_42":345,"_31":346,"_29":347,"_135":294,"_40":41,"_39":348,"_137":145,"_37":349,"_13":60,"_33":34,"_35":350,"_23":24,"_140":-5,"_215":351,"_26":352},{"_42":337,"_31":338,"_29":339,"_135":294,"_40":41,"_39":340,"_137":24,"_37":341,"_13":60,"_33":34,"_35":342,"_23":24,"_140":-5,"_215":343,"_26":344},{"_42":329,"_31":330,"_29":331,"_135":294,"_40":41,"_39":332,"_137":24,"_37":333,"_13":60,"_33":34,"_35":334,"_23":24,"_140":-5,"_215":335,"_26":336},{"_42":321,"_31":322,"_29":323,"_135":294,"_40":41,"_39":324,"_137":24,"_37":325,"_13":60,"_33":34,"_35":326,"_23":24,"_140":-5,"_215":327,"_26":328},{"_42":313,"_31":314,"_29":315,"_135":294,"_40":41,"_39":316,"_137":145,"_37":317,"_13":60,"_33":34,"_35":318,"_23":24,"_140":-5,"_215":319,"_26":320},{"_42":305,"_31":306,"_29":307,"_135":294,"_40":41,"_39":308,"_137":24,"_37":309,"_13":60,"_33":34,"_35":310,"_23":24,"_140":-5,"_215":311,"_26":312},{"_42":301,"_31":32,"_29":30,"_135":294,"_40":41,"_39":14,"_137":24,"_37":302,"_13":60,"_33":34,"_35":36,"_23":24,"_140":-5,"_215":303,"_26":304},{"_42":291,"_31":292,"_29":293,"_135":294,"_40":41,"_39":295,"_137":24,"_37":296,"_13":60,"_33":34,"_35":297,"_23":24,"_140":-5,"_215":298,"_26":299},{"_42":286,"_31":229,"_29":274,"_135":151,"_40":41,"_39":287,"_137":145,"_37":288,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":289,"_26":290},{"_42":279,"_31":280,"_29":281,"_135":274,"_40":41,"_39":282,"_137":145,"_37":283,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":284,"_26":285},{"_42":273,"_31":230,"_29":224,"_135":274,"_40":41,"_39":275,"_137":145,"_37":276,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":277,"_26":278},{"_42":266,"_31":267,"_29":268,"_135":224,"_40":41,"_39":269,"_137":145,"_37":270,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":271,"_26":272},{"_42":259,"_31":260,"_29":261,"_135":224,"_40":41,"_39":262,"_137":145,"_37":263,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":264,"_26":265},{"_42":252,"_31":253,"_29":254,"_135":224,"_40":41,"_39":255,"_137":145,"_37":256,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":257,"_26":258},{"_42":245,"_31":246,"_29":247,"_135":224,"_40":41,"_39":248,"_137":145,"_37":249,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":250,"_26":251},{"_42":238,"_31":239,"_29":240,"_135":224,"_40":41,"_39":241,"_137":145,"_37":242,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":243,"_26":244},{"_42":231,"_31":232,"_29":233,"_135":224,"_40":41,"_39":234,"_137":145,"_37":235,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":236,"_26":237},{"_42":221,"_31":222,"_29":223,"_135":224,"_40":41,"_39":225,"_137":145,"_37":226,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":227,"_26":228},{"_42":142,"_31":49,"_29":143,"_135":-5,"_40":41,"_39":144,"_137":145,"_37":218,"_13":60,"_33":147,"_35":-5,"_23":24,"_140":-5,"_215":219,"_26":220},{"_42":132,"_31":133,"_29":134,"_135":-5,"_40":41,"_39":136,"_137":24,"_37":214,"_13":60,"_33":34,"_35":139,"_23":24,"_140":-5,"_215":216,"_26":217},["D",1766815099653],"children",[],[133],["D",1766815097374],[],[49],"0b67b2d0-e2e9-11f0-9dc9-42dde27851f2","tokens","0b67b3ac-e2e9-11f0-9dc9-42dde27851f2","0ac3cc10-e2e9-11f0-9dc9-42dde27851f2",18,["D",1766815099504],[],[150,229,230,222],"styles","design-system","0b517092-e2e9-11f0-8ff9-42dde27851f2","startup","0b517128-e2e9-11f0-8ff9-42dde27851f2",17,["D",1766815099358],[],[150,229,230,232],"0b3a3fee-e2e9-11f0-b141-42dde27851f2","retro","0b3a40c0-e2e9-11f0-b141-42dde27851f2",16,["D",1766815099205],[],[150,229,230,239],"0af97dd8-e2e9-11f0-9dc9-42dde27851f2","luma","0af97e82-e2e9-11f0-9dc9-42dde27851f2",13,["D",1766815098782],[],[150,229,230,246],"0b0ef0d2-e2e9-11f0-8ff9-42dde27851f2","groq","0b0ef186-e2e9-11f0-8ff9-42dde27851f2",14,["D",1766815098922],[],[150,229,230,253],"0b2451b6-e2e9-11f0-b11e-42dde27851f2","default","0b245274-e2e9-11f0-b11e-42dde27851f2",15,["D",1766815099062],[],[150,229,230,260],"0ae1deee-e2e9-11f0-b941-42dde27851f2","corporate","0ae1dfb6-e2e9-11f0-b941-42dde27851f2",12,["D",1766815098617],[],[150,229,230,267],"0ac3cb52-e2e9-11f0-9dc9-42dde27851f2","0a5845a8-e2e9-11f0-8ff9-42dde27851f2",11,["D",1766815098430],[205,206,207,208,209,210,211],[150,229,230],"0aa9edea-e2e9-11f0-9dc9-42dde27851f2","components","0aa9eea8-e2e9-11f0-9dc9-42dde27851f2",10,["D",1766815098260],[],[150,229,280],"0a5844a4-e2e9-11f0-8ff9-42dde27851f2",7,["D",1766815097725],[203,204],[150,229],"0bba6ee4-e2e9-11f0-b141-42dde27851f2","threads.js","0bba70e2-e2e9-11f0-b141-42dde27851f2","0a3a8036-e2e9-11f0-9dc9-42dde27851f2",27,["D",1766815100044],"// =============================================================================\n// THREADS - Per-chat/thread state management and message parsing\n// =============================================================================\n// Each chat is a \"thread\" (like email threads). Manages thread state, \n// tracks job status, handles blockers, and provides message parsing\n// to extract reasoning/thinking tokens from various API formats.\n//\n// An \"orchestrator\" (to be built later) will manage multiple threads.\n\nvar THREADS_KEY = 'chatapp-threads';\n\n// Job status enum\nvar JobStatus = {\n PENDING: 'pending', // Job created, waiting to start\n RUNNING: 'running', // Job actively processing\n STREAMING: 'streaming', // Job streaming response\n BLOCKED: 'blocked', // Job blocked by a blocker (e.g., missing API key)\n COMPLETED: 'completed', // Job finished successfully\n ERROR: 'error', // Job failed with an error\n CANCELLED: 'cancelled', // Job was manually cancelled\n PAUSED: 'paused' // Job paused, can be resumed\n};\n\n// Blocker types\nvar BlockerType = {\n API_KEY_MISSING: 'api_key_missing',\n RATE_LIMIT: 'rate_limit',\n NETWORK_ERROR: 'network_error',\n PROVIDER_ERROR: 'provider_error',\n DEPENDENCY_FAILED: 'dependency_failed'\n};\n\n// Event types emitted by thread manager\nvar ThreadEvent = {\n JOB_CREATED: 'job:created',\n JOB_STARTED: 'job:started',\n JOB_STREAMING: 'job:streaming',\n JOB_PROGRESS: 'job:progress',\n JOB_COMPLETED: 'job:completed',\n JOB_FAILED: 'job:failed',\n JOB_BLOCKED: 'job:blocked',\n JOB_UNBLOCKED: 'job:unblocked',\n JOB_CANCELLED: 'job:cancelled',\n JOB_PAUSED: 'job:paused',\n JOB_RESUMED: 'job:resumed',\n BLOCKER_ADDED: 'blocker:added',\n BLOCKER_RESOLVED: 'blocker:resolved',\n STATE_CHANGED: 'state:changed'\n};\n\n// For backwards compatibility\nvar OrchestratorEvent = ThreadEvent;\n\nexport { JobStatus, BlockerType, ThreadEvent, OrchestratorEvent };\n\n// =============================================================================\n// MESSAGE PARSER - Extract reasoning, thinking, tool calls from various formats\n// =============================================================================\n\nexport function parseMessage(message) {\n if (!message) return null;\n \n var content = message.content || '';\n var reasoning = message.reasoning || null;\n var tools = message.tools || message.executedTools || [];\n \n // Parsed result object\n var parsed = {\n // Original message (kept intact for API calls)\n raw: message,\n \n // Clean content (for display, without think tags)\n content: content,\n \n // Extracted reasoning/thinking (for separate display)\n reasoning: reasoning,\n \n // Thinking extracted from content tags\n thinking: null,\n \n // Tool calls\n tools: Array.isArray(tools) ? tools : [],\n \n // Message role\n role: message.role || 'assistant',\n \n // Flags\n hasReasoning: !!reasoning,\n hasThinking: false,\n hasTools: Array.isArray(tools) && tools.length > 0\n };\n \n // Extract ... tags (Claude, some other models)\n var thinkTagMatch = content.match(/([\\s\\S]*?)<\\/think>/i);\n if (thinkTagMatch) {\n parsed.thinking = thinkTagMatch[1].trim();\n parsed.content = content.replace(/[\\s\\S]*?<\\/think>/gi, '').trim();\n parsed.hasThinking = true;\n }\n \n // Extract [think]...[/think] tags (alternative format)\n var thinkBracketMatch = content.match(/\\[think\\]([\\s\\S]*?)\\[\\/think\\]/i);\n if (thinkBracketMatch) {\n parsed.thinking = (parsed.thinking || '') + thinkBracketMatch[1].trim();\n parsed.content = parsed.content.replace(/\\[think\\][\\s\\S]*?\\[\\/think\\]/gi, '').trim();\n parsed.hasThinking = true;\n }\n \n // Extract ... tags (another variant)\n var thinkingTagMatch = content.match(/([\\s\\S]*?)<\\/thinking>/i);\n if (thinkingTagMatch) {\n parsed.thinking = (parsed.thinking || '') + thinkingTagMatch[1].trim();\n parsed.content = parsed.content.replace(/[\\s\\S]*?<\\/thinking>/gi, '').trim();\n parsed.hasThinking = true;\n }\n \n // Extract ```thinking ... ``` blocks\n var thinkingCodeMatch = content.match(/```thinking\\n?([\\s\\S]*?)```/i);\n if (thinkingCodeMatch) {\n parsed.thinking = (parsed.thinking || '') + thinkingCodeMatch[1].trim();\n parsed.content = parsed.content.replace(/```thinking\\n?[\\s\\S]*?```/gi, '').trim();\n parsed.hasThinking = true;\n }\n \n // If we have separate reasoning field from API, merge with thinking\n if (reasoning && !parsed.thinking) {\n parsed.thinking = reasoning;\n parsed.hasThinking = true;\n } else if (reasoning && parsed.thinking) {\n // Both exist - keep them separate but note it\n parsed.hasReasoning = true;\n }\n \n return parsed;\n}\n\n// Parse all messages in an array, returning both raw (for API) and parsed (for display)\nexport function parseMessages(messages) {\n if (!Array.isArray(messages)) return { raw: [], parsed: [] };\n \n return {\n // Raw messages for API calls (unchanged)\n raw: messages,\n \n // Parsed messages for display\n parsed: messages.map(function(msg) {\n if (msg.role === 'user') {\n // User messages don't need parsing\n return {\n raw: msg,\n content: msg.content,\n role: 'user',\n hasReasoning: false,\n hasThinking: false,\n hasTools: false\n };\n }\n return parseMessage(msg);\n })\n };\n}\n\n// Get display content for a message (clean, without think tags)\nexport function getDisplayContent(message) {\n var parsed = parseMessage(message);\n return parsed ? parsed.content : (message.content || '');\n}\n\n// Get thinking/reasoning for a message\nexport function getThinking(message) {\n var parsed = parseMessage(message);\n return parsed ? (parsed.thinking || parsed.reasoning) : null;\n}\n\nexport function createThreadsMixin() {\n return {\n // ==========================================================================\n // THREADS STATE\n // ==========================================================================\n \n threads: {\n // All tracked jobs: Map-like object { jobId: JobState }\n jobs: {},\n \n // Active blockers: Map-like object { blockerId: BlockerState }\n blockers: {},\n \n // Job dependencies: { jobId: [dependencyJobIds] }\n dependencies: {},\n \n // Event listeners: { eventType: [callbacks] }\n listeners: {},\n \n // Stats\n // Job dependencies: { jobId: [dependencyJobIds] }\n dependencies: {},\n \n // Event listeners: { eventType: [callbacks] }\n listeners: {},\n \n // Stats\n stats: {\n totalJobs: 0,\n completedJobs: 0,\n failedJobs: 0,\n blockedJobs: 0,\n activeJobs: 0,\n pendingJobs: 0,\n cancelledJobs: 0\n }\n },\n \n // Backwards compatibility alias\n get orchestrator() {\n return this.threads;\n },\n \n // ==========================================================================\n // INITIALIZATION\n // ==========================================================================\n \n initThreads: function() {\n console.log('[Threads] Initializing...');\n this.loadThreadsState();\n this.updateThreadsStats();\n \n var stats = this.threads.stats;\n console.log('[Threads] Initialized with', Object.keys(this.threads.jobs).length, 'jobs');\n console.log('[Threads] Stats:', \n 'active:', stats.activeJobs,\n 'blocked:', stats.blockedJobs, \n 'pending:', stats.pendingJobs,\n 'completed:', stats.completedJobs,\n 'failed:', stats.failedJobs\n );\n \n // Log all jobs for debugging\n if (Object.keys(this.threads.jobs).length > 0) {\n console.log('[Threads] All jobs:', this.threads.jobs);\n }\n },\n \n // Backwards compatibility\n initOrchestrator: function() {\n return this.initThreads();\n },\n \n loadThreadsState: function() {\n try {\n // Try new key first, fall back to old key for migration\n var stored = localStorage.getItem(THREADS_KEY) || localStorage.getItem('chatapp-orchestrator');\n if (stored) {\n var parsed = JSON.parse(stored);\n // Restore jobs but reset any \"running\" jobs to \"pending\" (they were interrupted)\n if (parsed.jobs) {\n var self = this;\n Object.keys(parsed.jobs).forEach(function(jobId) {\n var job = parsed.jobs[jobId];\n if (job.status === JobStatus.RUNNING || job.status === JobStatus.STREAMING) {\n job.status = JobStatus.PENDING;\n job.interruptedAt = Date.now();\n }\n self.threads.jobs[jobId] = job;\n });\n }\n if (parsed.blockers) {\n this.threads.blockers = parsed.blockers;\n }\n if (parsed.dependencies) {\n this.threads.dependencies = parsed.dependencies;\n }\n }\n } catch (e) {\n console.warn('[Threads] Failed to load state:', e);\n }\n },\n \n saveThreadsState: function() {\n try {\n var data = {\n jobs: this.threads.jobs,\n blockers: this.threads.blockers,\n dependencies: this.threads.dependencies,\n savedAt: Date.now()\n };\n localStorage.setItem(THREADS_KEY, JSON.stringify(data));\n // Clean up old key if it exists\n localStorage.removeItem('chatapp-orchestrator');\n } catch (e) {\n console.warn('[Threads] Failed to save state:', e);\n }\n },\n \n // Backwards compatibility\n loadOrchestratorState: function() {\n return this.loadThreadsState();\n },\n saveOrchestratorState: function() {\n return this.saveThreadsState();\n },\n \n // ==========================================================================\n // JOB MANAGEMENT\n // ==========================================================================\n \n // Create a new job and register it with the orchestrator\n createThreadJob: function(chatId, type, input, options) {\n options = options || {};\n \n // Clear old error/blocked jobs for this chat when creating a new job\n // This prevents stale error indicators from showing\n this.clearOldErrorJobsForChat(chatId);\n \n var jobId = 'job-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);\n \n var job = {\n id: jobId,\n chatId: chatId,\n type: type,\n input: input,\n status: JobStatus.PENDING,\n createdAt: Date.now(),\n updatedAt: Date.now(),\n startedAt: null,\n completedAt: null,\n result: null,\n error: null,\n blocker: null,\n progress: 0,\n metadata: options.metadata || {},\n retryCount: 0,\n maxRetries: options.maxRetries || 3\n };\n \n this.threads.jobs[jobId] = job;\n this.threads.stats.totalJobs++;\n \n // Handle dependencies\n if (options.dependsOn && options.dependsOn.length > 0) {\n this.threads.dependencies[jobId] = options.dependsOn;\n }\n \n this.updateThreadsStats();\n this.saveOrchestratorState();\n this.emitThreadEvent(OrchestratorEvent.JOB_CREATED, job);\n \n console.log('[Threads] Created job:', jobId, 'for chat:', chatId);\n \n return job;\n },\n \n // Clear old error/blocked jobs for a chat (called when creating new job)\n clearOldErrorJobsForChat: function(chatId) {\n var self = this;\n var jobsToRemove = Object.keys(this.threads.jobs)\n .map(function(id) { return self.threads.jobs[id]; })\n .filter(function(job) { \n return job.chatId === chatId && \n (job.status === JobStatus.ERROR || job.status === JobStatus.BLOCKED);\n });\n \n jobsToRemove.forEach(function(job) {\n delete self.threads.jobs[job.id];\n console.log('[Threads] Cleared old error job:', job.id);\n });\n \n if (jobsToRemove.length > 0) {\n this.updateThreadsStats();\n }\n },\n \n // Get a job by ID\n getThreadJob: function(jobId) {\n return this.threads.jobs[jobId] || null;\n },\n \n // Get all jobs for a specific chat\n getJobsForChat: function(chatId) {\n var self = this;\n return Object.keys(this.threads.jobs)\n .map(function(id) { return self.threads.jobs[id]; })\n .filter(function(job) { return job.chatId === chatId; })\n .sort(function(a, b) { return b.createdAt - a.createdAt; });\n },\n \n // Get the latest job for a chat\n getLatestJobForChat: function(chatId) {\n var jobs = this.getJobsForChat(chatId);\n return jobs.length > 0 ? jobs[0] : null;\n },\n \n // Update job status\n updateJobStatus: function(jobId, status, data) {\n var job = this.threads.jobs[jobId];\n if (!job) {\n console.warn('[Threads] Job not found:', jobId);\n return null;\n }\n \n var previousStatus = job.status;\n job.status = status;\n job.updatedAt = Date.now();\n \n // Handle status-specific updates\n if (status === JobStatus.RUNNING || status === JobStatus.STREAMING) {\n job.startedAt = job.startedAt || Date.now();\n this.threads.stats.activeJobs++;\n } else if (status === JobStatus.COMPLETED) {\n job.completedAt = Date.now();\n job.result = data && data.result;\n \n // Store parsed message data if result exists\n if (job.result) {\n job.parsed = parseMessage(job.result);\n }\n \n this.threads.stats.completedJobs++;\n if (previousStatus === JobStatus.RUNNING || previousStatus === JobStatus.STREAMING) {\n this.threads.stats.activeJobs = Math.max(0, this.threads.stats.activeJobs - 1);\n }\n } else if (status === JobStatus.ERROR) {\n job.completedAt = Date.now();\n job.error = data && data.error;\n this.threads.stats.failedJobs++;\n if (previousStatus === JobStatus.RUNNING || previousStatus === JobStatus.STREAMING) {\n this.threads.stats.activeJobs = Math.max(0, this.threads.stats.activeJobs - 1);\n }\n } else if (status === JobStatus.BLOCKED) {\n job.blocker = data && data.blocker;\n this.threads.stats.blockedJobs++;\n if (previousStatus === JobStatus.RUNNING || previousStatus === JobStatus.STREAMING) {\n this.threads.stats.activeJobs = Math.max(0, this.threads.stats.activeJobs - 1);\n }\n } else if (status === JobStatus.CANCELLED) {\n job.completedAt = Date.now();\n if (previousStatus === JobStatus.RUNNING || previousStatus === JobStatus.STREAMING) {\n this.threads.stats.activeJobs = Math.max(0, this.threads.stats.activeJobs - 1);\n }\n }\n \n // Merge any additional data\n if (data) {\n if (data.progress !== undefined) job.progress = data.progress;\n if (data.metadata) Object.assign(job.metadata, data.metadata);\n }\n \n this.updateThreadsStats();\n this.saveOrchestratorState();\n \n // Emit appropriate event\n var eventMap = {};\n eventMap[JobStatus.RUNNING] = OrchestratorEvent.JOB_STARTED;\n eventMap[JobStatus.STREAMING] = OrchestratorEvent.JOB_STREAMING;\n eventMap[JobStatus.COMPLETED] = OrchestratorEvent.JOB_COMPLETED;\n eventMap[JobStatus.ERROR] = OrchestratorEvent.JOB_FAILED;\n eventMap[JobStatus.BLOCKED] = OrchestratorEvent.JOB_BLOCKED;\n eventMap[JobStatus.CANCELLED] = OrchestratorEvent.JOB_CANCELLED;\n eventMap[JobStatus.PAUSED] = OrchestratorEvent.JOB_PAUSED;\n \n var eventType = eventMap[status];\n if (eventType) {\n this.emitThreadEvent(eventType, job);\n }\n \n console.log('[Threads] Job', jobId, 'status:', previousStatus, '->', status);\n \n // Log full job object when completed\n if (status === JobStatus.COMPLETED) {\n console.log('[Threads] Job completed, full state:', job);\n }\n \n return job;\n },\n \n // Update job progress (for streaming)\n updateJobProgress: function(jobId, progress, content) {\n var job = this.threads.jobs[jobId];\n if (!job) return;\n \n job.progress = progress;\n job.updatedAt = Date.now();\n if (content !== undefined) {\n job.metadata.streamedContent = content;\n }\n \n this.emitThreadEvent(OrchestratorEvent.JOB_PROGRESS, {\n job: job,\n progress: progress,\n content: content\n });\n },\n \n // ==========================================================================\n // JOB CONTROLS\n // ==========================================================================\n \n // Start a pending job\n startJob: function(jobId) {\n var job = this.threads.jobs[jobId];\n if (!job) {\n console.warn('[Threads] Cannot start: job not found:', jobId);\n return false;\n }\n \n if (job.status !== JobStatus.PENDING && job.status !== JobStatus.PAUSED) {\n console.warn('[Threads] Cannot start job in status:', job.status);\n return false;\n }\n \n // Check for blockers\n var blocker = this.checkJobBlockers(jobId);\n if (blocker) {\n this.updateJobStatus(jobId, JobStatus.BLOCKED, { blocker: blocker });\n return false;\n }\n \n // Check dependencies\n if (!this.checkDependencies(jobId)) {\n console.log('[Threads] Job has unmet dependencies:', jobId);\n return false;\n }\n \n this.updateJobStatus(jobId, JobStatus.RUNNING);\n return true;\n },\n \n // Cancel a job\n cancelJob: function(jobId) {\n var job = this.threads.jobs[jobId];\n if (!job) return false;\n \n if (job.status === JobStatus.COMPLETED || job.status === JobStatus.CANCELLED) {\n console.warn('[Threads] Cannot cancel job in status:', job.status);\n return false;\n }\n \n this.updateJobStatus(jobId, JobStatus.CANCELLED);\n \n // If there's a backend job, cancel it too\n if (job.metadata.backendJobId && this.jobs && this.jobs.cancelJob) {\n this.jobs.cancelJob(job.metadata.backendJobId);\n }\n \n return true;\n },\n \n // Pause a running job\n pauseJob: function(jobId) {\n var job = this.threads.jobs[jobId];\n if (!job) return false;\n \n if (job.status !== JobStatus.RUNNING && job.status !== JobStatus.STREAMING) {\n console.warn('[Threads] Cannot pause job in status:', job.status);\n return false;\n }\n \n this.updateJobStatus(jobId, JobStatus.PAUSED);\n return true;\n },\n \n // Resume a paused job\n resumeJob: function(jobId) {\n var job = this.threads.jobs[jobId];\n if (!job) return false;\n \n if (job.status !== JobStatus.PAUSED && job.status !== JobStatus.BLOCKED) {\n console.warn('[Threads] Cannot resume job in status:', job.status);\n return false;\n }\n \n // Check if blockers are resolved\n var blocker = this.checkJobBlockers(jobId);\n if (blocker) {\n console.log('[Threads] Job still blocked:', blocker.type);\n return false;\n }\n \n this.updateJobStatus(jobId, JobStatus.PENDING);\n return this.startJob(jobId);\n },\n \n // Retry a failed job\n retryJob: function(jobId) {\n var job = this.threads.jobs[jobId];\n if (!job) return false;\n \n if (job.status !== JobStatus.ERROR && job.status !== JobStatus.BLOCKED) {\n console.warn('[Threads] Cannot retry job in status:', job.status);\n return false;\n }\n \n if (job.retryCount >= job.maxRetries) {\n console.warn('[Threads] Max retries exceeded for job:', jobId);\n return false;\n }\n \n job.retryCount++;\n job.error = null;\n job.blocker = null;\n \n this.updateJobStatus(jobId, JobStatus.PENDING);\n \n this.emitThreadEvent(OrchestratorEvent.JOB_RESUMED, job);\n \n return this.startJob(jobId);\n },\n \n // ==========================================================================\n // BLOCKER MANAGEMENT\n // ==========================================================================\n \n // Check if a job has any blockers\n checkJobBlockers: function(jobId) {\n var job = this.threads.jobs[jobId];\n if (!job) return null;\n \n var provider = job.input && job.input.provider;\n if (!provider) {\n // Try to determine provider from model\n var model = job.input && job.input.model;\n if (model) {\n if (model.includes('/')) {\n provider = model.split('/')[0];\n } else if (model.startsWith('gpt') || model.startsWith('o1') || model.startsWith('o3') || model.startsWith('o4')) {\n provider = 'openai';\n } else if (model.startsWith('claude')) {\n provider = 'anthropic';\n } else {\n provider = 'groq';\n }\n }\n }\n \n // Skip API key check if:\n // 1. Provider is custom (may not need API key)\n // 2. API key is provided in job input (passed directly to backend)\n // 3. Base URL is provided (custom endpoint may not need API key)\n if (provider === 'custom' || job.input.apiKey || job.input.baseUrl) {\n // Let the backend handle authentication - it will return proper error if needed\n return null;\n }\n \n // Check API key for standard providers (groq, openai, anthropic)\n if (provider && this.apiKeys) {\n var apiKey = this.apiKeys[provider];\n if (!apiKey || apiKey.trim().length === 0) {\n return {\n id: 'blocker-' + Date.now(),\n type: BlockerType.API_KEY_MISSING,\n provider: provider,\n message: provider.charAt(0).toUpperCase() + provider.slice(1) + ' API key is missing',\n createdAt: Date.now()\n };\n }\n }\n \n return null;\n },\n \n // Add a global blocker\n addBlocker: function(type, data) {\n var blockerId = 'blocker-' + Date.now();\n var blocker = {\n id: blockerId,\n type: type,\n data: data,\n createdAt: Date.now(),\n resolvedAt: null\n };\n \n this.threads.blockers[blockerId] = blocker;\n this.saveOrchestratorState();\n this.emitThreadEvent(OrchestratorEvent.BLOCKER_ADDED, blocker);\n \n return blocker;\n },\n \n // Resolve a blocker\n resolveBlocker: function(blockerId) {\n var blocker = this.threads.blockers[blockerId];\n if (!blocker) return false;\n \n blocker.resolvedAt = Date.now();\n delete this.threads.blockers[blockerId];\n \n this.saveOrchestratorState();\n this.emitThreadEvent(OrchestratorEvent.BLOCKER_RESOLVED, blocker);\n \n // Check if any blocked jobs can now proceed\n this.checkBlockedJobs();\n \n return true;\n },\n \n // Check all blocked jobs to see if they can proceed\n checkBlockedJobs: function() {\n var self = this;\n var unblockedCount = 0;\n \n Object.keys(this.threads.jobs).forEach(function(jobId) {\n var job = self.threads.jobs[jobId];\n if (job.status === JobStatus.BLOCKED) {\n var blocker = self.checkJobBlockers(jobId);\n if (!blocker) {\n // Blocker resolved!\n self.updateJobStatus(jobId, JobStatus.PENDING);\n self.emitThreadEvent(OrchestratorEvent.JOB_UNBLOCKED, job);\n unblockedCount++;\n }\n }\n });\n \n if (unblockedCount > 0) {\n console.log('[Threads] Unblocked', unblockedCount, 'jobs');\n }\n \n return unblockedCount;\n },\n \n // Check dependencies for a job\n checkDependencies: function(jobId) {\n var deps = this.threads.dependencies[jobId];\n if (!deps || deps.length === 0) return true;\n \n var self = this;\n return deps.every(function(depId) {\n var depJob = self.threads.jobs[depId];\n return depJob && depJob.status === JobStatus.COMPLETED;\n });\n },\n \n // ==========================================================================\n // EVENT SYSTEM\n // ==========================================================================\n \n // Subscribe to orchestrator events\n onThreadEvent: function(eventType, callback) {\n if (!this.threads.listeners[eventType]) {\n this.threads.listeners[eventType] = [];\n }\n this.threads.listeners[eventType].push(callback);\n \n // Return unsubscribe function\n var self = this;\n return function() {\n var idx = self.orchestrator.listeners[eventType].indexOf(callback);\n if (idx !== -1) {\n self.orchestrator.listeners[eventType].splice(idx, 1);\n }\n };\n },\n \n // Emit an orchestrator event\n emitThreadEvent: function(eventType, data) {\n var listeners = this.threads.listeners[eventType] || [];\n listeners.forEach(function(callback) {\n try {\n callback(data);\n } catch (e) {\n console.error('[Threads] Event handler error:', e);\n }\n });\n \n // Also emit a generic state changed event\n if (eventType !== OrchestratorEvent.STATE_CHANGED) {\n var stateListeners = this.threads.listeners[OrchestratorEvent.STATE_CHANGED] || [];\n stateListeners.forEach(function(callback) {\n try {\n callback({ event: eventType, data: data });\n } catch (e) {\n console.error('[Threads] State change handler error:', e);\n }\n });\n }\n },\n \n // ==========================================================================\n // STATS & QUERIES\n // ==========================================================================\n \n updateThreadsStats: function() {\n var self = this;\n var stats = {\n totalJobs: 0,\n completedJobs: 0,\n failedJobs: 0,\n blockedJobs: 0,\n activeJobs: 0,\n pendingJobs: 0,\n cancelledJobs: 0\n };\n \n Object.keys(this.threads.jobs).forEach(function(jobId) {\n var job = self.threads.jobs[jobId];\n stats.totalJobs++;\n \n if (job.status === JobStatus.COMPLETED) stats.completedJobs++;\n else if (job.status === JobStatus.ERROR) stats.failedJobs++;\n else if (job.status === JobStatus.BLOCKED) stats.blockedJobs++;\n else if (job.status === JobStatus.RUNNING || job.status === JobStatus.STREAMING) stats.activeJobs++;\n else if (job.status === JobStatus.PENDING || job.status === JobStatus.PAUSED) stats.pendingJobs++;\n else if (job.status === JobStatus.CANCELLED) stats.cancelledJobs++;\n });\n \n this.threads.stats = stats;\n },\n \n getThreadsStats: function() {\n return this.threads.stats;\n },\n \n // Get jobs by status\n getJobsByStatus: function(status) {\n var self = this;\n return Object.keys(this.threads.jobs)\n .map(function(id) { return self.threads.jobs[id]; })\n .filter(function(job) { return job.status === status; });\n },\n \n // Get all active jobs\n getActiveJobs: function() {\n var running = this.getJobsByStatus(JobStatus.RUNNING);\n var streaming = this.getJobsByStatus(JobStatus.STREAMING);\n return running.concat(streaming);\n },\n \n // Get all blocked jobs\n getBlockedJobs: function() {\n return this.getJobsByStatus(JobStatus.BLOCKED);\n },\n \n // Clean up old completed jobs (keep last N)\n cleanupOldJobs: function(keepCount) {\n keepCount = keepCount || 100;\n var self = this;\n \n var jobs = Object.keys(this.threads.jobs)\n .map(function(id) { return self.threads.jobs[id]; })\n .filter(function(job) {\n return job.status === JobStatus.COMPLETED || \n job.status === JobStatus.CANCELLED;\n })\n .sort(function(a, b) { return b.completedAt - a.completedAt; });\n \n if (jobs.length > keepCount) {\n var toRemove = jobs.slice(keepCount);\n toRemove.forEach(function(job) {\n delete self.threads.jobs[job.id];\n });\n this.saveOrchestratorState();\n console.log('[Threads] Cleaned up', toRemove.length, 'old jobs');\n }\n },\n \n // Clear all thread state (for debugging)\n clearThreadsState: function() {\n this.threads.jobs = {};\n this.threads.blockers = {};\n this.threads.dependencies = {};\n this.threads.stats = {\n totalJobs: 0,\n completedJobs: 0,\n failedJobs: 0,\n blockedJobs: 0,\n activeJobs: 0,\n pendingJobs: 0,\n cancelledJobs: 0\n };\n localStorage.removeItem(THREADS_KEY);\n localStorage.removeItem('chatapp-orchestrator'); // Clean up old key\n console.log('[Threads] State cleared');\n },\n \n // ==========================================================================\n // MESSAGE PARSING (exposed as methods)\n // ==========================================================================\n \n // Parse a single message to extract reasoning/thinking\n parseMessage: parseMessage,\n \n // Parse all messages\n parseMessages: parseMessages,\n \n // Get display content (clean, without think tags)\n getDisplayContent: getDisplayContent,\n \n // Get thinking/reasoning from a message\n getThinking: getThinking\n };\n}\n\n// Backwards compatibility export\nexport var createOrchestratorMixin = createThreadsMixin;\n\n",[],[150,300,292],"app","0be9b514-e2e9-11f0-b39b-42dde27851f2",["D",1766815100356],[],[150,300,32],"0bb0d5be-e2e9-11f0-8def-42dde27851f2","state.js","0bb0d6ae-e2e9-11f0-8def-42dde27851f2",26,["D",1766815099983],"/**\n * Chat App State - Initial state and model definitions\n */\n\nexport const MODELS = [\n // Groq - Compound Systems\n { id: 'groq/compound', name: 'Compound', desc: 'AI system with built-in tools including web search and code execution.', logo: '/public/groq-logo-orange.png', provider: 'groq', web: true, tools: true },\n { id: 'groq/compound-mini', name: 'Compound Mini', desc: 'Faster, lighter version with web search and code execution.', logo: '/public/groq-logo-orange.png', provider: 'groq', web: true, tools: true },\n \n // Groq - OpenAI GPT-OSS Models\n { id: 'openai/gpt-oss-120b', name: 'GPT OSS 120B', desc: 'Flagship 120B parameter model with browser search and reasoning.', logo: '/public/groq-logo-orange.png', provider: 'groq', web: true, thinking: true, tools: true },\n { id: 'openai/gpt-oss-20b', name: 'GPT OSS 20B', desc: 'Fast 20B model with web search, thinking, and code execution.', logo: '/public/groq-logo-orange.png', provider: 'groq', web: true, thinking: true, tools: true },\n \n // Groq - Llama 3.x Production\n { id: 'llama-3.1-8b-instant', name: 'Llama 3.1 8B Instant', desc: 'Ultra-fast 8B model for instant responses (560 t/s).', logo: '/public/groq-logo-orange.png', provider: 'groq' },\n { id: 'llama-3.3-70b-versatile', name: 'Llama 3.3 70B Versatile', desc: 'Versatile 70B model for a wide range of tasks (280 t/s).', logo: '/public/groq-logo-orange.png', provider: 'groq' },\n \n // Groq - Llama 4 Vision Models\n { id: 'meta-llama/llama-4-maverick-17b-128e-instruct', name: 'Llama 4 Maverick 17B', desc: 'Powerful image understanding and analysis (600 t/s).', logo: '/public/groq-logo-orange.png', provider: 'groq', image: true, preview: true },\n { id: 'meta-llama/llama-4-scout-17b-16e-instruct', name: 'Llama 4 Scout 17B', desc: 'Fast responses with image support (750 t/s).', logo: '/public/groq-logo-orange.png', provider: 'groq', image: true, preview: true },\n \n // OpenAI - GPT-5.2 Series (Latest)\n { id: 'gpt-5.2', name: 'GPT-5.2', desc: 'Most advanced model for coding and agentic tasks across industries.', logo: '/public/openai-logo.png', provider: 'openai', image: true, tools: true },\n { id: 'gpt-5.2-pro', name: 'GPT-5.2 Pro', desc: 'Version of GPT-5.2 that produces smarter and more precise responses.', logo: '/public/openai-logo.png', provider: 'openai', image: true, tools: true },\n { id: 'gpt-5-mini', name: 'GPT-5 Mini', desc: 'Faster, cost-efficient version of GPT-5 for well-defined tasks.', logo: '/public/openai-logo.png', provider: 'openai', image: true, tools: true },\n { id: 'gpt-5-nano', name: 'GPT-5 Nano', desc: 'Fastest, most cost-efficient version of GPT-5.', logo: '/public/openai-logo.png', provider: 'openai', tools: true },\n \n // OpenAI - GPT-4o Series\n { id: 'gpt-4o', name: 'GPT-4o', desc: 'High-intelligence model with vision, fast and affordable.', logo: '/public/openai-logo.png', provider: 'openai', image: true, tools: true },\n { id: 'gpt-4o-mini', name: 'GPT-4o Mini', desc: 'Small, fast, and affordable. Great for most tasks.', logo: '/public/openai-logo.png', provider: 'openai', image: true, tools: true },\n \n // OpenAI - o4 Reasoning Models (Latest)\n { id: 'o4', name: 'o4', desc: 'Latest reasoning model with enhanced capabilities.', logo: '/public/openai-logo.png', provider: 'openai', thinking: true, image: true, tools: true },\n { id: 'o4-mini', name: 'o4-mini', desc: 'Faster reasoning model optimized for coding and math.', logo: '/public/openai-logo.png', provider: 'openai', thinking: true },\n \n // OpenAI - o3 Reasoning Models\n { id: 'o3', name: 'o3', desc: 'Advanced reasoning model for complex multi-step tasks.', logo: '/public/openai-logo.png', provider: 'openai', thinking: true, image: true, tools: true },\n { id: 'o3-mini', name: 'o3-mini', desc: 'Fast, flexible reasoning for coding and problem-solving.', logo: '/public/openai-logo.png', provider: 'openai', thinking: true },\n \n // OpenAI - o1 Reasoning Models\n { id: 'o1', name: 'o1', desc: 'Original reasoning model for complex analysis.', logo: '/public/openai-logo.png', provider: 'openai', thinking: true, image: true },\n { id: 'o1-mini', name: 'o1-mini', desc: 'Efficient reasoning model for coding and math.', logo: '/public/openai-logo.png', provider: 'openai', thinking: true },\n \n // Anthropic - Claude 4 Series (Latest)\n { id: 'claude-opus-4-1-20250805', name: 'Claude Opus 4.1', desc: 'Most capable and intelligent model, setting new standards.', logo: 'vscode-icons:file-type-claude', provider: 'anthropic', thinking: true, image: true, tools: true },\n { id: 'claude-opus-4-20250514', name: 'Claude Opus 4', desc: 'Highly capable model for complex tasks.', logo: 'vscode-icons:file-type-claude', provider: 'anthropic', thinking: true, image: true, tools: true },\n { id: 'claude-sonnet-4-20250514', name: 'Claude Sonnet 4', desc: 'Excellent balance of performance, speed, and cost.', logo: 'vscode-icons:file-type-claude', provider: 'anthropic', thinking: true, image: true, tools: true },\n \n // Anthropic - Claude 3.7 Series\n { id: 'claude-3-7-sonnet-20250219', name: 'Claude 3.7 Sonnet', desc: 'Hybrid model with extended thinking capabilities.', logo: 'vscode-icons:file-type-claude', provider: 'anthropic', thinking: true, image: true, tools: true },\n \n // Anthropic - Claude 3.5 Series\n { id: 'claude-3-5-sonnet-20241022', name: 'Claude 3.5 Sonnet', desc: 'High performance for complex reasoning and coding.', logo: 'vscode-icons:file-type-claude', provider: 'anthropic', thinking: true, image: true, tools: true },\n { id: 'claude-3-5-haiku-20241022', name: 'Claude 3.5 Haiku', desc: 'Fast and cost-effective for simple tasks.', logo: 'vscode-icons:file-type-claude', provider: 'anthropic', image: true, tools: true }\n];\n\n// Default model parameters\nexport const DEFAULT_MODEL_PARAMS = {\n temperature: 0.7,\n maxTokens: 2048,\n topP: 1,\n frequencyPenalty: 0,\n presencePenalty: 0,\n // Groq-specific parameters\n reasoningEffort: 'medium',\n webSearch: false,\n codeExecution: false,\n imageDetail: 'auto',\n modelVersion: 'stable'\n};\n\n// Create default chat metadata\nexport function createChatMetadata() {\n return {\n systemPrompt: '',\n defaultModel: null, // Will use global selected model if null\n parameters: { ...DEFAULT_MODEL_PARAMS },\n createdAt: new Date().toISOString(),\n updatedAt: new Date().toISOString()\n };\n}\n\n// Create a new chat object with messages and metadata unified\nexport function createChatData(messages = [], metadata = null) {\n return {\n messages: messages,\n metadata: metadata || createChatMetadata()\n };\n}\n\n// Create message metadata for tracing\nexport function createMessageMetadata(model, params) {\n return {\n model: model || null,\n temperature: params?.temperature,\n maxTokens: params?.maxTokens,\n parameters: params ? { ...params } : {},\n timestamp: new Date().toISOString()\n };\n}\n\nexport function createInitialState() {\n return {\n // Sidebar state\n sidebarOpen: true,\n rightSidebarOpen: false, // Right sidebar for chat settings\n \n // Folder/Chat tree state\n folders: [],\n items: [], // Each item represents a chat with { id, name, folderId, order }\n // Unified chats structure: { [chatId]: { messages: [], metadata: { systemPrompt, defaultModel, parameters, ... } } }\n chats: {},\n nextFolderId: 1,\n nextItemId: 1,\n activeChatId: null,\n \n // Editing state\n editingFolderId: null,\n editingFolderName: '',\n editingItemId: null,\n editingItemName: '',\n \n // Drag state\n draggingItemId: null,\n draggingFolderId: null,\n draggingType: null,\n dragOverFolderId: null,\n dragOverRoot: false,\n dragOverFolderRoot: false,\n dropIndicator: null,\n \n // Menu state\n folderMenuOpen: null,\n \n // Copy feedback state\n copiedMessageId: null,\n itemMenuOpen: null,\n \n // Message editing state\n editingMessageId: null,\n editingMessageContent: '',\n \n // Reactivity helper - increment to force sidebar re-render\n itemsVersion: 0,\n \n // Chat state\n messages: [],\n messageInput: '',\n isTyping: false,\n showAttachments: false,\n showModelPicker: false,\n modelSearch: '',\n selectedModel: null,\n previewIndex: -1,\n modelPosition: 'top',\n models: MODELS,\n activeJobId: null, // Track current job for cancellation\n \n // Model configs state (loaded from API)\n modelConfigs: [],\n \n // Current chat settings (bound to right sidebar form)\n currentChatSettings: {\n systemPrompt: '',\n temperature: 0.7,\n maxTokens: 2048,\n topP: 1,\n frequencyPenalty: 0,\n presencePenalty: 0,\n reasoningEffort: 'medium',\n webSearch: false,\n codeExecution: false,\n imageDetail: 'auto',\n modelVersion: 'stable'\n },\n \n // Settings state\n showSettings: false,\n settingsTab: 'general',\n settings: {\n autoSave: true,\n showWelcomeMessage: false,\n language: 'English',\n autoScroll: true\n },\n \n // Thinking/reasoning visibility per message\n // Format: { messageId: true/false }\n thinkingVisible: {},\n \n // API Keys - stored per provider\n apiKeys: {\n groq: '', // Groq API key\n openai: '', // OpenAI API key\n anthropic: '', // Anthropic API key\n custom: '', // Custom provider API key (optional)\n },\n };\n}\n\n",[],[150,300,306],"0bcfbf42-e2e9-11f0-a009-42dde27851f2","settings.js","0bcfbfe2-e2e9-11f0-a009-42dde27851f2",30,["D",1766815100155],"/**\n * Chat App Settings - Settings management\n */\n\nconst SETTINGS_KEY = 'chatapp-settings';\n\nexport function createSettingsMethods() {\n return {\n // Settings state (add to state.js later)\n settings: {\n autoSave: true,\n showWelcomeMessage: false,\n language: 'English',\n useStreaming: true, // Enable streaming responses by default\n autoScroll: true // Enable auto-scroll by default\n },\n \n // Toggle settings page\n toggleSettings() {\n var wasOpen = this.showSettings;\n this.showSettings = !this.showSettings;\n // Close right sidebar when opening settings\n if (this.showSettings) {\n this.rightSidebarOpen = false;\n }\n // When closing settings, check if any API key errors can be cleared\n if (wasOpen && !this.showSettings) {\n this.checkAndClearApiKeyErrors();\n }\n },\n \n // Check if API key errors in messages can be cleared (API key was added)\n checkAndClearApiKeyErrors() {\n var self = this;\n if (!Array.isArray(this.messages)) return;\n \n // First, use orchestrator to check all blocked jobs\n if (this.checkBlockedJobs) {\n var unblockedCount = this.checkBlockedJobs();\n if (unblockedCount > 0) {\n console.log('[Settings] Orchestrator unblocked', unblockedCount, 'jobs');\n }\n }\n \n // Find any API key error messages\n var hasApiKeyErrors = this.messages.some(function(m) {\n return m.role === 'error' && m.isApiKeyError;\n });\n \n if (!hasApiKeyErrors) return;\n \n // Check if the relevant provider now has an API key\n this.messages.forEach(function(msg, idx) {\n if (msg.role === 'error' && msg.isApiKeyError) {\n // Determine which provider this error was for\n var provider = self.selectedModel && self.selectedModel.provider;\n if (!provider) return;\n \n // Check if we now have an API key for this provider\n var hasKey = self.apiKeys && self.apiKeys[provider] && self.apiKeys[provider].trim().length > 0;\n \n if (hasKey) {\n // Update the error message to show it can be retried\n self.messages[idx] = {\n id: msg.id,\n role: 'error',\n content: 'API key added! Click \"Retry\" to send your message again.',\n isError: true,\n isApiKeyError: false,\n canRetry: true,\n originalProvider: provider,\n threadJobId: msg.threadJobId,\n timestamp: Date.now()\n };\n }\n }\n });\n \n // Save changes\n if (this.saveToStorage) {\n this.saveToStorage();\n }\n },\n \n // Retry a failed message (used after API key is added or for immediate retry)\n retryLastMessage() {\n if (!Array.isArray(this.messages)) return;\n \n // Find any error message (with or without canRetry flag)\n var errorMsgIdx = -1;\n var threadJobId = null;\n for (var i = this.messages.length - 1; i >= 0; i--) {\n if (this.messages[i].role === 'error') {\n errorMsgIdx = i;\n threadJobId = this.messages[i].threadJobId;\n break;\n }\n }\n \n // Find the last user message before any error\n var lastUserMsgIdx = -1;\n for (var i = this.messages.length - 1; i >= 0; i--) {\n if (this.messages[i].role === 'user') {\n lastUserMsgIdx = i;\n break;\n }\n }\n \n if (lastUserMsgIdx === -1) return;\n \n // Remove any error messages after the last user message\n var newMessages = this.messages.slice(0, lastUserMsgIdx + 1);\n this.messages = newMessages;\n \n // If there was an orchestrator job, try to retry it\n if (threadJobId && this.retryJob) {\n var success = this.retryJob(threadJobId);\n console.log('[Settings] Retry thread job:', threadJobId, success ? 'started' : 'failed');\n }\n \n // Resend the last user message\n if (this.sendChatRequest) {\n this.sendChatRequest();\n }\n \n // Save changes\n if (this.saveToStorage) {\n this.saveToStorage();\n }\n },\n \n // Cancel a job from the UI\n cancelJobFromUI(jobId) {\n if (this.cancelJob) {\n var success = this.cancelJob(jobId);\n console.log('[Settings] Cancel job:', jobId, success ? 'cancelled' : 'failed');\n \n // Remove the associated error message if present\n if (Array.isArray(this.messages)) {\n var msgIdx = this.messages.findIndex(function(m) { \n return m.threadJobId === jobId; \n });\n if (msgIdx !== -1) {\n this.messages.splice(msgIdx, 1);\n this.saveToStorage();\n }\n }\n }\n },\n \n loadSettings() {\n try {\n const stored = localStorage.getItem(SETTINGS_KEY);\n if (stored) {\n this.settings = { ...this.settings, ...JSON.parse(stored) };\n }\n } catch (e) {\n console.warn('Failed to load settings:', e);\n }\n },\n \n saveSettings() {\n try {\n localStorage.setItem(SETTINGS_KEY, JSON.stringify(this.settings));\n } catch (e) {\n console.warn('Failed to save settings:', e);\n }\n },\n \n updateSetting(key, value) {\n this.settings[key] = value;\n this.saveSettings();\n },\n \n checkForUpdate() {\n // Simple version check - in a real app this would ping a server\n const currentVersion = '1.0.0';\n alert(`Current version: ${currentVersion}\\\\n\\\\nYou are running the latest version!`);\n },\n \n exportData() {\n try {\n // Get all chat data\n const chatData = localStorage.getItem('chatapp-data');\n const settings = localStorage.getItem(SETTINGS_KEY);\n \n const exportObj = {\n version: '1.0.0',\n exportDate: new Date().toISOString(),\n chatData: chatData ? JSON.parse(chatData) : null,\n settings: settings ? JSON.parse(settings) : null\n };\n \n // Create download\n const dataStr = JSON.stringify(exportObj, null, 2);\n const dataBlob = new Blob([dataStr], { type: 'application/json' });\n const url = URL.createObjectURL(dataBlob);\n const link = document.createElement('a');\n link.href = url;\n link.download = `chatter-export-${new Date().toISOString().split('T')[0]}.json`;\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n URL.revokeObjectURL(url);\n \n console.log('Data exported successfully');\n } catch (e) {\n console.error('Failed to export data:', e);\n alert('Failed to export data. Check console for details.');\n }\n },\n \n importData() {\n try {\n const input = document.createElement('input');\n input.type = 'file';\n input.accept = 'application/json';\n \n input.onchange = (e) => {\n const file = e.target.files[0];\n if (!file) return;\n \n const reader = new FileReader();\n reader.onload = (event) => {\n try {\n const importObj = JSON.parse(event.target.result);\n \n // Validate import\n if (!importObj.version || !importObj.chatData) {\n throw new Error('Invalid import file format');\n }\n \n // Confirm before importing\n if (!confirm('This will replace all current data. Continue?')) {\n return;\n }\n \n // Import chat data\n if (importObj.chatData) {\n localStorage.setItem('chatapp-data', JSON.stringify(importObj.chatData));\n }\n \n // Import settings\n if (importObj.settings) {\n localStorage.setItem(SETTINGS_KEY, JSON.stringify(importObj.settings));\n }\n \n // Reload the page to apply changes\n alert('Data imported successfully! The page will now reload.');\n window.location.reload();\n } catch (err) {\n console.error('Failed to import data:', err);\n alert('Failed to import data. Please check the file format.');\n }\n };\n \n reader.readAsText(file);\n };\n \n input.click();\n } catch (e) {\n console.error('Failed to import data:', e);\n alert('Failed to import data. Check console for details.');\n }\n },\n \n clearData() {\n if (confirm('Are you sure you want to clear all data? This cannot be undone.')) {\n if (confirm('This will delete all chats, folders, and messages. Are you absolutely sure?')) {\n try {\n localStorage.removeItem('chatapp-data');\n localStorage.removeItem(SETTINGS_KEY);\n \n // Reset state\n this.folders = [];\n this.items = [];\n this.chats = {};\n this.nextFolderId = 1;\n this.nextItemId = 1;\n this.activeChatId = null;\n this.messages = [];\n this.settings = {\n autoSave: true,\n showWelcomeMessage: false,\n language: 'English',\n useStreaming: true\n };\n \n alert('All data cleared successfully!');\n } catch (e) {\n console.error('Failed to clear data:', e);\n alert('Failed to clear data. Check console for details.');\n }\n }\n }\n }\n };\n}\n\n",[],[150,300,314],"0ba174fc-e2e9-11f0-8def-42dde27851f2","providerSettings.js","0ba175e2-e2e9-11f0-8def-42dde27851f2",24,["D",1766815099847],"/**\n * Provider Settings - Manage API keys, base URLs, and model configurations\n * Loads defaults from server configs and allows user customization via localStorage\n */\n\nvar PROVIDER_SETTINGS_KEY = 'chatapp-provider-settings';\nvar PROVIDER_SETTINGS_VERSION = 2; // Increment this when DEFAULT_MODELS changes significantly\n\n// Default provider configurations\nvar DEFAULT_PROVIDERS = {\n groq: {\n name: 'Groq',\n baseUrl: 'https://api.groq.com/openai/v1',\n logo: '/public/groq-logo-orange.png',\n docsUrl: 'https://console.groq.com/docs',\n apiKeyUrl: 'https://console.groq.com/keys',\n apiKeyPrefix: 'gsk_'\n },\n openai: {\n name: 'OpenAI',\n baseUrl: 'https://api.openai.com/v1',\n logo: '/public/openai-logo.png',\n docsUrl: 'https://platform.openai.com/docs',\n apiKeyUrl: 'https://platform.openai.com/api-keys',\n apiKeyPrefix: 'sk-'\n },\n anthropic: {\n name: 'Anthropic',\n baseUrl: 'https://api.anthropic.com/v1',\n logo: 'vscode-icons:file-type-claude',\n docsUrl: 'https://docs.anthropic.com',\n apiKeyUrl: 'https://console.anthropic.com/settings/keys',\n apiKeyPrefix: 'sk-ant-'\n },\n custom: {\n name: 'Custom',\n baseUrl: 'https://llm.labspace.ai/v1',\n logo: '/public/custom-logo.png',\n docsUrl: '',\n apiKeyUrl: '',\n apiKeyPrefix: ''\n }\n};\n\n// Default models based on provider configs\nvar DEFAULT_MODELS = [\n // Groq models\n { id: 'groq/compound', name: 'Compound', provider: 'groq', desc: 'AI system with built-in tools including web search and code execution.', capabilities: { web: true, tools: true, streaming: true } },\n { id: 'groq/compound-mini', name: 'Compound Mini', provider: 'groq', desc: 'Faster, lighter version with web search and code execution.', capabilities: { web: true, tools: true, streaming: true } },\n { id: 'llama-3.1-8b-instant', name: 'Llama 3.1 8B Instant', provider: 'groq', desc: 'Ultra-fast 8B model for instant responses (560 t/s).', capabilities: { streaming: true } },\n { id: 'llama-3.3-70b-versatile', name: 'Llama 3.3 70B Versatile', provider: 'groq', desc: 'Versatile 70B model for a wide range of tasks (280 t/s).', capabilities: { streaming: true } },\n { id: 'meta-llama/llama-4-maverick-17b-128e-instruct', name: 'Llama 4 Maverick 17B', provider: 'groq', desc: 'Powerful image understanding and analysis (600 t/s).', capabilities: { image: true, streaming: true }, preview: true },\n { id: 'meta-llama/llama-4-scout-17b-16e-instruct', name: 'Llama 4 Scout 17B', provider: 'groq', desc: 'Fast responses with image support (750 t/s).', capabilities: { image: true, streaming: true }, preview: true },\n { id: 'openai/gpt-oss-120b', name: 'GPT OSS 120B', provider: 'groq', desc: 'Flagship 120B parameter model with browser search and reasoning.', capabilities: { web: true, thinking: true, tools: true, streaming: true } },\n { id: 'openai/gpt-oss-20b', name: 'GPT OSS 20B', provider: 'groq', desc: 'Fast 20B model with web search, thinking, and code execution.', capabilities: { web: true, thinking: true, tools: true, streaming: true } },\n { id: 'moonshotai/kimi-k2-instruct-0905', name: 'Kimi K2', provider: 'groq', desc: 'Highly capable for writing and coding with 262K context.', capabilities: { streaming: true }, preview: true },\n { id: 'qwen/qwen3-32b', name: 'Qwen3-32B', provider: 'groq', desc: 'Multilingual responses with thinking capabilities.', capabilities: { thinking: true, streaming: true }, preview: true },\n \n // OpenAI models - GPT-5.2 Series (Latest)\n { id: 'gpt-5.2', name: 'GPT-5.2', provider: 'openai', desc: 'Most advanced model for coding and agentic tasks across industries.', capabilities: { image: true, streaming: true, tools: true } },\n { id: 'gpt-5.2-pro', name: 'GPT-5.2 Pro', provider: 'openai', desc: 'Version of GPT-5.2 that produces smarter and more precise responses.', capabilities: { image: true, streaming: true, tools: true } },\n { id: 'gpt-5-mini', name: 'GPT-5 Mini', provider: 'openai', desc: 'Faster, cost-efficient version of GPT-5 for well-defined tasks.', capabilities: { image: true, streaming: true, tools: true } },\n { id: 'gpt-5-nano', name: 'GPT-5 Nano', provider: 'openai', desc: 'Fastest, most cost-efficient version of GPT-5.', capabilities: { streaming: true, tools: true } },\n \n // OpenAI - GPT-4o Series\n { id: 'gpt-4o', name: 'GPT-4o', provider: 'openai', desc: 'High-intelligence model with vision, fast and affordable.', capabilities: { image: true, streaming: true, tools: true } },\n { id: 'gpt-4o-mini', name: 'GPT-4o Mini', provider: 'openai', desc: 'Small, fast, and affordable. Great for most tasks.', capabilities: { image: true, streaming: true, tools: true } },\n { id: 'chatgpt-4o-latest', name: 'ChatGPT-4o Latest', provider: 'openai', desc: 'Dynamic model continuously updated to current ChatGPT version.', capabilities: { image: true, streaming: true, tools: true } },\n \n // OpenAI - o4 Reasoning Models (Latest)\n { id: 'o4', name: 'o4', provider: 'openai', desc: 'Latest reasoning model with enhanced capabilities and configurable effort.', capabilities: { thinking: true, streaming: true, image: true, tools: true } },\n { id: 'o4-mini', name: 'o4-mini', provider: 'openai', desc: 'Faster reasoning model optimized for coding, math, and science.', capabilities: { thinking: true, streaming: true } },\n \n // OpenAI - o3 Reasoning Models\n { id: 'o3', name: 'o3', provider: 'openai', desc: 'Advanced reasoning model for complex multi-step tasks.', capabilities: { thinking: true, streaming: true, image: true, tools: true } },\n { id: 'o3-mini', name: 'o3-mini', provider: 'openai', desc: 'Fast, flexible reasoning for coding and problem-solving.', capabilities: { thinking: true, streaming: true } },\n \n // OpenAI - o1 Reasoning Models\n { id: 'o1', name: 'o1', provider: 'openai', desc: 'Original reasoning model for complex analysis.', capabilities: { thinking: true, streaming: true, image: true } },\n { id: 'o1-mini', name: 'o1-mini', provider: 'openai', desc: 'Efficient reasoning model for coding and math.', capabilities: { thinking: true, streaming: true } },\n { id: 'o1-pro', name: 'o1-pro', provider: 'openai', desc: 'Enhanced compute for hard problems.', capabilities: { thinking: true, streaming: true, image: true } },\n \n // Anthropic - Claude 4 Series (Latest)\n { id: 'claude-opus-4-1-20250805', name: 'Claude Opus 4.1', provider: 'anthropic', desc: 'Most capable and intelligent model, setting new standards in complex reasoning.', capabilities: { thinking: true, image: true, streaming: true, tools: true } },\n { id: 'claude-opus-4-20250514', name: 'Claude Opus 4', provider: 'anthropic', desc: 'Highly capable model for complex tasks requiring deep reasoning.', capabilities: { thinking: true, image: true, streaming: true, tools: true } },\n { id: 'claude-sonnet-4-20250514', name: 'Claude Sonnet 4', provider: 'anthropic', desc: 'Excellent balance of performance, speed, and cost with extended thinking.', capabilities: { thinking: true, image: true, streaming: true, tools: true } },\n \n // Anthropic - Claude 3.7 Series\n { id: 'claude-3-7-sonnet-20250219', name: 'Claude 3.7 Sonnet', provider: 'anthropic', desc: 'Hybrid model with extended thinking capabilities.', capabilities: { thinking: true, image: true, streaming: true, tools: true } },\n \n // Anthropic - Claude 3.5 Series\n { id: 'claude-3-5-sonnet-20241022', name: 'Claude 3.5 Sonnet', provider: 'anthropic', desc: 'High performance for complex reasoning and coding.', capabilities: { thinking: true, image: true, streaming: true, tools: true } },\n { id: 'claude-3-5-haiku-20241022', name: 'Claude 3.5 Haiku', provider: 'anthropic', desc: 'Fast and cost-effective for simple tasks.', capabilities: { image: true, streaming: true, tools: true } },\n \n // Anthropic - Claude 3 Series (Legacy)\n { id: 'claude-3-opus-20240229', name: 'Claude 3 Opus', provider: 'anthropic', desc: 'Highly capable for complex analysis and coding.', capabilities: { image: true, streaming: true, tools: true } },\n { id: 'claude-3-sonnet-20240229', name: 'Claude 3 Sonnet', provider: 'anthropic', desc: 'Balanced performance and cost.', capabilities: { image: true, streaming: true, tools: true } },\n { id: 'claude-3-haiku-20240307', name: 'Claude 3 Haiku', provider: 'anthropic', desc: 'Fastest Claude 3 model.', capabilities: { streaming: true, tools: true } }\n];\n\nexport function createProviderSettingsMethods() {\n return {\n // Provider settings state\n providerSettings: {\n providers: {}, // { groq: { baseUrl, apiKey }, openai: {...} }\n models: [], // User's configured models\n loaded: false\n },\n \n // UI state for provider settings\n providerSettingsUI: {\n editingModelId: null,\n editingModelName: '',\n addingModelToProvider: null,\n newModelId: '',\n expandedProvider: 'groq', // Which provider section is expanded\n discoveringModels: false,\n discoveryError: null,\n testingConnection: false,\n connectionTestResult: null\n },\n \n // Load provider settings from localStorage, merging with defaults\n loadProviderSettings() {\n try {\n var stored = localStorage.getItem(PROVIDER_SETTINGS_KEY);\n var parsed = stored ? JSON.parse(stored) : {};\n \n // Check version - if old version or no version, reset to defaults\n if (!parsed.version || parsed.version < PROVIDER_SETTINGS_VERSION) {\n console.log('[ProviderSettings] Old version detected, resetting to defaults');\n parsed = { version: PROVIDER_SETTINGS_VERSION };\n }\n \n // Merge with defaults for providers\n var providers = {};\n Object.keys(DEFAULT_PROVIDERS).forEach(function(key) {\n providers[key] = Object.assign(\n {},\n DEFAULT_PROVIDERS[key],\n parsed.providers ? parsed.providers[key] : {}\n );\n });\n \n // For models, use stored if available AND not empty, otherwise use defaults\n var models = (parsed.models && parsed.models.length > 0) \n ? parsed.models \n : JSON.parse(JSON.stringify(DEFAULT_MODELS));\n \n // Safety check: if models is still empty (shouldn't happen), force defaults\n if (!models || models.length === 0) {\n console.warn('[ProviderSettings] Models array was empty, forcing defaults');\n models = JSON.parse(JSON.stringify(DEFAULT_MODELS));\n }\n \n this.providerSettings = {\n providers: providers,\n models: models,\n loaded: true,\n version: PROVIDER_SETTINGS_VERSION\n };\n \n // Also sync apiKeys from storage (these are stored separately)\n if (this.apiKeys) {\n Object.keys(providers).forEach(function(key) {\n if (this.apiKeys[key]) {\n providers[key].apiKey = this.apiKeys[key];\n }\n }.bind(this));\n }\n \n // Update the global models list for the picker\n this.updateGlobalModelsList();\n \n console.log('[ProviderSettings] Loaded', models.length, 'models');\n } catch (e) {\n console.warn('Failed to load provider settings:', e);\n this.providerSettings = {\n providers: JSON.parse(JSON.stringify(DEFAULT_PROVIDERS)),\n models: JSON.parse(JSON.stringify(DEFAULT_MODELS)),\n loaded: true,\n version: PROVIDER_SETTINGS_VERSION\n };\n this.updateGlobalModelsList();\n }\n },\n \n // Save provider settings to localStorage\n saveProviderSettings() {\n try {\n var data = {\n version: PROVIDER_SETTINGS_VERSION,\n providers: {},\n models: this.providerSettings.models\n };\n \n // Only save user-modified provider settings (not defaults)\n Object.keys(this.providerSettings.providers).forEach(function(key) {\n var provider = this.providerSettings.providers[key];\n data.providers[key] = {\n baseUrl: provider.baseUrl,\n name: provider.name // Save custom provider name\n // Don't save apiKey here - it's stored separately\n };\n }.bind(this));\n \n localStorage.setItem(PROVIDER_SETTINGS_KEY, JSON.stringify(data));\n console.log('[ProviderSettings] Saved');\n } catch (e) {\n console.warn('Failed to save provider settings:', e);\n }\n },\n \n // Reset provider settings to defaults\n resetProviderSettings() {\n if (confirm('Reset all provider settings to defaults? This will remove any custom models you have added.')) {\n localStorage.removeItem(PROVIDER_SETTINGS_KEY);\n this.loadProviderSettings();\n this.updateGlobalModelsList();\n }\n },\n \n // Get models for a specific provider\n getModelsForProvider(providerId) {\n return this.providerSettings.models.filter(function(m) {\n return m.provider === providerId;\n });\n },\n \n // Update provider base URL\n updateProviderBaseUrl(providerId, url) {\n if (this.providerSettings.providers[providerId]) {\n this.providerSettings.providers[providerId].baseUrl = url;\n this.saveProviderSettings();\n }\n },\n \n // Update provider name\n updateProviderName(providerId, name) {\n if (this.providerSettings.providers[providerId]) {\n this.providerSettings.providers[providerId].name = name;\n this.saveProviderSettings();\n // Update model descriptions with new provider name\n this.updateGlobalModelsList();\n }\n },\n \n // Start editing a model name\n startEditingModel(modelId, currentName) {\n this.providerSettingsUI.editingModelId = modelId;\n this.providerSettingsUI.editingModelName = currentName;\n \n // Focus the input after Alpine renders\n var self = this;\n this.$nextTick(function() {\n var input = document.querySelector('[data-model-edit=\"' + modelId + '\"]');\n if (input) {\n input.focus();\n input.select();\n }\n });\n },\n \n // Commit editing a model name\n commitEditingModel() {\n var modelId = this.providerSettingsUI.editingModelId;\n var newName = this.providerSettingsUI.editingModelName.trim();\n \n if (modelId && newName) {\n var model = this.providerSettings.models.find(function(m) {\n return m.id === modelId;\n });\n if (model) {\n model.name = newName;\n this.saveProviderSettings();\n }\n }\n \n this.providerSettingsUI.editingModelId = null;\n this.providerSettingsUI.editingModelName = '';\n },\n \n // Cancel editing\n cancelEditingModel() {\n this.providerSettingsUI.editingModelId = null;\n this.providerSettingsUI.editingModelName = '';\n },\n \n // Start adding a new model\n startAddingModel(providerId) {\n this.providerSettingsUI.addingModelToProvider = providerId;\n this.providerSettingsUI.newModelId = '';\n \n var self = this;\n this.$nextTick(function() {\n var input = document.querySelector('[data-new-model-input=\"' + providerId + '\"]');\n if (input) {\n input.focus();\n }\n });\n },\n \n // Commit adding a new model\n commitAddingModel() {\n var providerId = this.providerSettingsUI.addingModelToProvider;\n var modelId = this.providerSettingsUI.newModelId.trim();\n \n if (providerId && modelId) {\n // Check if model already exists\n var exists = this.providerSettings.models.find(function(m) {\n return m.id === modelId;\n });\n \n if (exists) {\n alert('Model with this ID already exists');\n return;\n }\n \n // Add new model (active by default)\n var provider = this.providerSettings.providers[providerId];\n var providerName = provider?.name || providerId;\n \n // Extract hostname from baseUrl for custom providers\n if (providerId === 'custom' && provider?.baseUrl) {\n try {\n var url = new URL(provider.baseUrl);\n providerName = url.hostname;\n } catch (e) {\n providerName = 'Custom';\n }\n }\n \n this.providerSettings.models.push({\n id: modelId,\n name: modelId, // Use ID as initial name, user can edit\n provider: providerId,\n desc: providerName + ' model',\n capabilities: { streaming: true },\n active: true\n });\n \n this.saveProviderSettings();\n this.updateGlobalModelsList();\n }\n \n this.providerSettingsUI.addingModelToProvider = null;\n this.providerSettingsUI.newModelId = '';\n },\n \n // Cancel adding\n cancelAddingModel() {\n this.providerSettingsUI.addingModelToProvider = null;\n this.providerSettingsUI.newModelId = '';\n },\n \n // Delete a model\n deleteModel(modelId) {\n if (confirm('Delete this model from your configuration?')) {\n this.providerSettings.models = this.providerSettings.models.filter(function(m) {\n return m.id !== modelId;\n });\n this.saveProviderSettings();\n this.updateGlobalModelsList();\n }\n },\n \n // Toggle model capability\n toggleModelCapability(modelId, capability) {\n var model = this.providerSettings.models.find(function(m) {\n return m.id === modelId;\n });\n if (model) {\n if (!model.capabilities) model.capabilities = {};\n model.capabilities[capability] = !model.capabilities[capability];\n this.saveProviderSettings();\n }\n },\n \n // Toggle model active/inactive (show/hide in model picker)\n toggleModelActive(modelId) {\n var model = this.providerSettings.models.find(function(m) {\n return m.id === modelId;\n });\n if (model) {\n // Default to true if undefined, so toggle to false\n model.active = model.active === false ? true : false;\n this.saveProviderSettings();\n \n // Also update the global models list used by the picker\n this.updateGlobalModelsList();\n }\n },\n \n // Enable all models for a provider\n enableAllModels(providerId) {\n var models = this.getModelsForProvider(providerId);\n models.forEach(function(m) {\n m.active = true;\n });\n this.saveProviderSettings();\n this.updateGlobalModelsList();\n },\n \n // Disable all models for a provider\n disableAllModels(providerId) {\n var models = this.getModelsForProvider(providerId);\n models.forEach(function(m) {\n m.active = false;\n });\n this.saveProviderSettings();\n this.updateGlobalModelsList();\n },\n \n // Update the global models list (used by model picker) from provider settings\n updateGlobalModelsList() {\n // Get all active models from provider settings\n var activeModels = this.providerSettings.models.filter(function(m) {\n return m.active !== false; // Show by default if not set\n });\n \n // Get provider logos\n var providerLogos = {\n groq: '/public/groq-logo-orange.png',\n openai: '/public/openai-logo.png',\n anthropic: 'vscode-icons:file-type-claude',\n custom: 'lucide:message-square'\n };\n \n // Helper function to get provider display name\n var self = this;\n var getProviderDisplayName = function(providerId) {\n var provider = self.providerSettings.providers[providerId];\n if (!provider) return providerId;\n \n // For custom provider, use custom name or extract from URL\n if (providerId === 'custom') {\n if (provider.name) {\n return provider.name;\n }\n if (provider.baseUrl) {\n try {\n var url = new URL(provider.baseUrl);\n return url.hostname;\n } catch (e) {\n return 'Custom';\n }\n }\n return 'Custom';\n }\n \n // For other providers, use their name\n return provider.name || providerId;\n };\n \n // Update the main models array used by the picker\n // Use a Map to deduplicate by model ID (keep first occurrence)\n var seenIds = {};\n var dedupedModels = [];\n activeModels.forEach(function(m) {\n if (!seenIds[m.id]) {\n seenIds[m.id] = true;\n dedupedModels.push(m);\n }\n });\n \n this.models = dedupedModels.map(function(m) {\n // Generate description dynamically based on current provider settings\n var providerDisplayName = getProviderDisplayName(m.provider);\n var desc = m.desc;\n \n // Update description for custom provider models to use current provider name\n if (m.provider === 'custom') {\n desc = providerDisplayName + ' model';\n }\n \n return {\n id: m.id,\n name: m.name,\n desc: desc,\n logo: providerLogos[m.provider] || 'mdi:robot',\n provider: m.provider,\n web: m.capabilities?.web,\n thinking: m.capabilities?.thinking,\n image: m.capabilities?.image,\n tools: m.capabilities?.tools,\n preview: m.preview\n };\n });\n \n // If current selected model is no longer active, select the first available\n if (this.selectedModel) {\n var stillActive = this.models.find(function(m) {\n return m.id === this.selectedModel.id;\n }.bind(this));\n \n if (!stillActive && this.models.length > 0) {\n this.selectedModel = this.models[0];\n }\n }\n },\n \n // Update model description\n updateModelDescription(modelId, desc) {\n var model = this.providerSettings.models.find(function(m) {\n return m.id === modelId;\n });\n if (model) {\n model.desc = desc;\n this.saveProviderSettings();\n }\n },\n \n // Discover models from a custom endpoint\n async discoverModels(providerId) {\n var provider = this.providerSettings.providers[providerId];\n if (!provider || !provider.baseUrl) {\n this.providerSettingsUI.discoveryError = 'Please enter a base URL first';\n return;\n }\n \n this.providerSettingsUI.discoveringModels = true;\n this.providerSettingsUI.discoveryError = null;\n \n try {\n var apiKey = this.apiKeys ? this.apiKeys[providerId] : null;\n \n var response = await fetch('/api/providers/discover-models', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({\n baseUrl: provider.baseUrl,\n apiKey: apiKey,\n provider: providerId\n })\n });\n \n var data = await response.json();\n \n if (!response.ok || data.error) {\n throw new Error(data.error || data.details || 'Failed to discover models');\n }\n \n if (data.models && data.models.length > 0) {\n var addedCount = 0;\n var self = this;\n \n data.models.forEach(function(model) {\n // Check if model already exists\n var exists = self.providerSettings.models.find(function(m) {\n return m.id === model.id;\n });\n \n if (!exists) {\n // Get provider name - use custom name if set, otherwise extract from URL\n var providerName = 'Custom';\n if (provider.name) {\n providerName = provider.name;\n } else if (provider.baseUrl) {\n try {\n var url = new URL(provider.baseUrl);\n providerName = url.hostname;\n } catch (e) {\n providerName = 'Custom';\n }\n }\n \n self.providerSettings.models.push({\n id: model.id,\n name: model.name || model.id,\n provider: providerId,\n desc: providerName + ' model' + (model.owned_by && model.owned_by !== 'organization_owner' ? ' • ' + model.owned_by : ''),\n capabilities: { streaming: true },\n active: true\n });\n addedCount++;\n }\n });\n \n if (addedCount > 0) {\n this.saveProviderSettings();\n this.updateGlobalModelsList();\n // Success - models added silently\n } else {\n // All models already exist - no action needed\n }\n } else {\n this.providerSettingsUI.discoveryError = 'No models found at this endpoint';\n }\n } catch (error) {\n console.error('[discoverModels] Error:', error);\n this.providerSettingsUI.discoveryError = error.message || 'Failed to discover models';\n } finally {\n this.providerSettingsUI.discoveringModels = false;\n }\n },\n \n // Test connection to a provider\n async testConnection(providerId) {\n var provider = this.providerSettings.providers[providerId];\n \n this.providerSettingsUI.testingConnection = true;\n this.providerSettingsUI.connectionTestResult = null;\n \n try {\n var apiKey = this.apiKeys ? this.apiKeys[providerId] : null;\n \n var response = await fetch('/api/providers/test-connection', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({\n baseUrl: provider ? provider.baseUrl : null,\n apiKey: apiKey,\n provider: providerId\n })\n });\n \n var data = await response.json();\n \n this.providerSettingsUI.connectionTestResult = {\n success: data.success,\n message: data.message || data.error,\n modelCount: data.modelCount\n };\n } catch (error) {\n console.error('[testConnection] Error:', error);\n this.providerSettingsUI.connectionTestResult = {\n success: false,\n message: error.message || 'Connection test failed'\n };\n } finally {\n this.providerSettingsUI.testingConnection = false;\n }\n },\n \n // Get capability badge class\n getCapabilityBadgeClass(capability) {\n switch(capability) {\n case 'web': return 'badge-info';\n case 'thinking': return 'badge-purple';\n case 'image': return 'badge-success';\n case 'tools': return 'badge-warning';\n case 'streaming': return 'badge-neutral';\n default: return 'badge-neutral';\n }\n },\n \n // Get capability icon\n getCapabilityIcon(capability) {\n switch(capability) {\n case 'web': return 'mdi:web';\n case 'thinking': return 'mdi:brain';\n case 'image': return 'mdi:image-outline';\n case 'tools': return 'mdi:tools';\n case 'streaming': return 'mdi:lightning-bolt';\n default: return 'mdi:help-circle-outline';\n }\n },\n \n // Get provider logo path\n getProviderLogo(providerId) {\n var logos = {\n groq: '/public/groq-logo-orange.png',\n openai: '/public/openai-logo.png',\n anthropic: 'vscode-icons:file-type-claude',\n custom: '/public/custom-logo.png'\n };\n return logos[providerId] || '/public/custom-logo.png';\n }\n };\n}\n",[],[150,300,322],"0b83422a-e2e9-11f0-b141-42dde27851f2","models.js","0b834310-e2e9-11f0-b141-42dde27851f2",20,["D",1766815099683],"/**\n * Chat App Models - Model picker functionality\n * \n * Uses unified chat structure: chats[id] = { messages: [], metadata: {...} }\n */\n\nimport { createChatData, createChatMetadata } from './state.js';\n\nexport function createModelMethods() {\n return {\n initPreviewIndex() {\n if (this.selectedModel) {\n const idx = this.filteredModels.findIndex(m => m.id === this.selectedModel.id);\n this.previewIndex = idx >= 0 ? idx : 0;\n } else {\n this.previewIndex = 0;\n }\n },\n \n handleModelKeydown(event) {\n const filtered = this.filteredModels;\n if (filtered.length === 0) return;\n \n if (event.key === 'ArrowDown') {\n event.preventDefault();\n this.previewIndex = Math.min(this.previewIndex + 1, filtered.length - 1);\n this.scrollPreviewIntoView();\n } else if (event.key === 'ArrowUp') {\n event.preventDefault();\n this.previewIndex = Math.max(this.previewIndex - 1, 0);\n this.scrollPreviewIntoView();\n } else if (event.key === 'Enter') {\n event.preventDefault();\n if (this.previewIndex >= 0 && this.previewIndex < filtered.length) {\n this.selectModel(filtered[this.previewIndex]);\n }\n } else if (event.key === 'Escape') {\n event.preventDefault();\n this.showModelPicker = false;\n this.modelSearch = '';\n }\n },\n \n scrollPreviewIntoView() {\n this.$nextTick(() => {\n const list = this.$refs.modelList;\n const items = list?.querySelectorAll('.model-picker-item');\n if (items && items[this.previewIndex]) {\n items[this.previewIndex].scrollIntoView({ block: 'nearest' });\n }\n });\n },\n \n selectModel(model) {\n this.selectedModel = model;\n this.showModelPicker = false;\n this.modelSearch = '';\n \n // Save selected model to current chat's unified metadata\n if (this.activeChatId) {\n // Ensure chat exists with proper structure\n if (!this.chats[this.activeChatId]) {\n this.chats[this.activeChatId] = createChatData();\n }\n // Ensure metadata exists\n if (!this.chats[this.activeChatId].metadata) {\n this.chats[this.activeChatId].metadata = createChatMetadata();\n }\n \n this.chats[this.activeChatId].metadata.defaultModel = model.id;\n this.chats[this.activeChatId].metadata.updatedAt = new Date().toISOString();\n \n console.log('[selectModel] Saved model to chat', this.activeChatId, ':', model.id);\n \n // Trigger save\n if (this.saveToStorage) {\n this.saveToStorage();\n }\n }\n \n this.$nextTick(() => {\n if (this.$refs.input) {\n this.$refs.input.focus();\n }\n });\n },\n \n setupModelPickerWatchers() {\n this.$watch('showModelPicker', (value) => {\n if (value) {\n this.$nextTick(() => {\n const trigger = this.$refs.modelTrigger;\n const dropdown = this.$refs.modelDropdown;\n if (trigger && dropdown) {\n const triggerRect = trigger.getBoundingClientRect();\n const dropdownRect = dropdown.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n \n if (triggerRect.bottom + dropdownRect.height > viewportHeight && triggerRect.top > dropdownRect.height) {\n this.modelPosition = 'top';\n } else {\n this.modelPosition = 'bottom';\n }\n }\n this.initPreviewIndex();\n if (this.$refs.modelSearchInput) {\n this.$refs.modelSearchInput.focus();\n }\n });\n } else {\n this.modelSearch = '';\n this.previewIndex = -1;\n }\n });\n \n this.$watch('modelSearch', () => this.initPreviewIndex());\n },\n };\n}\n",[],[150,300,330],"0ba63e06-e2e9-11f0-a009-42dde27851f2","messaging.js","0ba63ece-e2e9-11f0-a009-42dde27851f2",25,["D",1766815099914],"/**\n * Chat App Messaging - Message sending, receiving, and API calls\n */\n\nimport { createMonacoEditor, addCopyButton } from \"../monaco-utils.js\";\n\nexport function createMessagingMethods(marked) {\n return {\n renderMessage(content) {\n return marked.parse(content);\n },\n\n async hydrateMonacoEditors() {\n // IMPORTANT: This function manipulates DOM which can break Alpine's x-for tracking\n // We need to be very careful to only modify elements OUTSIDE the x-for template\n // Use a safer approach: add Monaco INSIDE the existing element instead of replacing\n \n const codeBlocks = this.$el.querySelectorAll('pre code');\n \n for (const block of codeBlocks) {\n const pre = block.parentElement;\n if (!pre || pre.classList.contains('monaco-hydrated')) continue;\n \n const className = block.className;\n const langMatch = className.match(/language-(\\w+)/);\n const language = langMatch ? langMatch[1] : 'plaintext';\n \n if (['javascript', 'js', 'typescript', 'ts', 'json'].includes(language)) {\n const code = block.textContent;\n \n if (!pre.parentNode) continue;\n \n // SAFER APPROACH: Instead of replacing the pre element (which breaks Alpine),\n // hide the original content and add Monaco as a sibling\n // This preserves Alpine's DOM tracking\n \n // Mark as hydrated first to prevent double processing\n pre.classList.add('monaco-hydrated');\n \n // Hide the original code block\n pre.style.display = 'none';\n \n // Create Monaco wrapper as a sibling, not a replacement\n const wrapper = document.createElement('div');\n wrapper.className = 'monaco-wrapper';\n wrapper.style.position = 'relative';\n wrapper.style.marginTop = '1rem';\n wrapper.style.marginBottom = '1rem';\n \n const container = document.createElement('div');\n container.style.height = '200px';\n container.style.width = '100%';\n container.style.border = '1px solid #e2e8f0';\n container.style.borderRadius = '0.375rem';\n container.style.overflow = 'hidden';\n container.style.backgroundColor = '#ffffff';\n \n wrapper.appendChild(container);\n addCopyButton(wrapper, code);\n \n // Insert after the pre instead of replacing\n pre.parentNode.insertBefore(wrapper, pre.nextSibling);\n\n await this.$nextTick();\n\n createMonacoEditor(container, code, language, {\n readOnly: true,\n lineNumbers: 'off'\n });\n } else {\n pre.classList.add('monaco-hydrated');\n }\n }\n },\n \n adjustHeight() {\n const textarea = this.$refs.input;\n textarea.style.height = 'auto';\n const newHeight = Math.min(textarea.scrollHeight, 200);\n textarea.style.height = newHeight + 'px';\n \n const container = textarea.closest('.chat-input-container');\n if (container) {\n if (newHeight > 50) {\n container.classList.add('multiline');\n } else {\n container.classList.remove('multiline');\n }\n }\n },\n \n triggerFileUpload(type) {\n this.showAttachments = false;\n const fileName = type === 'image' ? 'vacation_photo.jpg' : 'project_report.pdf';\n \n // Generate unique ID with role prefix to prevent ID collision\n const userMessageId = 'user-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);\n \n this.messages.push({\n id: userMessageId,\n role: 'user',\n content: 'Uploaded ' + fileName,\n attachment: fileName,\n timestamp: new Date().toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' })\n });\n this.$nextTick(() => this.scrollToBottom());\n this.sendChatRequest();\n },\n \n copyMessage(text, messageId) {\n navigator.clipboard.writeText(text).then(() => {\n // Set copied state for this message\n this.copiedMessageId = messageId;\n \n // Clear after 1.5 seconds\n setTimeout(() => {\n this.copiedMessageId = null;\n }, 1500);\n });\n },\n \n deleteMessage(messageId) {\n const msgIndex = this.messages.findIndex(m => m.id === messageId);\n if (msgIndex !== -1) {\n this.messages.splice(msgIndex, 1);\n this.saveToStorage();\n }\n },\n \n // Fork chat from a message - create new chat with all messages up to and including this one\n forkChatFromMessage(messageId) {\n const msgIndex = this.messages.findIndex(m => m.id === messageId);\n if (msgIndex === -1) {\n console.warn('[forkChatFromMessage] Message not found:', messageId);\n return;\n }\n \n // Get all messages up to and including this one\n const forkedMessages = this.messages.slice(0, msgIndex + 1);\n \n // Get the current chat's folder\n const currentChat = this.items.find(i => i.id === this.activeChatId);\n const folderId = currentChat ? currentChat.folderId : null;\n \n // Create new chat in the same folder\n const id = this.nextItemId++;\n const order = this.getMaxOrder(this.items.filter(i => i.folderId === folderId)) + 1;\n \n // Generate name from the last user message or use default\n let chatName = 'Forked Chat';\n const lastUserMsg = forkedMessages.filter(m => m.role === 'user').pop();\n if (lastUserMsg && lastUserMsg.content) {\n chatName = lastUserMsg.content.slice(0, 30) + (lastUserMsg.content.length > 30 ? '...' : '');\n }\n \n const item = { id, name: chatName, folderId, order };\n this.items.push(item);\n \n // Create chat with forked messages (deep copy to avoid reference issues)\n const messageCopy = JSON.parse(JSON.stringify(forkedMessages));\n this.chats[id] = {\n messages: messageCopy,\n metadata: {\n createdAt: Date.now(),\n updatedAt: Date.now(),\n forkedFrom: this.activeChatId,\n forkedAt: Date.now()\n }\n };\n \n // Select the new chat\n this.selectChat(id);\n \n console.log('[forkChatFromMessage] Created forked chat:', id, 'with', forkedMessages.length, 'messages');\n },\n \n // Delete all messages below (after) this message\n deleteMessagesBelow(messageId) {\n const msgIndex = this.messages.findIndex(m => m.id === messageId);\n if (msgIndex === -1) {\n console.warn('[deleteMessagesBelow] Message not found:', messageId);\n return;\n }\n \n // Get count of messages to delete (for confirmation)\n const deleteCount = this.messages.length - msgIndex - 1;\n \n if (deleteCount === 0) {\n console.log('[deleteMessagesBelow] No messages below this one');\n return;\n }\n \n // Confirm deletion\n if (!confirm('Delete ' + deleteCount + ' message' + (deleteCount === 1 ? '' : 's') + ' below this one?')) {\n return;\n }\n \n // Delete all messages after this one\n this.messages.splice(msgIndex + 1, deleteCount);\n this.saveToStorage();\n \n console.log('[deleteMessagesBelow] Deleted', deleteCount, 'messages');\n },\n \n regenerateMessage(messageId) {\n // Find and delete the assistant message, then re-run inference\n const msgIndex = this.messages.findIndex(m => m.id === messageId);\n if (msgIndex !== -1 && this.messages[msgIndex].role === 'assistant') {\n this.messages.splice(msgIndex, 1);\n this.saveToStorage();\n // Re-run the chat request\n this.sendChatRequest();\n }\n },\n\n async sendMessage() {\n const self = this;\n if (!self.messageInput.trim() || self.isTyping || !self.activeChatId) return;\n \n // Defensive check: ensure messages is always an array\n if (!Array.isArray(self.messages)) {\n console.warn('[sendMessage] messages is not an array, resetting to empty array');\n self.messages = [];\n }\n \n const userText = self.messageInput;\n \n // Check if we should auto-rename (first user message in a \"New Chat\")\n const currentItem = self.items.find(i => i.id === self.activeChatId);\n const shouldRename = currentItem && currentItem.name === 'New Chat' && self.messages.filter(m => m.role === 'user').length === 0;\n \n // Generate unique ID with role prefix to prevent ID collision\n const userMessageId = 'user-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);\n \n self.messages.push({\n id: userMessageId,\n role: 'user',\n content: userText,\n timestamp: new Date().toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' })\n });\n \n // Auto-rename: just call the rename function directly\n if (shouldRename) {\n const newName = userText.slice(0, 30) + (userText.length > 30 ? '...' : '');\n self.renameChat(self.activeChatId, newName);\n }\n \n self.messageInput = '';\n \n self.$nextTick(() => {\n self.$refs.input.style.height = 'auto';\n self.scrollToBottom();\n // Don't call hydrateMonacoEditors here - let the debounced watcher handle it\n // Calling it synchronously during message updates can corrupt Alpine's DOM tracking\n });\n \n self.sendChatRequest();\n },\n \n async sendChatRequest() {\n this.isTyping = true;\n this.scrollToBottom();\n \n // Defensive check: ensure messages is always an array\n if (!Array.isArray(this.messages)) {\n console.warn('[sendChatRequest] messages is not an array, resetting to empty array');\n this.messages = [];\n }\n \n // Capture context for callbacks\n const self = this;\n \n try {\n // Get chat parameters from settings\n const chatParams = this.getChatParameters ? this.getChatParameters() : {};\n const systemPrompt = this.getSystemPrompt ? this.getSystemPrompt() : '';\n \n // Build messages array with optional system prompt\n const apiMessages = [];\n \n // Add system prompt if set\n if (systemPrompt && systemPrompt.trim()) {\n apiMessages.push({\n role: 'system',\n content: systemPrompt.trim()\n });\n }\n \n // Add conversation messages\n this.messages\n .filter(msg => msg.role === 'user' || msg.role === 'assistant')\n .forEach(msg => {\n apiMessages.push({\n role: msg.role,\n content: msg.content\n });\n });\n \n // Get model ID for metadata\n const modelId = this.selectedModel ? this.selectedModel.id : 'llama-3.3-70b-versatile';\n \n // Store message metadata for tracing (create BEFORE using it)\n const messageMeta = {\n model: modelId,\n temperature: chatParams.temperature,\n maxTokens: chatParams.maxTokens,\n parameters: { ...chatParams },\n timestamp: new Date().toISOString()\n };\n \n // Check streaming setting (default to true if not set)\n const useStreaming = this.settings?.useStreaming !== false;\n \n // Create assistant message placeholder with unique ID and metadata\n // Generate unique ID with role prefix to prevent ID collision with user messages\n const assistantMessageId = 'assistant-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);\n const assistantMessage = {\n id: assistantMessageId,\n role: 'assistant',\n content: '',\n timestamp: new Date().toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' }),\n metadata: messageMeta,\n isLoading: !useStreaming // Show loading state for non-streaming\n };\n this.messages.push(assistantMessage);\n this.isTyping = false;\n \n let assistantContent = '';\n \n // Throttle UI updates to prevent overwhelming Alpine's reactivity\n // Update UI at most every 50ms during streaming\n let lastUpdateTime = 0;\n let pendingUpdate = null;\n const UPDATE_THROTTLE_MS = 50;\n \n function throttledUpdate() {\n var now = Date.now();\n if (now - lastUpdateTime >= UPDATE_THROTTLE_MS) {\n // Enough time has passed, update immediately\n lastUpdateTime = now;\n if (pendingUpdate) {\n clearTimeout(pendingUpdate);\n pendingUpdate = null;\n }\n // Actually update the message content\n if (!Array.isArray(self.messages)) {\n return;\n }\n var msgIndex = self.messages.findIndex(function(m) { return m.id === assistantMessageId; });\n if (msgIndex !== -1) {\n self.messages[msgIndex].content = assistantContent;\n }\n self.scrollToBottom();\n } else if (!pendingUpdate) {\n // Schedule an update for when throttle period ends\n pendingUpdate = setTimeout(function() {\n pendingUpdate = null;\n throttledUpdate();\n }, UPDATE_THROTTLE_MS - (now - lastUpdateTime));\n }\n }\n \n // Get provider from model's stored config, fallback to parsing model ID\n var modelConfig = null;\n if (this.providerSettings && this.providerSettings.models) {\n modelConfig = this.providerSettings.models.find(function(m) { return m.id === modelId; });\n }\n if (!modelConfig && this.models) {\n modelConfig = this.models.find(function(m) { return m.id === modelId; });\n }\n var provider = (modelConfig && modelConfig.provider) \n ? modelConfig.provider \n : (modelId.includes('/') ? modelId.split('/')[0] : 'groq');\n var apiKey = this.getApiKey ? this.getApiKey(provider) : '';\n \n // Get base URL for custom providers\n var baseUrl = null;\n if (this.providerSettings && this.providerSettings.providers && this.providerSettings.providers[provider]) {\n baseUrl = this.providerSettings.providers[provider].baseUrl;\n }\n \n console.log('[Chat] Model:', modelId, '| Provider:', provider, '| API Key:', apiKey ? '***set***' : '(empty)', '| Base URL:', baseUrl || '(default)');\n \n // Create orchestrator job to track this chat request\n var threadJob = null;\n if (this.createThreadJob) {\n threadJob = this.createThreadJob(this.activeChatId, 'chat', {\n messages: apiMessages,\n model: modelId,\n provider: provider\n }, {\n metadata: {\n assistantMessageId: assistantMessageId,\n messageCount: apiMessages.length\n }\n });\n \n // Check for blockers before sending\n var blocker = this.checkJobBlockers ? this.checkJobBlockers(threadJob.id) : null;\n if (blocker) {\n console.log('[Orchestrator] Job blocked:', blocker.type);\n if (this.updateJobStatus) {\n this.updateJobStatus(threadJob.id, 'blocked', { blocker: blocker });\n }\n \n // Show blocked error in UI\n if (Array.isArray(self.messages)) {\n var msgIndex = self.messages.findIndex(function(m) { return m.id === assistantMessageId; });\n if (msgIndex !== -1) {\n self.messages[msgIndex] = {\n id: assistantMessageId,\n role: 'error',\n content: blocker.message + '. Please add your API key in Settings → Models.',\n isError: true,\n isApiKeyError: blocker.type === 'api_key_missing',\n threadJobId: threadJob.id,\n timestamp: Date.now()\n };\n }\n }\n self.isTyping = false;\n self.saveToStorage();\n return;\n }\n \n // Mark job as running\n if (this.updateJobStatus) {\n this.updateJobStatus(threadJob.id, 'running');\n }\n }\n \n var job = await this.jobs.createJob('chat', {\n messages: apiMessages,\n model: modelId,\n provider: provider, // Send provider to backend\n temperature: chatParams.temperature,\n maxTokens: chatParams.maxTokens,\n topP: chatParams.topP,\n frequencyPenalty: chatParams.frequencyPenalty,\n presencePenalty: chatParams.presencePenalty,\n systemPrompt: chatParams.systemPrompt,\n reasoningEffort: chatParams.reasoningEffort,\n webSearch: chatParams.webSearch,\n codeExecution: chatParams.codeExecution,\n imageDetail: chatParams.imageDetail,\n modelVersion: chatParams.modelVersion,\n apiKey: apiKey, // Pass API key to backend\n baseUrl: baseUrl, // Pass base URL for custom providers\n stream: useStreaming // Pass streaming preference\n });\n \n // Store job ID for potential cancellation\n this.activeJobId = job.id;\n console.log('[Job created]:', job.id);\n \n // Link backend job to orchestrator job\n if (threadJob && this.updateJobStatus) {\n threadJob.metadata.backendJobId = job.id;\n this.updateJobStatus(threadJob.id, 'streaming');\n }\n \n // Subscribe to job stream with captured context\n this.jobs.streamJob(job.id, {\n onData: function(data) {\n // Handle streaming data chunks\n if (data.content) {\n assistantContent += data.content;\n // Use throttled update to prevent overwhelming Alpine\n throttledUpdate();\n \n // Update orchestrator progress\n if (threadJob && self.updateJobProgress) {\n self.updateJobProgress(threadJob.id, assistantContent.length, assistantContent);\n }\n }\n \n // Clear loading state on first data chunk (for non-streaming mode)\n if (!Array.isArray(self.messages)) return;\n const msgIndex = self.messages.findIndex(function(m) { return m.id === assistantMessageId; });\n if (msgIndex !== -1 && self.messages[msgIndex].isLoading) {\n self.messages[msgIndex].isLoading = false;\n }\n },\n onJob: function(jobData) {\n // Handle job status changes\n console.log('[Job status]:', jobData.status);\n \n if (jobData.status === 'completed') {\n // Clear any pending throttled update\n if (pendingUpdate) {\n clearTimeout(pendingUpdate);\n pendingUpdate = null;\n }\n \n // Update orchestrator job status\n if (threadJob && self.updateJobStatus) {\n self.updateJobStatus(threadJob.id, 'completed', { \n result: jobData.result \n });\n }\n \n // Final result available\n console.log('[Chat complete]:', jobData.result);\n \n // Parse the message to extract thinking/reasoning\n if (jobData.result) {\n var parsed = self.parseMessage(jobData.result);\n console.log('[Parsed message]:', parsed);\n console.log('[Has reasoning?]:', parsed.hasReasoning, '|', parsed.reasoning);\n console.log('[Has thinking?]:', parsed.hasThinking, '|', parsed.thinking);\n console.log('[Clean content]:', parsed.content);\n }\n \n // Make sure final content is set\n if (jobData.result && jobData.result.content) {\n // Defensive check: ensure messages array still exists\n if (!Array.isArray(self.messages)) {\n console.warn('[Stream onJob] messages array lost, cannot update final content');\n return;\n }\n const msgIndex = self.messages.findIndex(function(m) { return m.id === assistantMessageId; });\n if (msgIndex !== -1) {\n // Store the full result object (including reasoning, tools, etc)\n self.messages[msgIndex].content = jobData.result.content;\n self.messages[msgIndex].reasoning = jobData.result.reasoning;\n self.messages[msgIndex].tools = jobData.result.tools || jobData.result.executedTools || [];\n self.messages[msgIndex].isLoading = false; // Clear loading state\n \n console.log('[Message stored with reasoning]:', !!self.messages[msgIndex].reasoning);\n }\n }\n \n // Save to chat storage\n self.saveToStorage();\n self.scrollToBottom();\n } else if (jobData.status === 'error') {\n console.error('[Job error]:', jobData.error, jobData);\n \n // Extract error message from various possible locations\n var errorMsg = jobData.error || jobData.message || jobData.details || 'An error occurred. Please check your settings and try again.';\n \n // Normalize error message for better detection\n var errorMsgLower = String(errorMsg).toLowerCase();\n var isApiKeyError = errorMsgLower.includes('api') && \n (errorMsgLower.includes('key') || errorMsgLower.includes('configured') || \n errorMsgLower.includes('not set') || errorMsgLower.includes('missing') ||\n errorMsgLower.includes('401') || errorMsgLower.includes('403') ||\n errorMsgLower.includes('unauthorized') || errorMsgLower.includes('forbidden'));\n \n // Determine provider name for better error messages\n var providerName = 'provider';\n if (self.selectedModel && self.selectedModel.provider) {\n var providerMap = {\n 'groq': 'Groq',\n 'openai': 'OpenAI',\n 'anthropic': 'Anthropic',\n 'custom': 'Custom Provider'\n };\n providerName = providerMap[self.selectedModel.provider] || self.selectedModel.provider;\n }\n \n // Create user-friendly error message for display\n var displayMsg = errorMsg;\n if (isApiKeyError && !errorMsg.includes('Settings')) {\n displayMsg = providerName + ' API key is missing or invalid. Please add your API key in Settings → Models.';\n }\n \n // Replace the placeholder loading message with an error card\n if (Array.isArray(self.messages)) {\n var msgIndex = self.messages.findIndex(function(m) { return m.id === assistantMessageId; });\n if (msgIndex !== -1) {\n self.messages[msgIndex] = {\n id: assistantMessageId,\n role: 'error',\n content: displayMsg,\n isError: true,\n isApiKeyError: isApiKeyError,\n threadJobId: threadJob ? threadJob.id : null,\n timestamp: Date.now()\n };\n }\n }\n \n // Update orchestrator job status\n if (threadJob && self.updateJobStatus) {\n var blockerType = isApiKeyError ? 'api_key_missing' : 'provider_error';\n self.updateJobStatus(threadJob.id, isApiKeyError ? 'blocked' : 'error', { \n error: errorMsg,\n blocker: isApiKeyError ? {\n type: blockerType,\n message: displayMsg,\n provider: provider\n } : null\n });\n }\n \n // Save to chat storage\n self.saveToStorage();\n self.scrollToBottom();\n \n // Also log for debugging\n console.error('[Chat Error]', errorMsg);\n \n // Clear typing indicator\n self.isTyping = false;\n }\n },\n onError: function(error) {\n console.error('[Stream error]:', error);\n \n // Remove the placeholder message\n if (Array.isArray(self.messages)) {\n const msgIndex = self.messages.findIndex(function(m) { return m.id === assistantMessageId; });\n if (msgIndex !== -1) {\n self.messages.splice(msgIndex, 1);\n }\n }\n \n // Show error toast\n if (window.toast) {\n window.toast('Stream Error', {\n description: error.message || 'An error occurred while streaming the response.',\n type: 'danger'\n });\n }\n }\n });\n \n } catch (error) {\n console.error('Chat error:', error);\n this.isTyping = false;\n \n // Check if it's an API key error\n const isApiKeyError = error.message && (\n error.message.includes('messageMeta') ||\n error.message.includes('API') ||\n error.message.includes('key') ||\n error.message.includes('401') ||\n error.message.includes('403')\n );\n \n // Show user-friendly error toast\n if (window.toast) {\n if (isApiKeyError || !this.getApiKey('groq')) {\n window.toast('API Key Required', {\n description: 'Please add your Groq API key in the settings to use this chat.',\n type: 'danger'\n });\n } else {\n window.toast('Error', {\n description: error.message || 'An unexpected error occurred. Please try again.',\n type: 'danger'\n });\n }\n }\n \n this.scrollToBottom();\n }\n },\n \n scrollToBottom() {\n if (!this.settings.autoScroll) {\n return;\n }\n const messagesContainer = document.getElementById('chat-messages');\n if (messagesContainer) {\n messagesContainer.scrollTop = messagesContainer.scrollHeight;\n }\n },\n \n // Toggle thinking/reasoning visibility for a message\n toggleThinking(messageId) {\n if (!this.thinkingVisible) {\n this.thinkingVisible = {};\n }\n this.thinkingVisible[messageId] = !this.thinkingVisible[messageId];\n },\n \n // Check if thinking is visible for a message\n isThinkingVisible(messageId) {\n return this.thinkingVisible && this.thinkingVisible[messageId];\n },\n \n handleKeydown(event) {\n if (event.key === 'Enter' && !event.shiftKey) {\n event.preventDefault();\n this.sendMessage();\n }\n },\n };\n}\n",[],[150,300,338],"0bbfc7fe-e2e9-11f0-a62a-42dde27851f2","jobs.js","0bbfc8c6-e2e9-11f0-a62a-42dde27851f2",28,["D",1766815100048],"// Jobs API Module - Frontend integration for async jobs\nexport function jobsModule() {\n return {\n // Active jobs tracking\n jobs: {},\n activeStreams: {},\n\n // Create a new job\n async createJob(type, input) {\n try {\n const response = await fetch('/api/jobs', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({ type, input })\n });\n \n if (!response.ok) {\n throw new Error('Failed to create job: ' + response.statusText);\n }\n \n const job = await response.json();\n this.jobs[job.id] = job;\n \n console.log('[Jobs] Created job:', job.id, job.status);\n return job;\n } catch (error) {\n console.error('[Jobs] Error creating job:', error);\n throw error;\n }\n },\n\n // Get job status\n async getJob(jobId) {\n try {\n const response = await fetch('/api/jobs/' + jobId);\n \n if (!response.ok) {\n throw new Error('Job not found');\n }\n \n const job = await response.json();\n this.jobs[jobId] = job;\n return job;\n } catch (error) {\n console.error('[Jobs] Error fetching job:', error);\n throw error;\n }\n },\n\n // List all jobs\n async listJobs(status = null) {\n try {\n const url = status ? '/api/jobs?status=' + status : '/api/jobs';\n const response = await fetch(url);\n \n if (!response.ok) {\n throw new Error('Failed to list jobs');\n }\n \n const data = await response.json();\n return data.jobs || [];\n } catch (error) {\n console.error('[Jobs] Error listing jobs:', error);\n throw error;\n }\n },\n\n // Cancel a job\n async cancelJob(jobId) {\n try {\n const response = await fetch('/api/jobs/' + jobId + '/cancel', {\n method: 'POST'\n });\n \n if (!response.ok) {\n throw new Error('Failed to cancel job');\n }\n \n const job = await response.json();\n this.jobs[jobId] = job;\n console.log('[Jobs] Cancelled job:', jobId);\n return job;\n } catch (error) {\n console.error('[Jobs] Error cancelling job:', error);\n throw error;\n }\n },\n\n // Subscribe to job updates via SSE\n streamJob(jobId, handlers = {}) {\n // Check if already streaming\n if (this.activeStreams[jobId]) {\n console.warn('[Jobs] Already streaming job:', jobId);\n return this.activeStreams[jobId];\n }\n\n const eventSource = new EventSource('/api/jobs/' + jobId + '/stream');\n this.activeStreams[jobId] = eventSource;\n\n // Handle job status updates\n eventSource.addEventListener('job', (event) => {\n try {\n const data = JSON.parse(event.data);\n this.jobs[jobId] = { ...this.jobs[jobId], ...data };\n \n console.log('[Jobs] Job update:', jobId, data.status);\n \n if (handlers.onJob) {\n handlers.onJob(data);\n }\n\n // Auto-close stream when job completes\n if (data.status === 'completed' || data.status === 'error' || data.status === 'cancelled') {\n this.stopStreaming(jobId);\n }\n } catch (error) {\n console.error('[Jobs] Error parsing job event:', error);\n }\n });\n\n // Handle streaming data chunks\n eventSource.addEventListener('data', (event) => {\n try {\n const data = JSON.parse(event.data);\n \n if (handlers.onData) {\n handlers.onData(data);\n }\n } catch (error) {\n console.error('[Jobs] Error parsing data event:', error);\n }\n });\n\n // Handle ping (keep-alive)\n eventSource.addEventListener('ping', () => {\n // Keep connection alive\n });\n\n // Handle errors\n eventSource.onerror = (error) => {\n console.error('[Jobs] Stream error for job:', jobId, error);\n \n if (handlers.onError) {\n handlers.onError(error);\n }\n \n this.stopStreaming(jobId);\n };\n\n return eventSource;\n },\n\n // Stop streaming a job\n stopStreaming(jobId) {\n if (this.activeStreams[jobId]) {\n this.activeStreams[jobId].close();\n delete this.activeStreams[jobId];\n console.log('[Jobs] Stopped streaming job:', jobId);\n }\n },\n\n // Stop all active streams\n stopAllStreams() {\n Object.keys(this.activeStreams).forEach(jobId => {\n this.stopStreaming(jobId);\n });\n },\n\n // Helper: Create and stream a chat job\n async createAndStreamChatJob(messages, options = {}) {\n const job = await this.createJob('chat', {\n messages,\n model: options.model,\n provider: options.provider,\n temperature: options.temperature,\n maxTokens: options.maxTokens\n });\n\n // Immediately start streaming\n this.streamJob(job.id, options.handlers);\n\n return job;\n }\n };\n}\n\n",[],[150,300,346],"0bca693e-e2e9-11f0-b941-42dde27851f2","index.js","0bca6a1a-e2e9-11f0-b941-42dde27851f2",29,["D",1766815099829],"/**\n * Chat App - Main Entry Point\n * Combines all modules into a single Alpine.js component\n */\n\nimport { marked } from \"https://esm.sh/marked\";\nimport Alpine from \"https://esm.sh/alpinejs@3.12.3\";\n\nimport { createInitialState, MODELS } from \"./state.js\";\nimport { createStorageMethods } from \"./storage.js\";\nimport { createFolderMethods } from \"./folders.js\";\nimport { createChatMethods } from \"./chats.js\";\nimport { createEditingMethods } from \"./editing.js\";\nimport { createDragDropMethods } from \"./dragdrop.js\";\nimport { createModelMethods } from \"./models.js\";\nimport { createMessagingMethods } from \"./messaging.js\";\nimport { createSettingsMethods } from \"./settings.js\";\nimport { createChatSettingsMethods } from \"./chatSettings.js\";\nimport { createProviderSettingsMethods } from \"./providerSettings.js\";\nimport { createThreadsMixin, JobStatus, ThreadEvent, OrchestratorEvent, parseMessage, getDisplayContent, getThinking } from \"./threads.js\";\nimport { jobsModule } from \"./jobs.js\";\n\nfunction chatApp() {\n // Get initial state\n const state = createInitialState();\n \n // Get all method objects\n const storageMethods = createStorageMethods();\n const folderMethods = createFolderMethods();\n const chatMethods = createChatMethods();\n const editingMethods = createEditingMethods();\n const dragDropMethods = createDragDropMethods();\n const modelMethods = createModelMethods();\n const messagingMethods = createMessagingMethods(marked);\n const settingsMethods = createSettingsMethods();\n const chatSettingsMethods = createChatSettingsMethods();\n const providerSettingsMethods = createProviderSettingsMethods();\n const threadsMixin = createThreadsMixin();\n const jobs = jobsModule();\n \n // Return the combined component object\n // All methods use 'this' which Alpine will bind correctly\n return {\n // Spread all state properties\n ...state,\n \n // Spread all methods from modules\n ...storageMethods,\n ...folderMethods,\n ...chatMethods,\n ...editingMethods,\n ...dragDropMethods,\n ...modelMethods,\n ...messagingMethods,\n ...settingsMethods,\n ...chatSettingsMethods,\n ...providerSettingsMethods,\n ...threadsMixin,\n \n // Job/thread status constants for templates\n JobStatus,\n ThreadEvent,\n OrchestratorEvent, // Backwards compat\n \n // Message parsing utilities\n parseMessage,\n getDisplayContent,\n getThinking,\n \n // Jobs API\n jobs,\n \n // Computed property for filtered models\n get filteredModels() {\n if (this.modelSearch === '') return this.models;\n const search = this.modelSearch.toLowerCase();\n return this.models.filter(m => \n m.name.toLowerCase().includes(search) ||\n m.desc.toLowerCase().includes(search) ||\n m.id.toLowerCase().includes(search)\n );\n },\n \n // Computed property to check if we should show \"Generate Response\" button\n // Shows when user's message is last and there's no assistant response after it\n get shouldShowGenerateButton() {\n if (!Array.isArray(this.messages) || this.messages.length === 0) return false;\n const lastMessage = this.messages[this.messages.length - 1];\n return lastMessage && lastMessage.role === 'user' && !this.isTyping;\n },\n \n // =========================================================================\n // Initialization\n // =========================================================================\n \n async init() {\n console.log('Chatter initialized');\n \n // Set default model first (may be overridden by chat-specific model in loadFromStorage)\n if (this.models.length > 0) {\n this.selectedModel = this.models[0];\n }\n \n this.loadSettings();\n this.loadFromStorage(); // This will restore chat-specific model in $nextTick\n \n // Initialize the threads manager\n this.initThreads();\n \n // Load provider settings (API keys, base URLs, models)\n this.loadProviderSettings();\n \n // Load model configs from API\n this.loadModelConfigs();\n \n marked.setOptions({\n highlight: function(code, lang) { return code; },\n breaks: true\n });\n \n // Debounced save function to prevent excessive saves during streaming\n let saveTimeout = null;\n const debouncedSave = () => {\n if (saveTimeout) clearTimeout(saveTimeout);\n saveTimeout = setTimeout(() => {\n this.saveToStorage();\n }, 500); // Save 500ms after last change\n };\n \n // Debounced Monaco hydration - only run after content stops changing\n // This prevents excessive DOM manipulation during streaming\n let hydrateTimeout = null;\n const debouncedHydrate = () => {\n if (hydrateTimeout) clearTimeout(hydrateTimeout);\n hydrateTimeout = setTimeout(() => {\n this.hydrateMonacoEditors();\n }, 1000); // Wait 1 second after last change before hydrating\n };\n \n // Watch for storage changes\n this.$watch('folders', () => this.saveToStorage(), { deep: true });\n this.$watch('items', () => this.saveToStorage(), { deep: true });\n // Note: We don't watch 'chats' because saveToStorage() updates it,\n // which would create a circular dependency. Instead we save when messages change.\n \n this.$watch('messages', () => {\n // Defensive check: ensure messages is always an array\n if (!Array.isArray(this.messages)) {\n console.error('[Watch] CRITICAL: messages is not an array! Type:', typeof this.messages);\n console.error('[Watch] This should never happen - messages array reference was lost');\n }\n // Use debounced hydration to avoid excessive DOM manipulation during streaming\n this.$nextTick(() => debouncedHydrate());\n // Debounced save to prevent excessive saves during streaming\n debouncedSave();\n }, { deep: true });\n \n // Setup model picker watchers\n this.setupModelPickerWatchers();\n\n this.$nextTick(() => {\n this.scrollToBottom();\n if (this.$refs.input) {\n this.$refs.input.style.height = 'auto';\n }\n setTimeout(() => this.hydrateMonacoEditors(), 500);\n });\n },\n };\n}\n\n// Register with Alpine and start\nAlpine.data('chatApp', chatApp);\nAlpine.start();\n\n// Export for potential external use\nexport { chatApp, MODELS };\n",[],[150,300,354],"0b9e86ca-e2e9-11f0-b141-42dde27851f2","folders.js","0b9e8760-e2e9-11f0-b141-42dde27851f2",23,["D",1766815099862],"/**\n * Chat App Folders - Folder operations\n */\n\nexport function createFolderMethods() {\n return {\n createFolder(parentId = null) {\n const id = this.nextFolderId++;\n const order = this.getMaxOrder(this.folders.filter(f => f.parentId === parentId)) + 1;\n const folder = { id, name: 'New Folder', parentId, collapsed: false, order };\n this.folders.push(folder);\n this.$nextTick(() => this.startEditingFolder(id, folder.name));\n return folder;\n },\n \n deleteFolder(folderId) {\n const descendantIds = this.getAllDescendantFolderIds(folderId);\n const allFolderIds = [folderId, ...descendantIds];\n \n // Delete chats in these folders\n const chatsToDelete = this.items.filter(item => allFolderIds.includes(item.folderId));\n for (const chat of chatsToDelete) {\n delete this.chats[chat.id];\n }\n \n this.items = this.items.filter(item => !allFolderIds.includes(item.folderId));\n this.folders = this.folders.filter(f => !allFolderIds.includes(f.id));\n this.folderMenuOpen = null;\n },\n \n getAllDescendantFolderIds(folderId) {\n const children = this.folders.filter(f => f.parentId === folderId);\n let descendants = children.map(c => c.id);\n for (const child of children) {\n descendants = [...descendants, ...this.getAllDescendantFolderIds(child.id)];\n }\n return descendants;\n },\n \n toggleFolderCollapsed(folderId) {\n const folder = this.folders.find(f => f.id === folderId);\n if (folder) folder.collapsed = !folder.collapsed;\n },\n \n getFolderDepth(folderId) {\n let depth = 0;\n let folder = this.folders.find(f => f.id === folderId);\n while (folder && folder.parentId !== null) {\n depth++;\n folder = this.folders.find(f => f.id === folder.parentId);\n }\n return depth;\n },\n \n canNestIn(folderId) {\n return this.getFolderDepth(folderId) < 2;\n },\n \n getRootFolders() {\n return this.folders.filter(f => f.parentId === null).sort((a, b) => a.order - b.order);\n },\n \n getChildFolders(parentId) {\n return this.folders.filter(f => f.parentId === parentId).sort((a, b) => a.order - b.order);\n },\n \n getMaxOrder(items) {\n if (!items.length) return 0;\n return Math.max(...items.map(i => i.order || 0));\n },\n };\n}\n",[],[150,300,362],"0b98634e-e2e9-11f0-a5e5-42dde27851f2","editing.js","0b986402-e2e9-11f0-a5e5-42dde27851f2",22,["D",1766815099823],"/**\n * Chat App Editing - Inline editing for folders, items, and messages\n */\n\nexport function createEditingMethods() {\n return {\n // Folder editing\n startEditingFolder(folderId, currentName) {\n this.editingFolderId = folderId;\n this.editingFolderName = currentName || '';\n this.$nextTick(() => {\n const input = document.querySelector('[data-folder-edit=\"' + folderId + '\"]');\n if (input) { input.focus(); input.select(); }\n });\n },\n \n commitEditingFolder() {\n if (!this.editingFolderId) return;\n const folder = this.folders.find(f => f.id === this.editingFolderId);\n if (folder) folder.name = (this.editingFolderName || '').trim() || 'New Folder';\n this.cancelEditingFolder();\n },\n \n cancelEditingFolder() {\n this.editingFolderId = null;\n this.editingFolderName = '';\n },\n \n // Item editing\n startEditingItem(itemId, currentName) {\n this.editingItemId = itemId;\n this.editingItemName = currentName || '';\n this.$nextTick(() => {\n const input = document.querySelector('[data-item-edit=\"' + itemId + '\"]');\n if (input) { input.focus(); input.select(); }\n });\n },\n \n commitEditingItem() {\n if (!this.editingItemId) return;\n const item = this.items.find(i => i.id === this.editingItemId);\n if (item) item.name = (this.editingItemName || '').trim() || 'New Chat';\n this.cancelEditingItem();\n },\n \n cancelEditingItem() {\n this.editingItemId = null;\n this.editingItemName = '';\n },\n \n // Message editing\n startEditingMessage(messageId, content) {\n this.editingMessageId = messageId;\n this.editingMessageContent = content;\n \n // Focus the contenteditable element\n this.$nextTick(() => {\n const el = document.querySelector('[data-message-id=\"' + messageId + '\"]');\n if (el) {\n el.focus();\n // Move cursor to end\n const range = document.createRange();\n const sel = window.getSelection();\n range.selectNodeContents(el);\n range.collapse(false);\n sel.removeAllRanges();\n sel.addRange(range);\n }\n });\n },\n \n commitEditingMessage(event) {\n if (!this.editingMessageId) return;\n \n const msgIndex = this.messages.findIndex(m => m.id === this.editingMessageId);\n if (msgIndex !== -1 && event && event.target) {\n // Get text content - innerText preserves line breaks in

\n        const newContent = event.target.innerText;\n        if (newContent && newContent.trim()) {\n          this.messages[msgIndex].content = newContent;\n          this.saveToStorage();\n        }\n      }\n      this.editingMessageId = null;\n      this.editingMessageContent = '';\n    },\n    \n    cancelEditingMessage() {\n      // Restore original content by just clearing editing state\n      // Alpine will re-render with the original message.content\n      this.editingMessageId = null;\n      this.editingMessageContent = '';\n    },\n  };\n}\n",[],[150,300,370],"0b8a590c-e2e9-11f0-b941-42dde27851f2","dragdrop.js","0b8a59c0-e2e9-11f0-b941-42dde27851f2",21,["D",1766815099656],"/**\n * Chat App Drag & Drop - Folder and item drag/drop functionality\n */\n\nexport function createDragDropMethods() {\n  return {\n    onItemDragStart(e, itemId) {\n      try { if (e && e.dataTransfer) { e.dataTransfer.setData('text/plain', 'item:' + itemId); e.dataTransfer.effectAllowed = 'move'; } } catch (_) {}\n      this.draggingItemId = itemId;\n      this.draggingFolderId = null;\n      this.draggingType = 'item';\n    },\n    \n    onItemDragEnd() {\n      this.clearDragState();\n    },\n    \n    onFolderDragStart(e, folderId) {\n      try { if (e && e.dataTransfer) { e.dataTransfer.setData('text/plain', 'folder:' + folderId); e.dataTransfer.effectAllowed = 'move'; } } catch (_) {}\n      this.draggingFolderId = folderId;\n      this.draggingItemId = null;\n      this.draggingType = 'folder';\n    },\n    \n    onFolderDragEnd() {\n      this.clearDragState();\n    },\n    \n    clearDragState() {\n      this.draggingItemId = null;\n      this.draggingFolderId = null;\n      this.draggingType = null;\n      this.dropIndicator = null;\n      this.dragOverFolderId = null;\n      this.dragOverRoot = false;\n      this.dragOverFolderRoot = false;\n    },\n    \n    onItemDragOver(e, targetId, targetType, parentId) {\n      e.preventDefault();\n      e.stopPropagation();\n      \n      if (this.draggingItemId === targetId && targetType === 'item') return;\n      if (this.draggingFolderId === targetId && targetType === 'folder') return;\n      \n      if (this.draggingFolderId && targetType === 'folder') {\n        const descendants = this.getAllDescendantFolderIds(this.draggingFolderId);\n        if (descendants.includes(targetId)) return;\n      }\n      \n      const rect = e.currentTarget.getBoundingClientRect();\n      const y = e.clientY - rect.top;\n      const height = rect.height;\n      const threshold = 0.35;\n      \n      let position;\n      if (y < height * threshold) {\n        position = 'before';\n      } else if (y > height * (1 - threshold)) {\n        position = 'after';\n      } else if (targetType === 'folder') {\n        position = 'inside';\n        this.dragOverFolderId = targetId;\n      } else {\n        position = 'after';\n      }\n      \n      if (position !== 'inside') {\n        this.dragOverFolderId = null;\n      }\n      \n      this.dropIndicator = { targetId, position, type: targetType, parentId };\n    },\n    \n    onItemDragLeave(e) {\n      if (e.currentTarget.contains(e.relatedTarget)) return;\n      if (this.dropIndicator && this.dropIndicator.targetId === parseInt(e.currentTarget.dataset?.id)) {\n        this.dropIndicator = null;\n      }\n    },\n    \n    onReorderDrop(e, targetId, targetType, parentId) {\n      e.preventDefault();\n      e.stopPropagation();\n      \n      if (!this.dropIndicator) return;\n      \n      const { position } = this.dropIndicator;\n      const draggedItemId = this.draggingItemId;\n      const draggedFolderId = this.draggingFolderId;\n      \n      if (draggedItemId) {\n        if (position === 'inside' && targetType === 'folder') {\n          this.moveItemToFolder(draggedItemId, targetId);\n        } else {\n          this.reorderItem(draggedItemId, targetId, targetType, position, parentId);\n        }\n      } else if (draggedFolderId) {\n        if (position === 'inside' && targetType === 'folder') {\n          this.moveFolderToParent(draggedFolderId, targetId);\n        } else if (targetType === 'folder') {\n          this.reorderFolder(draggedFolderId, targetId, position, parentId);\n        }\n      }\n      \n      this.clearDragState();\n    },\n    \n    reorderItem(itemId, targetId, targetType, position, targetParentId) {\n      const item = this.items.find(i => i.id === itemId);\n      if (!item) return;\n      \n      let newFolderId;\n      if (targetType === 'folder') {\n        const targetFolder = this.folders.find(f => f.id === targetId);\n        newFolderId = targetFolder ? targetFolder.parentId : null;\n      } else {\n        const targetItem = this.items.find(i => i.id === targetId);\n        newFolderId = targetItem ? targetItem.folderId : targetParentId;\n      }\n      \n      item.folderId = newFolderId;\n      \n      const siblings = this.items\n        .filter(i => i.folderId === newFolderId && i.id !== itemId)\n        .sort((a, b) => a.order - b.order);\n      \n      let targetIndex = targetType === 'item' \n        ? siblings.findIndex(i => i.id === targetId)\n        : siblings.length - 1;\n      \n      if (position === 'before') {\n        siblings.splice(Math.max(0, targetIndex), 0, item);\n      } else {\n        siblings.splice(targetIndex + 1, 0, item);\n      }\n      \n      siblings.forEach((s, idx) => { s.order = idx + 1; });\n    },\n    \n    reorderFolder(folderId, targetFolderId, position, targetParentId) {\n      const folder = this.folders.find(f => f.id === folderId);\n      const targetFolder = this.folders.find(f => f.id === targetFolderId);\n      if (!folder || !targetFolder) return;\n      \n      const descendants = this.getAllDescendantFolderIds(folderId);\n      if (descendants.includes(targetFolderId)) return;\n      \n      const newParentId = targetFolder.parentId;\n      folder.parentId = newParentId;\n      \n      const siblings = this.folders\n        .filter(f => f.parentId === newParentId && f.id !== folderId)\n        .sort((a, b) => a.order - b.order);\n      \n      const targetIndex = siblings.findIndex(f => f.id === targetFolderId);\n      \n      if (position === 'before') {\n        siblings.splice(Math.max(0, targetIndex), 0, folder);\n      } else {\n        siblings.splice(targetIndex + 1, 0, folder);\n      }\n      \n      siblings.forEach((s, idx) => { s.order = idx + 1; });\n    },\n    \n    moveItemToFolder(itemId, folderId) {\n      const item = this.items.find(i => i.id === itemId);\n      if (!item) return;\n      item.folderId = folderId;\n      item.order = this.getMaxOrder(this.items.filter(i => i.folderId === folderId)) + 1;\n    },\n    \n    moveFolderToParent(folderId, parentId) {\n      const folder = this.folders.find(f => f.id === folderId);\n      if (!folder) return;\n      \n      if (parentId !== null) {\n        const descendants = this.getAllDescendantFolderIds(folderId);\n        if (descendants.includes(parentId) || folderId === parentId) return;\n      }\n      \n      folder.parentId = parentId;\n      folder.order = this.getMaxOrder(this.folders.filter(f => f.parentId === parentId)) + 1;\n    },\n    \n    onRootDragOver(e) {\n      e.preventDefault();\n      this.dragOverRoot = true;\n      this.dragOverFolderId = null;\n    },\n    \n    onRootDragLeave() {\n      this.dragOverRoot = false;\n    },\n    \n    onRootDrop(e) {\n      e.preventDefault();\n      \n      if (this.dropIndicator) {\n        this.onReorderDrop(e, this.dropIndicator.targetId, this.dropIndicator.type, this.dropIndicator.parentId);\n        return;\n      }\n      \n      if (this.draggingItemId) {\n        this.moveItemToFolder(this.draggingItemId, null);\n      } else if (this.draggingFolderId) {\n        this.moveFolderToParent(this.draggingFolderId, null);\n      }\n      this.clearDragState();\n    },\n    \n    onFolderRootDragOver(e) {\n      e.preventDefault();\n      if (this.draggingFolderId) {\n        const folder = this.folders.find(f => f.id === this.draggingFolderId);\n        if (folder && folder.parentId !== null) {\n          this.dragOverFolderRoot = true;\n        }\n      }\n      this.dropIndicator = null;\n    },\n    \n    onFolderRootDragLeave() {\n      this.dragOverFolderRoot = false;\n    },\n    \n    onFolderRootDrop(e) {\n      e.preventDefault();\n      e.stopPropagation();\n      \n      if (this.dropIndicator) {\n        this.onReorderDrop(e, this.dropIndicator.targetId, this.dropIndicator.type, this.dropIndicator.parentId);\n        return;\n      }\n      \n      if (this.draggingFolderId) {\n        this.moveFolderToParent(this.draggingFolderId, null);\n      }\n      \n      this.clearDragState();\n    },\n    \n    showDropBefore(id, type) {\n      return this.dropIndicator && \n             this.dropIndicator.targetId === id && \n             this.dropIndicator.type === type && \n             this.dropIndicator.position === 'before';\n    },\n    \n    showDropAfter(id, type) {\n      return this.dropIndicator && \n             this.dropIndicator.targetId === id && \n             this.dropIndicator.type === type && \n             this.dropIndicator.position === 'after';\n    },\n    \n    showDropInside(id) {\n      return this.dropIndicator && \n             this.dropIndicator.targetId === id && \n             this.dropIndicator.position === 'inside';\n    },\n  };\n}\n",[],[150,300,378],"0bd515a0-e2e9-11f0-b39b-42dde27851f2","chatSettings.js","0bd5164a-e2e9-11f0-b39b-42dde27851f2",31,["D",1766815100212],"/**\n * Chat App Chat Settings - Right sidebar for chat-specific settings\n * Handles system prompt, model parameters, and per-message metadata\n * \n * Uses unified chat structure: chats[id] = { messages: [], metadata: {...} }\n */\n\nimport { createChatMetadata, createMessageMetadata, DEFAULT_MODEL_PARAMS, createChatData } from './state.js';\n\nexport function createChatSettingsMethods() {\n  return {\n    // Toggle right sidebar\n    toggleRightSidebar() {\n      this.rightSidebarOpen = !this.rightSidebarOpen;\n      // Close settings page when opening right sidebar\n      if (this.rightSidebarOpen) {\n        this.showSettings = false;\n      }\n      // Load current chat settings when opening\n      if (this.rightSidebarOpen && this.activeChatId) {\n        this.loadCurrentChatSettings();\n      }\n    },\n    \n    // Load settings for the current active chat (from unified structure)\n    loadCurrentChatSettings() {\n      if (!this.activeChatId) {\n        // Reset to defaults\n        this.currentChatSettings = {\n          systemPrompt: '',\n          temperature: DEFAULT_MODEL_PARAMS.temperature,\n          maxTokens: DEFAULT_MODEL_PARAMS.maxTokens,\n          topP: DEFAULT_MODEL_PARAMS.topP,\n          frequencyPenalty: DEFAULT_MODEL_PARAMS.frequencyPenalty,\n          presencePenalty: DEFAULT_MODEL_PARAMS.presencePenalty,\n          reasoningEffort: DEFAULT_MODEL_PARAMS.reasoningEffort,\n          webSearch: DEFAULT_MODEL_PARAMS.webSearch,\n          codeExecution: DEFAULT_MODEL_PARAMS.codeExecution,\n          imageDetail: DEFAULT_MODEL_PARAMS.imageDetail,\n          modelVersion: DEFAULT_MODEL_PARAMS.modelVersion\n        };\n        return;\n      }\n      \n      // Ensure chat exists with proper structure\n      if (!this.chats[this.activeChatId]) {\n        this.chats[this.activeChatId] = createChatData();\n      }\n      \n      // Ensure metadata exists\n      if (!this.chats[this.activeChatId].metadata) {\n        this.chats[this.activeChatId].metadata = createChatMetadata();\n      }\n      \n      const metadata = this.chats[this.activeChatId].metadata;\n      const params = metadata.parameters || {};\n      \n      this.currentChatSettings = {\n        systemPrompt: metadata.systemPrompt || '',\n        temperature: params.temperature ?? DEFAULT_MODEL_PARAMS.temperature,\n        maxTokens: params.maxTokens ?? DEFAULT_MODEL_PARAMS.maxTokens,\n        topP: params.topP ?? DEFAULT_MODEL_PARAMS.topP,\n        frequencyPenalty: params.frequencyPenalty ?? DEFAULT_MODEL_PARAMS.frequencyPenalty,\n        presencePenalty: params.presencePenalty ?? DEFAULT_MODEL_PARAMS.presencePenalty,\n        reasoningEffort: params.reasoningEffort ?? DEFAULT_MODEL_PARAMS.reasoningEffort,\n        webSearch: params.webSearch ?? DEFAULT_MODEL_PARAMS.webSearch,\n        codeExecution: params.codeExecution ?? DEFAULT_MODEL_PARAMS.codeExecution,\n        imageDetail: params.imageDetail ?? DEFAULT_MODEL_PARAMS.imageDetail,\n        modelVersion: params.modelVersion ?? DEFAULT_MODEL_PARAMS.modelVersion\n      };\n    },\n    \n    // Save current chat settings to metadata (unified structure)\n    saveChatSettings() {\n      if (!this.activeChatId) return;\n      \n      // Ensure chat exists with proper structure\n      if (!this.chats[this.activeChatId]) {\n        this.chats[this.activeChatId] = createChatData();\n      }\n      \n      // Ensure metadata exists\n      if (!this.chats[this.activeChatId].metadata) {\n        this.chats[this.activeChatId].metadata = createChatMetadata();\n      }\n      \n      const metadata = this.chats[this.activeChatId].metadata;\n      metadata.systemPrompt = this.currentChatSettings.systemPrompt;\n      metadata.parameters = {\n        temperature: this.currentChatSettings.temperature,\n        maxTokens: this.currentChatSettings.maxTokens,\n        topP: this.currentChatSettings.topP,\n        frequencyPenalty: this.currentChatSettings.frequencyPenalty,\n        presencePenalty: this.currentChatSettings.presencePenalty,\n        reasoningEffort: this.currentChatSettings.reasoningEffort,\n        webSearch: this.currentChatSettings.webSearch,\n        codeExecution: this.currentChatSettings.codeExecution,\n        imageDetail: this.currentChatSettings.imageDetail,\n        modelVersion: this.currentChatSettings.modelVersion\n      };\n      metadata.updatedAt = new Date().toISOString();\n      \n      this.saveToStorage();\n      console.log('[Chat Settings] Saved settings for chat:', this.activeChatId);\n    },\n    \n    // Update a single setting (debounced save)\n    updateChatSetting(key, value) {\n      this.currentChatSettings[key] = value;\n      \n      // Debounce the save\n      if (this._settingsSaveTimeout) {\n        clearTimeout(this._settingsSaveTimeout);\n      }\n      this._settingsSaveTimeout = setTimeout(() => {\n        this.saveChatSettings();\n      }, 500);\n    },\n    \n    // Get current chat's system prompt\n    getSystemPrompt() {\n      if (!this.activeChatId || !this.chats[this.activeChatId]) {\n        return '';\n      }\n      const metadata = this.chats[this.activeChatId].metadata;\n      return metadata ? (metadata.systemPrompt || '') : '';\n    },\n    \n    // Get current chat's model parameters\n    getChatParameters() {\n      if (!this.activeChatId || !this.currentChatSettings) {\n        return { ...DEFAULT_MODEL_PARAMS, systemPrompt: '' };\n      }\n      return {\n        systemPrompt: this.currentChatSettings.systemPrompt || '',\n        temperature: this.currentChatSettings.temperature ?? DEFAULT_MODEL_PARAMS.temperature,\n        maxTokens: this.currentChatSettings.maxTokens ?? DEFAULT_MODEL_PARAMS.maxTokens,\n        topP: this.currentChatSettings.topP ?? DEFAULT_MODEL_PARAMS.topP,\n        frequencyPenalty: this.currentChatSettings.frequencyPenalty ?? DEFAULT_MODEL_PARAMS.frequencyPenalty,\n        presencePenalty: this.currentChatSettings.presencePenalty ?? DEFAULT_MODEL_PARAMS.presencePenalty,\n        reasoningEffort: this.currentChatSettings.reasoningEffort ?? DEFAULT_MODEL_PARAMS.reasoningEffort,\n        webSearch: this.currentChatSettings.webSearch ?? DEFAULT_MODEL_PARAMS.webSearch,\n        codeExecution: this.currentChatSettings.codeExecution ?? DEFAULT_MODEL_PARAMS.codeExecution,\n        imageDetail: this.currentChatSettings.imageDetail ?? DEFAULT_MODEL_PARAMS.imageDetail,\n        modelVersion: this.currentChatSettings.modelVersion ?? DEFAULT_MODEL_PARAMS.modelVersion,\n      };\n    },\n    \n    // Get model config for the currently selected model\n    getCurrentModelConfig() {\n      if (!this.selectedModel || !this.modelConfigs.length) {\n        return null;\n      }\n      return this.modelConfigs.find(function(c) {\n        return c.id === this.selectedModel.id;\n      }.bind(this)) || null;\n    },\n    \n    // Create message metadata when sending a message\n    createMessageMeta() {\n      var modelId = this.selectedModel ? this.selectedModel.id : null;\n      var params = this.getChatParameters();\n      return createMessageMetadata(modelId, params);\n    },\n    \n    // Load model configs from API\n    async loadModelConfigs() {\n      try {\n        var response = await fetch('/api/models/configs');\n        if (response.ok) {\n          var data = await response.json();\n          this.modelConfigs = data.models || [];\n          console.log('[Model Configs] Loaded', this.modelConfigs.length, 'model configs');\n        }\n      } catch (error) {\n        console.error('[Model Configs] Failed to load:', error);\n      }\n    },\n    \n    // Reset current chat settings to defaults\n    resetChatSettings() {\n      this.currentChatSettings = {\n        systemPrompt: '',\n        temperature: DEFAULT_MODEL_PARAMS.temperature,\n        maxTokens: DEFAULT_MODEL_PARAMS.maxTokens,\n        topP: DEFAULT_MODEL_PARAMS.topP,\n        frequencyPenalty: DEFAULT_MODEL_PARAMS.frequencyPenalty,\n        presencePenalty: DEFAULT_MODEL_PARAMS.presencePenalty,\n        reasoningEffort: DEFAULT_MODEL_PARAMS.reasoningEffort,\n        webSearch: DEFAULT_MODEL_PARAMS.webSearch,\n        codeExecution: DEFAULT_MODEL_PARAMS.codeExecution,\n        imageDetail: DEFAULT_MODEL_PARAMS.imageDetail,\n        modelVersion: DEFAULT_MODEL_PARAMS.modelVersion\n      };\n      \n      // Also clear the saved model for this chat\n      if (this.activeChatId && this.chats[this.activeChatId] && this.chats[this.activeChatId].metadata) {\n        this.chats[this.activeChatId].metadata.defaultModel = null;\n      }\n      \n      this.saveChatSettings();\n    }\n  };\n}\n",[],[150,300,386],"0a3a7f8c-e2e9-11f0-9dc9-42dde27851f2",6,["D",1766815097530],[189,190,191,192,193,194,195,196,197,198,199,200,201],[150,300],["D",1766815096734],[188,202],[150],["D",1766815097047],[],[156],["D",1766815096882],[],[44],"0a85d126-e2e9-11f0-a5e5-42dde27851f2","routes","0a85d1bc-e2e9-11f0-a5e5-42dde27851f2",9,["D",1766815098015],[],[167,408],"0a6eb7f2-e2e9-11f0-b141-42dde27851f2","providers","0a6eb8a6-e2e9-11f0-b141-42dde27851f2",8,["D",1766815097871],[],[167,415],["D",1766815097206],[183,184],[167],["D",1766815045152],["D",1789530642963],{"_97":96,"_104":100},{"_97":96,"_98":-5,"_99":100,"_18":54,"_101":102,"_103":24},{"_13":86,"_31":87,"_42":41,"_88":43,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":44,"_95":96},"ctx",{"_79":-5,"_123":462,"_463":260,"_464":465,"_466":24,"_467":24,"_468":24,"_469":145,"_470":-5,"_471":-7,"_472":-7,"_473":60,"_474":24,"_475":24,"_476":-5,"_477":24,"_478":24,"_479":24,"_480":-5},"ENV",{"_433":434,"_435":436,"_437":87,"_438":439,"_440":441,"_442":443,"_444":445,"_446":447,"_448":449,"_450":451,"_452":453,"_454":455,"_456":457,"_458":459,"_460":461},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","fdb67791413f4386b4dbf18f354029a617f6160f","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v32