Merge branch 'misskey-dev:develop' into fix/server-stats-live-update

CHANGELOG.md

@@ -8,9 +8,20 @@
 -
 
 ### Server
--
+- Fix: 外部サーバーの投稿がタイムラインに表示されないことがある問題を修正
 
 -->
+## 13.x.x (unreleased)
+
+### General
+-
+
+### Client
+- リストTLで、ユーザーが追加・削除されてもTLを初期化しないように
+- Fix: モバイル表示のときページ下部がナビゲーションバーに隠れる問題を修正
+
+### Server
+- Fix: APIのオフセットが壊れていたせいで「もっと見る」でもっと見れない問題を修正
 
 ## 13.14.1
 

packages/backend/src/core/activitypub/ApAudienceService.ts

@@ -95,7 +95,7 @@ export class ApAudienceService {
 	private isPublic(id: string): boolean {
 		return [
 			'https://www.w3.org/ns/activitystreams#Public',
-			'as#Public',
+			'as:Public',
 			'Public',
 		].includes(id);
 	}

packages/backend/src/server/api/endpoints/admin/invite/list.ts

@@ -60,7 +60,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			}
 
 			query.limit(ps.limit);
-			query.skip(ps.offset);
+			query.offset(ps.offset);
 
 			const tickets = await query.getMany();
 

packages/backend/src/server/api/endpoints/admin/show-users.ts

@@ -105,7 +105,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			}
 
 			query.limit(ps.limit);
-			query.skip(ps.offset);
+			query.offset(ps.offset);
 
 			const users = await query.getMany();
 

packages/backend/src/server/api/endpoints/federation/instances.ts

@@ -126,7 +126,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 				query.andWhere('instance.host like :host', { host: '%' + sqlLikeEscape(ps.host.toLowerCase()) + '%' });
 			}
 
-			const instances = await query.limit(ps.limit).skip(ps.offset).getMany();
+			const instances = await query.limit(ps.limit).offset(ps.offset).getMany();
 
 			return await this.instanceEntityService.packMany(instances);
 		});

packages/backend/src/server/api/endpoints/hashtags/search.ts

@@ -42,7 +42,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 				.orderBy('tag.count', 'DESC')
 				.groupBy('tag.id')
 				.limit(ps.limit)
-				.skip(ps.offset)
+				.offset(ps.offset)
 				.getMany();
 
 			return hashtags.map(tag => tag.name);

packages/backend/src/server/api/endpoints/notes/polls/recommendation.ts

@@ -83,7 +83,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			const polls = await query
 				.orderBy('poll.noteId', 'DESC')
 				.limit(ps.limit)
-				.skip(ps.offset)
+				.offset(ps.offset)
 				.getMany();
 
 			if (polls.length === 0) return [];

packages/backend/src/server/api/endpoints/users.ts

@@ -81,7 +81,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			if (me) this.queryService.generateBlockQueryForUsers(query, me);
 
 			query.limit(ps.limit);
-			query.skip(ps.offset);
+			query.offset(ps.offset);
 
 			const users = await query.getMany();
 

packages/backend/src/server/api/endpoints/users/recommendation.ts

@@ -70,7 +70,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 			query.setParameters(followingQuery.getParameters());
 
-			const users = await query.limit(ps.limit).skip(ps.offset).getMany();
+			const users = await query.limit(ps.limit).offset(ps.offset).getMany();
 
 			return await this.userEntityService.packMany(users, me, { detail: true });
 		});

packages/backend/src/server/api/endpoints/users/search.ts

@@ -75,7 +75,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 				users = await usernameQuery
 					.orderBy('user.updatedAt', 'DESC', 'NULLS LAST')
 					.limit(ps.limit)
