Refactyor

src/client/app/common/views/deck/deck.direct-column.vue

@@ -2,7 +2,7 @@
 <x-column :name="name" :column="column" :is-stacked="isStacked">
 	<template #header><fa :icon="['far', 'envelope']"/>{{ name }}</template>
 
-	<x-direct/>
+	<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
 </x-column>
 </template>
 
@@ -10,13 +10,14 @@
 import Vue from 'vue';
 import i18n from '../../../i18n';
 import XColumn from './deck.column.vue';
-import XDirect from './deck.direct.vue';
+import XNotes from './deck.notes.vue';
 
 export default Vue.extend({
 	i18n: i18n(),
+
 	components: {
 		XColumn,
-		XDirect
+		XNotes
 	},
 
 	props: {
@@ -30,6 +31,22 @@ export default Vue.extend({
 		}
 	},
 
+	data() {
+		return {
+			connection: null,
+			pagination: {
+				endpoint: 'notes/mentions',
+				limit: 10,
+				params: {
+					includeMyRenotes: this.$store.state.settings.showMyRenotes,
+					includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
+					includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
+					visibility: 'specified'
+				}
+			}
+		};
+	},
+
 	computed: {
 		name(): string {
 			if (this.column.name) return this.column.name;
@@ -37,9 +54,25 @@ export default Vue.extend({
 		}
 	},
 
+	mounted() {
+		this.connection = this.$root.stream.useSharedConnection('main');
+		this.connection.on('mention', this.onNote);
+	},
+
+	beforeDestroy() {
+		this.connection.dispose();
+	},
+
 	methods: {
+		onNote(note) {
+			// Prepend a note
+			if (note.visibility == 'specified') {
+				(this.$refs.timeline as any).prepend(note);
+			}
+		},
+
 		focus() {
-			this.$refs.tl.focus();
+			this.$refs.timeline.focus();
 		}
 	}
 });

src/client/app/common/views/deck/deck.direct.vue

@@ -1,52 +0,0 @@
-<template>
-<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-import XNotes from './deck.notes.vue';
-
-export default Vue.extend({
-	components: {
-		XNotes
-	},
-
-	data() {
-		return {
-			connection: null,
-			pagination: {
-				endpoint: 'notes/mentions',
-				limit: 10,
-				params: {
-					includeMyRenotes: this.$store.state.settings.showMyRenotes,
-					includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
-					includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
-					visibility: 'specified'
-				}
-			}
-		};
-	},
-
-	mounted() {
-		this.connection = this.$root.stream.useSharedConnection('main');
-		this.connection.on('mention', this.onNote);
-	},
-
-	beforeDestroy() {
-		this.connection.dispose();
-	},
-
-	methods: {
-		onNote(note) {
-			// Prepend a note
-			if (note.visibility == 'specified') {
-				(this.$refs.timeline as any).prepend(note);
-			}
-		},
-
-		focus() {
-			this.$refs.timeline.focus();
-		}
-	}
-});
-</script>

src/client/app/common/views/deck/deck.mentions-column.vue

@@ -2,7 +2,7 @@
 <x-column :name="name" :column="column" :is-stacked="isStacked">
 	<template #header><fa icon="at"/>{{ name }}</template>
 
-	<x-mentions ref="tl"/>
+	<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
 </x-column>
 </template>
 
@@ -10,13 +10,14 @@
 import Vue from 'vue';
 import i18n from '../../../i18n';
 import XColumn from './deck.column.vue';
-import XMentions from './deck.mentions.vue';
+import XNotes from './deck.notes.vue';
 
 export default Vue.extend({
 	i18n: i18n(),
+
 	components: {
 		XColumn,
-		XMentions
+		XNotes
 	},
 
 	props: {
@@ -30,6 +31,22 @@ export default Vue.extend({
 		}
 	},
 
+	data() {
+		return {
+			connection: null,
+			pagination: {
+				endpoint: 'notes/mentions',
+				limit: 10,
+				params: init => ({
+					untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
+					includeMyRenotes: this.$store.state.settings.showMyRenotes,
+					includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
+					includeLocalRenotes: this.$store.state.settings.showLocalRenotes
+				})
+			}
+		};
+	},
+
 	computed: {
 		name(): string {
 			if (this.column.name) return this.column.name;
@@ -37,9 +54,22 @@ export default Vue.extend({
 		}
 	},
 
+	mounted() {
+		this.connection = this.$root.stream.useSharedConnection('main');
+		this.connection.on('mention', this.onNote);
+	},
+
+	beforeDestroy() {
+		this.connection.dispose();
+	},
+
 	methods: {
+		onNote(note) {
+			(this.$refs.timeline as any).prepend(note);
+		},
+
 		focus() {
-			this.$refs.tl.focus();
+			this.$refs.timeline.focus();
 		}
 	}
 });

src/client/app/common/views/deck/deck.mentions.vue

@@ -1,49 +0,0 @@
-<template>
-<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-import XNotes from './deck.notes.vue';
-
-export default Vue.extend({
-	components: {
-		XNotes
-	},
-
-	data() {
-		return {
-			connection: null,
-			pagination: {
-				endpoint: 'notes/mentions',
-				limit: 10,
-				params: init => ({
-					untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
-					includeMyRenotes: this.$store.state.settings.showMyRenotes,
-					includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
-					includeLocalRenotes: this.$store.state.settings.showLocalRenotes
-				})
-			}
-		};
-	},
-
-	mounted() {
-		this.connection = this.$root.stream.useSharedConnection('main');
-		this.connection.on('mention', this.onNote);
-	},
-
-	beforeDestroy() {
-		this.connection.dispose();
-	},
-
-	methods: {
-		onNote(note) {
-			(this.$refs.timeline as any).prepend(note);
-		},
-
-		focus() {
-			this.$refs.timeline.focus();
-		}
-	}
-});
-</script>