Merge branch 'develop' into chat

CHANGELOG.md

@@ -10,20 +10,24 @@
 
 ### Client
 - Feat: 設定の管理が強化されました
+  - 内部処理が一新され、安定性とパフォーマンスが向上しました
   - 全てのクライアント設定がエクスポート(バックアップ)/インポート対象に含まれるようになりました
-    - クライアントに追加されたすべてのアカウント情報も含まれるようになりました
+    - プラグイン、テーマ、クライアントに追加されたすべてのアカウント情報も含まれるようになりました
   - 自動で設定データをサーバーにバックアップできるように
     - 設定→設定のプロファイル→自動バックアップ で有効にできます
     - 新しいデバイスからログインしたり、ブラウザから設定データが消えてしまったときに自動で復元されます(復元をスキップすることも可能)
   - 任意の設定項目をデバイス間で同期できるように
     - 設定項目の「...」メニュー→「デバイス間で同期」
+    - 同期をオンにした際にサーバーに保存された値とローカルの値が競合する場合はどちらを優先するか選択できます
   - 任意の設定項目を初期値にリセットできるように
+    - 設定項目の「...」メニュー→「初期値にリセット」
   - アカウントごとに設定値が分離される設定とそうでないクライアント設定が混在していた(かつ分離するかどうかを設定不可だった)のを、基本的に一律でクライアント全体に適用されるようにし、個別でアカウントごとに異なる設定を行えるように
     - 設定項目の「...」メニュー→「アカウントで上書き」をオンにすることで、設定値をそのアカウントでだけ適用するようにできます
   - ログアウトすると設定データもブラウザから消去されるようになりプライバシーが向上しました
     - 再度ログインすればサーバーのバックアップから設定データを復元可能です
-  - エクスポートした設定データを他のサーバーでインポートして適用することが可能になりました
+  - エクスポートした設定データを他のサーバーでインポートして適用すること(設定の持ち運び)が可能になりました
 - Feat: 画面を重ねて表示するオプションを実装(実験的)
+	- 設定 → その他 → 実験的機能 → Enable stacking router view
 - Enhance: プラグインの管理が強化されました
   - インストール/アンインストール/設定の変更時にリロード不要になりました
 - Enhance: ログアウト時、ブラウザに保存されたWebクライアントのデータを全て消去するように

packages/frontend-shared/js/const.ts

@@ -110,12 +110,6 @@ export const ROLE_POLICIES = [
 	'canChat',
 ] as const;
 
-// なんか動かない
-//export const CURRENT_STICKY_TOP = Symbol('CURRENT_STICKY_TOP');
-//export const CURRENT_STICKY_BOTTOM = Symbol('CURRENT_STICKY_BOTTOM');
-export const CURRENT_STICKY_TOP = 'CURRENT_STICKY_TOP';
-export const CURRENT_STICKY_BOTTOM = 'CURRENT_STICKY_BOTTOM';
-
 export const DEFAULT_SERVER_ERROR_IMAGE_URL = 'https://xn--931a.moe/assets/error.jpg';
 export const DEFAULT_NOT_FOUND_IMAGE_URL = 'https://xn--931a.moe/assets/not-found.jpg';
 export const DEFAULT_INFO_IMAGE_URL = 'https://xn--931a.moe/assets/info.jpg';

packages/frontend/src/components/global/MkStickyContainer.vue

@@ -23,8 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, provide, inject, ref, watch, useTemplateRef } from 'vue';
-import { CURRENT_STICKY_BOTTOM, CURRENT_STICKY_TOP } from '@@/js/const.js';
+import { DI } from '@/di.js';
-import type { Ref } from 'vue';
 
 const rootEl = useTemplateRef('rootEl');
 const headerEl = useTemplateRef('headerEl');
@@ -32,13 +31,13 @@ const footerEl = useTemplateRef('footerEl');
 
 const headerHeight = ref<string | undefined>();
 const childStickyTop = ref(0);
-const parentStickyTop = inject<Ref<number>>(CURRENT_STICKY_TOP, ref(0));
+const parentStickyTop = inject(DI.currentStickyTop, ref(0));
-provide(CURRENT_STICKY_TOP, childStickyTop);
+provide(DI.currentStickyTop, childStickyTop);
 
 const footerHeight = ref<string | undefined>();
 const childStickyBottom = ref(0);
-const parentStickyBottom = inject<Ref<number>>(CURRENT_STICKY_BOTTOM, ref(0));
+const parentStickyBottom = inject(DI.currentStickyBottom, ref(0));
-provide(CURRENT_STICKY_BOTTOM, childStickyBottom);
+provide(DI.currentStickyBottom, childStickyBottom);
 
 const calc = () => {
 	// コンポーネントが表示されてないけどKeepAliveで残ってる場合などは null になる

packages/frontend/src/di.ts

@@ -12,4 +12,6 @@ export const DI = {
 	mock: Symbol() as InjectionKey<boolean>,
 	pageMetadata: Symbol() as InjectionKey<Ref<Record<string, any>>>,
 	viewId: Symbol() as InjectionKey<string>,
+	currentStickyTop: Symbol() as InjectionKey<Ref<number>>,
+	currentStickyBottom: Symbol() as InjectionKey<Ref<number>>,
 };

packages/frontend/src/style.scss

@@ -179,14 +179,14 @@ rt {
 
 ._pageScrollable {
 	height: 100%;
-	overflow: auto;
+	overflow: clip;
 	overflow-y: scroll;
 	overscroll-behavior: contain;
 }
 
 ._pageScrollableReversed {
 	height: 100%;
-	overflow: auto;
+	overflow: clip;
 	overflow-y: scroll;
 	overscroll-behavior: contain;
 	display: flex;

packages/frontend/src/ui/universal.vue

@@ -97,7 +97,6 @@ SPDX-License-Identifier: AGPL-3.0-only
 <script lang="ts" setup>
 import { defineAsyncComponent, provide, onMounted, computed, ref, watch, useTemplateRef } from 'vue';
 import { instanceName } from '@@/js/config.js';
-import { CURRENT_STICKY_BOTTOM } from '@@/js/const.js';
 import { isLink } from '@@/js/is-link.js';
 import XCommon from './_common_/common.vue';
 import type { Ref } from 'vue';
@@ -200,16 +199,13 @@ const onContextmenu = (ev) => {
 };
 
 const navFooterHeight = ref(0);
-provide<Ref<number>>(CURRENT_STICKY_BOTTOM, navFooterHeight);
 
 watch(navFooter, () => {
 	if (navFooter.value) {
 		navFooterHeight.value = navFooter.value.offsetHeight;
-		window.document.body.style.setProperty('--MI-stickyBottom', `${navFooterHeight.value}px`);
 		window.document.body.style.setProperty('--MI-minBottomSpacing', 'var(--MI-minBottomSpacingMobile)');
 	} else {
 		navFooterHeight.value = 0;
-		window.document.body.style.setProperty('--MI-stickyBottom', '0px');
 		window.document.body.style.setProperty('--MI-minBottomSpacing', '0px');
 	}
 }, {