-					.skip(ps.offset)
+					.offset(ps.offset)
 					.getMany();
 			} else {
 				const nameQuery = this.usersRepository.createQueryBuilder('user')
@@ -102,7 +102,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 				users = await nameQuery
 					.orderBy('user.updatedAt', 'DESC', 'NULLS LAST')
 					.limit(ps.limit)
-					.skip(ps.offset)
+					.offset(ps.offset)
 					.getMany();
 
 				if (users.length < ps.limit) {
@@ -128,7 +128,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 					users = users.concat(await query
 						.orderBy('user.updatedAt', 'DESC', 'NULLS LAST')
 						.limit(ps.limit)
-						.skip(ps.offset)
+						.offset(ps.offset)
 						.getMany(),
 					);
 				}

packages/backend/src/server/web/ClientServerService.ts

@@ -3,7 +3,7 @@ import { dirname } from 'node:path';
 import { fileURLToPath } from 'node:url';
 import { Inject, Injectable } from '@nestjs/common';
 import { createBullBoard } from '@bull-board/api';
-import { BullAdapter } from '@bull-board/api/bullAdapter.js';
+import { BullMQAdapter } from '@bull-board/api/bullMQAdapter.js';
 import { FastifyAdapter } from '@bull-board/fastify';
 import ms from 'ms';
 import sharp from 'sharp';
@@ -168,7 +168,7 @@ export class ClientServerService {
 				this.dbQueue,
 				this.objectStorageQueue,
 				this.webhookDeliverQueue,
-			].map(q => new BullAdapter(q)),
+			].map(q => new BullMQAdapter(q)),
 			serverAdapter,
 		});
 

packages/backend/src/server/web/views/gallery-post.pug

@@ -16,8 +16,12 @@ block og
 	meta(property='og:title'       content= title)
 	meta(property='og:description' content= post.description)
 	meta(property='og:url'         content= url)
-	meta(property='og:image'       content= post.files[0].thumbnailUrl)
-	meta(property='twitter:card'   content='summary_large_image')
+	if post.isSensitive
+		meta(property='og:image'     content= avatarUrl)
+		meta(property='twitter:card' content='summary')
+	else
+		meta(property='og:image'       content= post.files[0].thumbnailUrl)
+		meta(property='twitter:card'   content='summary_large_image')
 
 block meta
 	if user.host || profile.noCrawle

packages/frontend/src/components/MkImgWithBlurhash.vue

@@ -108,8 +108,7 @@ function waitForDecode() {
 			.then(() => {
 				loaded = true;
 			}, error => {
-				console.error('Error occurred during decoding image', img.value, error);
-				throw Error(error);
+				console.log('Error occurred during decoding image', img.value, error);
 			});
 	} else {
 		loaded = false;

packages/frontend/src/components/MkMediaList.vue

@@ -1,5 +1,5 @@
 <template>
-<div>
+<div ref="root">
 	<XBanner v-for="media in mediaList.filter(media => !previewable(media))" :key="media.id" :media="media"/>
 	<div v-if="mediaList.filter(media => previewable(media)).length > 0" :class="$style.container">
 		<div
@@ -23,7 +23,7 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, watch, shallowRef } from 'vue';
+import { onMounted, shallowRef } from 'vue';
 import * as misskey from 'misskey-js';
 import PhotoSwipeLightbox from 'photoswipe/lightbox';
 import PhotoSwipe from 'photoswipe';
@@ -34,19 +34,26 @@ import XVideo from '@/components/MkMediaVideo.vue';
 import * as os from '@/os';
 import { FILE_TYPE_BROWSERSAFE } from '@/const';
 import { defaultStore } from '@/store';
+import { getScrollContainer, getBodyScrollHeight } from '@/scripts/scroll';
 
 const props = defineProps<{
 	mediaList: misskey.entities.DriveFile[];
 	raw?: boolean;
 }>();
 
+const root = shallowRef<HTMLDivElement>();
+const container = shallowRef<HTMLElement | null | undefined>(undefined);
 const gallery = shallowRef<HTMLDivElement>();
 const pswpZIndex = os.claimZIndex('middle');
 document.documentElement.style.setProperty('--mk-pswp-root-z-index', pswpZIndex.toString());
 const count = $computed(() => props.mediaList.filter(media => previewable(media)).length);
 
