wip

src/client/app/desktop/views/pages/deck/deck.vue

@@ -1,10 +1,12 @@
 <template>
 <mk-ui :class="$style.root">
 	<div class="qlvquzbjribqcaozciifydkngcwtyzje">
-		<x-tl-column src="home"/>
-		<x-notifications-column/>
-		<x-tl-column src="local"/>
-		<x-tl-column src="global"/>
+		<template v-for="column in columns">
+			<x-notifications-column v-if="column.type == 'notifications'" :key="column.id"/>
+			<x-tl-column v-if="column.type == 'home'" :key="column.id" src="home"/>
+			<x-tl-column v-if="column.type == 'local'" :key="column.id" src="local"/>
+			<x-tl-column v-if="column.type == 'global'" :key="column.id" src="global"/>
+		</template>
 	</div>
 </mk-ui>
 </template>
@@ -13,11 +15,45 @@
 import Vue from 'vue';
 import XTlColumn from './deck.tl-column.vue';
 import XNotificationsColumn from './deck.notifications-column.vue';
+import * as uuid from 'uuid';
 
 export default Vue.extend({
 	components: {
 		XTlColumn,
 		XNotificationsColumn
+	},
+	computed: {
+		columns() {
+			if (this.$store.state.settings.deck == null) return [];
+			return this.$store.state.settings.deck.columns;
+		}
+	},
+	created() {
+		if (this.$store.state.settings.deck == null) {
+			const deck = {
+				columns: [/*{
+					type: 'widgets',
+					widgets: []
+				}, */{
+					id: uuid(),
+					type: 'home'
+				}, {
+					id: uuid(),
+					type: 'notifications'
+				}, {
+					id: uuid(),
+					type: 'local'
+				}, {
+					id: uuid(),
+					type: 'global'
+				}]
+			};
+
+			this.$store.dispatch('settings/set', {
+				key: 'deck',
+				value: deck
+			});
+		}
 	}
 });
 </script>

src/client/app/store.ts

@@ -7,20 +7,7 @@ import { hostname } from './config';
 const defaultSettings = {
 	home: null,
 	mobileHome: [],
-	deck: {
-		columns: [/*{
-			type: 'widgets',
-			widgets: []
-		}, */{
-			type: 'home'
-		}, {
-			type: 'notifications'
-		}, {
-			type: 'local'
-		}, {
-			type: 'global'
-		}]
-	},
+	deck: null,
 	fetchOnScroll: true,
 	showMaps: true,
 	showPostFormOnTopOfTl: false,