fix: allow scrollback on approval screens

This commit is contained in:
cpacker
2025-10-26 18:41:16 -07:00
parent db683485dc
commit 0b9c14f6de
3 changed files with 29 additions and 25 deletions

View File

@@ -1167,27 +1167,29 @@ export default function App({
{loadingState === "ready" && (
<>
{/* Transcript */}
{liveItems.length > 0 && (
<Box flexDirection="column">
{liveItems.map((ln) => (
<Box key={ln.id} marginTop={1}>
{ln.kind === "user" ? (
<UserMessage line={ln} />
) : ln.kind === "reasoning" ? (
<ReasoningMessage line={ln} />
) : ln.kind === "assistant" ? (
<AssistantMessage line={ln} />
) : ln.kind === "tool_call" ? (
<ToolCallMessage line={ln} />
) : ln.kind === "error" ? (
<ErrorMessage line={ln} />
) : (
<CommandMessage line={ln} />
)}
</Box>
))}
</Box>
)}
{liveItems.length > 0 &&
!pendingApproval &&
!planApprovalPending && (
<Box flexDirection="column">
{liveItems.map((ln) => (
<Box key={ln.id} marginTop={1}>
{ln.kind === "user" ? (
<UserMessage line={ln} />
) : ln.kind === "reasoning" ? (
<ReasoningMessage line={ln} />
) : ln.kind === "assistant" ? (
<AssistantMessage line={ln} />
) : ln.kind === "tool_call" ? (
<ToolCallMessage line={ln} />
) : ln.kind === "error" ? (
<ErrorMessage line={ln} />
) : (
<CommandMessage line={ln} />
)}
</Box>
))}
</Box>
)}
{/* Ensure 1 blank line above input when there are no live items */}
{liveItems.length === 0 && <Box height={1} />}

View File

@@ -205,7 +205,7 @@ const DynamicPreview: React.FC<DynamicPreviewProps> = ({
);
};
export function ApprovalDialog({
export const ApprovalDialog = memo(function ApprovalDialog({
approvalRequest,
approvalContext,
onApprove,
@@ -403,7 +403,9 @@ export function ApprovalDialog({
<Box height={1} />
</Box>
);
}
});
ApprovalDialog.displayName = "ApprovalDialog";
// Helper functions for tool name mapping
function getHeaderLabel(toolName: string): string {

View File

@@ -158,7 +158,7 @@ export function Input({
// Shimmer animation effect
useEffect(() => {
if (!streaming) return;
if (!streaming || !visible) return;
const id = setInterval(() => {
setShimmerOffset((prev) => {
@@ -169,7 +169,7 @@ export function Input({
}, 120); // Speed of shimmer animation
return () => clearInterval(id);
}, [streaming, thinkingMessage]);
}, [streaming, thinkingMessage, visible]);
const handleSubmit = async () => {
if (streaming || commandRunning) {