enhance: タイムラインからRenoteを除外するオプションを追加

1 files changed, 31 insertions, 2 deletions

diff --git a/packages/frontend/src/ui/deck/tl-column.vue b/packages/frontend/src/ui/deck/tl-column.vue
index 813b801d21..073898409c 100644
--- a/packages/frontend/src/ui/deck/tl-column.vue
+++ b/packages/frontend/src/ui/deck/tl-column.vue
@@ -20,12 +20,19 @@ SPDX-License-Identifier: AGPL-3.0-only
 		</p>
 		<p :class="$style.disabledDescription">{{ i18n.ts._disabledTimeline.description }}</p>
 	</div>
-	<MkTimeline v-else-if="column.tl" ref="timeline" :key="column.tl" :src="column.tl"/>
+	<MkTimeline
+		v-else-if="column.tl"
+		ref="timeline"
+		:key="column.tl + withRenotes + withReplies"
+		:src="column.tl"
+		:withRenotes="withRenotes"
+		:withReplies="withReplies"
+	/>
 </XColumn>
 </template>
 
 <script lang="ts" setup>
-import { onMounted } from 'vue';
+import { onMounted, watch } from 'vue';
 import XColumn from './column.vue';
 import { removeColumn, updateColumn, Column } from './deck-store.js';
 import MkTimeline from '@/components/MkTimeline.vue';
@@ -43,6 +50,20 @@ let disabled = $ref(false);
 
 const isLocalTimelineAvailable = (($i == null && instance.policies.ltlAvailable) || ($i != null && $i.policies.ltlAvailable));
 const isGlobalTimelineAvailable = (($i == null && instance.policies.gtlAvailable) || ($i != null && $i.policies.gtlAvailable));
+const withRenotes = $ref(props.column.withRenotes ?? true);
+const withReplies = $ref(props.column.withReplies ?? false);
+
+watch($$(withRenotes), v => {
+	updateColumn(props.column.id, {
+		withRenotes: v,
+	});
+});
+
+watch($$(withReplies), v => {
+	updateColumn(props.column.id, {
+		withReplies: v,
+	});
+});
 
 onMounted(() => {
 	if (props.column.tl == null) {
@@ -82,6 +103,14 @@ const menu = [{
 	icon: 'ti ti-pencil',
 	text: i18n.ts.timeline,
 	action: setType,
+}, {
+	type: 'switch',
+	text: i18n.ts.showRenotes,
+	ref: $$(withRenotes),
+}, {
+	type: 'switch',
+	text: i18n.ts.withReplies,
+	ref: $$(withReplies),
 }];
 </script>