style(weave): chatview styling #2977
Conversation
|
Preview this PR with FeatureBee: https://beta.wandb.ai/?betaVersion=39eac3af30090813872defe974fa511193eaab1d |
|
@jwlee64 I'm seeing styling issues on the beta link: https://www.loom.com/share/16a01ecb20394ea1b2f6b4e2d5d62144?sid=a0ed33d1-a9f5-4440-87be-768f52e7ea6f |
| @@ -34,10 +34,17 @@ export type ToolCall = { | |||
| }; | |||
| }; | |||
|
|
|||
| // Used to store the response of a tool call in the message history. | |||
| export type ToolCallWithResponse = ToolCall & { | |||
| response?: Message; | |||
There was a problem hiding this comment.
If response is optional anyway, would it make sense to just add this into the ToolCall definition?
|
|
||
| import {useDeepMemo} from '../../../../../../hookUtils'; | ||
| import {ChoicesView} from './ChoicesView'; | ||
| import {HorizontalRuleWithLabel} from './HorizontalRuleWithLabel'; |
There was a problem hiding this comment.
This class was the only place using HorizontalRuleWithLabel; I'd delete it rather than leaving it unused in the codebase.
| const lastMessageRef = useRef<HTMLDivElement>(null); | ||
| const processedMessages = processToolCallMessages(messages); | ||
|
|
||
| useEffect(() => { |
There was a problem hiding this comment.
Wondering why we are doing a scrollIntoView in both ChatView and MessageList
There was a problem hiding this comment.
messagelist scrolls to the last message when theres no choice, or when we add a message in the playground chat view, chat view scrolls the last choice
| ))} | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| // Associates tool calls with their responses | ||
| const processToolCallMessages = (messages: Messages) => { |
There was a problem hiding this comment.
Add return type annotation
| message: Message; | ||
| isStructuredOutput?: boolean; | ||
| isChoice?: boolean; |
There was a problem hiding this comment.
This does not appear to be used
There was a problem hiding this comment.
i use this later for the message panel buttons
| message: Message; | ||
| isStructuredOutput?: boolean; | ||
| isChoice?: boolean; | ||
| isNested?: boolean; | ||
| pendingToolResponseId?: string; |
There was a problem hiding this comment.
This also appears to be unused
There was a problem hiding this comment.
isNested is use for margins on the toolCallResponses below
isChoice
pnedingToolResponseId
are used for the messagePanel buttons i can remove for this pr
| if (!message.tool_calls) { | ||
| processedMessages.push({ | ||
| ...message, | ||
| original_index: message.original_index ?? i, |
There was a problem hiding this comment.
Under what condition would original_index be set?
There was a problem hiding this comment.
sometime the llm returns it on tool calls but we can just manually set, we wouldnt want the wrong one anyways
| <div | ||
| className={classNames('relative overflow-visible rounded-lg', { | ||
| 'border-t border-moon-250': isTool, | ||
| 'bg-moon-50': isSystemPrompt, |
There was a problem hiding this comment.
We should use a different color, see Slack: https://weightsandbiases.slack.com/archives/C05DURZNT41/p1731705377239469?thread_ts=1731684165.155239&cid=C05DURZNT41
| }; | ||
|
|
||
| const OneToolCall = ({toolCall}: OneToolCallProps) => { | ||
| const [isCopying, setIsCopying] = useState<boolean>(false); |
There was a problem hiding this comment.
Can omit <boolean>
Description
groups tool responses with messages
changes background colors
adds robot icon
removes horizontal rules
Testing
How was this PR tested?