fix(desktop): message animation

This commit is contained in:
Adam
2025-11-18 15:17:50 -06:00
parent edd86e3fb7
commit 45180104fe
2 changed files with 27 additions and 4 deletions

View File

@@ -0,0 +1,20 @@
import { createSignal, onCleanup, onMount } from "solid-js"
import { isServer } from "solid-js/web"
export function createSessionSeen(key: string, delay = 1000) {
// 1. Initialize state based on storage (default to true on server to avoid flash)
const storageKey = `app:seen:${key}`
const [hasSeen] = createSignal(!isServer && sessionStorage.getItem(storageKey) === "true")
onMount(() => {
// 2. If we haven't seen it, mark it as seen for NEXT time
if (!hasSeen()) {
const timer = setTimeout(() => {
sessionStorage.setItem(storageKey, "true")
}, delay)
onCleanup(() => clearTimeout(timer))
}
})
return hasSeen
}

View File

@@ -52,6 +52,7 @@ import { useSession } from "@/context/session"
import { StickyAccordionHeader } from "@/components/sticky-accordion-header"
import { SessionReview } from "@/components/session-review"
import { useLayout } from "@/context/layout"
import { createSessionSeen } from "@/hooks/create-session-seen"
export default function Page() {
const layout = useLayout()
@@ -451,7 +452,9 @@ export default function Page() {
<For each={session.messages.user()}>
{(message) => {
const isActive = createMemo(() => session.messages.active()?.id === message.id)
const [titled, setTitled] = createSignal(!!message.summary?.title)
const titleSeen = createSessionSeen(`message-title-${message.id}`)
const contentSeen = createSessionSeen(`message-content-${message.id}`)
const [titled, setTitled] = createSignal(titleSeen())
const assistantMessages = createMemo(() => {
if (!session.id) return []
return sync.data.message[session.id]?.filter(
@@ -474,8 +477,9 @@ export default function Page() {
// allowing time for the animations to finish
createEffect(() => {
if (titleSeen()) return
const title = message.summary?.title
setTimeout(() => setTitled(!!title), 10_000)
if (title) setTimeout(() => setTitled(true), 10_000)
})
createEffect(() => {
const completed = !working()
@@ -523,8 +527,7 @@ export default function Page() {
<Markdown
classList={{
"text-14-regular": !!message.summary?.diffs?.length,
"[&>*]:fade-up-text":
!message.summary?.diffs?.length && !initialCompleted,
"[&>*]:fade-up-text": !message.summary?.diffs?.length && !contentSeen(),
}}
text={summary()}
/>