omnibot3000 1.8.6 → 1.8.7

package/api/server.ts

@@ -27,35 +27,35 @@ type Package = {
   size: number;
 };
 
-type Provider = "openai" | "mistral";
-
-const MODEL: Provider = "openai";
-const MAX_TOKENS = 1000;
-
 const DOMAIN = process.env.DOMAIN || "localhost";
 const API_PATH = process.env.API_PATH || "/api";
 const API_PORT = process.env.API_PORT || 3001;
 const BASE_PATH = process.cwd();
 const JSON_PATH = path.join(BASE_PATH, "dist", "packages.json");
 
+type Provider = "openai" | "mistral";
+
+export const MODEL: Provider = "openai";
+const MAX_TOKENS = 1000;
+
 type OpenAIConfig = Omit<ChatCompletionCreateParamsNonStreaming, "messages">;
 type MistralConfig = Omit<ChatCompletionRequest, "messages">;
 
-const API_CONFIG = {
+export const API_CONFIG = {
   openai: {
     model: "gpt-4.1-mini",
     //model: "gpt-5-mini",
     temperature: 2.0 /* more creative */,
-    top_p: 0.3 /* use nucleus sampling */,
-    frequency_penalty: 1.5 /* avoid repetition */,
+    top_p: 0.1 /* use nucleus sampling */,
+    frequency_penalty: 2.0 /* avoid repetition */,
     presence_penalty: 2.0 /* encourage new topics */,
     max_completion_tokens: MAX_TOKENS,
   } satisfies OpenAIConfig,
   mistral: {
-    //model: "ministral-14b-latest",
+    //model: "labs-mistral-small-creative",
     model: "mistral-small-latest",
     temperature: 1 /* creativity */,
-    topP: 0.3 /* nucleus sampling */,
+    topP: 0.1 /* nucleus sampling */,
     frequencyPenalty: 1.0 /* avoid repetition */,
     presencePenalty: 1.0 /* encourage new topics */,
     maxTokens: MAX_TOKENS,
@@ -102,7 +102,6 @@ const server = createServer((req: IncomingMessage, res: ServerResponse) => {
     req.on("end", async () => {
       try {
         const {messages, stream} = JSON.parse(body);
-
         switch (MODEL as Provider) {
           case "openai":
             /* https://openai.com/api/pricing/ */
@@ -113,7 +112,7 @@ const server = createServer((req: IncomingMessage, res: ServerResponse) => {
                 project: process.env.OPENAI_PROJECT_ID,
               });
               const response = await openai.chat.completions.create({
-                ...API_CONFIG.openai,
+                ...API_CONFIG[MODEL],
                 messages,
                 stream,
               });
@@ -151,7 +150,7 @@ const server = createServer((req: IncomingMessage, res: ServerResponse) => {
                   Connection: "keep-alive",
                 });
                 const response = await mistral.chat.stream({
-                  ...API_CONFIG.mistral,
+                  ...API_CONFIG[MODEL],
                   messages,
                 });
                 /* forward chunks to browser as SSE */
@@ -163,7 +162,7 @@ const server = createServer((req: IncomingMessage, res: ServerResponse) => {
                 res.end();
               } else {
                 const response = await mistral.chat.complete({
-                  ...API_CONFIG.mistral,
+                  ...API_CONFIG[MODEL],
                   messages,
                 });
                 res.writeHead(200, {"Content-Type": "application/json"});
@@ -196,6 +195,13 @@ const server = createServer((req: IncomingMessage, res: ServerResponse) => {
         }
       }
     });
+  } else if (url.startsWith(`${API_PATH}/config`)) {
+    const config = {
+      provider: MODEL,
+      config: API_CONFIG[MODEL],
+    };
+    res.writeHead(200, {"Content-Type": "application/json"});
+    res.end(JSON.stringify(config));
   } else if (url.startsWith(`${API_PATH}/packages`)) {
     exec("npm list --json --depth=0 --silent", (err, stdout) => {
       if (err) {
@@ -226,8 +232,7 @@ const server = createServer((req: IncomingMessage, res: ServerResponse) => {
   }
 });
 
-/* Increase max listeners to handle concurrent streaming requests */
-server.setMaxListeners(0);
+server.setMaxListeners(0); /* remove listener limit */
 server.maxConnections = 100;
 
 server.listen(API_PORT, () => {

package/package.json

@@ -3,7 +3,7 @@
   "x-display-name": "OMNIBOT 3000",
   "description": "your omniscient source of truth",
   "private": false,
-  "version": "1.8.6",
+  "version": "1.8.7",
   "type": "module",
   "author": {
     "name": "rez",
@@ -61,7 +61,7 @@
     "npm-run-all": "^4.1.5",
     "prettier": "^3.7.4",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.50.0",
+    "typescript-eslint": "^8.50.1",
     "vite": "^7.3.0",
     "vite-tsconfig-paths": "^6.0.3"
   }

package/src/App.tsx

@@ -98,8 +98,8 @@ const Layout = () => {
     el.id = "debug-screen-size";
     el.className = "debug-info";
     document.body.appendChild(el);
-    el.innerHTML = `viewport: ${vw}x${vh} | \
-char: ${format(cw)}x${format(lh)} | \
+    el.innerHTML = `viewport: ${vw}*${vh} | \
+char: ${format(cw)}*${format(lh)} | \
 w: ${w} | h: ${h}`;
     el.style.display = debug ? "block" : "none";
   }, [w, h]);

package/src/commons/api/api.ts

@@ -6,35 +6,44 @@ import persona from "@commons/persona.txt?raw";
 import {formatText} from "@utils/strings";
 import {getVariableFromCSS} from "@utils/styles";
 
-export const getSystemConfig = (): ChatCompletionMessageParam => {
-  const size = getVariableFromCSS("base-size");
-  const height = getVariableFromCSS("base-height");
-  const systemConfig = [
-    ...formatting,
-    `your name is ${NAME} and your version is ${VERSION.join(".")}`,
-    ...persona.split("\n").map((line) => line.trim()),
-    `current date: ${new Date().toLocaleDateString()}`,
-    `current time: ${new Date().toLocaleTimeString()}`,
-    `current unix EPOCH time: ${Math.floor(Date.now() / 1000)}`,
-    `a list of random number: ${Array.from({length: 32}, () =>
-      Math.round(Math.random() * 100),
-    ).join(", ")}`,
-    `current user agent: ${navigator.userAgent}`,
-    `current color hue: ${getVariableFromCSS("h")}°`,
-    `current color saturation: ${getVariableFromCSS("s")}%`,
-    `current color lightness: ${getVariableFromCSS("l")}%`,
-    `current font base size: ${getVariableFromCSS("BASE-SIZE")}`,
-    'user can change the color with the "/color [h|s|l] number" command',
-    'user can change the font size with the "/size number" command',
-    `the "/size" command without parameter will reset the value to ${size}`,
-    'user can change the line height with the "/height number" command',
-    `the "/height" command without parameter will reset the value to ${height}`,
-    'user can reset the settings with the "/reset" command',
-    'user can reload the page with "/reboot" (do no reset, just reload)',
-  ];
-  return {role: "system", content: systemConfig.join(". ")};
+export const getApiConfig = async (): Promise<Record<string, string>> => {
+  const response = await fetch("/api/config");
+  return response.ok ? await response.json() : {};
 };
 
+export const getSystemConfig =
+  async (): Promise<ChatCompletionMessageParam> => {
+    const size = getVariableFromCSS("base-size");
+    const height = getVariableFromCSS("base-height");
+    const apiConfig = await getApiConfig();
+    const systemConfig = [
+      ...formatting,
+      `your name is ${NAME} and your version is ${VERSION.join(".")}`,
+      ...persona.split("\n").map((line) => line.trim()),
+      `current date: ${new Date().toLocaleDateString()}`,
+      `current time: ${new Date().toLocaleTimeString()}`,
+      `current unix EPOCH time: ${Math.floor(Date.now() / 1000)}`,
+      `a list of random number: ${Array.from({length: 32}, () =>
+        Math.round(Math.random() * 100),
+      ).join(", ")}`,
+      `current API provider: ${apiConfig.provider || "unknown"}`,
+      `current API config: ${JSON.stringify(apiConfig.config || {})}`,
+      `current user agent: ${navigator.userAgent}`,
+      `current color hue: ${getVariableFromCSS("h")}°`,
+      `current color saturation: ${getVariableFromCSS("s")}%`,
+      `current color lightness: ${getVariableFromCSS("l")}%`,
+      `current font base size: ${getVariableFromCSS("BASE-SIZE")}`,
+      'user can change the color with the "/color [h|s|l] number" command',
+      'user can change the font size with the "/size number" command',
+      `the "/size" command without parameter will reset the value to ${size}`,
+      'user can change the line height with the "/height number" command',
+      `the "/height" command without parameter will reset the value to ${height}`,
+      'user can reset the settings with the "/reset" command',
+      'user can reload the page with "/reboot" (do no reset, just reload)',
+    ];
+    return {role: "system", content: systemConfig.join(". ")};
+  };
+
 export const formatting = [
   "do not mention, repeat or paraphrase user prompt, just answer it",
   "generate text or markdown only, no HTML please! never HTML",

package/src/commons/api/utils/getData.ts

@@ -9,7 +9,7 @@ export const getData = async (
   context?: ChatCompletionMessageParam[],
 ): Promise<ChatCompletion> => {
   const messages: ChatCompletionMessageParam[] = [
-    getSystemConfig(),
+    await getSystemConfig(),
     {
       role: "system",
       content: system?.map((str) => str.trim()).join(". ") || "",

package/src/commons/api/utils/getStream.ts

@@ -42,7 +42,7 @@ const getStream = async (
 ) => {
   try {
     const messages: ChatCompletionMessageParam[] = [
-      getSystemConfig(),
+      await getSystemConfig(),
       {
         role: "system",
         content: system?.map((str) => str.trim()).join(". ") || "",

package/src/commons/layout/Footer.module.css

@@ -3,6 +3,7 @@
   flex-direction: row;
   flex-grow: 0;
   flex-shrink: 0;
+  flex-wrap: wrap;
   column-gap: var(--font-width);
   align-items: start;
   align-self: stretch;

package/src/commons/layout/Header.module.css

@@ -4,7 +4,7 @@
   flex-grow: 0;
   flex-shrink: 0;
   column-gap: var(--font-width);
-  align-items: center;
+  align-items: flex-start;
   align-self: stretch;
   padding-left: var(--font-width);
 }
@@ -12,6 +12,7 @@
 .container {
   display: flex;
   flex-direction: row;
+  flex-wrap: wrap;
   column-gap: var(--font-width);
   height: fit-content;
 }
@@ -20,11 +21,11 @@
   display: inline-block;
   text-wrap: wrap;
   text-overflow: ellipsis;
-  width: fit-content;
   opacity: var(--opacity-primary);
 }
 
 .subtitle {
+  flex-shrink: 1;
   min-height: var(--line-height);
   opacity: var(--opacity-secondary);
 }
@@ -44,6 +45,7 @@
 .avatar {
   display: flex;
   flex: row;
+  flex-wrap: nowrap;
   column-gap: var(--font-width);
   align-items: flex-start;
   opacity: 0;

package/src/commons/layout/Header.tsx

@@ -78,17 +78,17 @@ const Header = (_props: {darkMode: boolean; onThemeToggle: () => void}) => {
             <div className={subtitle && styles.subtext}>{subtitle}</div>
           </div>
         </div>
-        {subtitle && (
-          <>
-            <div className={styles.avatar}>
-              {AVATAR_1}
-              <br />
-              {AVATAR_2}
-            </div>
-            <Button name="?" handler={helpHandler} className={styles.help} />
-          </>
-        )}
       </div>
+      {subtitle && (
+        <div className={styles.avatar}>
+          <div>
+            {AVATAR_1}
+            <br />
+            {AVATAR_2}
+          </div>
+          <Button name="?" handler={helpHandler} className={styles.help} />
+        </div>
+      )}
       <Spacer />
       <div className={styles.button}>
         <Button name={BUTTON_CREATE} handler={newChatHandler} />

package/src/commons/styles/debug.css

@@ -61,11 +61,12 @@
 
 .debug-info {
   position: absolute;
-  top: 0.1rem;
+  top: 0.15rem;
   left: 0.3rem;
   line-height: 1rem;
   font-size: 1rem;
   font-weight: 900;
   color: #f53;
+  text-transform: uppercase;
   z-index: var(--z-index-debug);
 }

package/src/commons/styles/main.css

@@ -1,7 +1,7 @@
 :root {
   /* constants */
   --base-size: 15; /* default font size */
-  --base-height: 1.8; /* default line height */
+  --base-height: 2; /* default line height */
   /* global variables */
   --font-width: 1rem;
   --font-height: 2rem;
@@ -24,9 +24,9 @@
   /* game of life variables */
   --lifespan: 750; /* lifespan of lifeforms in ms */
   /* colors */
-  --h: 30; /* amber:30 | yellow: 90 | green:120 | blue:180 */
-  --s: 35; /* saturation */
-  --l: 65; /* lightness */
+  --h: 150; /* amber:30 | yellow: 90 | green:120 | blue:180 */
+  --s: 25; /* saturation */
+  --l: 60; /* lightness */
   --color-primary: hsla(var(--h) var(--s) var(--l) / 0.7);
   --color-secondary: hsla(var(--h) var(--s) var(--l) / 0.5);
   --color-tertiary: hsla(var(--h) var(--s) var(--l) / 0.3);

package/src/features/chat/Chat.tsx

@@ -30,6 +30,7 @@ const Chat = () => {
   const [completion, setCompletion] = useState<Completion>();
   const [loading, setLoading] = useState<boolean>(false);
   const [query, setQuery] = useState<string>("");
+  const [updateTitle, setUpdateTitle] = useState<boolean>(false);
 
   const navigate = useNavigate();
 
@@ -69,17 +70,14 @@ const Chat = () => {
         "you must separate each part with a line or empty line",
       ],
       prompt,
-      chatStore.getMessages(id),
+      [
+        ...chatStore.getMessages(id),
+        {role: "assistant", content: completion?.message || "nothing"},
+      ],
       completionCallback,
     );
   };
 
-  const setTitle = async (id: ChatId) => {
-    const title = await getChatTitle(chatStore.getMessages(id));
-    chatStore.updateChatTitle(id, title);
-    storage.save();
-  };
-
   /* handle chat id url parameter */
   useEffect(() => {
     if (!chatStore.getChat(id)) {
@@ -117,18 +115,29 @@ const Chat = () => {
     if (!chatId) {
       chatStore.setCompletions();
       chatStore.createChat(completion);
-      setTitle(chatStore.getChatId());
     }
     chatStore.addCompletion(completion);
     if (chatId) {
       chatStore.updateCompletions(chatId);
-      setTitle(chatId);
     }
     /* reset values once the completion is saved in the store */
     setCompletion(undefined);
     setResponse("");
+    setUpdateTitle(true);
   }, [completion]);
 
+  const setTitle = async (id: ChatId) => {
+    const title = await getChatTitle(chatStore.getMessages(id));
+    chatStore.updateChatTitle(id, title);
+    storage.save();
+  };
+
+  useEffect(() => {
+    if (!updateTitle) return;
+    setTitle(chatStore.getChatId());
+    setUpdateTitle(false);
+  }, [updateTitle]);
+
   return (
     <section className={styles.root}>
       <Container>
@@ -139,7 +148,7 @@ const Chat = () => {
             <Toolbar completion={completion} />
           </Fragment>
         ))}
-        {loading && response && (
+        {loading && (
           <Fragment key="chat-completion">
             <Message role="user" content={query} />
             <Message role="assistant" content={response} hasCaret={loading} />