nostr/primal-web-app
1
0
Fork 0
mirror of https://github.com/PrimalHQ/primal-web-app.git synced 2024-10-03 02:10:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Scroll primary note into view

Browse Source
This commit is contained in:
Bojan Mojsilovic 2024-01-09 14:12:47 +01:00
parent 4004d90cce
commit 407295608f
1 changed files with 9 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/pages/Thread.tsx
View File

@ -101,36 +101,15 @@ const Thread: Component = () => {
let observer: IntersectionObserver | undefined; let observer: IntersectionObserver | undefined;
createEffect(() => { createEffect(() => {
if (primaryNote() && !threadContext?.isFetching) { if (!primaryNote() || threadContext?.isFetching) return;
const pn = document.getElementById('primary_note');
if (!pn) { const pn = document.getElementById('primary_note');
return;
}
setTimeout(() => { if (!pn) return;
if (!repliesHolder) return;
if (parentNotes().length === 0) { setTimeout(() => {
return; pn.scrollIntoView({ block: 'end' });
} }, 100);
const rect = pn.getBoundingClientRect();
const vh = window.innerHeight;
const header = 72;
const note = rect.height;
const banner = isIOS() ? 54 : 0;
const minHeight = vh - note - header - banner;
repliesHolder.setAttribute('style',`min-height: ${minHeight}px`);
scrollWindowTo(rect.top - header - banner);
// repliesHolder.setAttribute('style', `height: ${document.documentElement.scrollHeight}px;`)
}, 10)
}
}); });
onCleanup(() => { onCleanup(() => {
@ -175,7 +154,7 @@ const Thread: Component = () => {
<div class={styles.parentsHolder}> <div class={styles.parentsHolder}>
<For each={parentNotes()}> <For each={parentNotes()}>
{note => {note =>
<div class={styles.threadList}> <div>
<Note note={note} parent={true} shorten={true} /> <Note note={note} parent={true} shorten={true} />
</div> </div>
} }
@ -184,7 +163,7 @@ const Thread: Component = () => {
</Show> </Show>
<Show when={primaryNote()}> <Show when={primaryNote()}>
<div id="primary_note" class={styles.threadList}> <div id="primary_note">
<Note <Note
note={primaryNote() as PrimalNote} note={primaryNote() as PrimalNote}
/> />
@ -200,7 +179,7 @@ const Thread: Component = () => {
<div class={styles.repliesHolder} ref={repliesHolder}> <div class={styles.repliesHolder} ref={repliesHolder}>
<For each={replyNotes()}> <For each={replyNotes()}>
{note => {note =>
<div class={styles.threadList}> <div>
<Note note={note} shorten={true} /> <Note note={note} shorten={true} />
</div> </div>
} }