Merge branch 'develop' into pag-back

packages/frontend/package.json

@@ -24,7 +24,7 @@
 		"@syuilo/aiscript": "0.15.0",
 		"@tabler/icons-webfont": "2.32.0",
 		"@vitejs/plugin-vue": "4.3.4",
-		"@vue-macros/reactivity-transform": "0.3.22",
+		"@vue-macros/reactivity-transform": "0.3.23",
 		"@vue/compiler-sfc": "3.3.4",
 		"astring": "1.8.6",
 		"autosize": "6.0.1",
@@ -37,7 +37,7 @@
 		"chartjs-chart-matrix": "2.0.1",
 		"chartjs-plugin-gradient": "0.6.1",
 		"chartjs-plugin-zoom": "2.0.1",
-		"chromatic": "6.24.1",
+		"chromatic": "7.1.0",
 		"compare-versions": "6.1.0",
 		"cropperjs": "2.0.0-beta.4",
 		"date-fns": "2.30.0",
@@ -52,18 +52,16 @@
 		"matter-js": "0.19.0",
 		"mfm-js": "0.23.3",
 		"misskey-js": "workspace:*",
-		"photoswipe": "5.3.9",
+		"photoswipe": "5.4.0",
 		"prismjs": "1.29.0",
 		"punycode": "2.3.0",
 		"querystring": "0.2.1",
-		"rollup": "3.28.1",
-		"s-age": "1.1.2",
+		"rollup": "3.29.1",
 		"sanitize-html": "2.11.0",
-		"sass": "1.66.1",
+		"sass": "1.67.0",
 		"strict-event-emitter-types": "2.0.0",
-		"syuilo-password-strength": "0.0.1",
 		"textarea-caret": "3.1.0",
-		"three": "0.156.0",
+		"three": "0.156.1",
 		"throttle-debounce": "5.0.0",
 		"tinycolor2": "1.6.0",
 		"tsc-alias": "1.8.7",
@@ -71,7 +69,7 @@
 		"twemoji-parser": "14.0.0",
 		"typescript": "5.2.2",
 		"ua-parser-js": "2.0.0-alpha.2",
-		"uuid": "9.0.0",
+		"uuid": "9.0.1",
 		"vanilla-tilt": "1.8.1",
 		"vite": "4.4.9",
 		"vue": "3.3.4",
@@ -79,64 +77,64 @@
 		"vuedraggable": "next"
 	},
 	"devDependencies": {
-		"@storybook/addon-actions": "7.4.0",
-		"@storybook/addon-essentials": "7.4.0",
-		"@storybook/addon-interactions": "7.4.0",
-		"@storybook/addon-links": "7.4.0",
-		"@storybook/addon-storysource": "7.4.0",
-		"@storybook/addons": "7.4.0",
-		"@storybook/blocks": "7.4.0",
-		"@storybook/core-events": "7.4.0",
+		"@storybook/addon-actions": "7.4.1",
+		"@storybook/addon-essentials": "7.4.1",
+		"@storybook/addon-interactions": "7.4.1",
+		"@storybook/addon-links": "7.4.1",
+		"@storybook/addon-storysource": "7.4.1",
+		"@storybook/addons": "7.4.1",
+		"@storybook/blocks": "7.4.1",
+		"@storybook/core-events": "7.4.1",
 		"@storybook/jest": "0.2.2",
-		"@storybook/manager-api": "7.4.0",
-		"@storybook/preview-api": "7.4.0",
-		"@storybook/react": "7.4.0",
-		"@storybook/react-vite": "7.4.0",
+		"@storybook/manager-api": "7.4.1",
+		"@storybook/preview-api": "7.4.1",
+		"@storybook/react": "7.4.1",
+		"@storybook/react-vite": "7.4.1",
 		"@storybook/testing-library": "0.2.0",
-		"@storybook/theming": "7.4.0",
-		"@storybook/types": "7.4.0",
-		"@storybook/vue3": "7.4.0",
-		"@storybook/vue3-vite": "7.4.0",
+		"@storybook/theming": "7.4.1",
+		"@storybook/types": "7.4.1",
+		"@storybook/vue3": "7.4.1",
+		"@storybook/vue3-vite": "7.4.1",
 		"@testing-library/vue": "7.0.0",
 		"@types/escape-regexp": "0.0.1",
 		"@types/estree": "1.0.1",
 		"@types/matter-js": "0.19.0",
 		"@types/micromatch": "4.0.2",
-		"@types/node": "20.5.9",
+		"@types/node": "20.6.0",
 		"@types/punycode": "2.1.0",
 		"@types/sanitize-html": "2.9.0",
 		"@types/throttle-debounce": "5.0.0",
-		"@types/tinycolor2": "1.4.3",
-		"@types/uuid": "9.0.3",
+		"@types/tinycolor2": "1.4.4",
+		"@types/uuid": "9.0.4",
 		"@types/websocket": "1.0.6",
 		"@types/ws": "8.5.5",
-		"@typescript-eslint/eslint-plugin": "6.6.0",
-		"@typescript-eslint/parser": "6.6.0",
-		"@vitest/coverage-v8": "0.34.3",
+		"@typescript-eslint/eslint-plugin": "6.7.0",
+		"@typescript-eslint/parser": "6.7.0",
+		"@vitest/coverage-v8": "0.34.4",
 		"@vue/runtime-core": "3.3.4",
 		"acorn": "8.10.0",
 		"cross-env": "7.0.3",
-		"cypress": "13.1.0",
-		"eslint": "8.48.0",
+		"cypress": "13.2.0",
+		"eslint": "8.49.0",
 		"eslint-plugin-import": "2.28.1",
 		"eslint-plugin-vue": "9.17.0",
 		"fast-glob": "3.3.1",
 		"happy-dom": "10.0.3",
 		"micromatch": "4.0.5",
-		"msw": "1.3.0",
+		"msw": "1.3.1",
 		"msw-storybook-addon": "1.8.0",
 		"nodemon": "3.0.1",
 		"prettier": "3.0.3",
 		"react": "18.2.0",
 		"react-dom": "18.2.0",
 		"start-server-and-test": "2.0.0",
-		"storybook": "7.4.0",
+		"storybook": "7.4.1",
 		"storybook-addon-misskey-theme": "github:misskey-dev/storybook-addon-misskey-theme",
 		"summaly": "github:misskey-dev/summaly",
-		"vite-plugin-turbosnap": "1.0.2",
-		"vitest": "0.34.3",
+		"vite-plugin-turbosnap": "1.0.3",
+		"vitest": "0.34.4",
 		"vitest-fetch-mock": "0.2.2",
 		"vue-eslint-parser": "9.3.1",
-		"vue-tsc": "1.8.8"
+		"vue-tsc": "1.8.11"
 	}
 }

