Merge branch 'develop'

12 files changed, 71 insertions, 51 deletions

diff --git a/packages/client/src/components/page-window.vue b/packages/client/src/components/page-window.vue
index 5b06c7718c..98140b95c0 100644
--- a/packages/client/src/components/page-window.vue
+++ b/packages/client/src/components/page-window.vue
@@ -122,7 +122,7 @@ function close() {
 }
 
 function expand() {
-	mainRouter.push(router.getCurrentPath());
+	mainRouter.push(router.getCurrentPath(), 'forcePage');
 	windowEl.close();
 }
 
diff --git a/packages/client/src/nirax.ts b/packages/client/src/nirax.ts
index 4efa0345af..4ba1fe70f6 100644
--- a/packages/client/src/nirax.ts
+++ b/packages/client/src/nirax.ts
@@ -71,7 +71,7 @@ export class Router extends EventEmitter<{
 	private currentKey = Date.now().toString();
 
 	public currentRoute: ShallowRef<RouteDef | null> = shallowRef(null);
-	public navHook: ((path: string) => boolean) | null = null;
+	public navHook: ((path: string, flag?: any) => boolean) | null = null;
 
 	constructor(routes: Router['routes'], currentPath: Router['currentPath']) {
 		super();
@@ -213,14 +213,14 @@ export class Router extends EventEmitter<{
 		return this.currentKey;
 	}
 
-	public push(path: string) {
+	public push(path: string, flag?: any) {
 		const beforePath = this.currentPath;
 		if (path === beforePath) {
 			this.emit('same');
 			return;
 		}
 		if (this.navHook) {
-			const cancel = this.navHook(path);
+			const cancel = this.navHook(path, flag);
 			if (cancel) return;
 		}
 		this.navigate(path, null);
diff --git a/packages/client/src/pages/registry.keys.vue b/packages/client/src/pages/registry.keys.vue
index 9d2f24f18a..e580779052 100644
--- a/packages/client/src/pages/registry.keys.vue
+++ b/packages/client/src/pages/registry.keys.vue
@@ -1,7 +1,7 @@
 <template>
 <MkStickyContainer>
 	<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
-	<MkSpacer :content-max="600">
+	<MkSpacer :content-max="600" :margin-min="16">
 		<FormSplit>
 			<MkKeyValue class="_formBlock">
 				<template #key>{{ $ts._registry.domain }}</template>
diff --git a/packages/client/src/pages/registry.value.vue b/packages/client/src/pages/registry.value.vue
index 5291b2e4c8..34253cc93b 100644
--- a/packages/client/src/pages/registry.value.vue
+++ b/packages/client/src/pages/registry.value.vue
@@ -1,7 +1,7 @@
 <template>
 <MkStickyContainer>
 	<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
-	<MkSpacer :content-max="600">
+	<MkSpacer :content-max="600" :margin-min="16">
 		<FormInfo warn>{{ $ts.editTheseSettingsMayBreakAccount }}</FormInfo>
 
 		<template v-if="value">
diff --git a/packages/client/src/pages/registry.vue b/packages/client/src/pages/registry.vue
index a428755a88..f022a0d688 100644
--- a/packages/client/src/pages/registry.vue
+++ b/packages/client/src/pages/registry.vue
@@ -1,7 +1,7 @@
 <template>
 <MkStickyContainer>
 	<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
-	<MkSpacer :content-max="600">
+	<MkSpacer :content-max="600" :margin-min="16">
 		<MkButton primary @click="createKey">{{ i18n.ts._registry.createKey }}</MkButton>
 
 		<FormSection v-if="scopes">
diff --git a/packages/client/src/ui/deck.vue b/packages/client/src/ui/deck.vue
index 8c9e52063d..f8263b1b9e 100644
--- a/packages/client/src/ui/deck.vue
+++ b/packages/client/src/ui/deck.vue
@@ -89,7 +89,8 @@ import { mainRouter } from '@/router';
 import { unisonReload } from '@/scripts/unison-reload';
 const XStatusBars = defineAsyncComponent(() => import('@/ui/_common_/statusbars.vue'));
 
-mainRouter.navHook = (path): boolean => {
+mainRouter.navHook = (path, flag): boolean => {
+	if (flag === 'forcePage') return false;
 	const noMainColumn = !deckStore.state.columns.some(x => x.type === 'main');
 	if (deckStore.state.navWindow || noMainColumn) {
 		os.pageWindow(path);
@@ -161,8 +162,6 @@ const onContextmenu = (ev) => {
 	}], ev);
 };
 
-provide('shouldSpacerMin', true);
-
 document.documentElement.style.overflowY = 'hidden';
 document.documentElement.style.scrollBehavior = 'auto';
 window.addEventListener('wheel', (ev) => {
diff --git a/packages/client/src/ui/deck/antenna-column.vue b/packages/client/src/ui/deck/antenna-column.vue
index f12f5c6b25..6268c357eb 100644
--- a/packages/client/src/ui/deck/antenna-column.vue
+++ b/packages/client/src/ui/deck/antenna-column.vue
@@ -1,5 +1,5 @@
 <template>
-<XColumn :func="{ handler: setAntenna, title: $ts.selectAntenna }" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
+<XColumn :menu="menu" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
 	<template #header>
 		<i class="fas fa-satellite"></i><span style="margin-left: 8px;">{{ column.name }}</span>
 	</template>
@@ -11,9 +11,9 @@
 <script lang="ts" setup>
 import { onMounted } from 'vue';
 import XColumn from './column.vue';
+import { updateColumn, Column } from './deck-store';
 import XTimeline from '@/components/timeline.vue';
 import * as os from '@/os';
-import { updateColumn, Column } from './deck-store';
 import { i18n } from '@/i18n';
 
 const props = defineProps<{
@@ -39,15 +39,22 @@ async function setAntenna() {
 	const { canceled, result: antenna } = await os.select({
 		title: i18n.ts.selectAntenna,
 		items: antennas.map(x => ({
-			value: x, text: x.name
+			value: x, text: x.name,
 		})),
-		default: props.column.antennaId
+		default: props.column.antennaId,
 	});
 	if (canceled) return;
 	updateColumn(props.column.id, {
-		antennaId: antenna.id
+		antennaId: antenna.id,
 	});
 }
+
+const menu = [{
+	icon: 'fas fa-pencil-alt',
+	text: i18n.ts.selectAntenna,
+	action: setAntenna,
+}];
+
 /*
 function focus() {
 	timeline.focus();
diff --git a/packages/client/src/ui/deck/column.vue b/packages/client/src/ui/deck/column.vue
index 4d34ca9b8e..1a1bd7d266 100644
--- a/packages/client/src/ui/deck/column.vue
+++ b/packages/client/src/ui/deck/column.vue
@@ -31,31 +31,25 @@
 </section>
 </template>
 
-<script lang="ts">
-export type DeckFunc = {
-	title: string;
-	handler: (payload: MouseEvent) => void;
-	icon?: string;
-};
-</script>
 <script lang="ts" setup>
-import { onBeforeUnmount, onMounted, provide, watch } from 'vue';
+import { onBeforeUnmount, onMounted, provide, Ref, watch } from 'vue';
 import { updateColumn, swapLeftColumn, swapRightColumn, swapUpColumn, swapDownColumn, stackLeftColumn, popRightColumn, removeColumn, swapColumn, Column , deckStore } from './deck-store';
 import * as os from '@/os';
 import { i18n } from '@/i18n';
+import { MenuItem } from '@/types/menu';
 
 provide('shouldHeaderThin', true);
 provide('shouldOmitHeaderTitle', true);
+provide('shouldSpacerMin', true);
 
 const props = withDefaults(defineProps<{
 	column: Column;
 	isStacked?: boolean;
-	func?: DeckFunc | null;
 	naked?: boolean;
 	indicated?: boolean;
+	menu?: MenuItem[];
 }>(), {
 	isStacked: false,
-	func: null,
 	naked: false,
 	indicated: false,
 });
@@ -110,9 +104,9 @@ function toggleActive() {
 }
 
 function getMenu() {
-	const items = [{
-		icon: 'fas fa-pencil-alt',
-		text: i18n.ts.edit,
+	let items = [{
+		icon: 'fas fa-cog',
+		text: i18n.ts._deck.configureColumn,
 		action: async () => {
 			const { canceled, result } = await os.form(props.column.name, {
 				name: {
@@ -179,13 +173,9 @@ function getMenu() {
 		},
 	}];
 
-	if (props.func) {
+	if (props.menu) {
 		items.unshift(null);
-		items.unshift({
-			icon: props.func.icon,
-			text: props.func.title,
-			action: props.func.handler,
-		});
+		items = props.menu.concat(items);
 	}
 
 	return items;
diff --git a/packages/client/src/ui/deck/list-column.vue b/packages/client/src/ui/deck/list-column.vue
index a27e65594a..6fbb9f0e6c 100644
--- a/packages/client/src/ui/deck/list-column.vue
+++ b/packages/client/src/ui/deck/list-column.vue
@@ -1,5 +1,5 @@
 <template>
-<XColumn :func="{ handler: setList, title: $ts.selectList }" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
+<XColumn :menu="menu" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
 	<template #header>
 		<i class="fas fa-list-ul"></i><span style="margin-left: 8px;">{{ column.name }}</span>
 	</template>
@@ -11,9 +11,9 @@
 <script lang="ts" setup>
 import { } from 'vue';
 import XColumn from './column.vue';
+import { updateColumn, Column } from './deck-store';
 import XTimeline from '@/components/timeline.vue';
 import * as os from '@/os';
-import { updateColumn, Column } from './deck-store';
 import { i18n } from '@/i18n';
 
 const props = defineProps<{
@@ -37,16 +37,22 @@ async function setList() {
 	const { canceled, result: list } = await os.select({
 		title: i18n.ts.selectList,
 		items: lists.map(x => ({
-			value: x, text: x.name
+			value: x, text: x.name,
 		})),
-		default: props.column.listId
+		default: props.column.listId,
 	});
 	if (canceled) return;
 	updateColumn(props.column.id, {
-		listId: list.id
+		listId: list.id,
 	});
 }
 
+const menu = [{
+	icon: 'fas fa-pencil-alt',
+	text: i18n.ts.selectList,
+	action: setList,
+}];
+
 /*
 function focus() {
 	timeline.focus();
diff --git a/packages/client/src/ui/deck/notifications-column.vue b/packages/client/src/ui/deck/notifications-column.vue
index 6dd040cb8d..34132f2e9f 100644
--- a/packages/client/src/ui/deck/notifications-column.vue
+++ b/packages/client/src/ui/deck/notifications-column.vue
@@ -1,5 +1,5 @@
 <template>
-<XColumn :column="column" :is-stacked="isStacked" :func="{ handler: func, title: $ts.notificationSetting }" @parent-focus="$event => emit('parent-focus', $event)">
+<XColumn :column="column" :is-stacked="isStacked" :menu="menu" @parent-focus="$event => emit('parent-focus', $event)">
 	<template #header><i class="fas fa-bell" style="margin-right: 8px;"></i>{{ column.name }}</template>
 
 	<XNotifications :include-types="column.includingTypes"/>
@@ -9,10 +9,10 @@
 <script lang="ts" setup>
 import { defineAsyncComponent } from 'vue';
 import XColumn from './column.vue';
+import { updateColumn , Column } from './deck-store';
 import XNotifications from '@/components/notifications.vue';
 import * as os from '@/os';
-import { updateColumn } from './deck-store';
-import { Column } from './deck-store';
+import { i18n } from '@/i18n';
 
 const props = defineProps<{
 	column: Column;
@@ -30,9 +30,15 @@ function func() {
 		done: async (res) => {
 			const { includingTypes } = res;
 			updateColumn(props.column.id, {
-				includingTypes: includingTypes
+				includingTypes: includingTypes,
 			});
 		},
 	}, 'closed');
 }
+
+const menu = [{
+	icon: 'fas fa-pencil-alt',
+	text: i18n.ts.notificationSetting,
+	action: func,
+}];
 </script>
diff --git a/packages/client/src/ui/deck/tl-column.vue b/packages/client/src/ui/deck/tl-column.vue
index f3ecda5aa4..6ea8e1a8aa 100644
--- a/packages/client/src/ui/deck/tl-column.vue
+++ b/packages/client/src/ui/deck/tl-column.vue
@@ -1,5 +1,5 @@
 <template>
-<XColumn :func="{ handler: setType, title: $ts.timeline }" :column="column" :is-stacked="isStacked" :indicated="indicated" @change-active-state="onChangeActiveState" @parent-focus="$event => emit('parent-focus', $event)">
+<XColumn :menu="menu" :column="column" :is-stacked="isStacked" :indicated="indicated" @change-active-state="onChangeActiveState" @parent-focus="$event => emit('parent-focus', $event)">
 	<template #header>
 		<i v-if="column.tl === 'home'" class="fas fa-home"></i>
 		<i v-else-if="column.tl === 'local'" class="fas fa-comments"></i>
@@ -22,9 +22,9 @@
 <script lang="ts" setup>
 import { onMounted } from 'vue';
 import XColumn from './column.vue';
+import { removeColumn, updateColumn, Column } from './deck-store';
 import XTimeline from '@/components/timeline.vue';
 import * as os from '@/os';
-import { removeColumn, updateColumn, Column } from './deck-store';
 import { $i } from '@/account';
 import { instance } from '@/instance';
 import { i18n } from '@/i18n';
@@ -57,13 +57,13 @@ async function setType() {
 	const { canceled, result: src } = await os.select({
 		title: i18n.ts.timeline,
 		items: [{
-			value: 'home' as const, text: i18n.ts._timelines.home
+			value: 'home' as const, text: i18n.ts._timelines.home,
 		}, {
-			value: 'local' as const, text: i18n.ts._timelines.local
+			value: 'local' as const, text: i18n.ts._timelines.local,
 		}, {
-			value: 'social' as const, text: i18n.ts._timelines.social
+			value: 'social' as const, text: i18n.ts._timelines.social,
 		}, {
-			value: 'global' as const, text: i18n.ts._timelines.global
+			value: 'global' as const, text: i18n.ts._timelines.global,
 		}],
 	});
 	if (canceled) {
@@ -73,7 +73,7 @@ async function setType() {
 		return;
 	}
 	updateColumn(props.column.id, {
-		tl: src
+		tl: src,
 	});
 }
 
@@ -97,6 +97,12 @@ function onChangeActiveState(state) {
 	}
 }
 
+const menu = [{
+	icon: 'fas fa-pencil-alt',
+	text: i18n.ts.timeline,
+	action: setType,
+}];
+
 /*
 export default defineComponent({
 	watch: {
diff --git a/packages/client/src/ui/deck/widgets-column.vue b/packages/client/src/ui/deck/widgets-column.vue
index f181fc328d..3661dda59f 100644
--- a/packages/client/src/ui/deck/widgets-column.vue
+++ b/packages/client/src/ui/deck/widgets-column.vue
@@ -1,5 +1,5 @@
 <template>
-<XColumn :func="{ handler: func, title: $ts.editWidgets }" :naked="true" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
+<XColumn :menu="menu" :naked="true" :column="column" :is-stacked="isStacked" @parent-focus="$event => emit('parent-focus', $event)">
 	<template #header><i class="fas fa-window-maximize" style="margin-right: 8px;"></i>{{ column.name }}</template>
 
 	<div class="wtdtxvec">
@@ -46,6 +46,12 @@ function updateWidgets(widgets) {
 function func() {
 	edit = !edit;
 }
+
+const menu = [{
+	icon: 'fas fa-pencil-alt',
+	text: i18n.ts.editWidgets,
+	action: func,
+}];
 </script>
 
 <style lang="scss" scoped>