Merge branch 'use-sync-visibility-picker' into 'develop'

chore: don't import MkVisibilityPicker dynamically

Co-authored-by: Lhcfl <Lhcfl@outlook.com>

See merge request firefish/firefish!10736

packages/client/src/components/MkPostForm.vue

@@ -297,22 +297,14 @@
 </template>
 
 <script lang="ts" setup>
-import {
-	computed,
-	defineAsyncComponent,
-	inject,
-	nextTick,
-	onMounted,
-	ref,
-	watch,
-} from "vue";
+import { computed, inject, nextTick, onMounted, ref, watch } from "vue";
 import * as mfm from "mfm-js";
 import autosize from "autosize";
 import insertTextAtCursor from "insert-text-at-cursor";
 import { length } from "stringz";
 import { toASCII } from "punycode/";
 import { acct } from "firefish-js";
-import type { entities, languages, noteVisibilities } from "firefish-js";
+import type { entities, languages } from "firefish-js";
 import { throttle } from "throttle-debounce";
 import XNoteSimple from "@/components/MkNoteSimple.vue";
 import XNotePreview from "@/components/MkNotePreview.vue";
@@ -347,6 +339,8 @@ import {
 } from "@/scripts/language-utils";
 import type { MenuItem } from "@/types/menu";
 import icon from "@/scripts/icon";
+import MkVisibilityPicker from "@/components/MkVisibilityPicker.vue";
+import type { NoteVisibility } from "@/types/note";
 
 const modal = inject("modal");
 
