summaryrefslogtreecommitdiffhomepage
path: root/packages/ui
diff options
context:
space:
mode:
Diffstat (limited to 'packages/ui')
-rw-r--r--packages/ui/src/components/select-dialog.tsx11
-rw-r--r--packages/ui/src/components/session-turn.tsx23
2 files changed, 8 insertions, 26 deletions
diff --git a/packages/ui/src/components/select-dialog.tsx b/packages/ui/src/components/select-dialog.tsx
index 06953168c..68707536a 100644
--- a/packages/ui/src/components/select-dialog.tsx
+++ b/packages/ui/src/components/select-dialog.tsx
@@ -1,4 +1,4 @@
-import { createEffect, Show, type JSX, splitProps, createSignal } from "solid-js"
+import { Show, type JSX, splitProps, createSignal } from "solid-js"
import { Dialog, DialogProps } from "./dialog"
import { Icon } from "./icon"
import { IconButton } from "./icon-button"
@@ -20,15 +20,6 @@ export function SelectDialog<T>(props: SelectDialogProps<T>) {
const [filter, setFilter] = createSignal("")
let listRef: ListRef | undefined
- createEffect(() => {
- if (!props.current) return
- const key = props.key(props.current)
- requestAnimationFrame(() => {
- const element = document.querySelector(`[data-key="${key}"]`)
- element?.scrollIntoView({ block: "center" })
- })
- })
-
const handleSelect = (item: T | undefined, index: number) => {
others.onSelect?.(item, index)
closeButton.click()
diff --git a/packages/ui/src/components/session-turn.tsx b/packages/ui/src/components/session-turn.tsx
index b50e4c8a0..a4a762fc6 100644
--- a/packages/ui/src/components/session-turn.tsx
+++ b/packages/ui/src/components/session-turn.tsx
@@ -50,19 +50,16 @@ export function SessionTurn(
let scrollRef: HTMLDivElement | undefined
const [state, setState] = createStore({
- contentRef: undefined as HTMLDivElement | undefined,
stickyTitleRef: undefined as HTMLDivElement | undefined,
stickyTriggerRef: undefined as HTMLDivElement | undefined,
userScrolled: false,
stickyHeaderHeight: 0,
scrollY: 0,
- autoScrolling: false,
})
function handleScroll() {
if (!scrollRef) return
setState("scrollY", scrollRef.scrollTop)
- if (state.autoScrolling) return
const { scrollTop, scrollHeight, clientHeight } = scrollRef
const atBottom = scrollHeight - scrollTop - clientHeight < 50
if (!atBottom && working()) {
@@ -77,13 +74,9 @@ export function SessionTurn(
}
function scrollToBottom() {
- if (!scrollRef || state.userScrolled || !working() || state.autoScrolling) return
- setState("autoScrolling", true)
+ if (!scrollRef || state.userScrolled || !working()) return
requestAnimationFrame(() => {
scrollRef?.scrollTo({ top: scrollRef.scrollHeight, behavior: "auto" })
- requestAnimationFrame(() => {
- setState("autoScrolling", false)
- })
})
}
@@ -94,13 +87,6 @@ export function SessionTurn(
})
createResizeObserver(
- () => state.contentRef,
- () => {
- scrollToBottom()
- },
- )
-
- createResizeObserver(
() => state.stickyTitleRef,
({ height }) => {
const triggerHeight = state.stickyTriggerRef?.offsetHeight ?? 0
@@ -119,7 +105,7 @@ export function SessionTurn(
return (
<div data-component="session-turn" class={props.classes?.root} style={{ "--scroll-y": `${state.scrollY}px` }}>
<div ref={scrollRef} onScroll={handleScroll} data-slot="session-turn-content" class={props.classes?.content}>
- <div ref={(el) => setState("contentRef", el)} onClick={handleInteraction}>
+ <div onClick={handleInteraction}>
<Show when={message()}>
{(message) => {
const assistantMessages = createMemo(() => {
@@ -221,6 +207,11 @@ export function SessionTurn(
})
}
+ createEffect(() => {
+ lastPart()
+ scrollToBottom()
+ })
+
const [store, setStore] = createStore({
status: rawStatus(),
stepsExpanded: true,