fix: clear extension definition options after switching extension points (#6165)

#### 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 #6164 

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

```release-note
修复在扩展点设置页面切换扩展点定义后,扩展定义的选项被清空的问题。
```
pull/6140/head^2
Ryan Wang 2024-06-27 15:12:53 +08:00 committed by GitHub
parent 54cd1c82f4
commit 28e4ef0756
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 11 additions and 4 deletions

View File

@ -5,7 +5,7 @@ import {
} from "@halo-dev/api-client";
import { Toast, VEmpty, VLoading } from "@halo-dev/components";
import { useQuery, useQueryClient } from "@tanstack/vue-query";
import { computed, ref, toRefs } from "vue";
import { computed, ref, toRefs, type Ref } from "vue";
import { useI18n } from "vue-i18n";
import { useExtensionDefinitionFetch } from "../../composables/use-extension-definition-fetch";
import ExtensionDefinitionListItem from "./ExtensionDefinitionListItem.vue";
@ -13,13 +13,20 @@ import ExtensionDefinitionListItem from "./ExtensionDefinitionListItem.vue";
const { t } = useI18n();
const queryClient = useQueryClient();
const Q_KEY = (name?: string) => ["extension-point-value", name];
const Q_KEY = (name?: Ref<string | undefined>) => [
"extension-point-value",
name,
];
const props = withDefaults(
defineProps<{ extensionPointDefinition?: ExtensionPointDefinition }>(),
{ extensionPointDefinition: undefined }
);
const extensionPointDefinitionName = computed(() => {
return extensionPointDefinition.value?.metadata.name;
});
const { extensionPointDefinition } = toRefs(props);
const { data: extensionDefinitions, isLoading } = useExtensionDefinitionFetch(
@ -27,7 +34,7 @@ const { data: extensionDefinitions, isLoading } = useExtensionDefinitionFetch(
);
const { data: value } = useQuery({
queryKey: Q_KEY(extensionPointDefinition.value?.metadata.name),
queryKey: Q_KEY(extensionPointDefinitionName),
queryFn: async () => {
if (!extensionPointDefinition.value) return null;
@ -88,7 +95,7 @@ async function onExtensionChange(e: Event) {
Toast.success(t("core.common.toast.save_success"));
queryClient.invalidateQueries({
queryKey: Q_KEY(extensionPointDefinition.value?.metadata.name),
queryKey: Q_KEY(extensionPointDefinitionName),
});
} catch (error) {
Toast.error(t("core.common.toast.save_failed_and_retry"));