Fix stream action spacing branches
This commit is contained in:
@@ -89,20 +89,33 @@ const isSameAssistantBlockGroup = (params: {
|
|||||||
params.item.blockGroupId !== undefined &&
|
params.item.blockGroupId !== undefined &&
|
||||||
params.item.blockGroupId === params.other.blockGroupId;
|
params.item.blockGroupId === params.other.blockGroupId;
|
||||||
|
|
||||||
const isAssistantBlockFragment = (params: {
|
const getAssistantBlockSpacing = (params: {
|
||||||
item: StreamItem;
|
item: StreamItem;
|
||||||
aboveItem: StreamItem | null | undefined;
|
aboveItem: StreamItem | null | undefined;
|
||||||
belowItem: StreamItem | null | undefined;
|
belowItem: StreamItem | null | undefined;
|
||||||
}) =>
|
}): "default" | "compactTop" | "compactBottom" | "compactBoth" => {
|
||||||
params.item.kind === "assistant_message" &&
|
if (params.item.kind !== "assistant_message") {
|
||||||
(isSameAssistantBlockGroup({
|
return "default";
|
||||||
|
}
|
||||||
|
const compactTop = isSameAssistantBlockGroup({
|
||||||
item: params.item,
|
item: params.item,
|
||||||
other: params.aboveItem,
|
other: params.aboveItem,
|
||||||
}) ||
|
});
|
||||||
isSameAssistantBlockGroup({
|
const compactBottom = isSameAssistantBlockGroup({
|
||||||
item: params.item,
|
item: params.item,
|
||||||
other: params.belowItem,
|
other: params.belowItem,
|
||||||
}));
|
});
|
||||||
|
if (compactTop && compactBottom) {
|
||||||
|
return "compactBoth";
|
||||||
|
}
|
||||||
|
if (compactTop) {
|
||||||
|
return "compactTop";
|
||||||
|
}
|
||||||
|
if (compactBottom) {
|
||||||
|
return "compactBottom";
|
||||||
|
}
|
||||||
|
return "default";
|
||||||
|
};
|
||||||
export interface AgentStreamViewHandle {
|
export interface AgentStreamViewHandle {
|
||||||
scrollToBottom(reason?: BottomAnchorLocalRequest["reason"]): void;
|
scrollToBottom(reason?: BottomAnchorLocalRequest["reason"]): void;
|
||||||
prepareForViewportChange(): void;
|
prepareForViewportChange(): void;
|
||||||
@@ -373,13 +386,11 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
|
|||||||
index,
|
index,
|
||||||
relation: "below",
|
relation: "below",
|
||||||
});
|
});
|
||||||
const spacing = isAssistantBlockFragment({
|
const spacing = getAssistantBlockSpacing({
|
||||||
item,
|
item,
|
||||||
aboveItem,
|
aboveItem,
|
||||||
belowItem,
|
belowItem,
|
||||||
})
|
});
|
||||||
? "compact"
|
|
||||||
: "default";
|
|
||||||
return (
|
return (
|
||||||
<AssistantMessage
|
<AssistantMessage
|
||||||
message={item.text}
|
message={item.text}
|
||||||
@@ -518,12 +529,7 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
|
|||||||
return (
|
return (
|
||||||
<View style={[stylesheet.streamItemWrapper, { marginBottom: gapBelow }]}>
|
<View style={[stylesheet.streamItemWrapper, { marginBottom: gapBelow }]}>
|
||||||
{content}
|
{content}
|
||||||
{isEndOfAssistantTurn ? (
|
{isEndOfAssistantTurn ? <TurnCopyButton getContent={getTurnContent} /> : null}
|
||||||
<TurnCopyButton
|
|
||||||
getContent={getTurnContent}
|
|
||||||
containerStyle={stylesheet.assistantTurnCopyButton}
|
|
||||||
/>
|
|
||||||
) : null}
|
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
@@ -636,7 +642,11 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
|
|||||||
<View
|
<View
|
||||||
style={[
|
style={[
|
||||||
stylesheet.listHeaderContent,
|
stylesheet.listHeaderContent,
|
||||||
boundary.hasLiveHead ? { paddingTop: looseGap } : null,
|
boundary.hasLiveHead
|
||||||
|
? streamRenderStrategy.getFlatListInverted()
|
||||||
|
? { paddingBottom: looseGap }
|
||||||
|
: { paddingTop: looseGap }
|
||||||
|
: null,
|
||||||
]}
|
]}
|
||||||
>
|
>
|
||||||
{auxiliary.pendingPermissions}
|
{auxiliary.pendingPermissions}
|
||||||
@@ -644,7 +654,13 @@ const AgentStreamViewComponent = forwardRef<AgentStreamViewHandle, AgentStreamVi
|
|||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
}, [auxiliary.pendingPermissions, auxiliary.workingIndicator, boundary.hasLiveHead, looseGap]);
|
}, [
|
||||||
|
auxiliary.pendingPermissions,
|
||||||
|
auxiliary.workingIndicator,
|
||||||
|
boundary.hasLiveHead,
|
||||||
|
looseGap,
|
||||||
|
streamRenderStrategy,
|
||||||
|
]);
|
||||||
|
|
||||||
const renderers = useMemo<StreamSegmentRenderers>(
|
const renderers = useMemo<StreamSegmentRenderers>(
|
||||||
() => ({
|
() => ({
|
||||||
@@ -1049,9 +1065,6 @@ const stylesheet = StyleSheet.create((theme) => ({
|
|||||||
listHeaderContent: {
|
listHeaderContent: {
|
||||||
gap: theme.spacing[3],
|
gap: theme.spacing[3],
|
||||||
},
|
},
|
||||||
assistantTurnCopyButton: {
|
|
||||||
marginTop: theme.spacing[3],
|
|
||||||
},
|
|
||||||
bottomBarWrapper: {
|
bottomBarWrapper: {
|
||||||
flexDirection: "row",
|
flexDirection: "row",
|
||||||
alignItems: "center",
|
alignItems: "center",
|
||||||
|
|||||||
@@ -433,7 +433,7 @@ interface AssistantMessageProps {
|
|||||||
serverId?: string;
|
serverId?: string;
|
||||||
client?: DaemonClient | null;
|
client?: DaemonClient | null;
|
||||||
disableOuterSpacing?: boolean;
|
disableOuterSpacing?: boolean;
|
||||||
spacing?: "default" | "compact";
|
spacing?: "default" | "compactTop" | "compactBottom" | "compactBoth";
|
||||||
}
|
}
|
||||||
|
|
||||||
export const assistantMessageStylesheet = StyleSheet.create((theme) => ({
|
export const assistantMessageStylesheet = StyleSheet.create((theme) => ({
|
||||||
@@ -441,8 +441,10 @@ export const assistantMessageStylesheet = StyleSheet.create((theme) => ({
|
|||||||
paddingHorizontal: theme.spacing[2],
|
paddingHorizontal: theme.spacing[2],
|
||||||
paddingVertical: theme.spacing[3],
|
paddingVertical: theme.spacing[3],
|
||||||
},
|
},
|
||||||
containerCompactVertical: {
|
containerCompactTop: {
|
||||||
paddingTop: 0,
|
paddingTop: 0,
|
||||||
|
},
|
||||||
|
containerCompactBottom: {
|
||||||
paddingBottom: 0,
|
paddingBottom: 0,
|
||||||
},
|
},
|
||||||
containerSpacing: {
|
containerSpacing: {
|
||||||
@@ -1107,7 +1109,7 @@ export const AssistantMessage = memo(function AssistantMessage({
|
|||||||
}: AssistantMessageProps) {
|
}: AssistantMessageProps) {
|
||||||
const { theme } = useUnistyles();
|
const { theme } = useUnistyles();
|
||||||
const resolvedDisableOuterSpacing = useDisableOuterSpacing(
|
const resolvedDisableOuterSpacing = useDisableOuterSpacing(
|
||||||
disableOuterSpacing ?? spacing === "compact",
|
disableOuterSpacing ?? spacing !== "default",
|
||||||
);
|
);
|
||||||
|
|
||||||
const markdownStyles = useMemo(() => createMarkdownStyles(theme), [theme]);
|
const markdownStyles = useMemo(() => createMarkdownStyles(theme), [theme]);
|
||||||
@@ -1309,7 +1311,10 @@ export const AssistantMessage = memo(function AssistantMessage({
|
|||||||
testID="assistant-message"
|
testID="assistant-message"
|
||||||
style={[
|
style={[
|
||||||
assistantMessageStylesheet.container,
|
assistantMessageStylesheet.container,
|
||||||
spacing === "compact" && assistantMessageStylesheet.containerCompactVertical,
|
(spacing === "compactTop" || spacing === "compactBoth") &&
|
||||||
|
assistantMessageStylesheet.containerCompactTop,
|
||||||
|
(spacing === "compactBottom" || spacing === "compactBoth") &&
|
||||||
|
assistantMessageStylesheet.containerCompactBottom,
|
||||||
!resolvedDisableOuterSpacing && assistantMessageStylesheet.containerSpacing,
|
!resolvedDisableOuterSpacing && assistantMessageStylesheet.containerSpacing,
|
||||||
]}
|
]}
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in New Issue
Block a user