packages/frontend/src/components/MkSignupDialog.form.vue

@@ -77,7 +77,6 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { } from 'vue';
-import getPasswordStrength from 'syuilo-password-strength';
 import { toUnicode } from 'punycode/';
 import MkButton from './MkButton.vue';
 import MkInput from './MkInput.vue';
@@ -132,6 +131,30 @@ const shouldDisableSubmitting = $computed((): boolean => {
 		passwordRetypeState !== 'match';
 });
 
+function getPasswordStrength(source: string): number {
+	let strength = 0;
+	let power = 0.018;
+
+	// 英数字
+	if (/[a-zA-Z]/.test(source) && /[0-9]/.test(source)) {
+		power += 0.020;
+	}
+
+	// 大文字と小文字が混ざってたら
+	if (/[a-z]/.test(source) && /[A-Z]/.test(source)) {
+		power += 0.015;
+	}
+
+	// 記号が混ざってたら
+	if (/[!\x22\#$%&@'()*+,-./_]/.test(source)) {
+		power += 0.02;
+	}
+
+	strength = power * source.length;
+
+	return Math.max(0, Math.min(1, strength));
+}
+
 function onChangeUsername(): void {
 	if (username === '') {
 		usernameState = null;

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

@@ -12,7 +12,29 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<div class="_gaps_m">
 					<MkInput v-model="iconUrl">
 						<template #prefix><i class="ti ti-link"></i></template>
-						<template #label>{{ i18n.ts.iconUrl }}</template>
+						<template #label>{{ i18n.ts._serverSettings.iconUrl }}</template>
+					</MkInput>
+
+					<MkInput v-model="app192IconUrl">
+						<template #prefix><i class="ti ti-link"></i></template>
+						<template #label>{{ i18n.ts._serverSettings.iconUrl }} (App/192px)</template>
+						<template #caption>
+							<div>{{ i18n.t('_serverSettings.appIconDescription', { host: instance.name ?? host }) }}</div>
+							<div>({{ i18n.ts._serverSettings.appIconUsageExample }})</div>
+							<div>{{ i18n.ts._serverSettings.appIconStyleRecommendation }}</div>
+							<div><strong>{{ i18n.t('_serverSettings.appIconResolutionMustBe', { resolution: '192x192px' }) }}</strong></div>
+						</template>
+					</MkInput>
+
+					<MkInput v-model="app512IconUrl">
+						<template #prefix><i class="ti ti-link"></i></template>
+						<template #label>{{ i18n.ts._serverSettings.iconUrl }} (App/512px)</template>
+						<template #caption>
+							<div>{{ i18n.t('_serverSettings.appIconDescription', { host: instance.name ?? host }) }}</div>
+							<div>({{ i18n.ts._serverSettings.appIconUsageExample }})</div>
+							<div>{{ i18n.ts._serverSettings.appIconStyleRecommendation }}</div>
+							<div><strong>{{ i18n.t('_serverSettings.appIconResolutionMustBe', { resolution: '512x512px' }) }}</strong></div>
+						</template>
 					</MkInput>
 
 					<MkInput v-model="bannerUrl">
@@ -53,6 +75,10 @@ SPDX-License-Identifier: AGPL-3.0-only
 						<template #label>{{ i18n.ts.instanceDefaultDarkTheme }}</template>
 						<template #caption>{{ i18n.ts.instanceDefaultThemeDescription }}</template>
 					</MkTextarea>
+
+					<MkTextarea v-model="manifestJsonOverride">
+						<template #label>{{ i18n.ts._serverSettings.manifestJsonOverride }}</template>
+					</MkTextarea>
 				</div>
 			</FormSuspense>
 		</MkSpacer>
@@ -69,6 +95,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { } from 'vue';
+import JSON5 from 'json5';
 import XHeader from './_header_.vue';
 import MkSwitch from '@/components/MkSwitch.vue';
 import MkInput from '@/components/MkInput.vue';
@@ -77,13 +104,16 @@ import FormSection from '@/components/form/section.vue';
 import FormSplit from '@/components/form/split.vue';
 import FormSuspense from '@/components/form/suspense.vue';
 import * as os from '@/os';
-import { fetchInstance } from '@/instance';
+import { instance, fetchInstance } from '@/instance';
 import { i18n } from '@/i18n';
 import { definePageMetadata } from '@/scripts/page-metadata';
 import MkButton from '@/components/MkButton.vue';
 import MkColorInput from '@/components/MkColorInput.vue';
+import { host } from '@/config';
 
 let iconUrl: string | null = $ref(null);
+let app192IconUrl: string | null = $ref(null);
+let app512IconUrl: string | null = $ref(null);
 let bannerUrl: string | null = $ref(null);
 let backgroundImageUrl: string | null = $ref(null);
 let themeColor: any = $ref(null);
@@ -92,10 +122,13 @@ let defaultDarkTheme: any = $ref(null);
 let serverErrorImageUrl: string | null = $ref(null);
 let infoImageUrl: string | null = $ref(null);
 let notFoundImageUrl: string | null = $ref(null);
+let manifestJsonOverride: string = $ref('{}');
 
 async function init() {
 	const meta = await os.api('admin/meta');
 	iconUrl = meta.iconUrl;
+	app192IconUrl = meta.app192IconUrl;
+	app512IconUrl = meta.app512IconUrl;
 	bannerUrl = meta.bannerUrl;
 	backgroundImageUrl = meta.backgroundImageUrl;
 	themeColor = meta.themeColor;
@@ -104,11 +137,14 @@ async function init() {
 	serverErrorImageUrl = meta.serverErrorImageUrl;
 	infoImageUrl = meta.infoImageUrl;
 	notFoundImageUrl = meta.notFoundImageUrl;
+	manifestJsonOverride = meta.manifestJsonOverride === '' ? '{}' : JSON.stringify(JSON.parse(meta.manifestJsonOverride), null, '\t');
 }
 
 function save() {
 	os.apiWithDialog('admin/update-meta', {
 		iconUrl,
+		app192IconUrl,
+		app512IconUrl,
 		bannerUrl,
 		backgroundImageUrl,
 		themeColor: themeColor === '' ? null : themeColor,
@@ -117,6 +153,7 @@ function save() {
 		infoImageUrl,
 		notFoundImageUrl,
 		serverErrorImageUrl,
+		manifestJsonOverride: manifestJsonOverride === '' ? '{}' : JSON.stringify(JSON5.parse(manifestJsonOverride)),
 	}).then(() => {
 		fetchInstance();
 	});

packages/frontend/src/pages/user/home.vue

@@ -143,7 +143,6 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { defineAsyncComponent, computed, onMounted, onUnmounted, nextTick, watch } from 'vue';
-import calcAge from 's-age';
 import * as Misskey from 'misskey-js';
 import MkNote from '@/components/MkNote.vue';
 import MkFollowButton from '@/components/MkFollowButton.vue';
@@ -167,6 +166,21 @@ import MkNotes from '@/components/MkNotes.vue';
 import { api } from '@/os';
 import { isFfVisibleForMe } from '@/scripts/isFfVisibleForMe';
 
+function calcAge(birthdate: string): number {
+	const date = new Date(birthdate);
+	const now = new Date();
+
+	let yearDiff = now.getFullYear() - date.getFullYear();
+	const monthDiff = now.getMonth() - date.getMonth();
+	const pastDate = now.getDate() < date.getDate();
+
+	if (monthDiff < 0 || (monthDiff === 0 && pastDate)) {
+		yearDiff--;
+	}
+
+	return yearDiff;
+}
+
 const XPhotos = defineAsyncComponent(() => import('./index.photos.vue'));
 const XActivity = defineAsyncComponent(() => import('./index.activity.vue'));
 

packages/frontend/vite.config.ts

@@ -112,8 +112,8 @@ export function getConfig(): UserConfig {
 
 		build: {
 			target: [
-				'chrome108',
-				'firefox109',
+				'chrome116',
+				'firefox116',
 				'safari16',
 			],
 			manifest: 'manifest.json',