@nethru/kit 1.1.5 → 1.1.7

package/dist/components/chat/AiChat.js

@@ -1,20 +1,22 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Stack } from "@mui/material";
 import { useChatContext } from './contexts/ChatContext';
 import ChatMessages from './ChatMessages';
 import ChatInput from './ChatInput';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function AiChat({
+  mainPageRef,
   sx
 }) {
   const {
     messages,
-    inputValue,
-    setInputValue,
     isLoading,
     chatContainerRef,
-    sendMessage
+    mainPageRef: _mainPageRef
   } = useChatContext();
+  useEffect(() => {
+    _mainPageRef.current = mainPageRef.current;
+  }, [mainPageRef.current]);
   return /*#__PURE__*/_jsxs(Stack, {
     sx: {
       ...styles.container,
@@ -24,12 +26,7 @@ function AiChat({
       messages: messages,
       isLoading: isLoading,
       chatContainerRef: chatContainerRef
-    }), /*#__PURE__*/_jsx(ChatInput, {
-      inputValue: inputValue,
-      setInputValue: setInputValue,
-      onSend: sendMessage,
-      isLoading: isLoading
-    })]
+    }), /*#__PURE__*/_jsx(ChatInput, {})]
   });
 }
 export default AiChat;

package/dist/components/chat/ChatInput.js

@@ -1,25 +1,33 @@
-import React from 'react';
+import React, { useRef, useEffect, useState } from 'react';
 import { Box, FormControl, IconButton, Stack, TextField } from '@mui/material';
 import { Send as SendIcon } from '@mui/icons-material';
+import { useChatContext } from "./contexts/ChatContext";
 import ModelSelect from "./ModelSelect";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const ChatInput = ({
-  inputValue,
-  setInputValue,
-  onSend,
-  isLoading
-}) => {
+const ChatInput = () => {
+  const inputRef = useRef(null);
+  const [selectOpen, setSelectOpen] = useState(false);
+  const {
+    inputValue,
+    setInputValue,
+    isLoading,
+    sendMessage
+  } = useChatContext();
   const handleKeyPress = e => {
     if (e.key === 'Enter' && !e.shiftKey) {
       e.preventDefault();
-      onSend();
+      sendMessage();
     }
   };
+  useEffect(() => {
+    if (!isLoading && !selectOpen && inputRef.current) inputRef.current.focus();
+  }, [isLoading, selectOpen]);
   return /*#__PURE__*/_jsx(Box, {
     sx: styles.container,
     children: /*#__PURE__*/_jsxs(Stack, {
       sx: styles.textArea,
       children: [/*#__PURE__*/_jsx(TextField, {
+        inputRef: inputRef,
         fullWidth: true,
         multiline: true,
         placeholder: "\uBA54\uC2DC\uC9C0\uB97C \uC785\uB825\uD558\uC138\uC694...",
@@ -41,9 +49,13 @@ const ChatInput = ({
         alignItems: "center",
         children: [/*#__PURE__*/_jsx(FormControl, {
           variant: "standard",
-          children: /*#__PURE__*/_jsx(ModelSelect, {})
+          children: /*#__PURE__*/_jsx(ModelSelect, {
+            open: selectOpen,
+            onOpen: () => setSelectOpen(true),
+            onClose: () => setSelectOpen(false)
+          })
         }), /*#__PURE__*/_jsx(IconButton, {
-          onClick: onSend,
+          onClick: sendMessage,
           disabled: isLoading || !inputValue.trim(),
           sx: styles.iconButton,
           children: /*#__PURE__*/_jsx(SendIcon, {

package/dist/components/chat/ChatMessages.js

@@ -10,7 +10,7 @@ const ChatMessages = ({
   useEffect(() => {
     if (messages.length === 0) return;
     const message = messages[messages.length - 1];
-    if (message.role === 'assistant') console.log(message);
+    //if(message.role === 'assistant') console.log(message);
   }, [messages.length]);
   return /*#__PURE__*/_jsxs("div", {
     style: styles.container,

package/dist/components/chat/ModelSelect.js

@@ -2,7 +2,9 @@ import React from "react";
 import { Box, Divider, MenuItem, Select } from "@mui/material";
 import { useChatContext } from "./contexts/ChatContext";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-export default function ModelSelect() {
+export default function ModelSelect({
+  ...props
+}) {
   const {
     model,
     setModel,
@@ -25,6 +27,7 @@ export default function ModelSelect() {
       disableUnderline: true,
       sx: styles.select,
       renderValue: value => findModel(providers, value)?.name,
+      ...props,
       children: makeOptions(providers)
     })
   });

package/dist/components/chat/contexts/ChatContext.js

@@ -15,6 +15,7 @@ export function ChatProvider({
   const [model, setModel] = useState('gpt-4.1-mini');
   const [tools, setTools] = useState([]);
   const chatContainerRef = useRef(null);
+  const mainPageRef = useRef(null);
   useEffect(() => {
     loadModels();
     // loadTools();
@@ -80,8 +81,9 @@ export function ChatProvider({
           model: model
         })
       });
-      const data = await response.json();
+      let data = await response.json();
       setConversationId(data.conversationId);
+      if (isPageAnalysisIntent(data)) data = await sendPageAnalysisRequest(data);
       setMessages(prev => [...prev, {
         role: data.role,
         kinds: data.kinds,
@@ -100,6 +102,40 @@ export function ChatProvider({
       setIsLoading(false);
     }
   };
+  const isPageAnalysisIntent = data => {
+    return data.content.filter(c => c.type === 'tool').some(c => c.name === 'detect-page-analysis-intent' && c.result === 'true');
+  };
+  const sendPageAnalysisRequest = async data => {
+    if (!mainPageRef.current) return data;
+    const {
+      apiUrl
+    } = getConfig();
+    const html = mainPageRef.current?.innerHTML;
+    try {
+      const response = await fetch(`${apiUrl}/api/pages/analyze`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+          htmlContent: html,
+          pageUrl: window.location.href,
+          provider: provider,
+          model: model
+        })
+      });
+      const json = await response.json();
+      if (json.summary) {
+        data.content = [{
+          type: 'text',
+          value: json.summary
+        }];
+      }
+    } catch (error) {
+      console.error('Error:', error);
+    }
+    return data;
+  };
   const clearChat = () => {
     setMessages([]);
     setConversationId(null);
@@ -117,6 +153,7 @@ export function ChatProvider({
     setModel,
     tools,
     chatContainerRef,
+    mainPageRef,
     sendMessage,
     clearChat,
     conversationId

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nethru/kit",
-  "version": "1.1.5",
+  "version": "1.1.7",
   "description": "A React component library by Nethru",
   "main": "dist/index.js",
   "homepage": ".",