fix(chat): unify OpenCode notice styling
This commit is contained in:
@@ -705,30 +705,25 @@ const ChatMessage: React.FC<ChatMessageProps> = ({
|
|||||||
}
|
}
|
||||||
if (errorName === 'SessionRetry') {
|
if (errorName === 'SessionRetry') {
|
||||||
return {
|
return {
|
||||||
text: `Opencode failed to send a message. Retry attempt info: \n\`${detail}\``,
|
text: `Opencode failed to send a message. Retry attempt info: ${detail}`,
|
||||||
variant: 'info' as const,
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
if (isLikelyProviderAuthFailure(detail)) {
|
if (isLikelyProviderAuthFailure(detail)) {
|
||||||
return {
|
return {
|
||||||
text: PROVIDER_AUTH_FAILURE_MESSAGE,
|
text: PROVIDER_AUTH_FAILURE_MESSAGE,
|
||||||
variant: 'error' as const,
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
if (detail.trim().toLowerCase() === 'aborted') {
|
if (detail.trim().toLowerCase() === 'aborted') {
|
||||||
return {
|
return {
|
||||||
text: 'The running turn was stopped before OpenCode could send the next message.',
|
text: 'The running turn was stopped before OpenCode could send the next message.',
|
||||||
variant: 'info' as const,
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
text: `Opencode failed to send message with error:\n\`${detail}\``,
|
text: `Opencode failed to send message with error: ${detail}`,
|
||||||
variant: 'error' as const,
|
|
||||||
};
|
};
|
||||||
}, [isUser, message.info]);
|
}, [isUser, message.info]);
|
||||||
|
|
||||||
const assistantErrorText = assistantError?.text;
|
const assistantErrorText = assistantError?.text;
|
||||||
const assistantErrorVariant = assistantError?.variant;
|
|
||||||
|
|
||||||
const messageTextContent = React.useMemo(() => {
|
const messageTextContent = React.useMemo(() => {
|
||||||
if (isUser) {
|
if (isUser) {
|
||||||
@@ -1089,7 +1084,6 @@ const ChatMessage: React.FC<ChatMessageProps> = ({
|
|||||||
contextPinPending={pinPending}
|
contextPinPending={pinPending}
|
||||||
onToggleContextPin={canPinIntoContext && messageCreatedAt ? handleToggleContextPin : undefined}
|
onToggleContextPin={canPinIntoContext && messageCreatedAt ? handleToggleContextPin : undefined}
|
||||||
errorMessage={assistantErrorText}
|
errorMessage={assistantErrorText}
|
||||||
errorVariant={assistantErrorVariant}
|
|
||||||
userActionsMode={useExternalUserActionsRow ? 'external-content' : 'inline'}
|
userActionsMode={useExternalUserActionsRow ? 'external-content' : 'inline'}
|
||||||
stickyUserHeaderEnabled={stickyUserHeader}
|
stickyUserHeaderEnabled={stickyUserHeader}
|
||||||
/>
|
/>
|
||||||
@@ -1126,7 +1120,6 @@ const ChatMessage: React.FC<ChatMessageProps> = ({
|
|||||||
contextPinPending={pinPending}
|
contextPinPending={pinPending}
|
||||||
onToggleContextPin={canPinIntoContext && messageCreatedAt ? handleToggleContextPin : undefined}
|
onToggleContextPin={canPinIntoContext && messageCreatedAt ? handleToggleContextPin : undefined}
|
||||||
errorMessage={assistantErrorText}
|
errorMessage={assistantErrorText}
|
||||||
errorVariant={assistantErrorVariant}
|
|
||||||
userActionsMode="external-actions"
|
userActionsMode="external-actions"
|
||||||
stickyUserHeaderEnabled={stickyUserHeader}
|
stickyUserHeaderEnabled={stickyUserHeader}
|
||||||
/>
|
/>
|
||||||
@@ -1169,7 +1162,6 @@ const ChatMessage: React.FC<ChatMessageProps> = ({
|
|||||||
agentMention={agentMention}
|
agentMention={agentMention}
|
||||||
turnGroupingContext={turnGroupingContext}
|
turnGroupingContext={turnGroupingContext}
|
||||||
errorMessage={assistantErrorText}
|
errorMessage={assistantErrorText}
|
||||||
errorVariant={assistantErrorVariant}
|
|
||||||
reviewTransferDirection={reviewTransferDirection}
|
reviewTransferDirection={reviewTransferDirection}
|
||||||
footerProviderID={headerProviderID}
|
footerProviderID={headerProviderID}
|
||||||
footerModelName={headerModelName}
|
footerModelName={headerModelName}
|
||||||
|
|||||||
@@ -432,7 +432,6 @@ interface MessageBodyProps {
|
|||||||
onRevert?: () => void;
|
onRevert?: () => void;
|
||||||
onFork?: () => void;
|
onFork?: () => void;
|
||||||
errorMessage?: string;
|
errorMessage?: string;
|
||||||
errorVariant?: 'error' | 'info';
|
|
||||||
userActionsMode?: 'inline' | 'external-content' | 'external-actions';
|
userActionsMode?: 'inline' | 'external-content' | 'external-actions';
|
||||||
stickyUserHeaderEnabled?: boolean;
|
stickyUserHeaderEnabled?: boolean;
|
||||||
reviewTransferDirection?: ReviewTransferDirection | null;
|
reviewTransferDirection?: ReviewTransferDirection | null;
|
||||||
@@ -1094,7 +1093,6 @@ const AssistantMessageBody = React.memo(({
|
|||||||
showReasoningTraces = false,
|
showReasoningTraces = false,
|
||||||
turnGroupingContext,
|
turnGroupingContext,
|
||||||
errorMessage,
|
errorMessage,
|
||||||
errorVariant = 'error',
|
|
||||||
reviewTransferDirection = null,
|
reviewTransferDirection = null,
|
||||||
contextPinned,
|
contextPinned,
|
||||||
contextPinPending,
|
contextPinPending,
|
||||||
@@ -1704,7 +1702,6 @@ const AssistantMessageBody = React.memo(({
|
|||||||
|
|
||||||
const shouldDeferSortedInlineText = isSortedRenderMode && !hasStopFinish;
|
const shouldDeferSortedInlineText = isSortedRenderMode && !hasStopFinish;
|
||||||
const showErrorMessage = Boolean(errorMessage);
|
const showErrorMessage = Boolean(errorMessage);
|
||||||
const errorIconName = errorVariant === 'info' ? 'information' : 'error-warning';
|
|
||||||
const isPeekSurface = chatSurfaceMode === 'peek';
|
const isPeekSurface = chatSurfaceMode === 'peek';
|
||||||
const shouldShowMessageActions = hasCopyableText && !isPeekSurface;
|
const shouldShowMessageActions = hasCopyableText && !isPeekSurface;
|
||||||
const shouldShowTurnFooter = isLastAssistantInTurn && hasTextContent && (hasStopFinish || Boolean(errorMessage)) && !isPeekSurface;
|
const shouldShowTurnFooter = isLastAssistantInTurn && hasTextContent && (hasStopFinish || Boolean(errorMessage)) && !isPeekSurface;
|
||||||
@@ -2217,17 +2214,9 @@ const AssistantMessageBody = React.memo(({
|
|||||||
{renderedParts}
|
{renderedParts}
|
||||||
{showErrorMessage && (
|
{showErrorMessage && (
|
||||||
<FadeInOnReveal key="assistant-error">
|
<FadeInOnReveal key="assistant-error">
|
||||||
<div className={cn(
|
<div className="group/assistant-text relative mt-3 max-w-full break-words rounded-2xl border border-[var(--status-info-border)] bg-[var(--status-info-background)] px-4 py-3 text-base leading-relaxed">
|
||||||
'group/assistant-text relative mt-3 p-3 rounded-lg border break-words max-w-full',
|
<div className="flex items-center gap-3">
|
||||||
errorVariant === 'info'
|
<Icon name="information" className="size-4 shrink-0 text-[var(--status-info)]" />
|
||||||
? 'bg-[var(--status-info-background)] border-[var(--status-info-border)]'
|
|
||||||
: 'bg-[var(--status-error-background)] border-[var(--status-error-border)]',
|
|
||||||
)}>
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<Icon name={errorIconName} className={cn(
|
|
||||||
'h-4 w-4 shrink-0',
|
|
||||||
errorVariant === 'info' ? 'text-[var(--status-info)]' : 'text-[var(--status-error)]',
|
|
||||||
)} />
|
|
||||||
<div className="min-w-0 flex-1 break-words">
|
<div className="min-w-0 flex-1 break-words">
|
||||||
<SimpleMarkdownRenderer
|
<SimpleMarkdownRenderer
|
||||||
content={errorMessage ?? ''}
|
content={errorMessage ?? ''}
|
||||||
|
|||||||
Reference in New Issue
Block a user