fix: broken chats (#8983)
* Fix broken chats
Co-authored-by: @ltlapy
* 🎨
			
			
This commit is contained in:
		@@ -197,21 +197,23 @@ const prepend = (item: Item): void => {
 | 
			
		||||
	if (props.pagination.reversed) {
 | 
			
		||||
		if (rootEl.value) {
 | 
			
		||||
			const container = getScrollContainer(rootEl.value);
 | 
			
		||||
			if (container == null) return; // TODO?
 | 
			
		||||
 | 
			
		||||
			const pos = getScrollPosition(rootEl.value);
 | 
			
		||||
			const viewHeight = container.clientHeight;
 | 
			
		||||
			const height = container.scrollHeight;
 | 
			
		||||
			const isBottom = (pos + viewHeight > height - 32);
 | 
			
		||||
			if (isBottom) {
 | 
			
		||||
				// オーバーフローしたら古いアイテムは捨てる
 | 
			
		||||
				if (items.value.length >= props.displayLimit) {
 | 
			
		||||
					// このやり方だとVue 3.2以降アニメーションが動かなくなる
 | 
			
		||||
					//items.value = items.value.slice(-props.displayLimit);
 | 
			
		||||
					while (items.value.length >= props.displayLimit) {
 | 
			
		||||
						items.value.shift();
 | 
			
		||||
			if (container == null) {
 | 
			
		||||
				// TODO?
 | 
			
		||||
			} else {
 | 
			
		||||
				const pos = getScrollPosition(rootEl.value);
 | 
			
		||||
				const viewHeight = container.clientHeight;
 | 
			
		||||
				const height = container.scrollHeight;
 | 
			
		||||
				const isBottom = (pos + viewHeight > height - 32);
 | 
			
		||||
				if (isBottom) {
 | 
			
		||||
					// オーバーフローしたら古いアイテムは捨てる
 | 
			
		||||
					if (items.value.length >= props.displayLimit) {
 | 
			
		||||
						// このやり方だとVue 3.2以降アニメーションが動かなくなる
 | 
			
		||||
						//items.value = items.value.slice(-props.displayLimit);
 | 
			
		||||
						while (items.value.length >= props.displayLimit) {
 | 
			
		||||
							items.value.shift();
 | 
			
		||||
						}
 | 
			
		||||
						more.value = true;
 | 
			
		||||
					}
 | 
			
		||||
					more.value = true;
 | 
			
		||||
				}
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
 
 | 
			
		||||
@@ -292,6 +292,7 @@ definePageMetadata(computed(() => !fetching ? user ? {
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.mk-messaging-room {
 | 
			
		||||
	position: relative;
 | 
			
		||||
	overflow: auto;
 | 
			
		||||
 | 
			
		||||
	> .body {
 | 
			
		||||
		.more {
 | 
			
		||||
@@ -335,10 +336,7 @@ definePageMetadata(computed(() => !fetching ? user ? {
 | 
			
		||||
		z-index: 2;
 | 
			
		||||
		bottom: 0;
 | 
			
		||||
		padding-top: 8px;
 | 
			
		||||
 | 
			
		||||
		@media (max-width: 500px) {
 | 
			
		||||
			bottom: calc(env(safe-area-inset-bottom, 0px) + 92px);
 | 
			
		||||
		}
 | 
			
		||||
		bottom: calc(env(safe-area-inset-bottom, 0px) + 8px);
 | 
			
		||||
 | 
			
		||||
		> .new-message {
 | 
			
		||||
			width: 100%;
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user