fix: allow scrollback on approval screens
This commit is contained in:
@@ -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} />}
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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) {
|
||||
|
||||
Reference in New Issue
Block a user