feat(modulify-ui): library updates (#2787) (#2932)

Co-authored-by: sergesha <[email protected]>
epam · Jan 14, 2025 · 2273e07 · 2273e07
1 parent 550309a
commit 2273e07
Show file tree

Hide file tree

Showing 15 changed files with 1,229 additions and 988 deletions.
diff --git a/apps/chat/src/components/Chat/ChatHeader/Header.tsx b/apps/chat/src/components/Chat/ChatHeader/Header.tsx
diff --git a/apps/chat/src/components/Chat/ChatInput/ChatInput.tsx b/apps/chat/src/components/Chat/ChatInput/ChatInput.tsx
@@ -6,6 +6,7 @@ import { useAppSelector } from '@/src/store/hooks';
 import { ChatInputFooter } from './ChatInputFooter';
 import { ChatInputMessage } from './ChatInputMessage';
 
+import { Inversify } from '@epam/ai-dial-modulify-ui';
 import { Message } from '@epam/ai-dial-shared';
 
 interface Props {
@@ -22,56 +23,60 @@ interface Props {
   onRegenerate: () => void;
 }
 
-export const ChatInput = ({
-  isLastMessageError,
-  textareaRef,
-  showScrollDownButton,
-  isShowInput,
-  showReplayControls,
-  children,
-  onSend,
-  onRegenerate,
-  onScrollDownClick,
-  onStopConversation,
-  onResize,
-}: Props) => {
-  const messageIsStreaming = useAppSelector(
-    ConversationsSelectors.selectIsConversationsStreaming,
-  );
+export const ChatInput = Inversify.register(
+  'ChatInput',
+  ({
+    isLastMessageError,
+    textareaRef,
+    showScrollDownButton,
+    isShowInput,
+    showReplayControls,
+    children,
+    onSend,
+    onRegenerate,
+    onScrollDownClick,
+    onStopConversation,
+    onResize,
+  }: Props) => {
+    const messageIsStreaming = useAppSelector(
+      ConversationsSelectors.selectIsConversationsStreaming,
+    );
 
-  const inputRef = useRef<HTMLDivElement | null>(null);
+    const inputRef = useRef<HTMLDivElement | null>(null);
 
-  useEffect(() => {
-    if (!inputRef) {
-      return;
-    }
+    useEffect(() => {
+      if (!inputRef) {
+        return;
+      }
 
-    const resizeObserver = new ResizeObserver(() => {
-      inputRef.current?.clientHeight && onResize(inputRef.current.clientHeight);
-    });
-    inputRef.current && resizeObserver.observe(inputRef.current);
+      const resizeObserver = new ResizeObserver(() => {
+        inputRef.current?.clientHeight &&
+          onResize(inputRef.current.clientHeight);
+      });
+      inputRef.current && resizeObserver.observe(inputRef.current);
 
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, [inputRef, onResize]);
+      return () => {
+        resizeObserver.disconnect();
+      };
+    }, [inputRef, onResize]);
 
-  return (
-    <div ref={inputRef} className="w-full pt-3 md:pt-5">
-      <div className="relative">{!messageIsStreaming && children}</div>
-      {isShowInput && (
-        <ChatInputMessage
-          isLastMessageError={isLastMessageError}
-          onRegenerate={onRegenerate}
-          textareaRef={textareaRef}
-          showScrollDownButton={showScrollDownButton}
-          onScrollDownClick={onScrollDownClick}
-          onSend={onSend}
-          onStopConversation={onStopConversation}
-          showReplayControls={showReplayControls}
-        />
-      )}
-      <ChatInputFooter />
-    </div>
-  );
-};
+    return (
+      <div ref={inputRef} className="w-full pt-3 md:pt-5">
+        <div className="relative">{!messageIsStreaming && children}</div>
+        {isShowInput && (
+          <ChatInputMessage
+            isLastMessageError={isLastMessageError}
+            onRegenerate={onRegenerate}
+            textareaRef={textareaRef}
+            showScrollDownButton={showScrollDownButton}
+            onScrollDownClick={onScrollDownClick}
+            onSend={onSend}
+            onStopConversation={onStopConversation}
+            showReplayControls={showReplayControls}
+          />
+        )}
+        <ChatInputFooter />
+      </div>
+    );
+  },
+);