halbot 1995.1.42 → 1995.1.43

package/inspect_turn.mjs

@@ -0,0 +1,28 @@
+
+import { dbio, hal, storage as _storage } from './index.mjs';
+
+const run = async () => {
+    const { config } = await _storage.getConfig();
+    await dbio.init(config.storage);
+    const token = 'TOKEN|8df8db54-3ef1-4d63-b91d-da05ae6eccff-d46ae000661b3509e743d37d55a7e30be8158c008ad93cad88d7af07503e2061c53bce89f042762495d168af02f';
+    const result = await dbio.queryOne(
+        `SELECT * FROM ${hal.table} WHERE token = $1`,
+        [token]
+    );
+
+    if (result) {
+        console.log('Result found.');
+        const response = JSON.parse(result.response);
+        console.log('Response count:', response.length);
+
+        response.forEach((msg, i) => {
+            console.log(`\nMessage ${i}:`);
+            console.log(JSON.stringify(msg, null, 2));
+        });
+    } else {
+        console.log('No result found for token.');
+    }
+    process.exit(0);
+};
+
+run().catch(console.error);

package/lib/hal.mjs

@@ -168,6 +168,7 @@ const init = async (options) => {
             controllerPath: options?.web?.controllerPath || getPath('../web'),
             cfTunnel: options?.web?.cfTunnel,
         });
+        const url = options?.web?.url || web?.listen;
         if (callosum.isPrimary) {
             const { ais } = await alan.initChat({ sessions: null });
             const cmds = options?.cmds || [];
@@ -178,6 +179,10 @@ const init = async (options) => {
                 return x.model;
             }).map(x => x.supportedMimeTypes || []).flat().map(x => x.toLowerCase()));
             const _bot = await bot.init(options);
