fix: incorrect note id

packages/client/src/components/MkNote.vue

@@ -2,7 +2,7 @@
 	<div
 		v-if="!muted.muted"
 		v-show="!isDeleted"
-		:id="appearNote.id"
+		:id="appearNote.historyId || appearNote.id"
 		ref="el"
 		v-hotkey="keymap"
 		v-size="{ max: [500, 350] }"
@@ -91,6 +91,9 @@
 			:style="{
 				cursor: expandOnNoteClick && !detailedView ? 'pointer' : '',
 			}"
+			:class="{
+				history: appearNote.historyId,
+			}"
 			@contextmenu.stop="onContextmenu"
 			@click="noteClick"
 		>
@@ -427,11 +430,13 @@ const keymap = {
 	s: () => showContent.value !== showContent.value,
 };
 
-useNoteCapture({
+if (!appearNote.value.historyId) {
-	rootEl: el,
+	useNoteCapture({
-	note: appearNote,
+		rootEl: el,
-	isDeletedRef: isDeleted,
+		note: appearNote,
-});
+		isDeletedRef: isDeleted,
+	});
+}
 
 function reply(viaKeyboard = false): void {
 	pleaseLogin();
@@ -864,6 +869,9 @@ defineExpose({
 		overflow: clip;
 		padding: 20px 32px 10px;
 		margin-top: -16px;
+		&.history {
+			margin-top: -90px !important;
+		}
 
 		&:first-child,
 		&:nth-child(2) {

packages/client/src/components/MkPagination.vue

@@ -118,10 +118,9 @@ const emit = defineEmits<{
 	(ev: "status", error: boolean): void;
 }>();
 
-interface Item {
+type Item = Endpoints[typeof props.pagination.endpoint]["res"] & {
 	id: string;
-	[another: string]: unknown;
+};
-}
 
 const rootEl = ref<HTMLElement>();
 const items = ref<Item[]>([]);

packages/client/src/filters/note.ts

@@ -8,5 +8,8 @@ export function notePage(
 	if (options?.historyPage) {
 		return `/notes/${note.id}/history`;
 	}
+	if (note.historyId) {
+		return `/notes/${note.id}/history#${note.historyId}`
+	}
 	return `/notes/${note.id}`;
 };

packages/client/src/pages/note-history.vue

@@ -10,21 +10,22 @@
 			<MkPagination
 				v-else
 				ref="pagingComponent"
-				v-slot="{ items: noteEdits }"
+				v-slot="{ items }: { items: NoteEdit[] }"
 				:pagination="pagination"
 			>
 				<div ref="tlEl" class="giivymft noGap">
 					<XList
-						v-slot="{ item: noteEdit }"
+						v-slot="{item} : {item: Note}"
-						:items="convertNoteEditsToNotes(noteEdits as NoteEdit[])"
+						:items="convertNoteEditsToNotes(items)"
 						class="notes"
 						:no-gap="true"
 					>
 						<XNote
-							:key="noteEdit.id"
+							:key="item.id"
 							class="qtqtichx"
-							:note="noteEdit"
+							:note="item"
 							:hide-footer="true"
+							:detailed-view="true"
 						/>
 					</XList>
 				</div>
@@ -88,7 +89,7 @@ onMounted(() => {
 
 function convertNoteEditsToNotes(noteEdits: NoteEdit[]) {
 	const now: NoteEdit = {
-		id: note.value.id,
+		id: "EditionNow",
 		noteId: note.value.id,
 		updatedAt: note.value.createdAt,
 		text: note.value.text,
@@ -99,7 +100,7 @@ function convertNoteEditsToNotes(noteEdits: NoteEdit[]) {
 
 	return [now].concat(noteEdits).map((noteEdit: NoteEdit, index, arr): Note => {
 		return Object.assign({}, note.value, {
-			id: crypto.randomUUID(), // Don't use noteId
+			historyId: noteEdit.id,
 			// Conversion from updatedAt to createdAt
 			// The createdAt of a edition's content is actually the updatedAt of the previous one.
 			createdAt: arr[(index + 1) % arr.length].updatedAt,

packages/firefish-js/src/entities.ts

@@ -174,6 +174,8 @@ export type Note = {
 	url?: string;
 	updatedAt?: DateString;
 	isHidden?: boolean;
+	/** if the note is a history */
+	historyId?: ID;
 };
 
 export type NoteEdit = {