check if number for chat splitter

This commit is contained in:
Nate Kelley 2025-01-24 13:05:09 -07:00
parent ff81539cb9
commit 2fe395b5ea
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
3 changed files with 26 additions and 5 deletions

View File

@ -1,7 +1,10 @@
import React from 'react'; import React from 'react';
import type { ChatSplitterProps } from './ChatSplitter';
interface ChatContainerProps { interface ChatContainerProps {
chatHeaderText: string; chatHeaderText: string;
chatHeaderOptions: ChatSplitterProps['chatHeaderOptions'];
chatContent: ChatSplitterProps['chatContent'];
} }
export const ChatContainer: React.FC<ChatContainerProps> = React.memo(({ chatHeaderText }) => { export const ChatContainer: React.FC<ChatContainerProps> = React.memo(({ chatHeaderText }) => {

View File

@ -1,4 +1,4 @@
import React, { useEffect, useMemo, useRef } from 'react'; import React, { useEffect, useImperativeHandle, useMemo, useRef } from 'react';
import { AppSplitter, AppSplitterRef } from '@/components/layout/AppSplitter'; import { AppSplitter, AppSplitterRef } from '@/components/layout/AppSplitter';
import { AppChatMessageFileType } from '@/components/messages/AppChatMessageContainer'; import { AppChatMessageFileType } from '@/components/messages/AppChatMessageContainer';
import { ChatContainer } from './ChatContainer'; import { ChatContainer } from './ChatContainer';
@ -18,7 +18,14 @@ export interface ChatSplitterProps {
} }
export const ChatSplitter: React.FC<ChatSplitterProps> = React.memo( export const ChatSplitter: React.FC<ChatSplitterProps> = React.memo(
({ chatHeaderText, defaultShowFile = false, defaultSelectedFile }) => { ({
chatHeaderText,
defaultShowFile = false,
defaultSelectedFile,
chatHeaderOptions,
chatContent,
fileHeader
}) => {
const appSplitterRef = useRef<AppSplitterRef>(null); const appSplitterRef = useRef<AppSplitterRef>(null);
const defaultLayout = useMemo(() => { const defaultLayout = useMemo(() => {
@ -32,7 +39,13 @@ export const ChatSplitter: React.FC<ChatSplitterProps> = React.memo(
<ChatSplitterContextProvider useChatSplitterProps={useChatSplitterProps}> <ChatSplitterContextProvider useChatSplitterProps={useChatSplitterProps}>
<AppSplitter <AppSplitter
ref={appSplitterRef} ref={appSplitterRef}
leftChildren={<ChatContainer chatHeaderText={chatHeaderText} />} leftChildren={
<ChatContainer
chatHeaderText={chatHeaderText}
chatHeaderOptions={chatHeaderOptions}
chatContent={chatContent}
/>
}
rightChildren={<FileContainer selectedFile={selectedFile} />} rightChildren={<FileContainer selectedFile={selectedFile} />}
autoSaveId="chat-splitter" autoSaveId="chat-splitter"
defaultLayout={defaultLayout} defaultLayout={defaultLayout}

View File

@ -166,8 +166,13 @@ export const AppSplitter = React.memo(
targetPercentage = targetValue; targetPercentage = targetValue;
} }
const leftPanelSize = _sizes[0]; const bothSizesAreNumber = typeof _sizes[0] === 'number' && typeof _sizes[1] === 'number';
const rightPanelSize = _sizes[1]; const leftPanelSize = bothSizesAreNumber
? `${(Number(_sizes[0]) / (Number(_sizes[0]) + Number(_sizes[1]))) * 100}%`
: _sizes[0];
const rightPanelSize = bothSizesAreNumber
? `${(Number(_sizes[1]) / (Number(_sizes[0]) + Number(_sizes[1]))) * 100}%`
: _sizes[1];
const currentSize = side === 'left' ? leftPanelSize : rightPanelSize; const currentSize = side === 'left' ? leftPanelSize : rightPanelSize;
const otherSize = side === 'left' ? rightPanelSize : leftPanelSize; const otherSize = side === 'left' ? rightPanelSize : leftPanelSize;