fix: not remembering the selected editor (#6114)

#### What type of PR is this?

/area ui
/kind bug
/milestone 2.17.x

#### What this PR does / why we need it:

修复新建文章时,没有自动选择之前所选编辑器的问题。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/6091

#### Special notes for your reviewer:

#### Does this PR introduce a user-facing change?

```release-note
修复新建文章时,没有自动选择之前所选编辑器的问题。
```
pull/6128/head
Ryan Wang 2024-06-23 11:46:29 +08:00 committed by GitHub
parent c10862d6fe
commit 373229e9de
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 21 additions and 11 deletions

View File

@ -50,7 +50,7 @@ const { mutateAsync: singlePageUpdateMutate } = usePageUpdateMutate();
const { currentUserHasPermission } = usePermission(); const { currentUserHasPermission } = usePermission();
// Editor providers // Editor providers
const { editorProviders } = useEditorExtensionPoints(); const { editorProviders, fetchEditorProviders } = useEditorExtensionPoints();
const currentEditorProvider = ref<EditorProvider>(); const currentEditorProvider = ref<EditorProvider>();
const storedEditorProviderName = useLocalStorage("editor-provider-name", ""); const storedEditorProviderName = useLocalStorage("editor-provider-name", "");
@ -331,6 +331,8 @@ const onSettingPublished = (singlePage: SinglePage) => {
}; };
onMounted(async () => { onMounted(async () => {
await fetchEditorProviders();
if (routeQueryName.value) { if (routeQueryName.value) {
const { data: singlePage } = const { data: singlePage } =
await apiClient.extension.singlePage.getContentHaloRunV1alpha1SinglePage({ await apiClient.extension.singlePage.getContentHaloRunV1alpha1SinglePage({

View File

@ -50,7 +50,7 @@ const { mutateAsync: postUpdateMutate } = usePostUpdateMutate();
const { currentUserHasPermission } = usePermission(); const { currentUserHasPermission } = usePermission();
// Editor providers // Editor providers
const { editorProviders } = useEditorExtensionPoints(); const { editorProviders, fetchEditorProviders } = useEditorExtensionPoints();
const currentEditorProvider = ref<EditorProvider>(); const currentEditorProvider = ref<EditorProvider>();
const storedEditorProviderName = useLocalStorage("editor-provider-name", ""); const storedEditorProviderName = useLocalStorage("editor-provider-name", "");
@ -356,6 +356,8 @@ const onSettingPublished = (post: Post) => {
// Get post data when the route contains the name parameter // Get post data when the route contains the name parameter
const name = useRouteQuery<string>("name"); const name = useRouteQuery<string>("name");
onMounted(async () => { onMounted(async () => {
await fetchEditorProviders();
if (name.value) { if (name.value) {
// fetch post // fetch post
const { data: post } = const { data: post } =

View File

@ -1,12 +1,12 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points"; import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
import type { EditorProvider } from "@halo-dev/console-shared";
import { import {
VAvatar,
IconExchange, IconExchange,
VAvatar,
VDropdown, VDropdown,
VDropdownItem, VDropdownItem,
} from "@halo-dev/components"; } from "@halo-dev/components";
import type { EditorProvider } from "@halo-dev/console-shared";
withDefaults( withDefaults(
defineProps<{ defineProps<{
@ -23,7 +23,9 @@ const emit = defineEmits<{
(event: "select", provider: EditorProvider): void; (event: "select", provider: EditorProvider): void;
}>(); }>();
const { editorProviders } = useEditorExtensionPoints(); const { editorProviders, fetchEditorProviders } = useEditorExtensionPoints();
fetchEditorProviders();
</script> </script>
<template> <template>

View File

@ -2,11 +2,12 @@ import Logo from "@/assets/logo.png";
import { usePluginModuleStore } from "@/stores/plugin"; import { usePluginModuleStore } from "@/stores/plugin";
import { VLoading } from "@halo-dev/components"; import { VLoading } from "@halo-dev/components";
import type { EditorProvider } from "@halo-dev/console-shared"; import type { EditorProvider } from "@halo-dev/console-shared";
import { defineAsyncComponent, markRaw, onMounted, ref, type Ref } from "vue"; import { defineAsyncComponent, markRaw, ref, type Ref } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
interface useEditorExtensionPointsReturn { interface useEditorExtensionPointsReturn {
editorProviders: Ref<EditorProvider[]>; editorProviders: Ref<EditorProvider[]>;
fetchEditorProviders: () => Promise<void>;
} }
export function useEditorExtensionPoints(): useEditorExtensionPointsReturn { export function useEditorExtensionPoints(): useEditorExtensionPointsReturn {
@ -30,7 +31,7 @@ export function useEditorExtensionPoints(): useEditorExtensionPointsReturn {
}, },
]); ]);
onMounted(async () => { async function fetchEditorProviders() {
for (const pluginModule of pluginModules) { for (const pluginModule of pluginModules) {
try { try {
const callbackFunction = const callbackFunction =
@ -40,16 +41,17 @@ export function useEditorExtensionPoints(): useEditorExtensionPointsReturn {
continue; continue;
} }
const providers = await callbackFunction(); const pluginProviders = await callbackFunction();
editorProviders.value.push(...providers); editorProviders.value.push(...pluginProviders);
} catch (error) { } catch (error) {
console.error(`Error processing plugin module:`, pluginModule, error); console.error(`Error processing plugin module:`, pluginModule, error);
} }
} }
}); }
return { return {
editorProviders, editorProviders,
fetchEditorProviders,
}; };
} }

View File

@ -102,7 +102,7 @@ provide<ComputedRef<string | undefined>>(
); );
// Editor providers // Editor providers
const { editorProviders } = useEditorExtensionPoints(); const { editorProviders, fetchEditorProviders } = useEditorExtensionPoints();
const currentEditorProvider = ref<EditorProvider>(); const currentEditorProvider = ref<EditorProvider>();
const storedEditorProviderName = useLocalStorage("editor-provider-name", ""); const storedEditorProviderName = useLocalStorage("editor-provider-name", "");
@ -125,6 +125,8 @@ const handleChangeEditorProvider = async (provider: EditorProvider) => {
const name = useRouteQuery<string | undefined>("name"); const name = useRouteQuery<string | undefined>("name");
onMounted(async () => { onMounted(async () => {
await fetchEditorProviders();
if (name.value) { if (name.value) {
await getLatestPost(); await getLatestPost();
await handleFetchContent(); await handleFetchContent();