forked from coracle/flotilla
remove VirtualItem
This commit is contained in:
@@ -1,53 +0,0 @@
|
||||
<script lang="ts">
|
||||
import type {Snippet} from "svelte"
|
||||
|
||||
type Props = {
|
||||
children: Snippet
|
||||
root?: HTMLElement
|
||||
initiallyVisible?: boolean
|
||||
estimatedHeight?: number
|
||||
}
|
||||
|
||||
const {children, root, initiallyVisible = false, estimatedHeight = 48}: Props = $props()
|
||||
|
||||
let visible = $state(initiallyVisible)
|
||||
let height = $state(estimatedHeight)
|
||||
let el: HTMLElement | undefined = $state()
|
||||
let hasMeasured = false
|
||||
|
||||
$effect(() => {
|
||||
if (!el) return
|
||||
|
||||
const observer = new IntersectionObserver(
|
||||
([entry]) => {
|
||||
if (entry.isIntersecting) {
|
||||
visible = true
|
||||
} else {
|
||||
// Measure actual height before hiding content
|
||||
if (el) {
|
||||
const h = el.offsetHeight
|
||||
if (h > 0) {
|
||||
height = h
|
||||
hasMeasured = true
|
||||
}
|
||||
}
|
||||
if (hasMeasured) {
|
||||
visible = false
|
||||
}
|
||||
}
|
||||
},
|
||||
{root: root || null, rootMargin: "1000px 0px"},
|
||||
)
|
||||
|
||||
observer.observe(el)
|
||||
return () => observer.disconnect()
|
||||
})
|
||||
</script>
|
||||
|
||||
<div bind:this={el}>
|
||||
{#if visible}
|
||||
{@render children()}
|
||||
{:else}
|
||||
<div style:height="{height}px"></div>
|
||||
{/if}
|
||||
</div>
|
||||
@@ -30,7 +30,6 @@
|
||||
import SpaceSearch from "@app/components/SpaceSearch.svelte"
|
||||
import ThunkToast from "@app/components/ThunkToast.svelte"
|
||||
import RoomItemAddMember from "@src/app/components/RoomItemAddMember.svelte"
|
||||
import VirtualItem from "@lib/components/VirtualItem.svelte"
|
||||
import RoomComposeEdit from "@src/app/components/RoomComposeEdit.svelte"
|
||||
import {canEnforceNip70, prependParent, publishDelete} from "@app/core/commands"
|
||||
import {
|
||||
@@ -486,23 +485,21 @@
|
||||
{:else if type === "date"}
|
||||
<Divider>{value}</Divider>
|
||||
{:else if shouldVirtualize}
|
||||
<VirtualItem root={element} initiallyVisible={i < 25}>
|
||||
{@const event = value as TrustedEvent}
|
||||
{#if event.kind === ROOM_ADD_MEMBER}
|
||||
<RoomItemAddMember {url} {event} />
|
||||
{:else}
|
||||
<div class="cv">
|
||||
<RoomItem
|
||||
{url}
|
||||
{event}
|
||||
{replyTo}
|
||||
{showPubkey}
|
||||
{addSpaceBelow}
|
||||
canEdit={canEditEvent}
|
||||
onEdit={onEditEvent} />
|
||||
</div>
|
||||
{/if}
|
||||
</VirtualItem>
|
||||
{@const event = value as TrustedEvent}
|
||||
{#if event.kind === ROOM_ADD_MEMBER}
|
||||
<RoomItemAddMember {url} {event} />
|
||||
{:else}
|
||||
<div class="cv">
|
||||
<RoomItem
|
||||
{url}
|
||||
{event}
|
||||
{replyTo}
|
||||
{showPubkey}
|
||||
{addSpaceBelow}
|
||||
canEdit={canEditEvent}
|
||||
onEdit={onEditEvent} />
|
||||
</div>
|
||||
{/if}
|
||||
{:else}
|
||||
{@const event = value as TrustedEvent}
|
||||
{#if event.kind === ROOM_ADD_MEMBER}
|
||||
|
||||
@@ -21,7 +21,6 @@
|
||||
import SpaceSearch from "@app/components/SpaceSearch.svelte"
|
||||
import RoomItem from "@app/components/RoomItem.svelte"
|
||||
import RoomItemAddMember from "@src/app/components/RoomItemAddMember.svelte"
|
||||
import VirtualItem from "@lib/components/VirtualItem.svelte"
|
||||
|
||||
import RoomCompose from "@app/components/RoomCompose.svelte"
|
||||
import RoomComposeEdit from "@src/app/components/RoomComposeEdit.svelte"
|
||||
@@ -324,23 +323,21 @@
|
||||
{:else if type === "date"}
|
||||
<Divider>{value}</Divider>
|
||||
{:else if shouldVirtualize}
|
||||
<VirtualItem root={element} initiallyVisible={i < 25}>
|
||||
{@const event = value as TrustedEvent}
|
||||
{#if event.kind === RELAY_ADD_MEMBER}
|
||||
<RoomItemAddMember {url} {event} />
|
||||
{:else}
|
||||
<div>
|
||||
<RoomItem
|
||||
{url}
|
||||
{event}
|
||||
{replyTo}
|
||||
{showPubkey}
|
||||
canEdit={canEditEvent}
|
||||
onEdit={onEditEvent}
|
||||
{addSpaceBelow} />
|
||||
</div>
|
||||
{/if}
|
||||
</VirtualItem>
|
||||
{@const event = value as TrustedEvent}
|
||||
{#if event.kind === RELAY_ADD_MEMBER}
|
||||
<RoomItemAddMember {url} {event} />
|
||||
{:else}
|
||||
<div>
|
||||
<RoomItem
|
||||
{url}
|
||||
{event}
|
||||
{replyTo}
|
||||
{showPubkey}
|
||||
canEdit={canEditEvent}
|
||||
onEdit={onEditEvent}
|
||||
{addSpaceBelow} />
|
||||
</div>
|
||||
{/if}
|
||||
{:else}
|
||||
{@const event = value as TrustedEvent}
|
||||
{#if event.kind === RELAY_ADD_MEMBER}
|
||||
|
||||
Reference in New Issue
Block a user