fix(frontend): CherryPick 클라이언트 업데이트 알림이 잘못 반환될 수 있음

  - 출시 전 빌드 태그가 고려되지 않음(`alpha`, `beta`, `rc`)
    - 예: `4.14.2 < 4.14.3-alpha.0` 계산 시 `4.14.2`가 더 큰 것으로 계산됨

CHANGELOG_CHERRYPICK.md

@@ -35,6 +35,9 @@ Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2024xx](CHANGE
 ### Client
 - Enhance: 사용자 페이지에서 `이름`, `자기소개`, `팔로우 메시지`, `추가 정보`에 포함된 외부 이모지를 가져올 수 있음
 - Fix: 노트 헤더의 사용자 이름을 클릭하면 페이지가 중복으로 이동됨
+- Fix: CherryPick 클라이언트 업데이트 알림이 잘못 반환될 수 있음
+  - 출시 전 빌드 태그가 고려되지 않음(`alpha`, `beta`, `rc`)
+    - 예: `4.14.2 < 4.14.3-alpha.0` 계산 시 `4.14.2`가 더 큰 것으로 계산됨
 
 ### Server
 - Fix: 신고 즉시 해결 기능에서 발생할 수 있는 일부 문제 해결 ([misskey-dev/misskey#11032 (review)](https://github.com/misskey-dev/misskey/pull/11032#pullrequestreview-2425669540))

packages/frontend/src/components/MkInfo.vue

@@ -6,6 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 <template>
 <div :class="[$style.root, { [$style.warn]: warn }]">
 	<i v-if="warn" class="ti ti-alert-triangle" :class="$style.i"></i>
+	<i v-else-if="check" class="ti ti-circle-check" :class="$style.i"></i>
 	<i v-else class="ti ti-info-circle" :class="$style.i"></i>
 	<div style="overflow: auto;"><slot></slot></div>
 	<button v-if="closable" :class="$style.button" class="_button" @click="close()"><i class="ti ti-x"></i></button>
@@ -17,6 +18,7 @@ import { } from 'vue';
 
 const props = defineProps<{
 	warn?: boolean;
+	check?: boolean;
 	closable?: boolean;
 }>();
 

packages/frontend/src/pages/admin/update.vue

@@ -17,7 +17,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 				<template v-if="(version && version.length > 0) && (releasesCherryPick && releasesCherryPick.length > 0)">
 					<FormInfo v-if="compareVersions(version, releasesCherryPick[0].tag_name) > 0">{{ i18n.ts.youAreRunningBetaClient }}</FormInfo>
-					<FormInfo v-else-if="compareVersions(version, releasesCherryPick[0].tag_name) === 0">{{ i18n.ts.youAreRunningUpToDateClient }}</FormInfo>
+					<FormInfo v-else-if="compareVersions(version, releasesCherryPick[0].tag_name) === 0" check>{{ i18n.ts.youAreRunningUpToDateClient }}</FormInfo>
 					<FormInfo v-else warn>{{ i18n.ts.newVersionOfClientAvailable }}</FormInfo>
 				</template>
 				<FormInfo v-else>{{ i18n.ts.loading }}</FormInfo>
@@ -122,16 +122,49 @@ async function init() {
 }
 
 function compareVersions(v1: string, v2: string): number {
-	const v1Parts = v1.split('.').map(Number);
-	const v2Parts = v2.split('.').map(Number);
+	const parseVersion = (version: string) => {
+		const [main, pre] = version.split('-');
+		const parts = main.split('.').map(num => parseInt(num, 10));
+		return { parts, pre: pre || null };
+	};
+
+	const compareArrays = (a: number[], b: number[]) => {
+		const maxLength = Math.max(a.length, b.length);
+		for (let i = 0; i < maxLength; i++) {
+			const part1 = a[i] || 0;
+			const part2 = b[i] || 0;
+			if (part1 > part2) return 1;
+			if (part1 < part2) return -1;
+		}
+		return 0;
+	};
 
-	for (let i = 0; i < Math.max(v1Parts.length, v2Parts.length); i++) {
-		const part1 = v1Parts[i] || 0;
-		const part2 = v2Parts[i] || 0;
+	const v1Parsed = parseVersion(v1);
+	const v2Parsed = parseVersion(v2);
 
-		if (part1 < part2) return -1;
-		if (part1 > part2) return 1;
+	const mainComparison = compareArrays(v1Parsed.parts, v2Parsed.parts);
+	if (mainComparison !== 0) {
+		return mainComparison;
 	}
+
+	if (v1Parsed.pre && !v2Parsed.pre) return -1;
+	if (!v1Parsed.pre && v2Parsed.pre) return 1;
+
+	if (v1Parsed.pre && v2Parsed.pre) {
+		const preOrder = ['alpha', 'beta', 'rc'];
+		const [pre1] = v1Parsed.pre.split('.');
+		const [pre2] = v2Parsed.pre.split('.');
+
+		const index1 = preOrder.indexOf(pre1);
+		const index2 = preOrder.indexOf(pre2);
+
+		if (index1 !== index2) {
+			return index1 - index2;
+		}
+
+		return v1Parsed.pre.localeCompare(v2Parsed.pre);
+	}
+
 	return 0;
 }