+/**
+ * アスペクト比をmediaListWithOneImageAppearanceに基づいていい感じに調整する
+ * aspect-ratioではなくheightを使う
+ */
 function calcAspectRatio() {
-	if (!gallery.value) return;
+	if (!gallery.value || !root.value) return;
 
 	let img = props.mediaList[0];
 
@@ -55,28 +62,46 @@ function calcAspectRatio() {
 		return;
 	}
 
-	// アスペクト比上限設定では、横長の場合は高さを縮小させる
-	const ratioMax = (ratio: number) => `${Math.max(ratio, img.properties.width / img.properties.height).toString()} / 1`;
+	const width = gallery.value.clientWidth;
+
+	const heightMin = (ratio: number) => {
+		const imgResizeRatio = width / img.properties.width;
+		const imgDrawHeight = img.properties.height * imgResizeRatio;
+		const maxHeight = width * ratio;
+		const height = Math.min(imgDrawHeight, maxHeight);
+		if (_DEV_) console.log('Image height calculated:', { width, properties: img.properties, imgResizeRatio, imgDrawHeight, maxHeight, height });
+		return `${height}px`;
+	};
 
 	switch (defaultStore.state.mediaListWithOneImageAppearance) {
 		case '16_9':
-			gallery.value.style.aspectRatio = ratioMax(16 / 9);
+			gallery.value.style.height = heightMin(9 / 16);
 			break;
 		case '1_1':
-			gallery.value.style.aspectRatio = ratioMax(1);
+			gallery.value.style.height = heightMin(1);
 			break;
 		case '2_3':
-			gallery.value.style.aspectRatio = ratioMax(2 / 3);
+			gallery.value.style.height = heightMin(3 / 2);
 			break;
-		default:
-			gallery.value.style.aspectRatio = '';
+		default: {
+			if (!container.value) container.value = getScrollContainer(root.value);
+			const maxHeight = Math.max(64, (container.value ? container.value.clientHeight : getBodyScrollHeight()) * 0.5 || 360);
+			if (width === 0 || !maxHeight) return;
+			const imgResizeRatio = width / img.properties.width;
+			const imgDrawHeight = img.properties.height * imgResizeRatio;
+			gallery.value.style.height = `${Math.max(64, Math.min(imgDrawHeight, maxHeight))}px`;
+			gallery.value.style.minHeight = 'initial';
+			gallery.value.style.maxHeight = 'initial';
 			break;
+		}
 	}
+
+	gallery.value.style.aspectRatio = 'initial';
 }
 
