EnterpriseAI/ClosedCode
1
0
Fork 0
Code Issues Pull Requests Actions 29 Packages Projects Releases Wiki Activity

fix(app): clip rounded session panels (#31462)

Browse Source
This commit is contained in:
Luke Parker
2026-06-09 06:22:52 +00:00
committed by GitHub
parent ab701d20eb
commit 5372c63c7c
1 changed files with 64 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/app/src/pages/session.tsx
+64 -60
View File
@@ -1745,81 +1745,85 @@ export default function Page() {
<div <div
classList={{ classList={{
"@container relative shrink-0 flex flex-col min-h-0 h-full bg-background-stronger flex-1 md:flex-none": true, "@container relative shrink-0 flex flex-col min-h-0 h-full flex-1 md:flex-none": true,
"duration-[240ms] ease-[cubic-bezier(0.22,1,0.36,1)] will-change-[width] motion-reduce:transition-none": "duration-[240ms] ease-[cubic-bezier(0.22,1,0.36,1)] will-change-[width] motion-reduce:transition-none":
!size.active() && !ui.reviewSnap, !size.active() && !ui.reviewSnap,
"transition-[width]": !isV2NewSessionPage(), "transition-[width]": !isV2NewSessionPage(),
"rounded-[10px] shadow-[var(--v2-elevation-raised)]": settings.general.newLayoutDesigns() && !!params.id,
}} }}
style={{ style={{
width: sessionPanelWidth(), width: sessionPanelWidth(),
}} }}
> >
<div <div
class="flex-1 min-h-0 overflow-hidden"
classList={{ classList={{
"rounded-[10px]": settings.general.newLayoutDesigns(), "flex-1 min-h-0 flex flex-col": true,
"bg-v2-background-bg-deep": isV2NewSessionPage(),
"bg-background-stronger": !isV2NewSessionPage(),
"rounded-[10px] overflow-hidden": settings.general.newLayoutDesigns(),
"shadow-[var(--v2-elevation-raised)]": settings.general.newLayoutDesigns() && !!params.id,
}} }}
> >
<Switch> <div class="flex-1 min-h-0 overflow-hidden">
<Match when={params.id && mobileChanges()}> <Switch>
<div class="relative h-full overflow-hidden"> <Match when={params.id && mobileChanges()}>
{reviewContent({ <div class="relative h-full overflow-hidden">
diffStyle: "unified", {reviewContent({
classes: { diffStyle: "unified",
root: "pb-8", classes: {
header: "px-4", root: "pb-8",
container: "px-4", header: "px-4",
}, container: "px-4",
loadingClass: "px-4 py-4 text-text-weak", },
emptyClass: "h-full pb-64 -mt-4 flex flex-col items-center justify-center text-center gap-6", loadingClass: "px-4 py-4 text-text-weak",
})} emptyClass: "h-full pb-64 -mt-4 flex flex-col items-center justify-center text-center gap-6",
</div> })}
</Match> </div>
<Match when={params.id}> </Match>
<Show when={messagesReady()}> <Match when={params.id}>
<MessageTimeline <Show when={messagesReady()}>
actions={actions} <MessageTimeline
scroll={ui.scroll} actions={actions}
onResumeScroll={resumeScroll} scroll={ui.scroll}
setScrollRef={setScrollRef} onResumeScroll={resumeScroll}
onScheduleScrollState={scheduleScrollState} setScrollRef={setScrollRef}
onAutoScrollHandleScroll={autoScroll.handleScroll} onScheduleScrollState={scheduleScrollState}
onMarkScrollGesture={markScrollGesture} onAutoScrollHandleScroll={autoScroll.handleScroll}
hasScrollGesture={hasScrollGesture} onMarkScrollGesture={markScrollGesture}
onUserScroll={markUserScroll} hasScrollGesture={hasScrollGesture}
onHistoryScroll={historyLoader.onScrollerScroll} onUserScroll={markUserScroll}
onAutoScrollInteraction={autoScroll.handleInteraction} onHistoryScroll={historyLoader.onScrollerScroll}
shouldAnchorBottom={() => onAutoScrollInteraction={autoScroll.handleInteraction}
!location.hash && !store.messageId && !ui.pendingMessage && !autoScroll.userScrolled() shouldAnchorBottom={() =>
} !location.hash && !store.messageId && !ui.pendingMessage && !autoScroll.userScrolled()
centered={centered()} }
setContentRef={(el) => { centered={centered()}
content = el setContentRef={(el) => {
autoScroll.contentRef(el) content = el
autoScroll.contentRef(el)
const root = scroller const root = scroller
if (root) scheduleScrollState(root) if (root) scheduleScrollState(root)
}} }}
historyShift={historyLoader.shift()} historyShift={historyLoader.shift()}
userMessages={historyLoader.userMessages()} userMessages={historyLoader.userMessages()}
anchor={anchor} anchor={anchor}
setRevealMessage={(fn) => { setRevealMessage={(fn) => {
revealMessage = fn revealMessage = fn
}} }}
/> />
</Show> </Show>
</Match> </Match>
<Match when={true}> <Match when={true}>
<Show when={newSessionDesign()} fallback={<NewSessionView worktree={newSessionWorktree()} />}> <Show when={newSessionDesign()} fallback={<NewSessionView worktree={newSessionWorktree()} />}>
<NewSessionDesignView>{composerRegion("inline")}</NewSessionDesignView> <NewSessionDesignView>{composerRegion("inline")}</NewSessionDesignView>
</Show> </Show>
</Match> </Match>
</Switch> </Switch>
</div>
<Show when={params.id || !newSessionDesign()}>{composerRegion("dock")}</Show>
</div> </div>
<Show when={params.id || !newSessionDesign()}>{composerRegion("dock")}</Show>
<Show when={desktopReviewOpen()}> <Show when={desktopReviewOpen()}>
<div onPointerDown={() => size.start()}> <div onPointerDown={() => size.start()}>
<ResizeHandle <ResizeHandle