Merge branch 'develop' into refactor/push-notification

This reverts commit 5382dc5da8.

It turns out this sends an inccorect time info to the stream
since JavaScript's Date object doesn't have timezone info

I'll revisit this in the future

.dockerignore

@@ -51,12 +51,11 @@ title.svg
 /dev
 /docs
 /scripts
+!/scripts/copy-assets.mjs
 biome.json
-COPYING
 CODE_OF_CONDUCT.md
 CONTRIBUTING.md
 Dockerfile
-LICENSE
 Procfile
 README.md
 SECURITY.md

.gitlab-ci.yml

@@ -8,10 +8,16 @@ services:
 
 workflow:
   rules:
-    - if: $CI_PIPELINE_SOURCE == 'merge_request_event'
+    - if: $CI_PROJECT_PATH == 'firefish/firefish'
       when: always
-    - if: $CI_MERGE_REQUEST_TARGET_BRANCH_NAME == 'main'
+    - if: $CI_MERGE_REQUEST_PROJECT_PATH == 'firefish/firefish'
+      when: always
+    - if: $CI_PROJECT_PATH != 'firefish/firefish'
+      changes:
+        paths:
+          - .gitlab-ci.yml
       when: never
+    - when: never
 
 cache:
   paths:
@@ -23,6 +29,8 @@ cache:
 
 stages:
   - test
+  - build
+  - dependency
 
 variables:
   POSTGRES_DB: 'firefish_db'
@@ -36,7 +44,6 @@ variables:
 
 default:
   before_script:
-    - mkdir -p "${CARGO_HOME}"
     - apt-get update && apt-get -y upgrade
     - apt-get -y --no-install-recommends install curl
     - curl -fsSL 'https://deb.nodesource.com/setup_18.x' | bash -
@@ -48,10 +55,138 @@ default:
     - export PGPASSWORD="${POSTGRES_PASSWORD}"
     - psql --host postgres --user "${POSTGRES_USER}" --dbname "${POSTGRES_DB}" --command 'CREATE EXTENSION pgroonga'
 
-build_and_cargo_unit_test:
+build_test:
   stage: test
+  rules:
+    - if: $CI_PIPELINE_SOURCE == 'push' || $CI_PIPELINE_SOURCE == 'merge_request_event'
+      changes:
+        paths:
+          - packages/backend/*
+          - packages/backend-rs/*
+          - packages/macro-rs/*
+          - packages/megalodon/*
+          - scripts/**/*
+          - package.json
+          - pnpm-lock.yaml
+          - Cargo.toml
+          - Cargo.lock
   script:
     - pnpm install --frozen-lockfile
     - pnpm run build:debug
     - pnpm run migrate
+
+client_build_test:
+  stage: test
+  rules:
+    - if: $CI_PIPELINE_SOURCE == 'push' || $CI_PIPELINE_SOURCE == 'merge_request_event'
+      changes:
+        paths:
+          - packages/client/*
+          - packages/firefish-js/*
+          - packages/sw/*
+          - scripts/**/*
+          - locales/**/*
+          - package.json
+          - pnpm-lock.yaml
+    - if: $CI_PIPELINE_SOURCE == 'push' || $CI_PIPELINE_SOURCE == 'merge_request_event'
+      changes:
+        paths:
+          - packages/backend/*
+          - packages/backend-rs/*
+          - packages/macro-rs/*
+          - packages/megalodon/*
+          - Cargo.toml
+          - Cargo.lock
+      when: never
+  script:
+    - pnpm install --frozen-lockfile
+    - pnpm --filter 'firefish-js' --filter 'client' --filter 'sw' run build:debug
+
+container_image_build:
+  stage: build
+  image: docker.io/debian:bookworm-slim
+  services: []
+  rules:
+    - if: $CI_COMMIT_BRANCH == 'develop'
+      changes:
+        paths:
+          - packages/**/*
+          - locales/**/*
+          - scripts/copy-assets.mjs
+          - package.json
+          - pnpm-lock.yaml
+          - Cargo.toml
+          - Cargo.lock
+          - Dockerfile
+          - .dockerignore
+  before_script:
+    - apt-get update && apt-get -y upgrade
+    - apt-get install -y --no-install-recommends buildah ca-certificates fuse-overlayfs
+    - buildah login --username "${CI_REGISTRY_USER}" --password "${CI_REGISTRY_PASSWORD}" "${CI_REGISTRY}"
+    - export IMAGE_TAG="${CI_REGISTRY}/${CI_PROJECT_PATH}/develop:not-for-production"
+    - export IMAGE_CACHE="${CI_REGISTRY}/${CI_PROJECT_PATH}/develop/cache"
+  script:
+    - |-
+      buildah build \
+        --isolation chroot \
+        --device /dev/fuse:rw \
+        --security-opt seccomp=unconfined \
+        --security-opt apparmor=unconfined \
+        --cap-add all \
+        --platform linux/amd64 \
+        --layers \
+        --cache-to "${IMAGE_CACHE}" \
+        --cache-from "${IMAGE_CACHE}" \
+        --tag "${IMAGE_TAG}" \
+        .
+    - buildah inspect "${IMAGE_TAG}"
+    - buildah push "${IMAGE_TAG}"
+
+cargo_unit_test:
+  stage: test
+  rules:
+    - if: $CI_PIPELINE_SOURCE == 'merge_request_event' || $CI_COMMIT_BRANCH == 'develop'
+      changes:
+        paths:
+          - packages/backend-rs/**/*
+          - packages/macro-rs/**/*
+          - Cargo.toml
+          - Cargo.lock
+    - if: $CI_MERGE_REQUEST_TARGET_BRANCH_NAME == 'main'
+      when: never
+  script:
+    - cargo check --features napi
+    - pnpm install --frozen-lockfile
+    - mkdir packages/backend-rs/built
+    - cp packages/backend-rs/index.js packages/backend-rs/built/index.js
+    - cp packages/backend-rs/index.d.ts packages/backend-rs/built/index.d.ts
+    - pnpm --filter='!backend-rs' run build:debug
     - cargo test
+
+cargo_clippy:
+  stage: test
+  rules:
+    - if: $CI_PIPELINE_SOURCE == 'merge_request_event' || $CI_COMMIT_BRANCH == 'develop'
+      changes:
+        paths:
+          - packages/backend-rs/**/*
+          - packages/macro-rs/**/*
+          - Cargo.toml
+          - Cargo.lock
+    - if: $CI_MERGE_REQUEST_TARGET_BRANCH_NAME == 'main'
+      when: never
+  script:
+    - rustup component add clippy
+    - cargo clippy -- -D warnings
+
+renovate:
+  stage: dependency
+  image:
+    name: docker.io/renovate/renovate:37-slim
+    entrypoint: [""]
+  rules:
+    - if: $RENOVATE && $CI_PIPELINE_SOURCE == 'schedule'
+  services: []
+  before_script: []
+  script:
+    - renovate --platform gitlab --token "${API_TOKEN}" --endpoint "${CI_SERVER_URL}/api/v4" "${CI_PROJECT_PATH}"

COPYING

@@ -26,10 +26,6 @@ RsaSignature2017 implementation by Transmute Industries Inc
 License: MIT
 https://github.com/transmute-industries/RsaSignature2017/blob/master/LICENSE
 
-Machine learning model for sensitive images by Infinite Red, Inc.
-License: MIT
-https://github.com/infinitered/nsfwjs/blob/master/LICENSE
-
 Chiptune2.js by Simon Gündling
 License: MIT
 https://github.com/deskjet/chiptune2.js#license

docs/api-change.md

@@ -2,6 +2,8 @@
 
 Breaking changes are indicated by the :warning: icon.
 
+## Unreleased
+
 - Adding `lang` to the response of `i` and the request parameter of `i/update`.
 
 ## v20240504

locales/en-US.yml

@@ -2244,3 +2244,5 @@ incorrectLanguageWarning: "It looks like your post is in {detected}, but you sel
 noteEditHistory: "Post edit history"
 slashQuote: "Chain quote"
 foldNotification: "Group similar notifications"
+mergeThreadInTimeline: "Merge multiple posts in the same thread in timelines"
+mergeRenotesInTimeline: "Group multiple boosts of the same post"

locales/zh-CN.yml

@@ -2071,3 +2071,5 @@ noteEditHistory: "帖子编辑历史"
 media: 媒体
 slashQuote: "斜杠引用"
 foldNotification: "将通知按同类型分组"
+mergeThreadInTimeline: "将时间线内的连续回复合并成一串"
+mergeRenotesInTimeline: "合并同一个帖子的转发"

packages/backend/package.json

@@ -59,11 +59,11 @@
 		"form-data": "^4.0.0",
 		"got": "14.2.1",
 		"gunzip-maybe": "^1.4.2",
-		"happy-dom": "^14.7.1",
 		"hpagent": "1.2.0",
 		"ioredis": "5.4.1",
 		"ip-cidr": "4.0.0",
 		"is-svg": "5.0.0",
+		"jsdom": "24.0.0",
 		"json5": "2.2.3",
 		"jsonld": "8.3.2",
 		"jsrsasign": "11.1.0",
@@ -130,6 +130,7 @@
 		"@types/content-disposition": "^0.5.8",
 		"@types/escape-regexp": "0.0.3",
 		"@types/fluent-ffmpeg": "2.1.24",
+		"@types/jsdom": "21.1.6",
 		"@types/jsonld": "1.5.13",
 		"@types/jsrsasign": "10.5.13",
 		"@types/katex": "0.16.7",

packages/backend/src/mfm/to-html.ts

