@@ -153,6 +154,8 @@ import { DI } from '@/di.js';
import { globalEvents } from '@/events.js';
import { checkDragDataType, getDragData } from '@/drag-and-drop.js';
import { useUploader } from '@/composables/use-uploader.js';
+import { startTour } from '@/utility/tour.js';
+import { closeTip } from '@/tips.js';
const $i = ensureSignin();
@@ -186,6 +189,9 @@ const cwInputEl = useTemplateRef('cwInputEl');
const hashtagsInputEl = useTemplateRef('hashtagsInputEl');
const visibilityButton = useTemplateRef('visibilityButton');
const otherSettingsButton = useTemplateRef('otherSettingsButton');
+const accountMenuEl = useTemplateRef('accountMenuEl');
+const footerEl = useTemplateRef('footerEl');
+const submitButtonEl = useTemplateRef('submitButtonEl');
const posting = ref(false);
const posted = ref(false);
@@ -1285,6 +1291,45 @@ function cancelSchedule() {
scheduledAt.value = null;
}
+function showTour() {
+ if (textareaEl.value == null ||
+ footerEl.value == null ||
+ accountMenuEl.value == null ||
+ visibilityButton.value == null ||
+ otherSettingsButton.value == null ||
+ submitButtonEl.value == null) {
+ return;
+ }
+
+ startTour([{
+ element: textareaEl.value,
+ title: i18n.ts._postForm._howToUse.content_title,
+ description: i18n.ts._postForm._howToUse.content_description,
+ }, {
+ element: footerEl.value,
+ title: i18n.ts._postForm._howToUse.toolbar_title,
+ description: i18n.ts._postForm._howToUse.toolbar_description,
+ }, {
+ element: accountMenuEl.value,
+ title: i18n.ts._postForm._howToUse.account_title,
+ description: i18n.ts._postForm._howToUse.account_description,
+ }, {
+ element: visibilityButton.value,
+ title: i18n.ts._postForm._howToUse.visibility_title,
+ description: i18n.ts._postForm._howToUse.visibility_description,
+ }, {
+ element: otherSettingsButton.value,
+ title: i18n.ts._postForm._howToUse.menu_title,
+ description: i18n.ts._postForm._howToUse.menu_description,
+ }, {
+ element: submitButtonEl.value,
+ title: i18n.ts._postForm._howToUse.submit_title,
+ description: i18n.ts._postForm._howToUse.submit_description,
+ }]).then(() => {
+ closeTip('postForm');
+ });
+}
+
onMounted(() => {
if (props.autofocus) {
focus();
@@ -1414,6 +1459,7 @@ defineExpose({
}
.avatar {
+ display: block;
width: 28px;
height: 28px;
margin: auto;
@@ -1575,6 +1621,10 @@ html[data-color-scheme=light] .preview {
margin: 0 20px 16px 20px;
}
+.showHowToUse {
+ margin: 0 20px 16px 20px;
+}
+
.cw,
.hashtags,
.text {
diff --git a/packages/frontend/src/components/MkSpot.vue b/packages/frontend/src/components/MkSpot.vue
new file mode 100644
index 0000000000..07699644aa
--- /dev/null
+++ b/packages/frontend/src/components/MkSpot.vue
@@ -0,0 +1,161 @@
+
+
+
+
+
+
+
+
+
{{ title }}
+
{{ description }}
+
+ {{ i18n.ts.goBack }}
+ {{ i18n.ts.next }}
+ {{ i18n.ts.done }}
+
+
+
+
+
+
+
+
diff --git a/packages/frontend/src/tips.ts b/packages/frontend/src/tips.ts
index 7218f4c19a..8a58e2aa63 100644
--- a/packages/frontend/src/tips.ts
+++ b/packages/frontend/src/tips.ts
@@ -11,6 +11,7 @@ export const TIPS = [
'postFormUploader',
'clips',
'userLists',
+ 'postForm',
'tl.home',
'tl.local',
'tl.social',
diff --git a/packages/frontend/src/utility/tour.ts b/packages/frontend/src/utility/tour.ts
new file mode 100644
index 0000000000..8ab3474ddc
--- /dev/null
+++ b/packages/frontend/src/utility/tour.ts
@@ -0,0 +1,49 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { computed, ref, shallowRef, watch } from 'vue';
+import * as os from '@/os.js';
+
+type TourStep = {
+ title: string;
+ description: string;
+ element: HTMLElement;
+};
+
+export function startTour(steps: TourStep[]) {
+ return new Promise
(async (resolve) => {
+ const currentStepIndex = ref(0);
+ const titleRef = ref(steps[0].title);
+ const descriptionRef = ref(steps[0].description);
+ const anchorElementRef = shallowRef(steps[0].element);
+
+ watch(currentStepIndex, (newIndex) => {
+ const step = steps[newIndex];
+ titleRef.value = step.title;
+ descriptionRef.value = step.description;
+ anchorElementRef.value = step.element;
+ });
+
+ const { dispose } = os.popup(await import('@/components/MkSpot.vue').then(x => x.default), {
+ title: titleRef,
+ description: descriptionRef,
+ anchorElement: anchorElementRef,
+ hasPrev: computed(() => currentStepIndex.value > 0),
+ hasNext: computed(() => currentStepIndex.value < steps.length - 1),
+ }, {
+ next: () => {
+ if (currentStepIndex.value >= steps.length - 1) {
+ dispose();
+ resolve();
+ return;
+ }
+ currentStepIndex.value++;
+ },
+ prev: () => {
+ currentStepIndex.value--;
+ },
+ });
+ });
+}
From 0a67d6f1a045c339dcdc0bb632fe359f16784a03 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=9C=E7=89=A9=E3=83=AA=E3=83=B3?=
Date: Fri, 7 Nov 2025 11:27:08 +0900
Subject: [PATCH 24/92] =?UTF-8?q?fix(frontend):=20=E4=B8=80=E9=83=A8?=
=?UTF-8?q?=E3=81=AE=E3=83=9A=E3=83=BC=E3=82=B8=E3=81=A7=E3=82=82=E3=81=A3?=
=?UTF-8?q?=E3=81=A8=E8=A6=8B=E3=82=8B=E3=81=8C=E8=87=AA=E5=8B=95=E3=81=A7?=
=?UTF-8?q?=E8=A1=8C=E3=82=8F=E3=82=8C=E3=81=AA=E3=81=84=E3=83=90=E3=82=B0?=
=?UTF-8?q?=E3=81=AE=E4=BF=AE=E6=AD=A3=20(#16754)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
* 一部のページでもっと見るが自動で行われないバグの修正
* fix(frontend): MkPagination で UI アニメーションオフ時に自動ロードが動作しない問題を修正
Transition コンポーネントの mode="out-in" が、アニメーション無効時でも
適用されており、IntersectionObserver の検出に干渉していた問題を修正。
アニメーション有効時のみ mode="out-in" を適用するように変更。
Co-authored-by: 果物リン
* enhance: ユーザーの設定値にかかわらず無限スクロールをオフにできるオプションを追加
* Update Changelog
* MkNotesTimeline.vueにforceDisableInfiniteScrollを追加、 note.vueの前方向の読み込みでこれを有効
* fix lint
* refactor
---------
Co-authored-by: claude[bot] <41898282+claude[bot]@users.noreply.github.com>
Co-authored-by: 果物リン
Co-authored-by: kakkokari-gtyih <67428053+kakkokari-gtyih@users.noreply.github.com>
---
CHANGELOG.md | 1 +
.../src/components/MkNotesTimeline.vue | 13 +++---
.../frontend/src/components/MkPagination.vue | 42 ++++++++++++-------
packages/frontend/src/pages/note.vue | 2 +-
4 files changed, 34 insertions(+), 24 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1ea6e2efd3..d602b88f88 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,7 @@
- Enhance: ユーザーのノート、フォロー、フォロワーページへのリンクをユーザーポップアップに追加
- Enhance: プッシュ通知を行うための権限確認をより確実に行うように
- Enhance: 投稿フォームのチュートリアルを追加
+- Enhance: 「自動でもっと見る」をほとんどの箇所で利用可能に
- Fix: 紙吹雪エフェクトがアニメーション設定を考慮せず常に表示される問題を修正
- Fix: ナビゲーションバーのリアルタイムモード切替ボタンの状態をよりわかりやすく表示するように
- Fix: ページのタイトルが長いとき、はみ出る問題を修正
diff --git a/packages/frontend/src/components/MkNotesTimeline.vue b/packages/frontend/src/components/MkNotesTimeline.vue
index d94cf3924c..b03bf6d09f 100644
--- a/packages/frontend/src/components/MkNotesTimeline.vue
+++ b/packages/frontend/src/components/MkNotesTimeline.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
-
+
@@ -40,26 +40,23 @@ SPDX-License-Identifier: AGPL-3.0-only
+