+            callosum.register(
+                'getFileLink', async id => await _bot.telegram.getFileLink(id)
+            );
+            callosum.register('getUrl', async () => url);
             const pkg = await utilitas.which();
             _ = {
                 args: { ...options?.args || {} },

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "halbot",
   "description": "Just another AI powered Telegram bot, which is simple design, easy to use, extendable and fun.",
-  "version": "1995.1.42",
+  "version": "1995.1.43",
   "private": false,
   "homepage": "https://github.com/Leask/halbot",
   "type": "module",

package/pipeline/080_history.mjs

@@ -105,9 +105,9 @@ const memorize = async (ctx) => {
     const received_text = ctx._.request || ctx._.text || '';
     const id = received.update_id;
     let response = {};
-    ctx._.done.map(m => m?.text && (response[m.message_id] = m));
+    ctx._.done.map(m => response[m.message_id] = m);
     response = Object.values(response).sort((a, b) => a.message_id - b.message_id);
-    const response_text = ctx?._.response || response.map(x => x.text).join('\n');
+    const response_text = ctx?._?.response || response.map(x => x?.text || '').filter(Boolean).join('\n');
     const collected = ctx._.collected.filter(x => String.isString(x.content));
     const distilled = compact(bot.lines([
         received_text, response_text, ...collected.map(x => x.content)

package/pipeline/100_chat.mjs

@@ -1,4 +1,4 @@
-import { alan } from '../index.mjs';
+import { callosum, alan } from '../index.mjs';
 import { token } from 'webjam';
 
 const _name = 'Chat';
@@ -92,7 +92,7 @@ const action = async (ctx, next) => {
     // 11: How are image, audio, and video formats displayed? (File tokens must be protected and require server-side forwarding.)
     await ctx.edit(lastMsg.message_id,
         lastMsg.raw
-        + `\n\n\-\-\-\n\n✨ [View in well-formatted page](https://hal.leaskh.com/turns/${ctx._.token}).`
+        + `\n\n\-\-\-\n\n✨ [View web version](${await callosum.call('getUrl')}/turns/${ctx._.token}).`
     );
     await next();
 };

package/web/turn.html

@@ -6,6 +6,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>HAL9000 Chat</title>
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+    <link rel="stylesheet"
+        href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.6.1/github-markdown-light.min.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css">
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link
@@ -52,8 +56,7 @@
             background-color: transparent;
             color: var(--text-color);
             font-family: var(--font-body);
-            height: 100%;
-            overflow: hidden;
+            min-height: 100%;
         }
 
 
@@ -133,23 +136,11 @@
 
         /* Main Content */
         main {
-            height: 100vh;
-            /* Fallback */
-            height: 100dvh;
-            /* Mobile viewport fix */
             padding-top: calc(70px + 1rem);
-            /* Header height + Gap (same as gap between bubbles) */
             padding-bottom: 80px;
-            /* Footer height + gap */
             padding-left: 20px;
             padding-right: 20px;
             box-sizing: border-box;
-            overflow-y: auto;
-            -webkit-overflow-scrolling: touch;
-            /* iOS Momentum Scrolling */
-            scroll-behavior: smooth;
-            overscroll-behavior-y: contain;
-            /* Prevent pull-to-refresh on body */
             max-width: 900px;
             margin: 0 auto;
             width: 100%;
@@ -241,39 +232,64 @@
         }
 
         /* Markdown Styles */
-        .message-bubble h1,
-        .message-bubble h2,
-        .message-bubble h3 {
-            margin-top: 0;
-            font-family: var(--font-display);
-            color: #333;
+        /* Markdown Overrides */
+        .markdown-body {
+            background-color: transparent !important;
+            font-family: inherit !important;
+            font-size: 1em !important;
+            padding: 16px !important;
         }
 
-        .message-bubble code {
-            background: rgba(0, 0, 0, 0.05);
-            /* Light gray */
-            padding: 2px 6px;
-            border-radius: 4px;
-            font-family: 'Courier New', Courier, monospace;
-            font-size: 0.9em;
-            color: #d63384;
-            /* Pinkish code color */
-        }
-
-        .message-bubble pre {
-            background: #f4f4f4;
-            /* Light background */
-            padding: 1rem;
-            border-radius: 4px;
-            overflow-x: auto;
-            border: 1px solid #ddd;
-            color: #333;
+        .markdown-body img {
+            max-width: 100%;
+            border-radius: 8px;
+            display: block;
+            margin: 10px 0;
         }
 
-        .message-bubble pre code {
-            background: transparent;
-            padding: 0;
-            color: inherit;
+        .markdown-body> :first-child {
+            margin-top: 0 !important;
+        }
+
+        .markdown-body> :last-child {
+            margin-bottom: 0 !important;
+        }
+
+
+
+        /* Code Block Fixes */
+        .markdown-body pre {
+            padding: 36px 16px 16px 16px !important;
+            background-color: #f6f8fa !important;
+            border-radius: 6px !important;
+            position: relative !important;
+        }
+
+        .markdown-body pre[data-language]::before {
+            content: attr(data-language);
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            height: 28px;
+            background: #e1e4e8;
+            color: #586069;
+            font-size: 12px;
+            font-weight: 600;
+            padding: 0 16px;
+            display: flex;
+            align-items: center;
+            border-radius: 6px 6px 0 0;
+            text-transform: uppercase;
+        }
+
+        .markdown-body pre:not([data-language]) {
+            padding: 16px !important;
+        }
+
+        .markdown-body pre code {
+            padding: 0 !important;
+            background: transparent !important;
         }
 
         /* Table Styles */
@@ -438,14 +454,16 @@
             // Determine role class based on specific role string
             // "HAL9000" -> robot
             // Anything else -> human
-            const roleClass = msg.role === 'HAL9000' ? 'robot' : 'human';
+            const roleClass = msg.role.includes('HAL9000') ? 'robot' : 'human';
             row.className = `message-row ${roleClass}`;
 
             const group = document.createElement('div');
             group.className = 'message-group';
 
             // Mapping sender name
-            const senderName = msg.role === 'HAL9000' ? '🤖 HAL9000' : `😺 ${msg.role}`;
+            const senderName = /^\p{Extended_Pictographic}/u.test(msg.role)
+                ? msg.role
+                : (msg.role.includes('HAL9000') ? `🤖 ${msg.role}` : `😺 ${msg.role}`);
 
             const bubble = document.createElement('div');
             bubble.className = 'message-bubble';
@@ -476,8 +494,42 @@
 
             // Content
             const contentDiv = document.createElement('div');
-            contentDiv.className = 'message-content';
-            contentDiv.innerHTML = marked.parse(msg.text || ''); // Use msg.text from JSON
+            contentDiv.className = 'message-content markdown-body';
+            contentDiv.innerHTML = marked.parse(msg.text || '');
+
+            // Highlight Code
+            contentDiv.querySelectorAll('pre code').forEach((block) => {
+                // Trim think block content
+                if (block.classList.contains('language-think')) {
+                    block.textContent = block.textContent.trim();
+                }
+
+                hljs.highlightElement(block);
+
+                // Detect language and set attribute
+                let lang = '';
+                block.classList.forEach(cls => {
+                    if (cls.startsWith('language-')) {
+                        lang = cls.replace('language-', '');
+                    }
+                });
+                if (lang) {
+                    block.parentElement.setAttribute('data-language', lang);
+                }
+
+                if (block.classList.contains('language-think')) {
+                    const pre = block.parentElement;
+                    pre.classList.add('think-block');
+                    pre.style.whiteSpace = 'pre-wrap';
+                    pre.style.wordBreak = 'break-word';
+                    block.style.whiteSpace = 'pre-wrap';
+                    block.style.wordBreak = 'break-word';
+                }
+            });
+
+            // Open links in new tab
+            contentDiv.querySelectorAll('a').forEach(a => a.target = '_blank');
+
             bubble.appendChild(contentDiv);
 
             group.appendChild(bubble);
@@ -495,17 +547,15 @@
 
                     // Check if it is the last message
                     if (index === chatData.messages.length - 1) {
-                        // For the last message, scroll to its top (start) with a small offset
                         const lastMsgElement = document.getElementById('chatContainer').lastElementChild;
                         if (lastMsgElement) {
-                            main.scrollTo({
-                                top: lastMsgElement.offsetTop - 25,
+                            window.scrollTo({
+                                top: lastMsgElement.getBoundingClientRect().top + window.scrollY - 100,
                                 behavior: 'smooth'
                             });
                         }
                     } else {
-                        // For other messages, keep scrolling to bottom
-                        main.scrollTop = main.scrollHeight;
+                        window.scrollTo(0, document.body.scrollHeight);
                     }
                 }, delay);
                 delay += 800; // Keep delay effect

package/web/turn.mjs

@@ -1,30 +1,104 @@
-import { dbio, hal, utilitas } from '../index.mjs';
+import { callosum, dbio, hal, utilitas } from '../index.mjs';
 import { readFile } from 'fs/promises';
 
 const getPath = (subPath) => utilitas.__(import.meta.url, subPath);
 const getHtml = async () => await readFile(getPath('turn.html'), 'utf-8');
 const renderHtml = async (data) => await getHtml().then((html) => html.replace("'{{data}}'", data));
 
+const file = async (ctx) => {
+    try {
+        const url = await callosum.call('getFileLink', { args: [ctx.params.id] });
+        const resp = await fetch(url);
+        if (!resp.ok) { throw new Error(`Fetch failed: ${resp.status}`); }
+        ctx.set('Content-Type', resp.headers.get('Content-Type'));
+        ctx.body = Buffer.from(await resp.arrayBuffer());
+    } catch (err) {
+        console.error('Error serving file:', ctx.params.id, err);
+        ctx.status = 404;
+        ctx.body = 'Not Found';
+    }
+};
+
 const process = async (ctx, next) => {
     const result = await dbio.queryOne(
         `SELECT * FROM ${hal.table} WHERE token = $1`,
         [ctx.params.token]
     );
+    if (!result) { return await next(); }
     const prompt_count = await dbio.countAll(hal.table);
     result.received = JSON.parse(result.received);
     result.response = JSON.parse(result.response);
-    // print(result);
+
+    const msg = result.received.message;
+    let userText = result.received_text || '';
+
+    const p = msg.photo?.[msg.photo?.length - 1];
+    if (p) { userText = `![Image](/file/${p.file_id})\n\n${userText}`; }
+
+    const a = msg.audio || msg.voice;
+    if (a) { userText = `<audio controls src="/file/${a.file_id}" style="width: 100%; display: block; margin-bottom: 8px;"></audio>\n\n${userText}`; }
+
+    const v = msg.video || msg.video_note;
+    if (v) { userText = `<video controls src="/file/${v.file_id}" style="width: 100%; display: block; border-radius: 8px; margin-bottom: 8px;"></video>\n\n${userText}`; }
+
     const messages = [{
-        role: `${result.received.message.from.username} (${result.received.message.from.first_name} ${result.received.message.from.last_name})`,
-        text: result.received_text,
-        time: new Date(result.received.message.date * 1000),
+        role: `${msg.from.username} (${msg.from.first_name} ${msg.from.last_name})`,
+        text: userText.trim(),
+        time: new Date(msg.date * 1000),
     }];
-    result.response.forEach(r => {
+
+    const first = result.response?.[0];
+    let modelLine = first?.text?.split('\n')?.[0] || '';
+    modelLine = modelLine.includes('/') ? modelLine.replace(/:.*$/g, '') : '';
+    let role = 'HAL9000';
+    if (/^\p{Extended_Pictographic}/u.test(modelLine)) {
+        role = `${modelLine.split(' ')[0]} ${role}`;
+        modelLine = modelLine.split(' ').slice(1).join(' ');
+    }
+    role = `${role} (${modelLine})`;
+
+    const last = result.response?.[result.response?.length - 1];
+    const defaultTime = new Date((last?.edit_date || last?.date || result.received.message.date) * 1000);
+
+    if (result.response_text) {
         messages.push({
-            role: 'HAL9000',
-            text: r.raw,
-            time: new Date((r.edit_date || r.date) * 1000),
+            role,
+            text: result.response_text,
+            time: defaultTime,
         });
+    }
+
+    result.response.map(x => {
+        const p = x.photo?.[x.photo?.length - 1];
+        if (p) {
+            let text = `![Image](/file/${p.file_id})`;
+            if (x.caption) { text += `\n\n${x.caption}`; }
+            messages.push({
+                role,
+                text,
+                time: new Date((x.edit_date || x.date || result.received.message.date) * 1000),
+            });
+        }
+        const a = x.audio || x.voice;
+        if (a) {
+            let text = `<audio controls src="/file/${a.file_id}" style="width: 100%; display: block;"></audio>`;
+            if (x.caption) { text += `\n\n${x.caption}`; }
+            messages.push({
+                role,
+                text,
+                time: new Date((x.edit_date || x.date || result.received.message.date) * 1000),
+            });
+        }
+        const v = x.video || x.video_note;
+        if (v) {
+            let text = `<video controls src="/file/${v.file_id}" style="width: 100%; display: block; border-radius: 8px;"></video>`;
+            if (x.caption) { text += `\n\n${x.caption}`; }
+            messages.push({
+                role,
+                text,
+                time: new Date((x.edit_date || x.date || result.received.message.date) * 1000),
+            });
+        }
     });
     ctx.body = await renderHtml(JSON.stringify({
         bot_id: result.bot_id, chat_id: result.chat_id,
@@ -39,5 +113,10 @@ export const { actions } = {
             method: 'GET',
             process,
         },
+        {
+            path: 'file/:id',
+            method: 'GET',
+            process: file,
+        },
     ]
 };