@@ -1,21 +1,17 @@
-import { type HTMLElement, Window } from "happy-dom";
+import { JSDOM } from "jsdom";
 import type * as mfm from "mfm-js";
 import katex from "katex";
 import { config } from "@/config.js";
 import { intersperse } from "@/prelude/array.js";
 import type { IMentionedRemoteUsers } from "@/models/entities/note.js";
 
-function toMathMl(code: string, displayMode: boolean): HTMLElement | null {
-	const { window } = new Window();
-	const document = window.document;
-
-	document.body.innerHTML = katex.renderToString(code, {
+function toMathMl(code: string, displayMode: boolean): MathMLElement | null {
+	const rendered = katex.renderToString(code, {
 		throwOnError: false,
 		output: "mathml",
 		displayMode,
 	});
-
-	return document.querySelector("math");
+	return JSDOM.fragment(rendered).querySelector("math");
 }
 
 export function toHtml(
@@ -26,7 +22,7 @@ export function toHtml(
 		return null;
 	}
 
-	const { window } = new Window();
+	const { window } = new JSDOM("");
 
 	const doc = window.document;
 

packages/backend/src/services/fetch-instance-metadata.ts

@@ -1,8 +1,8 @@
 import { URL } from "node:url";
-import { Window } from "happy-dom";
+import { type DOMWindow, JSDOM } from "jsdom";
 import fetch from "node-fetch";
 import tinycolor from "tinycolor2";
-import { getJson, getAgentByUrl } from "@/misc/fetch.js";
+import { getJson, getHtml, getAgentByUrl } from "@/misc/fetch.js";
 import {
 	type Instance,
 	MAX_LENGTH_INSTANCE,
@@ -112,15 +112,13 @@ export async function fetchInstanceMetadata(
 	}
 }
 
-async function fetchDom(instance: Instance): Promise<Window["document"]> {
+async function fetchDom(instance: Instance): Promise<DOMWindow["document"]> {
 	logger.info(`Fetching HTML of ${instance.host} ...`);
 
-	const window = new Window({
-		url: `https://${instance.host}`,
-	});
-	const doc = window.document;
+	const html = await getHtml(`https://${instance.host}`);
+	const { window } = new JSDOM(html);
 
-	return doc;
+	return window.document;
 }
 
 async function fetchManifest(
@@ -137,7 +135,7 @@ async function fetchManifest(
 
 async function fetchFaviconUrl(
 	instance: Instance,
-	doc: Window["document"] | null,
+	doc: DOMWindow["document"] | null,
 ): Promise<string | null> {
 	const url = `https://${instance.host}`;
 
@@ -169,7 +167,7 @@ async function fetchFaviconUrl(
 
 async function fetchIconUrl(
 	instance: Instance,
-	doc: Window["document"] | null,
+	doc: DOMWindow["document"] | null,
 	manifest: Record<string, any> | null,
 ): Promise<string | null> {
 	if (manifest?.icons && manifest.icons.length > 0 && manifest.icons[0].src) {
@@ -219,9 +217,9 @@ async function getThemeColor(
 
 async function getSiteName(
 	info: Nodeinfo | null,
-	doc: Window["document"] | null,
+	doc: DOMWindow["document"] | null,
 	manifest: Record<string, any> | null,
-): Promise<string | undefined | null> {
+): Promise<string | null> {
 	if (info?.metadata) {
 		if (info.metadata.nodeName || info.metadata.name) {
 			return info.metadata.nodeName || info.metadata.name;
@@ -247,7 +245,7 @@ async function getSiteName(
 
 async function getDescription(
 	info: Nodeinfo | null,
-	doc: Window["document"] | null,
+	doc: DOMWindow["document"] | null,
 	manifest: Record<string, any> | null,
 ): Promise<string | null> {
 	if (info?.metadata) {

packages/backend/src/services/fetch-rel-me.ts

@@ -1,12 +1,11 @@
-import { Window } from "happy-dom";
-import type { HTMLAnchorElement, HTMLLinkElement } from "happy-dom";
+import { JSDOM } from "jsdom";
 import { config } from "@/config.js";
+import { getHtml } from "@/misc/fetch.js";
 
 async function getRelMeLinks(url: string): Promise<string[]> {
 	try {
-		const dom = new Window({
-			url: url,
-		});
+		const html = await getHtml(url);
+		const dom = new JSDOM(html);
 		const allLinks = [...dom.window.document.querySelectorAll("a, link")];
 		const relMeLinks = allLinks
 			.filter((a) => {

packages/client/src/components/MkMediaList.vue

@@ -40,7 +40,7 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, ref } from "vue";
+import { computed, onMounted, ref } from "vue";
 import type { entities } from "firefish-js";
 import PhotoSwipeLightbox from "photoswipe/lightbox";
 import PhotoSwipe from "photoswipe";
@@ -207,9 +207,9 @@ const isModule = (file: entities.DriveFile): boolean => {
 	);
 };
 
-const previewableCount = props.mediaList.filter((media) =>
-	previewable(media),
-).length;
+const previewableCount = computed(
+	() => props.mediaList.filter((media) => previewable(media)).length,
+);
 </script>
 
 <style lang="scss" scoped>

packages/client/src/components/MkNote.vue

@@ -1,7 +1,7 @@
 <template>
 	<div
 		v-if="!muted.muted"
-		v-show="!isDeleted"
+		v-show="!isDeleted && renotes?.length !== 0"
 		:id="appearNote.historyId || appearNote.id"
 		ref="el"
 		v-hotkey="keymap"
@@ -10,13 +10,20 @@
 		:aria-label="accessibleLabel"
 		class="tkcbzcuz note-container"
 		:tabindex="!isDeleted ? '-1' : undefined"
-		:class="{ renote: isRenote }"
+		:class="{ renote: isRenote || (renotesSliced && renotesSliced.length > 0) }"
 	>
 		<MkNoteSub
-			v-if="appearNote.reply && !detailedView && !collapsedReply"
+			v-if="appearNote.reply && !detailedView && !collapsedReply && !parents"
 			:note="appearNote.reply"
 			class="reply-to"
 		/>
+		<MkNoteSub
+			v-else-if="!detailedView && !collapsedReply && parents"
+			v-for="n of parents"
+			:key="n.id"
+			:note="n"
+			class="reply-to"
+		/>
 		<div
 			v-if="!detailedView"
 			class="note-context"
@@ -41,35 +48,6 @@
 			<div v-if="pinned" class="info">
 				<i :class="icon('ph-push-pin')"></i>{{ i18n.ts.pinnedNote }}
 			</div>
-			<div v-if="isRenote" class="renote">
-				<i :class="icon('ph-rocket-launch')"></i>
-				<I18n :src="i18n.ts.renotedBy" tag="span">
-					<template #user>
-						<MkA
-							v-user-preview="note.userId"
-							class="name"
-							:to="userPage(note.user)"
-							@click.stop
-						>
-							<MkUserName :user="note.user" />
-						</MkA>
-					</template>
-				</I18n>
-				<div class="info">
-					<button
-						ref="renoteTime"
-						class="_button time"
-						@click.stop="showRenoteMenu()"
-					>
-						<i
-							v-if="isMyRenote"
-							:class="icon('ph-dots-three-outline dropdownIcon')"
-						></i>
-						<MkTime :time="note.createdAt" />
-					</button>
-					<MkVisibility :note="note" />
-				</div>
-			</div>
 			<div v-if="collapsedReply && appearNote.reply" class="info">
 				<MkAvatar class="avatar" :user="appearNote.reply.user" />
 				<MkUserName
@@ -85,6 +63,71 @@
 					:custom-emojis="note.emojis"
 				/>
 			</div>
+			<div v-if="isRenote || (renotesSliced && renotesSliced.length > 0)" class="renote">
+				<i :class="icon('ph-rocket-launch')"></i>
+				<I18n
+					v-if="renotesSliced == null"
+					:src="i18n.ts.renotedBy"
+					tag="span"
+				>
+					<template #user>
+						<MkAvatar class="avatar" :user="note.user" />
+						<MkA
+							v-user-preview="note.userId"
+							class="name"
+							:to="userPage(note.user)"
+							@click.stop
+						>
+							<MkUserName :user="note.user" />
+						</MkA>
+					</template>
+				</I18n>
+				<I18n
+					v-else
+					:src="i18n.ts.renotedBy"
+					tag="span"
+				>
+					<template #user>
+						<template
+							v-for="(renote, index) in renotesSliced"
+						>
+							<MkAvatar
+								class="avatar"
+								:user="renote.user"
+							/>
+							<MkA
+								v-user-preview="renote.userId"
+								class="name"
+								:to="userPage(renote.user)"
+								@click.stop
+							>
+								<MkUserName :user="renote.user" />
+							</MkA>
+							{{
+								index !== renotesSliced.length - 1
+									? ", "
+									: renotesSliced.length < renotes!.length
+										? "..."
+										: ""
+							}}
+						</template>
+					</template>
+				</I18n>
+				<div class="info">
+					<button
+						ref="renoteTime"
+						class="_button time"
+						@click.stop="showRenoteMenu()"
+					>
+						<i
+							v-if="isMyNote"
+							:class="icon('ph-dots-three-outline dropdownIcon')"
+						></i>
+						<MkTime :time="note.createdAt" />
+					</button>
+					<MkVisibility :note="note" />
+				</div>
+			</div>
 		</div>
 		<article
 			class="article"
@@ -279,7 +322,7 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, inject, onMounted, ref } from "vue";
+import { computed, inject, onMounted, ref, watch } from "vue";
 import type { Ref } from "vue";
 import type { entities } from "firefish-js";
 import MkSubNoteContent from "./MkSubNoteContent.vue";
@@ -310,17 +353,13 @@ import { notePage } from "@/filters/note";
 import { deepClone } from "@/scripts/clone";
 import { getNoteSummary } from "@/scripts/get-note-summary";
 import icon from "@/scripts/icon";
-import type { NoteTranslation } from "@/types/note";
-
-const router = useRouter();
-
-type NoteType = entities.Note & {
-	_featuredId_?: string;
-	_prId_?: string;
-};
+import type { NoteTranslation, NoteType } from "@/types/note";
+import { isRenote as _isRenote, isDeleted as _isDeleted } from "@/scripts/note";
 
 const props = defineProps<{
 	note: NoteType;
+	parents?: NoteType[];
+	renotes?: entities.Note[];
 	pinned?: boolean;
 	detailedView?: boolean;
 	collapsedReply?: boolean;
@@ -329,37 +368,20 @@ const props = defineProps<{
 	isLongJudger?: (note: entities.Note) => boolean;
 }>();
 
+//#region Constants
+const router = useRouter();
 const inChannel = inject("inChannel", null);
-
-const note = ref(deepClone(props.note));
-
-const softMuteReasonI18nSrc = (what?: string) => {
-	if (what === "note") return i18n.ts.userSaysSomethingReason;
-	if (what === "reply") return i18n.ts.userSaysSomethingReasonReply;
-	if (what === "renote") return i18n.ts.userSaysSomethingReasonRenote;
-	if (what === "quote") return i18n.ts.userSaysSomethingReasonQuote;
-
-	// I don't think here is reachable, but just in case
-	return i18n.ts.userSaysSomething;
+const keymap = {
+	r: () => reply(true),
+	"e|a|plus": () => react(true),
+	q: () => renoteButton.value!.renote(true),
+	"up|k": focusBefore,
+	"down|j": focusAfter,
+	esc: blur,
+	"m|o": () => menu(true),
+	// FIXME: What's this?
+	// s: () => showContent.value !== showContent.value,
 };
-
-// plugin
-if (noteViewInterruptors.length > 0) {
-	onMounted(async () => {
-		let result = deepClone(note.value);
-		for (const interruptor of noteViewInterruptors) {
-			result = await interruptor.handler(result);
-		}
-		note.value = result;
-	});
-}
-
-const isRenote =
-	note.value.renote != null &&
-	note.value.text == null &&
-	note.value.fileIds.length === 0 &&
-	note.value.poll == null;
-
 const el = ref<HTMLElement | null>(null);
 const footerEl = ref<HTMLElement>();
 const menuButton = ref<HTMLElement>();
@@ -367,42 +389,179 @@ const starButton = ref<InstanceType<typeof XStarButton>>();
 const renoteButton = ref<InstanceType<typeof XRenoteButton> | null>(null);
 const renoteTime = ref<HTMLElement>();
 const reactButton = ref<HTMLElement | null>(null);
-const appearNote = computed(() =>
-	isRenote ? (note.value.renote as NoteType) : note.value,
-);
-const isMyRenote = isSignedIn(me) && me.id === note.value.userId;
-// const showContent = ref(false);
-const isDeleted = ref(false);
-const muted = ref(
-	getWordSoftMute(
-		note.value,
-		me?.id,
-		defaultStore.state.mutedWords,
-		defaultStore.state.mutedLangs,
-	),
-);
-const translation = ref<NoteTranslation | null>(null);
-const translating = ref(false);
-const enableEmojiReactions = defaultStore.state.enableEmojiReactions;
-const expandOnNoteClick = defaultStore.state.expandOnNoteClick;
+const enableEmojiReactions = defaultStore.reactiveState.enableEmojiReactions;
+const expandOnNoteClick = defaultStore.reactiveState.expandOnNoteClick;
 const lang = localStorage.getItem("lang");
 const translateLang = localStorage.getItem("translateLang");
 const targetLang = (translateLang || lang || navigator.language)?.slice(0, 2);
+const currentClipPage = inject<Ref<entities.Clip> | null>(
+	"currentClipPage",
+	null,
+);
+//#endregion
 
-const isForeignLanguage: boolean =
-	defaultStore.state.detectPostLanguage &&
-	appearNote.value.text != null &&
-	(() => {
-		const postLang = detectLanguage(appearNote.value.text);
-		return postLang !== "" && postLang !== targetLang;
-	})();
+//#region Variables bound to Notes
+let capture: ReturnType<typeof useNoteCapture> | undefined;
+const note = ref(deepClone(props.note));
+const postIsExpanded = ref(false);
+const translation = ref<NoteTranslation | null>(null);
+const translating = ref(false);
+const isDeleted = ref(false);
+const renotes = ref(props.renotes?.filter((rn) => !_isDeleted(rn.id)));
+//#endregion
 
+//#region computed
+
+const renotesSliced = computed(() => renotes.value?.slice(0, 5));
+
+const isRenote = computed(() => _isRenote(note.value));
+const appearNote = computed(() =>
+	isRenote.value ? (note.value.renote as NoteType) : note.value,
+);
+const isMyNote = computed(
+	() => isSignedIn(me) && me.id === note.value.userId && props.renotes == null,
+);
+const muted = computed(() =>
+	getWordSoftMute(
+		note.value,
+		me?.id,
+		defaultStore.reactiveState.mutedWords.value,
+		defaultStore.reactiveState.mutedLangs.value,
+	),
+);
+const isForeignLanguage = computed(
+	() =>
+		defaultStore.state.detectPostLanguage &&
+		appearNote.value.text != null &&
+		(() => {
+			const postLang = detectLanguage(appearNote.value.text);
+			return postLang !== "" && postLang !== targetLang;
+		})(),
+);
 const reactionCount = computed(() =>
 	Object.values(appearNote.value.reactions).reduce(
 		(partialSum, val) => partialSum + val,
 		0,
 	),
 );
+const accessibleLabel = computed(() => {
+	let label = `${appearNote.value.user.username}; `;
+	if (appearNote.value.renote) {
+		label += `${i18n.ts.renoted} ${appearNote.value.renote.user.username}; `;
+		if (appearNote.value.renote.cw) {
+			label += `${i18n.ts.cw}: ${appearNote.value.renote.cw}; `;
+			if (postIsExpanded.value) {
+				label += `${appearNote.value.renote.text}; `;
+			}
+		} else {
+			label += `${appearNote.value.renote.text}; `;
+		}
+	} else {
+		if (appearNote.value.cw) {
+			label += `${i18n.ts.cw}: ${appearNote.value.cw}; `;
+			if (postIsExpanded.value) {
+				label += `${appearNote.value.text}; `;
+			}
+		} else {
+			label += `${appearNote.value.text}; `;
+		}
+	}
+	const date = new Date(appearNote.value.createdAt);
+	label += `${date.toLocaleTimeString()}`;
+	return label;
+});
+//#endregion
+
+async function pluginInit(newNote: NoteType) {
+	// plugin
+	if (noteViewInterruptors.length > 0) {
+		let result = deepClone(newNote);
+		for (const interruptor of noteViewInterruptors) {
+			result = await interruptor.handler(result);
+		}
+		note.value = result;
+	}
+}
+
+function recalculateRenotes() {
+	renotes.value = props.renotes?.filter((rn) => !_isDeleted(rn.id));
+}
+
+async function init(newNote: NoteType, first = false) {
+	if (!first) {
+		// plugin
+		if (noteViewInterruptors.length > 0) {
+			await pluginInit(newNote);
+		} else {
+			note.value = deepClone(newNote);
+		}
+	}
+
+	translation.value = null;
+	translating.value = false;
+	postIsExpanded.value = false;
+	isDeleted.value = _isDeleted(note.value.id);
+	if (appearNote.value.historyId == null) {
+		capture?.close();
+		capture = useNoteCapture({
+			rootEl: el,
+			note: appearNote,
+			isDeletedRef: isDeleted,
+		});
+		if (isRenote.value === true) {
+			useNoteCapture({
+				rootEl: el,
+				note,
+				isDeletedRef: isDeleted,
+			});
+		}
+		if (props.renotes) {
+			const renoteDeletedTrigger = ref(false);
+			for (const renote of props.renotes) {
+				useNoteCapture({
+					rootEl: el,
+					note: ref(renote),
+					isDeletedRef: renoteDeletedTrigger,
+				});
+			}
+			watch(renoteDeletedTrigger, recalculateRenotes);
+		}
+	}
+}
+
+init(props.note, true);
+
+onMounted(() => {
+	pluginInit(note.value);
+});
+
+watch(isDeleted, () => {
+	if (isDeleted.value === true) {
+		if (props.parents && props.parents.length > 0) {
+			let noteTakePlace: NoteType | null = null;
+			while (noteTakePlace == null || _isDeleted(noteTakePlace.id)) {
+				if (props.parents.length === 0) {
+					return;
+				}
+				noteTakePlace = props.parents[props.parents.length - 1];
+				props.parents.pop();
+			}
+			noteTakePlace.repliesCount -= 1;
+			init(noteTakePlace);
+			isDeleted.value = false;
+		}
+	}
+});
+
+watch(
+	() => props.note.id,
+	(o, n) => {
+		if (o !== n && _isDeleted(note.value.id) !== true) {
+			init(props.note);
+		}
+	},
+);
+watch(() => props.renotes?.length, recalculateRenotes);
 
 async function translate_(noteId: string, targetLang: string) {
 	return await os.api("notes/translate", {
@@ -431,24 +590,14 @@ async function translate() {
 	translating.value = false;
 }
 
-const keymap = {
-	r: () => reply(true),
-	"e|a|plus": () => react(true),
-	q: () => renoteButton.value!.renote(true),
-	"up|k": focusBefore,
-	"down|j": focusAfter,
-	esc: blur,
-	"m|o": () => menu(true),
-	// FIXME: What's this?
-	// s: () => showContent.value !== showContent.value,
-};
+function softMuteReasonI18nSrc(what?: string) {
+	if (what === "note") return i18n.ts.userSaysSomethingReason;
+	if (what === "reply") return i18n.ts.userSaysSomethingReasonReply;
+	if (what === "renote") return i18n.ts.userSaysSomethingReasonRenote;
+	if (what === "quote") return i18n.ts.userSaysSomethingReasonQuote;
 
-if (appearNote.value.historyId == null) {
-	useNoteCapture({
-		rootEl: el,
-		note: appearNote,
-		isDeletedRef: isDeleted,
-	});
+	// I don't think here is reachable, but just in case
+	return i18n.ts.userSaysSomething;
 }
 
 function reply(_viaKeyboard = false): void {
@@ -489,11 +638,6 @@ function undoReact(note: NoteType): void {
 	});
 }
 
-const currentClipPage = inject<Ref<entities.Clip> | null>(
-	"currentClipPage",
-	null,
-);
-
 function onContextmenu(ev: MouseEvent): void {
 	const isLink = (el: HTMLElement): boolean => {
 		if (el.tagName === "A") return true;
@@ -582,7 +726,7 @@ function menu(viaKeyboard = false): void {
 }
 
 function showRenoteMenu(viaKeyboard = false): void {
-	if (!isMyRenote) return;
+	if (!isMyNote.value) return;
 	os.popupMenu(
 		[
 			{
@@ -643,39 +787,10 @@ function readPromo() {
 	isDeleted.value = true;
 }
 
-const postIsExpanded = ref(false);
-
 function setPostExpanded(val: boolean) {
 	postIsExpanded.value = val;
 }
 
-const accessibleLabel = computed(() => {
-	let label = `${appearNote.value.user.username}; `;
-	if (appearNote.value.renote) {
-		label += `${i18n.ts.renoted} ${appearNote.value.renote.user.username}; `;
-		if (appearNote.value.renote.cw) {
-			label += `${i18n.ts.cw}: ${appearNote.value.renote.cw}; `;
-			if (postIsExpanded.value) {
-				label += `${appearNote.value.renote.text}; `;
-			}
-		} else {
-			label += `${appearNote.value.renote.text}; `;
-		}
-	} else {
-		if (appearNote.value.cw) {
-			label += `${i18n.ts.cw}: ${appearNote.value.cw}; `;
-			if (postIsExpanded.value) {
-				label += `${appearNote.value.text}; `;
-			}
-		} else {
-			label += `${appearNote.value.text}; `;
-		}
-	}
-	const date = new Date(appearNote.value.createdAt);
-	label += `${date.toLocaleTimeString()}`;
-	return label;
-});
-
 defineExpose({
 	focus,
 	blur,
@@ -749,6 +864,7 @@ defineExpose({
 		position: relative;
 		padding: 0 32px 0 32px;
 		display: flex;
+		flex-wrap: wrap;
 		z-index: 1;
 		&:first-child {
 			margin-top: 20px;
@@ -801,6 +917,16 @@ defineExpose({
 				margin-right: 4px;
 			}
 
+			.avatar {
+				width: 1.2em;
+				height: 1.2em;
+				border-radius: 2em;
+				overflow: hidden;
+				margin-right: 0.4em;
+				background: var(--panelHighlight);
+				transform: translateY(-4px);
+			}
+
 			> span {
 				overflow: hidden;
 				flex-shrink: 1;

packages/client/src/components/MkNoteHeader.vue

@@ -48,8 +48,6 @@
 </template>
 
 <script lang="ts" setup>
-import { ref } from "vue";
-
 import type { entities } from "firefish-js";
 import { defaultStore } from "@/store";
 import MkVisibility from "@/components/MkVisibility.vue";
@@ -66,18 +64,16 @@ const props = defineProps<{
 	canOpenServerInfo?: boolean;
 }>();
 
-const note = ref(props.note);
-
 const showTicker =
 	defaultStore.state.instanceTicker === "always" ||
-	(defaultStore.state.instanceTicker === "remote" && note.value.user.instance);
+	(defaultStore.state.instanceTicker === "remote" && props.note.user.instance);
 
 function openServerInfo() {
 	if (!props.canOpenServerInfo || !defaultStore.state.openServerInfo) return;
 	const instanceInfoUrl =
-		note.value.user.host == null
+		props.note.user.host == null
 			? "/about"
-			: `/instance-info/${note.value.user.host}`;
+			: `/instance-info/${props.note.user.host}`;
 	pageWindow(instanceInfoUrl);
 }
 </script>

packages/client/src/components/MkNoteSimple.vue

@@ -1,5 +1,10 @@
 <template>
-	<div v-size="{ min: [350, 500] }" class="yohlumlk">
+	<div
+		v-show="!deleted"
+		v-size="{ min: [350, 500] }"
+		class="yohlumlk"
+		ref="el"
+	>
 		<MkAvatar class="avatar" :user="note.user" />
 		<div class="main">
 			<XNoteHeader class="header" :note="note" :mini="true" />
@@ -14,11 +19,40 @@
 import type { entities } from "firefish-js";
 import XNoteHeader from "@/components/MkNoteHeader.vue";
 import MkSubNoteContent from "@/components/MkSubNoteContent.vue";
+import { computed, ref, watch } from "vue";
+import { deepClone } from "@/scripts/clone";
+import { useNoteCapture } from "@/scripts/use-note-capture";
+import { isDeleted } from "@/scripts/note";
 
-defineProps<{
+const props = defineProps<{
 	note: entities.Note;
 	pinned?: boolean;
 }>();
+
+const rootEl = ref<HTMLElement | null>(null);
+const note = ref(deepClone(props.note));
+const deleted = computed(() => isDeleted(note.value.id));
+let capture = useNoteCapture({
+	note,
+	rootEl,
+});
+
+function reload() {
+	note.value = deepClone(props.note);
+	capture.close();
+	capture = useNoteCapture({
+		note,
+		rootEl,
+	});
+}
+
+watch(
+	() => props.note.id,
+	(o, n) => {
+		if (o === n) return;
+		reload();
+	},
+);
 </script>
 
 <style lang="scss" scoped>

packages/client/src/components/MkNotes.vue

@@ -3,6 +3,7 @@
 		ref="pagingComponent"
 		:pagination="pagination"
 		:disable-auto-load="disableAutoLoad"
+		:folder
 	>
 		<template #empty>
 			<div class="_fullinfo">
@@ -15,7 +16,7 @@
 			</div>
 		</template>
 
-		<template #default="{ items: notes }">
+		<template #default="{ foldedItems: notes }">
 			<div ref="tlEl" class="giivymft" :class="{ noGap }">
 				<XList
 					ref="notes"
@@ -28,6 +29,21 @@
 					class="notes"
 				>
 					<XNote
+						v-if="'folded' in note && note.folded === 'thread'"
+						:key="note.id"
+						class="qtqtichx"
+						:note="note.note"
+						:parents="note.parents"
+					/>
+					<XNote
+						v-else-if="'folded' in note && note.folded === 'renote'"
+						:key="note.key"
+						class="qtqtichx"
+						:note="note.note"
+						:renotes="note.renotesArr"
+					/>
+					<XNote
+						v-else
 						:key="note._featuredId_ || note._prId_ || note.id"
 						class="qtqtichx"
 						:note="note"
@@ -51,14 +67,21 @@ import XList from "@/components/MkDateSeparatedList.vue";
 import MkPagination from "@/components/MkPagination.vue";
 import { i18n } from "@/i18n";
 import { scroll } from "@/scripts/scroll";
+import type { NoteFolded, NoteThread, NoteType } from "@/types/note";
 
 const tlEl = ref<HTMLElement>();
 
-defineProps<{
-	pagination: PagingOf<entities.Note>;
-	noGap?: boolean;
-	disableAutoLoad?: boolean;
-}>();
+withDefaults(
+	defineProps<{
+		pagination: PagingOf<entities.Note>;
+		noGap?: boolean;
+		disableAutoLoad?: boolean;
+		folder?: (ns: entities.Note[]) => (NoteType | NoteThread | NoteFolded)[];
+	}>(),
+	{
+		folder: (ns: entities.Note[]) => ns,
+	},
+);
 
 const pagingComponent = ref<MkPaginationType<
 	PagingKeyOf<entities.Note>

packages/client/src/components/MkNotifications.vue

@@ -79,29 +79,35 @@ const stream = useStream();
 
 const pagingComponent = ref<MkPaginationType<"i/notifications"> | null>(null);
 
-const shouldFold = defaultStore.state.foldNotification;
+const shouldFold = defaultStore.reactiveState.foldNotification;
+
+const convertNotification = computed(() =>
+	shouldFold.value ? foldNotifications : (ns: entities.Notification[]) => ns,
+);
 
 const FETCH_LIMIT = 90;
 
-const pagination = Object.assign(
-	{
-		endpoint: "i/notifications" as const,
-		params: computed(() => ({
-			includeTypes: props.includeTypes ?? undefined,
-			excludeTypes: props.includeTypes
-				? undefined
-				: me?.mutingNotificationTypes,
-			unreadOnly: props.unreadOnly,
-		})),
-	},
-	shouldFold
-		? {
-				limit: 50,
-				secondFetchLimit: FETCH_LIMIT,
-			}
-		: {
-				limit: 30,
-			},
+const pagination = computed(() =>
+	Object.assign(
+		{
+			endpoint: "i/notifications" as const,
+			params: computed(() => ({
+				includeTypes: props.includeTypes ?? undefined,
+				excludeTypes: props.includeTypes
+					? undefined
+					: me?.mutingNotificationTypes,
+				unreadOnly: props.unreadOnly,
+			})),
+		},
+		shouldFold.value
+			? {
+					limit: 50,
+					secondFetchLimit: FETCH_LIMIT,
+				}
+			: {
+					limit: 30,
+				},
+	),
 );
 
 function isNoteNotification(
@@ -138,14 +144,6 @@ const onNotification = (notification: entities.Notification) => {
 
 let connection: StreamTypes.ChannelOf<"main"> | undefined;
 
-function convertNotification(ns: entities.Notification[]) {
-	if (shouldFold) {
-		return foldNotifications(ns);
-	} else {
-		return ns;
-	}
-}
-
 onMounted(() => {
 	connection = stream.useChannel("main");
 	connection.on("notification", onNotification);

packages/client/src/components/MkPagination.vue

@@ -365,9 +365,9 @@ async function fetch(firstFetching?: boolean) {
 						}
 
 						// biome-ignore lint/style/noParameterAssign: assign it intentially
-						res = res.filter((item) => {
-							if (idMap.has(item)) return false;
-							idMap.set(item, true);
+						res = res.filter((it) => {
+							if (idMap.has(it.id)) return false;
+							idMap.set(it.id, true);
 							return true;
 						});
 					}
@@ -435,8 +435,20 @@ const prepend = (...item: Item[]): void => {
 	}
 };
 
-const append = (...items: Item[]): void => {
-	appended.value.push(...items);
+const append = (...it: Item[]): void => {
+	// If there are too many appended, merge them into arrItems
+	if (
+		appended.value.length >
+		(props.pagination.secondFetchLimit || SECOND_FETCH_LIMIT_DEFAULT)
+	) {
+		for (const item of appended.value) {
+			idMap.set(item.id, true);
+		}
+		arrItems.value.push(appended.value);
+		appended.value = [];
+		// We don't need to calculate here because it won't cause any changes in items
+	}
+	appended.value.push(...it);
 	calculateItems();
 };
 
@@ -486,6 +498,8 @@ if (props.pagination.params && isRef<Param>(props.pagination.params)) {
 	watch(props.pagination.params, reload, { deep: true });
 }
 
+watch(() => props.folder, calculateItems);
+
 watch(
 	queue,
 	(a, b) => {

packages/client/src/components/MkSubNoteContent.vue

@@ -178,7 +178,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref } from "vue";
+import { computed, ref, watch } from "vue";
 import type { entities } from "firefish-js";
 import * as mfm from "mfm-js";
 import * as os from "@/os";
@@ -226,24 +226,35 @@ const emit = defineEmits<{
 const cwButton = ref<HTMLElement>();
 const showMoreButton = ref<HTMLElement>();
 
-const isLong =
-	!props.detailedView &&
-	props.note.cw == null &&
-	props.isLongJudger(props.note);
-const collapsed = ref(props.note.cw == null && isLong);
-const urls = props.note.text
-	? extractUrlFromMfm(mfm.parse(props.note.text)).slice(0, 5)
-	: null;
-
-const showContent = ref(false);
-
-const mfms = props.note.text
-	? extractMfmWithAnimation(mfm.parse(props.note.text))
-	: null;
-
-const hasMfm = ref(mfms && mfms.length > 0);
+const isLong = computed(
+	() =>
+		!props.detailedView &&
+		props.note.cw == null &&
+		props.isLongJudger(props.note),
+);
+const urls = computed(() =>
+	props.note.text
+		? extractUrlFromMfm(mfm.parse(props.note.text)).slice(0, 5)
+		: null,
+);
+const mfms = computed(() =>
+	props.note.text ? extractMfmWithAnimation(mfm.parse(props.note.text)) : null,
+);
+const hasMfm = computed(() => mfms.value && mfms.value.length > 0);
 
 const disableMfm = ref(defaultStore.state.animatedMfm);
+const showContent = ref(false);
+const collapsed = ref(props.note.cw == null && isLong.value);
+
+watch(
+	() => props.note.id,
+	(o, n) => {
+		if (o !== n) return;
+		disableMfm.value = defaultStore.state.animatedMfm;
+		showContent.value = false;
+		collapsed.value = props.note.cw == null && isLong.value;
+	},
+);
 
 async function toggleMfm() {
 	if (disableMfm.value) {

packages/client/src/components/MkTimeline.vue

@@ -30,6 +30,7 @@
 			:pagination="pagination"
 			@queue="(x) => (queue = x)"
 			@status="pullToRefreshComponent?.setDisabled($event)"
+			:folder
 		/>
 	</MkPullToRefresh>
 	<XNotes
@@ -39,6 +40,7 @@
 		:pagination="pagination"
 		@queue="(x) => (queue = x)"
 		@status="pullToRefreshComponent?.setDisabled($event)"
+		:folder
 	/>
 </template>
 
@@ -54,6 +56,8 @@ import { isSignedIn, me } from "@/me";
 import { i18n } from "@/i18n";
 import { defaultStore } from "@/store";
 import icon from "@/scripts/icon";
+import { foldNotes } from "@/scripts/fold";
+import type { NoteType } from "@/types/note";
 
 export type TimelineSource =
 	| "antenna"
@@ -85,6 +89,12 @@ const emit = defineEmits<{
 const tlComponent = ref<InstanceType<typeof XNotes>>();
 const pullToRefreshComponent = ref<InstanceType<typeof MkPullToRefresh>>();
 
+const folder = computed(() => {
+	const mergeThread = defaultStore.reactiveState.mergeThreadInTimeline.value;
+	const mergeRenotes = defaultStore.reactiveState.mergeRenotesInTimeline.value;
+	return (ns: NoteType[]) => foldNotes(ns, mergeThread, mergeRenotes);
+});
+
 let endpoint: TypeUtils.EndpointsOf<entities.Note[]>; // keyof Endpoints
 let query: {
 	antennaId?: string | undefined;

packages/client/src/components/global/MkTime.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, onMounted, onUnmounted, ref } from "vue";
+import { computed, onMounted, onUnmounted, ref, watch } from "vue";
 import { i18n } from "@/i18n";
 import { dateTimeFormat } from "@/scripts/intl-const";
 
@@ -25,7 +25,7 @@ const props = withDefaults(
 	},
 );
 
-const _time =
+const _time = computed(() =>
 	props.time == null
 		? Number.NaN
 		: typeof props.time === "number"
@@ -33,16 +33,19 @@ const _time =
 			: (props.time instanceof Date
 					? props.time
 					: new Date(props.time)
-				).getTime();
-const invalid = Number.isNaN(_time);
-const absolute = !invalid ? dateTimeFormat.format(_time) : i18n.ts._ago.invalid;
+				).getTime(),
+);
+const invalid = computed(() => Number.isNaN(_time.value));
+const absolute = computed(() =>
+	!invalid.value ? dateTimeFormat.format(_time.value) : i18n.ts._ago.invalid,
+);
 
 const now = ref(props.origin?.getTime() ?? Date.now());
 const relative = computed<string>(() => {
 	if (props.mode === "absolute") return ""; // absoluteではrelativeを使わないので計算しない
-	if (invalid) return i18n.ts._ago.invalid;
+	if (invalid.value) return i18n.ts._ago.invalid;
 
-	const ago = (now.value - _time) / 1000; /* ms */
+	const ago = (now.value - _time.value) / 1000; /* ms */
 	return ago >= 31536000
 		? i18n.t("_ago.yearsAgo", { n: Math.floor(ago / 31536000).toString() })
 		: ago >= 2592000
@@ -74,15 +77,25 @@ const relative = computed<string>(() => {
 									: i18n.ts._ago.future;
 });
 
-let tickId: number;
+let tickId: number | undefined;
 
 function tick() {
+	if (
+		invalid.value ||
+		props.origin ||
+		(props.mode !== "relative" && props.mode !== "detail")
+	) {
+		if (tickId) window.clearInterval(tickId);
+		tickId = undefined;
+		return;
+	}
+
 	const _now = Date.now();
-	const agoPrev = (now.value - _time) / 1000; /* ms */ // 現状のinterval
+	const agoPrev = (now.value - _time.value) / 1000; /* ms */ // 現状のinterval
 
 	now.value = _now;
 
-	const ago = (now.value - _time) / 1000; /* ms */ // 次のinterval
+	const ago = (now.value - _time.value) / 1000; /* ms */ // 次のinterval
 	const prev = agoPrev < 60 ? 10000 : agoPrev < 3600 ? 60000 : 180000;
 	const next = ago < 60 ? 10000 : ago < 3600 ? 60000 : 180000;
 
@@ -94,16 +107,13 @@ function tick() {
 	}
 }
 
-if (
-	!invalid &&
-	!props.origin &&
-	(props.mode === "relative" || props.mode === "detail")
-) {
-	onMounted(() => {
-		tick();
-	});
-	onUnmounted(() => {
-		if (tickId) window.clearInterval(tickId);
-	});
-}
+watch(() => props.time, tick);
+
+onMounted(() => {
+	tick();
+});
+
+onUnmounted(() => {
+	if (tickId) window.clearInterval(tickId);
+});
 </script>

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

@@ -140,6 +140,12 @@
 			<FormSwitch v-model="foldNotification" class="_formBlock">{{
 				i18n.ts.foldNotification
 			}}</FormSwitch>
+			<FormSwitch v-model="mergeThreadInTimeline" class="_formBlock">{{
+				i18n.ts.mergeThreadInTimeline
+			}}</FormSwitch>
+			<FormSwitch v-model="mergeRenotesInTimeline" class="_formBlock">{{
+				i18n.ts.mergeRenotesInTimeline
+			}}</FormSwitch>
 
 			<FormSelect v-model="serverDisconnectedBehavior" class="_formBlock">
 				<template #label>{{ i18n.ts.whenServerDisconnected }}</template>
@@ -556,6 +562,12 @@ const autocorrectNoteLanguage = computed(
 const foldNotification = computed(
 	defaultStore.makeGetterSetter("foldNotification"),
 );
+const mergeThreadInTimeline = computed(
+	defaultStore.makeGetterSetter("mergeThreadInTimeline"),
+);
+const mergeRenotesInTimeline = computed(
+	defaultStore.makeGetterSetter("mergeRenotesInTimeline"),
+);
 
 // This feature (along with injectPromo) is currently disabled
 // function onChangeInjectFeaturedNote(v) {
@@ -632,7 +644,6 @@ watch(
 		enableTimelineStreaming,
 		enablePullToRefresh,
 		pullToRefreshThreshold,
-		foldNotification,
 	],
 	async () => {
 		await reloadAsk();

packages/client/src/scripts/fold.ts

@@ -3,6 +3,9 @@ import type {
 	FoldableNotification,
 	NotificationFolded,
 } from "@/types/notification";
+import type { NoteType, NoteThread, NoteFolded } from "@/types/note";
+import { me } from "@/me";
+import { isDeleted, isRenote } from "./note";
 
 interface FoldOption {
 	/** If items length is 1, skip aggregation */
@@ -91,3 +94,94 @@ export function foldNotifications(ns: entities.Notification[]) {
 		},
 	);
 }
+
+export function foldNotes(ns: NoteType[], foldReply = true, foldRenote = true) {
+	// By the implement of MkPagination, lastId is unique and is safe for key
+	const lastId = ns[ns.length - 1]?.id ?? "prepend";
+
+	function foldReplies(ns: NoteType[]) {
+		const res: Array<NoteType | NoteThread> = [];
+		const threads = new Map<NoteType["id"], NoteType[]>();
+
+		for (const n of [...ns].reverse()) {
+			if (isDeleted(n.id)) {
+				continue;
+			}
+			if (n.replyId && threads.has(n.replyId)) {
+				const th = threads.get(n.replyId)!;
+				threads.delete(n.replyId);
+				th.push(n);
+				threads.set(n.id, th);
+			} else if (n.reply?.replyId && threads.has(n.reply.replyId)) {
+				const th = threads.get(n.reply.replyId)!;
+				threads.delete(n.reply.replyId);
+				th.push(n.reply, n);
+				threads.set(n.id, th);
+			} else {
+				threads.set(n.id, [n]);
+			}
+		}
+
+		for (const n of ns) {
+			const conversation = threads.get(n.id);
+			if (conversation == null) continue;
+
+			const first = conversation[0];
+			const last = conversation[conversation.length - 1];
+			if (conversation.length === 1) {
+				res.push(first);
+				continue;
+			}
+
+			res.push({
+				// The same note can only appear once in the timeline, so the ID will not be repeated
+				id: first.id,
+				createdAt: last.createdAt,
+				folded: "thread",
+				note: last,
+				parents: (first.reply ? [first.reply] : []).concat(
+					conversation.slice(0, -1),
+				),
+			});
+		}
+
+		return res;
+	}
+
+	let res: (NoteType | NoteThread | NoteFolded)[] = ns;
+
+	if (foldReply) {
+		res = foldReplies(ns);
+	}
+
+	if (foldRenote) {
+		res = foldItems(
+			res,
+			(n) => {
+				// never fold my renotes
+				if (!("folded" in n) && isRenote(n) && n.userId !== me?.id)
+					return `renote-${n.renoteId}`;
+				return n.id;
+			},
+			(ns, key) => {
+				const represent = ns[0];
+				if (!key.startsWith("renote-")) {
+					return represent;
+				}
+				return {
+					id: `G-${lastId}-${key}`,
+					key: `G-${lastId}-${key}`,
+					createdAt: represent.createdAt,
+					folded: "renote",
+					note: (represent as entities.Note).renote!,
+					renotesArr: ns as entities.Note[],
+				};
+			},
+			{
+				skipSingleElement: false,
+			},
+		);
+	}
+
+	return res;
+}

packages/client/src/scripts/note.ts

@@ -0,0 +1,20 @@
+import type { entities } from "firefish-js";
+import { deletedNoteIds } from "./use-note-capture";
+
+export function isRenote(note: entities.Note): note is entities.Note & {
+	renote: entities.Note;
+	text: null;
+	renoteId: string;
+	poll: undefined;
+} {
+	return (
+		note.renote != null &&
+		note.text == null &&
+		note.fileIds.length === 0 &&
+		note.poll == null
+	);
+}
+
+export function isDeleted(noteId: string) {
+	return deletedNoteIds.has(noteId);
+}

packages/client/src/scripts/use-note-capture.ts

@@ -1,22 +1,62 @@
 import type { Ref } from "vue";
-import { onUnmounted } from "vue";
-import type { entities } from "firefish-js";
+import { onUnmounted, ref } from "vue";
 import { useStream } from "@/stream";
 import { isSignedIn, me } from "@/me";
 import * as os from "@/os";
+import type { NoteType } from "@/types/note";
+
+export const deletedNoteIds = new Map<NoteType["id"], boolean>();
+
+const noteRefs = new Map<NoteType["id"], Ref<NoteType>[]>();
+
+function addToNoteRefs(note: Ref<NoteType>) {
+	const refs = noteRefs.get(note.value.id);
+	if (refs) {
+		refs.push(note);
+	} else {
+		noteRefs.set(note.value.id, [note]);
+	}
+}
+
+function eachNote(id: NoteType["id"], cb: (note: Ref<NoteType>) => void) {
+	const refs = noteRefs.get(id);
+	if (refs) {
+		for (const n of refs) {
+			// n.value.id maybe changed
+			if (n.value.id === id) {
+				cb(n);
+			}
+		}
+	}
+}
 
 export function useNoteCapture(props: {
 	rootEl: Ref<HTMLElement | null>;
-	note: Ref<entities.Note>;
-	isDeletedRef: Ref<boolean>;
-	onReplied?: (note: entities.Note) => void;
+	note: Ref<NoteType>;
+	isDeletedRef?: Ref<boolean>;
+	onReplied?: (note: NoteType) => void;
 }) {
+	let closed = false;
 	const note = props.note;
 	const connection = isSignedIn(me) ? useStream() : null;
+	addToNoteRefs(note);
+
+	function onDeleted() {
+		if (props.isDeletedRef) props.isDeletedRef.value = true;
+		deletedNoteIds.set(note.value.id, true);
+
+		if (note.value.replyId) {
+			eachNote(note.value.replyId, (n) => n.value.repliesCount--);
+		}
+		if (note.value.renoteId) {
+			eachNote(note.value.renoteId, (n) => n.value.renoteCount--);
+		}
+	}
 
 	async function onStreamNoteUpdated(noteData): Promise<void> {
 		const { type, id, body } = noteData;
 
+		if (closed) return;
 		if (id !== note.value.id) return;
 
 		switch (type) {
@@ -87,7 +127,7 @@ export function useNoteCapture(props: {
 			}
 
 			case "deleted": {
-				props.isDeletedRef.value = true;
+				onDeleted();
 				break;
 			}
 
@@ -96,17 +136,14 @@ export function useNoteCapture(props: {
 					const editedNote = await os.api("notes/show", {
 						noteId: id,
 					});
-
-					const keys = new Set<string>();
-					Object.keys(editedNote)
-						.concat(Object.keys(note.value))
-						.forEach((key) => keys.add(key));
-					keys.forEach((key) => {
+					for (const key of [
+						...new Set(Object.keys(editedNote).concat(Object.keys(note.value))),
+					]) {
 						note.value[key] = editedNote[key];
-					});
+					}
 				} catch {
 					// delete the note if failing to get the edited note
-					props.isDeletedRef.value = true;
+					onDeleted();
 				}
 				break;
 			}
@@ -147,4 +184,10 @@ export function useNoteCapture(props: {
 			connection.off("_connected_", onStreamConnected);
 		}
 	});
+
+	return {
+		close: () => {
+			closed = true;
+		},
+	};
 }

packages/client/src/store.ts

@@ -454,6 +454,14 @@ export const defaultStore = markRaw(
 			where: "deviceAccount",
 			default: true,
 		},
+		mergeThreadInTimeline: {
+			where: "deviceAccount",
+			default: true,
+		},
+		mergeRenotesInTimeline: {
+			where: "deviceAccount",
+			default: true,
+		},
 	}),
 );
 

packages/client/src/types/note.ts

@@ -1,4 +1,4 @@
-import type { noteVisibilities } from "firefish-js";
+import type { entities, noteVisibilities } from "firefish-js";
 
 export type NoteVisibility = (typeof noteVisibilities)[number] | "private";
 
@@ -6,3 +6,25 @@ export interface NoteTranslation {
 	sourceLang: string;
 	text: string;
 }
+
+export type NoteType = entities.Note & {
+	_featuredId_?: string;
+	_prId_?: string;
+};
+
+export type NoteFolded = {
+	id: string;
+	key: string;
+	createdAt: entities.Note["createdAt"];
+	folded: "renote";
+	note: entities.Note;
+	renotesArr: entities.Note[];
+};
+
+export type NoteThread = {
+	id: string;
+	createdAt: entities.Note["createdAt"];
+	folded: "thread";
+	note: entities.Note;
+	parents: entities.Note[];
+};

pnpm-lock.yaml

@@ -153,9 +153,6 @@ importers:
       gunzip-maybe:
         specifier: ^1.4.2
         version: 1.4.2
-      happy-dom:
-        specifier: ^14.7.1
-        version: 14.7.1
       hpagent:
         specifier: 1.2.0
         version: 1.2.0
@@ -168,6 +165,9 @@ importers:
       is-svg:
         specifier: 5.0.0
         version: 5.0.0
+      jsdom:
+        specifier: 24.0.0
+        version: 24.0.0
       json5:
         specifier: 2.2.3
         version: 2.2.3
@@ -365,6 +365,9 @@ importers:
       '@types/fluent-ffmpeg':
         specifier: 2.1.24
         version: 2.1.24
+      '@types/jsdom':
+        specifier: 21.1.6
+        version: 21.1.6
       '@types/jsonld':
         specifier: 1.5.13
         version: 1.5.13
@@ -4111,6 +4114,14 @@ packages:
       pretty-format: 29.7.0
     dev: true
 
+  /@types/jsdom@21.1.6:
+    resolution: {integrity: sha512-/7kkMsC+/kMs7gAYmmBR9P0vGTnOoLhQhyhQJSlXGI5bzTHp6xdo0TtKWQAsz6pmSAeVqKSbqeyP6hytqr9FDw==}
+    dependencies:
+      '@types/node': 20.12.7
+      '@types/tough-cookie': 4.0.5
+      parse5: 7.1.2
+    dev: true
+
   /@types/json-schema@7.0.12:
     resolution: {integrity: sha512-Hr5Jfhc9eYOQNPYO5WLDq/n4jqijdHNlDXjuAQkkt+mWdQR+XJToOHrsD4cPaMXpn6KO7y2+wM8AZEs8VpBLVA==}
     dev: true
@@ -4413,6 +4424,10 @@ packages:
     resolution: {integrity: sha512-chhaNf2oKHlRkDGt+tiKE2Z5aJ6qalm7Z9rlLdBwmOiAAf09YQvvoLXjWK4HWPF1xU/fqvMgfNfpVoBscA/tKA==}
     dev: true
 
+  /@types/tough-cookie@4.0.5:
+    resolution: {integrity: sha512-/Ad8+nIOV7Rl++6f1BdKxFSMgmoqEoYbHRpPcx3JEfv8VRsQe9Z4mCXeJBzxs7mbHY/XOZZuXlRNfhpVPbs6ZA==}
+    dev: true
+
   /@types/unist@2.0.7:
     resolution: {integrity: sha512-cputDpIbFgLUaGQn6Vqg3/YsJwxUwHLO13v3i5ouxT4lat0khip9AEWxtERujXV9wxIB1EyF97BSJFt6vpdI8g==}
     dev: true
@@ -5171,6 +5186,15 @@ packages:
       - supports-color
     dev: false
 
+  /agent-base@7.1.1:
+    resolution: {integrity: sha512-H0TSyFNDMomMNJQBn8wFV5YC/2eJ+VXECwOadZJT554xP6cODZHPX3H9QMQECxvrgiSOP1pHjy1sMWQVYJOUOA==}
+    engines: {node: '>= 14'}
+    dependencies:
+      debug: 4.3.4(supports-color@8.1.1)
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /ajv-keywords@3.5.2(ajv@6.12.6):
     resolution: {integrity: sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==}
     peerDependencies:
@@ -6683,6 +6707,13 @@ packages:
     hasBin: true
     dev: true
 
+  /cssstyle@4.0.1:
+    resolution: {integrity: sha512-8ZYiJ3A/3OkDd093CBT/0UKDWry7ak4BdPTFP2+QEP7cmhouyq/Up709ASSj2cK02BbZiMgk7kYjZNS4QP5qrQ==}
+    engines: {node: '>=18'}
+    dependencies:
+      rrweb-cssom: 0.6.0
+    dev: false
+
   /csstype@3.1.2:
     resolution: {integrity: sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==}
     dev: true
@@ -6714,6 +6745,14 @@ packages:
     engines: {node: '>= 12'}
     dev: false
 
+  /data-urls@5.0.0:
+    resolution: {integrity: sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==}
+    engines: {node: '>=18'}
+    dependencies:
+      whatwg-mimetype: 4.0.0
+      whatwg-url: 14.0.0
+    dev: false
+
   /date-fns@3.6.0:
     resolution: {integrity: sha512-fRHTG8g/Gif+kSh50gaGEdToemgfj74aRX3swtiouboip5JDLAyDE9F11nHMIcvOaXeOC6D7SpNhi7uFyB7Uww==}
 
@@ -6787,6 +6826,10 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
+  /decimal.js@10.4.3:
+    resolution: {integrity: sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==}
+    dev: false
+
   /decode-uri-component@0.2.2:
     resolution: {integrity: sha512-FqUYQ+8o158GyGTrMFJms9qh3CqTKvAqgqsTnkLI8sKu0028orqBhxNMFkFen0zGyg6epACD32pjVk58ngIErQ==}
     engines: {node: '>=0.10'}
@@ -8984,15 +9027,6 @@ packages:
     engines: {node: '>=0.8.0'}
     dev: true
 
-  /happy-dom@14.7.1:
-    resolution: {integrity: sha512-v60Q0evZ4clvMcrAh5/F8EdxDdfHdFrtffz/CNe10jKD+nFweZVxM91tW+UyY2L4AtpgIaXdZ7TQmiO1pfcwbg==}
-    engines: {node: '>=16.0.0'}
-    dependencies:
-      entities: 4.5.0
-      webidl-conversions: 7.0.0
-      whatwg-mimetype: 3.0.0
-    dev: false
-
   /hard-rejection@2.1.0:
     resolution: {integrity: sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA==}
     engines: {node: '>=6'}
@@ -9094,6 +9128,13 @@ packages:
     engines: {node: '>=14'}
     dev: false
 
+  /html-encoding-sniffer@4.0.0:
+    resolution: {integrity: sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==}
+    engines: {node: '>=18'}
+    dependencies:
+      whatwg-encoding: 3.1.1
+    dev: false
+
   /html-entities@2.3.2:
     resolution: {integrity: sha512-c3Ab/url5ksaT0WyleslpBEthOzWhrjQbg75y7XUsfSzi3Dgzt0l8w5e7DylRn15MTlMMD58dTfzddNS2kcAjQ==}
     dev: false
@@ -9164,6 +9205,16 @@ packages:
       toidentifier: 1.0.1
     dev: false
 
+  /http-proxy-agent@7.0.2:
+    resolution: {integrity: sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==}
+    engines: {node: '>= 14'}
+    dependencies:
+      agent-base: 7.1.1
+      debug: 4.3.4(supports-color@8.1.1)
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /http2-wrapper@1.0.3:
     resolution: {integrity: sha512-V+23sDMr12Wnz7iTcDeJr3O6AIxlnvT/bmaAAAP/Xda35C90p9599p0F1eHR/N1KILWSoWVAiOMFjBBXaXSMxg==}
     engines: {node: '>=10.19.0'}
@@ -9189,6 +9240,16 @@ packages:
       - supports-color
     dev: false
 
+  /https-proxy-agent@7.0.4:
+    resolution: {integrity: sha512-wlwpilI7YdjSkWaQ/7omYBMTliDcmCN8OLihO6I9B86g06lMyAoqgoDpV0XqoaPOKj+0DIdAvnsWfyAAhmimcg==}
+    engines: {node: '>= 14'}
+    dependencies:
+      agent-base: 7.1.1
+      debug: 4.3.4(supports-color@8.1.1)
+    transitivePeerDependencies:
+      - supports-color
+    dev: false
+
   /human-signals@2.1.0:
     resolution: {integrity: sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==}
     engines: {node: '>=10.17.0'}
@@ -9556,6 +9617,10 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: false
 
+  /is-potential-custom-element-name@1.0.1:
+    resolution: {integrity: sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==}
+    dev: false
+
   /is-promise@2.2.2:
     resolution: {integrity: sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==}
 
@@ -10325,6 +10390,42 @@ packages:
     engines: {node: '>=12.0.0'}
     dev: true
 
+  /jsdom@24.0.0:
+    resolution: {integrity: sha512-UDS2NayCvmXSXVP6mpTj+73JnNQadZlr9N68189xib2tx5Mls7swlTNao26IoHv46BZJFvXygyRtyXd1feAk1A==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      canvas: ^2.11.2
+    peerDependenciesMeta:
+      canvas:
+        optional: true
+    dependencies:
+      cssstyle: 4.0.1
+      data-urls: 5.0.0
+      decimal.js: 10.4.3
+      form-data: 4.0.0
+      html-encoding-sniffer: 4.0.0
+      http-proxy-agent: 7.0.2
+      https-proxy-agent: 7.0.4
+      is-potential-custom-element-name: 1.0.1
+      nwsapi: 2.2.9
+      parse5: 7.1.2
+      rrweb-cssom: 0.6.0
+      saxes: 6.0.0
+      symbol-tree: 3.2.4
+      tough-cookie: 4.1.4
+      w3c-xmlserializer: 5.0.0
+      webidl-conversions: 7.0.0
+      whatwg-encoding: 3.1.1
+      whatwg-mimetype: 4.0.0
+      whatwg-url: 14.0.0
+      ws: 8.16.0
+      xml-name-validator: 5.0.0
+    transitivePeerDependencies:
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+    dev: false
+
   /jsesc@0.5.0:
     resolution: {integrity: sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA==}
     hasBin: true
@@ -11510,6 +11611,10 @@ packages:
       boolbase: 1.0.0
     dev: true
 
+  /nwsapi@2.2.9:
+    resolution: {integrity: sha512-2f3F0SEEer8bBu0dsNCFF50N0cTThV1nWFYcEYFZttdW0lDAoybv9cQoK7X7/68Z89S7FoRrVjP1LPX4XRf9vg==}
+    dev: false
+
   /oauth@0.10.0:
     resolution: {integrity: sha512-1orQ9MT1vHFGQxhuy7E/0gECD3fd2fCC+PIX+/jgmU/gI3EpRocXtmtvxCO5x3WZ443FLTLFWNDjl5MPJf9u+Q==}
     dev: false
@@ -11816,7 +11921,6 @@ packages:
     resolution: {integrity: sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==}
     dependencies:
       entities: 4.5.0
-    dev: false
 
   /parseurl@1.3.3:
     resolution: {integrity: sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==}
@@ -12296,6 +12400,10 @@ packages:
     resolution: {integrity: sha512-b/YwNhb8lk1Zz2+bXXpS/LK9OisiZZ1SNsSLxN1x2OXVEhW2Ckr/7mWE5vrC1ZTiJlD9g19jWszTmJsB+oEpFQ==}
     dev: true
 
+  /psl@1.9.0:
+    resolution: {integrity: sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==}
+    dev: false
+
   /pug-attrs@3.0.0:
     resolution: {integrity: sha512-azINV9dUtzPMFQktvTXciNAfAuVh/L/JCl0vtPCwvOA21uZrC08K/UnmrL+SXGEVc1FwzjW62+xw5S/uaLj6cA==}
     dependencies:
@@ -12455,6 +12563,10 @@ packages:
     deprecated: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
     dev: false
 
+  /querystringify@2.2.0:
+    resolution: {integrity: sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==}
+    dev: false
+
   /queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
     dev: true
@@ -12691,6 +12803,10 @@ packages:
   /require-main-filename@2.0.0:
     resolution: {integrity: sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==}
 
+  /requires-port@1.0.0:
+    resolution: {integrity: sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==}
+    dev: false
+
   /resolve-alpn@1.2.1:
     resolution: {integrity: sha512-0a1F4l73/ZFZOakJnQ3FvkJ2+gSTQWz/r2KE5OdDY0TxPm5h4GkqkWWfM47T7HsbnOtcJVEF4epCVy6u7Q3K+g==}
 
@@ -12817,6 +12933,10 @@ packages:
       fsevents: 2.3.3
     dev: true
 
+  /rrweb-cssom@0.6.0:
+    resolution: {integrity: sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw==}
+    dev: false
+
   /rss-parser@3.13.0:
     resolution: {integrity: sha512-7jWUBV5yGN3rqMMj7CZufl/291QAhvrrGpDNE4k/02ZchL0npisiYYqULF71jCEKoIiHvK/Q2e6IkDwPziT7+w==}
     dependencies:
@@ -12895,6 +13015,13 @@ packages:
   /sax@1.2.4:
     resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
 
+  /saxes@6.0.0:
+    resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==}
+    engines: {node: '>=v12.22.7'}
+    dependencies:
+      xmlchars: 2.2.0
+    dev: false
+
   /schema-utils@3.3.0:
     resolution: {integrity: sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==}
     engines: {node: '>= 10.13.0'}
@@ -13500,6 +13627,10 @@ packages:
     engines: {node: '>= 4.7.0'}
     dev: true
 
+  /symbol-tree@3.2.4:
+    resolution: {integrity: sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==}
+    dev: false
+
   /synckit@0.6.2:
     resolution: {integrity: sha512-Vhf+bUa//YSTYKseDiiEuQmhGCoIF3CVBhunm3r/DQnYiGT4JssmnKQc44BIyOZRK2pKjXXAgbhfmbeoC9CJpA==}
     engines: {node: '>=12.20'}
@@ -13719,9 +13850,26 @@ packages:
       '@tokenizer/token': 0.3.0
       ieee754: 1.2.1
 
+  /tough-cookie@4.1.4:
+    resolution: {integrity: sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==}
+    engines: {node: '>=6'}
+    dependencies:
+      psl: 1.9.0
+      punycode: 2.3.1
+      universalify: 0.2.0
+      url-parse: 1.5.10
+    dev: false
+
   /tr46@0.0.3:
     resolution: {integrity: sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==}
 
+  /tr46@5.0.0:
+    resolution: {integrity: sha512-tk2G5R2KRwBd+ZN0zaEXpmzdKyOYksXwywulIX95MBODjSzMIuQnQ3m8JxgbhnL1LeVo7lqQKsYa1O3Htl7K5g==}
+    engines: {node: '>=18'}
+    dependencies:
+      punycode: 2.3.1
+    dev: false
+
   /trace-redirect@1.0.6:
     resolution: {integrity: sha512-UUfa1DjjU5flcjMdaFIiIEGDTyu2y/IiMjOX4uGXa7meKBS4vD4f2Uy/tken9Qkd4Jsm4sRsfZcIIPqrRVF3Mg==}
     dev: false
@@ -14201,6 +14349,11 @@ packages:
     engines: {node: '>= 4.0.0'}
     dev: false
 
+  /universalify@0.2.0:
+    resolution: {integrity: sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==}
+    engines: {node: '>= 4.0.0'}
+    dev: false
+
   /universalify@2.0.0:
     resolution: {integrity: sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==}
     engines: {node: '>= 10.0.0'}
@@ -14241,6 +14394,13 @@ packages:
     dependencies:
       punycode: 2.3.1
 
+  /url-parse@1.5.10:
+    resolution: {integrity: sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==}
+    dependencies:
+      querystringify: 2.2.0
+      requires-port: 1.0.0
+    dev: false
+
   /url-polyfill@1.1.12:
     resolution: {integrity: sha512-mYFmBHCapZjtcNHW0MDq9967t+z4Dmg5CJ0KqysK3+ZbyoNOWQHksGCTWwDhxGXllkWlOc10Xfko6v4a3ucM6A==}
     dev: true
@@ -14512,6 +14672,13 @@ packages:
       typescript: 5.4.5
     dev: true
 
+  /w3c-xmlserializer@5.0.0:
+    resolution: {integrity: sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==}
+    engines: {node: '>=18'}
+    dependencies:
+      xml-name-validator: 5.0.0
+    dev: false
+
   /walker@1.0.8:
     resolution: {integrity: sha512-ts/8E8l5b7kY0vlWLewOkDXMmPdLcVV4GmOQLyxuSswIJsweeFZtAsMF7k1Nszz+TYBQrlYRmzOnr398y1JemQ==}
     dependencies:
@@ -14608,9 +14775,24 @@ packages:
       - supports-color
     dev: false
 
-  /whatwg-mimetype@3.0.0:
-    resolution: {integrity: sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==}
-    engines: {node: '>=12'}
+  /whatwg-encoding@3.1.1:
+    resolution: {integrity: sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==}
+    engines: {node: '>=18'}
+    dependencies:
+      iconv-lite: 0.6.3
+    dev: false
+
+  /whatwg-mimetype@4.0.0:
+    resolution: {integrity: sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==}
+    engines: {node: '>=18'}
+    dev: false
+
+  /whatwg-url@14.0.0:
+    resolution: {integrity: sha512-1lfMEm2IEr7RIV+f4lUNPOqfFL+pO+Xw3fJSqmjX9AbXcXcYOkCe1P6+9VBZB6n94af16NfZf+sSk0JCBZC9aw==}
+    engines: {node: '>=18'}
+    dependencies:
+      tr46: 5.0.0
+      webidl-conversions: 7.0.0
     dev: false
 
   /whatwg-url@5.0.0:
@@ -14740,7 +14922,6 @@ packages:
         optional: true
       utf-8-validate:
         optional: true
-    dev: true
 
   /xev@3.0.2:
     resolution: {integrity: sha512-8kxuH95iMXzHZj+fwqfA4UrPcYOy6bGIgfWzo9Ji23JoEc30ge/Z++Ubkiuy8c0+M64nXmmxrmJ7C8wnuBhluw==}
@@ -14758,6 +14939,11 @@ packages:
     engines: {node: '>=12'}
     dev: true
 
+  /xml-name-validator@5.0.0:
+    resolution: {integrity: sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==}
+    engines: {node: '>=18'}
+    dev: false
+
   /xml2js@0.5.0:
     resolution: {integrity: sha512-drPFnkQJik/O+uPKpqSgr22mpuFHqKdbS835iAQrUC73L2F5WkboIRd63ai/2Yg6I1jzifPFKH2NTK+cfglkIA==}
     engines: {node: '>=4.0.0'}
@@ -14779,6 +14965,10 @@ packages:
     engines: {node: '>=4.0'}
     dev: false
 
+  /xmlchars@2.2.0:
+    resolution: {integrity: sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==}
+    dev: false
+
   /xtend@4.0.2:
     resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==}
     engines: {node: '>=0.4'}

renovate.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
+  "extends": ["config:base"],
+  "rangeStrategy": "bump",
+	"branchConcurrentLimit": 5,
+	"enabledManagers": ["npm", "cargo"],
+	"baseBranches": ["develop"],
+	"lockFileMaintenance": {
+		"enabled": true,
+		"recreateWhen": "always",
+		"rebaseStalePrs": true,
+		"branchTopic": "lock-file-maintenance",
+		"commitMessageAction": "Lock file maintenance"
+	}
+}