@@ -358,7 +352,7 @@ const props = withDefaults(
 		mention?: entities.User;
 		specified?: entities.User;
 		initialText?: string;
-		initialVisibility?: typeof noteVisibilities;
+		initialVisibility?: NoteVisibility;
 		initialLanguage?: typeof languages;
 		initialFiles?: entities.DriveFile[];
 		initialLocalOnly?: boolean;
@@ -412,10 +406,9 @@ const localOnly = ref<boolean>(
 );
 const visibility = ref(
 	props.initialVisibility ??
-		((defaultStore.state.rememberNoteVisibility
+		(defaultStore.state.rememberNoteVisibility
 			? defaultStore.state.visibility
-			: defaultStore.state
-					.defaultNoteVisibility) as (typeof noteVisibilities)[number]),
+			: defaultStore.state.defaultNoteVisibility),
 );
 
 const visibleUsers = ref([]);
@@ -737,7 +730,7 @@ function setVisibility() {
 	}
 
 	os.popup(
-		defineAsyncComponent(() => import("@/components/MkVisibilityPicker.vue")),
+		MkVisibilityPicker,
 		{
 			currentVisibility: visibility.value,
 			currentLocalOnly: localOnly.value,

packages/client/src/components/MkPostFormDialog.vue

@@ -21,9 +21,10 @@
 <script lang="ts" setup>
 import { shallowRef } from "vue";
 
-import type { entities, languages, noteVisibilities } from "firefish-js";
+import type { entities, languages } from "firefish-js";
 import MkModal from "@/components/MkModal.vue";
 import MkPostForm from "@/components/MkPostForm.vue";
+import type { NoteVisibility } from "@/types/note";
 
 const props = defineProps<{
 	reply?: entities.Note;
@@ -32,7 +33,7 @@ const props = defineProps<{
 	mention?: entities.User;
 	specified?: entities.User;
 	initialText?: string;
-	initialVisibility?: typeof noteVisibilities;
+	initialVisibility?: NoteVisibility;
 	initialLanguage?: typeof languages;
 	initialFiles?: entities.DriveFile[];
 	initialLocalOnly?: boolean;

packages/client/src/components/MkVisibilityPicker.vue

@@ -142,16 +142,16 @@
 
 <script lang="ts" setup>
 import { nextTick, ref, shallowRef, watch } from "vue";
-import type { noteVisibilities } from "firefish-js";
 import MkModal from "@/components/MkModal.vue";
 import { i18n } from "@/i18n";
 import icon from "@/scripts/icon";
+import type { NoteVisibility } from "@/types/note";
 
 const modal = shallowRef<InstanceType<typeof MkModal>>();
 
 const props = withDefaults(
 	defineProps<{
-		currentVisibility: (typeof noteVisibilities)[number];
+		currentVisibility: NoteVisibility;
 		currentLocalOnly: boolean;
 		src?: HTMLElement;
 	}>(),
@@ -159,7 +159,7 @@ const props = withDefaults(
 );
 
 const emit = defineEmits<{
-	(ev: "changeVisibility", v: (typeof noteVisibilities)[number]): void;
+	(ev: "changeVisibility", v: NoteVisibility): void;
 	(ev: "changeLocalOnly", v: boolean): void;
 	(ev: "closed"): void;
 }>();
@@ -171,9 +171,7 @@ watch(localOnly, () => {
 	emit("changeLocalOnly", localOnly.value);
 });
 
-function choose(
-	visibility: (typeof noteVisibilities)[number] | "private",
-): void {
+function choose(visibility: NoteVisibility): void {
 	v.value = visibility;
 	emit("changeVisibility", visibility);
 	nextTick(() => {

packages/client/src/pages/share.vue

@@ -34,7 +34,7 @@ import { computed, ref } from "vue";
 
 // SPECIFICATION: https://misskey-hub.net/docs/features/share-form.html
 import type { entities } from "firefish-js";
-import { acct, noteVisibilities } from "firefish-js";
+import { acct } from "firefish-js";
 import MkButton from "@/components/MkButton.vue";
 import XPostForm from "@/components/MkPostForm.vue";
 import * as os from "@/os";
@@ -42,6 +42,8 @@ import { mainRouter } from "@/router";
 import { definePageMetadata } from "@/scripts/page-metadata";
 import { i18n } from "@/i18n";
 import icon from "@/scripts/icon";
+import type { NoteVisibility } from "@/types/note";
+import { noteVisibilitiesClient } from "@/scripts/consts";
 
 const urlParams = new URLSearchParams(window.location.search);
 const localOnlyQuery = urlParams.get("localOnly");
@@ -54,8 +56,14 @@ const url = urlParams.get("url");
 const initialText = ref(null as string | null);
 const reply = ref(null as entities.Note | null);
 const renote = ref(null as entities.Note | null);
+
+function isVisibility(v: string | null): v is NoteVisibility {
+	if (v == null) return false;
+	return (noteVisibilitiesClient as readonly string[]).includes(v);
+}
+
 const visibility = ref(
-	noteVisibilities.includes(visibilityQuery) ? visibilityQuery : null,
+	isVisibility(visibilityQuery) ? visibilityQuery : undefined,
 );
 const localOnly = ref(
 	localOnlyQuery === "0" ? false : localOnlyQuery === "1" ? true : null,

packages/client/src/scripts/consts.ts

@@ -0,0 +1,6 @@
+import { noteVisibilities } from "firefish-js";
+import type { NoteVisibility } from "@/types/note";
+
+export const noteVisibilitiesClient = (
+	noteVisibilities as readonly NoteVisibility[]
+).concat("private");

packages/client/src/store.ts

@@ -1,6 +1,7 @@
 import { markRaw, ref } from "vue";
 import { isSignedIn } from "./me";
 import { Storage } from "./pizzax";
+import type { NoteVisibility } from "@/types/note";
 
 export const postFormActions = [];
 export const userActions = [];
@@ -75,7 +76,7 @@ export const defaultStore = markRaw(
 		},
 		defaultNoteVisibility: {
 			where: "account",
-			default: "public",
+			default: "public" as NoteVisibility,
 		},
 		defaultNoteLocalOnly: {
 			where: "account",
@@ -123,12 +124,7 @@ export const defaultStore = markRaw(
 		},
 		visibility: {
 			where: "deviceAccount",
-			default: "public" as
-				| "public"
-				| "home"
-				| "followers"
-				| "specified"
-				| "private",
+			default: "public" as NoteVisibility,
 		},
 		localOnly: {
 			where: "deviceAccount",

packages/client/src/types/note.ts

@@ -0,0 +1,3 @@
+import type { noteVisibilities } from "firefish-js";
+
+export type NoteVisibility = (typeof noteVisibilities)[number] | "private";