-watch([defaultStore.reactiveState.mediaListWithOneImageAppearance, gallery], () => calcAspectRatio());
-
 onMounted(() => {
+	calcAspectRatio();
+
 	const lightbox = new PhotoSwipeLightbox({
 		dataSource: props.mediaList
 			.filter(media => {
@@ -203,7 +228,7 @@ const previewable = (file: misskey.entities.DriveFile): boolean => {
 	&.n1 {
 		grid-template-rows: 1fr;
 
-		// default (expand)
+		// default but fallback (expand)
 		min-height: 64px;
 		max-height: clamp(
 			64px,
@@ -212,20 +237,20 @@ const previewable = (file: misskey.entities.DriveFile): boolean => {
 		);
 
 		&.n116_9 {
-			min-height: none;
-			max-height: none;
+			min-height: initial;
+			max-height: initial;
 			aspect-ratio: 16 / 9; // fallback
 		}
 
 		&.n11_1{
-			min-height: none;
-			max-height: none;
+			min-height: initial;
+			max-height: initial;
 			aspect-ratio: 1 / 1; // fallback
 		}
 
 		&.n12_3 {
-			min-height: none;
-			max-height: none;
+			min-height: initial;
+			max-height: initial;
 			aspect-ratio: 2 / 3; // fallback
 		}
 	}

packages/frontend/src/components/MkPostForm.vue

@@ -540,7 +540,7 @@ function onCompositionEnd(ev: CompositionEvent) {
 }
 
 async function onPaste(ev: ClipboardEvent) {
-	for (const { item, i } of Array.from(ev.clipboardData.items).map((item, i) => ({ item, i }))) {
+	for (const { item, i } of Array.from(ev.clipboardData.items, (item, i) => ({ item, i }))) {
 		if (item.kind === 'file') {
 			const file = item.getAsFile();
 			const lio = file.name.lastIndexOf('.');

packages/frontend/src/components/MkTagCloud.vue

@@ -16,8 +16,8 @@ import tinycolor from 'tinycolor2';
 const loaded = !!window.TagCanvas;
 const SAFE_FOR_HTML_ID = 'abcdefghijklmnopqrstuvwxyz';
 const computedStyle = getComputedStyle(document.documentElement);
-const idForCanvas = Array.from(Array(16)).map(() => SAFE_FOR_HTML_ID[Math.floor(Math.random() * SAFE_FOR_HTML_ID.length)]).join('');
-const idForTags = Array.from(Array(16)).map(() => SAFE_FOR_HTML_ID[Math.floor(Math.random() * SAFE_FOR_HTML_ID.length)]).join('');
+const idForCanvas = Array.from({ length: 16 }, () => SAFE_FOR_HTML_ID[Math.floor(Math.random() * SAFE_FOR_HTML_ID.length)]).join('');
+const idForTags = Array.from({ length: 16 }, () => SAFE_FOR_HTML_ID[Math.floor(Math.random() * SAFE_FOR_HTML_ID.length)]).join('');
 let available = $ref(false);
 let rootEl = $shallowRef<HTMLElement | null>(null);
 let canvasEl = $shallowRef<HTMLCanvasElement | null>(null);

packages/frontend/src/components/MkTimeline.vue

@@ -38,14 +38,6 @@ const prepend = note => {
 	}
 };
 
-const onUserAdded = () => {
-	tlComponent.pagingComponent?.reload();
-};
-
-const onUserRemoved = () => {
-	tlComponent.pagingComponent?.reload();
-};
-
 let endpoint;
 let query;
 let connection;
@@ -125,8 +117,6 @@ if (props.src === 'antenna') {
 		listId: props.list,
 	});
 	connection.on('note', prepend);
-	connection.on('userAdded', onUserAdded);
-	connection.on('userRemoved', onUserRemoved);
 } else if (props.src === 'channel') {
 	endpoint = 'channels/timeline';
 	query = {

packages/frontend/src/pages/settings/general.vue

@@ -258,6 +258,7 @@ watch([
 	showGapBetweenNotesInTimeline,
 	instanceTicker,
 	overridedDeviceKind,
+	mediaListWithOneImageAppearance,
 ], async () => {
 	await reloadAsk();
 });

packages/frontend/src/scripts/emoji-base.ts

@@ -2,7 +2,7 @@ const twemojiSvgBase = '/twemoji';
 const fluentEmojiPngBase = '/fluent-emoji';
 
 export function char2twemojiFilePath(char: string): string {
-	let codes = Array.from(char).map(x => x.codePointAt(0)?.toString(16));
+	let codes = Array.from(char, x => x.codePointAt(0)?.toString(16));
 	if (!codes.includes('200d')) codes = codes.filter(x => x !== 'fe0f');
 	codes = codes.filter(x => x && x.length);
 	const fileName = codes.join('-');
@@ -10,7 +10,7 @@ export function char2twemojiFilePath(char: string): string {
 }
 
 export function char2fluentEmojiFilePath(char: string): string {
-	let codes = Array.from(char).map(x => x.codePointAt(0)?.toString(16));
+	let codes = Array.from(char, x => x.codePointAt(0)?.toString(16));
 	// Fluent Emojiは国旗非対応 https://github.com/microsoft/fluentui-emoji/issues/25
 	if (codes[0]?.startsWith('1f1')) return char2twemojiFilePath(char);
 	if (!codes.includes('200d')) codes = codes.filter(x => x !== 'fe0f');

packages/frontend/src/scripts/select-file.ts

@@ -12,7 +12,8 @@ export function chooseFileFromPc(multiple: boolean, keepOriginal = false): Promi
 		input.type = 'file';
 		input.multiple = multiple;
 		input.onchange = () => {
-			const promises = Array.from(input.files).map(file => uploadFile(file, defaultStore.state.uploadFolder, undefined, keepOriginal));
+			if (!input.files) return res([]);
+			const promises = Array.from(input.files, file => uploadFile(file, defaultStore.state.uploadFolder, undefined, keepOriginal));
 
 			Promise.all(promises).then(driveFiles => {
 				res(driveFiles);

packages/frontend/src/style.scss

@@ -6,11 +6,13 @@
 	--marginHalf: 10px;
 
 	--margin: var(--marginFull);
-	--minBottomSpacing: 0px;
+
+	// switch dynamically
+	--minBottomSpacingMobile: calc(72px + max(12px, env(safe-area-inset-bottom, 0px)));
+	--minBottomSpacing: var(--minBottomSpacingMobile);
 
 	@media (max-width: 500px) {
 		--margin: var(--marginHalf);
-		--minBottomSpacing: calc(72px + max(12px, env(safe-area-inset-bottom, 0px)));
 	}
 
 	//--ad: rgb(255 169 0 / 10%);

packages/frontend/src/ui/universal.vue

@@ -207,9 +207,11 @@ watch($$(navFooter), () => {
 	if (navFooter) {
 		navFooterHeight = navFooter.offsetHeight;
 		document.body.style.setProperty('--stickyBottom', `${navFooterHeight}px`);
+		document.body.style.setProperty('--minBottomSpacing', 'var(--minBottomSpacingMobile)');
 	} else {
 		navFooterHeight = 0;
 		document.body.style.setProperty('--stickyBottom', '0px');
+		document.body.style.setProperty('--minBottomSpacing', '0px');
 	}
 }, {
 	immediate: true,