From 08e885d8a2c6bb752ef60fd59de54918de45bf90 Mon Sep 17 00:00:00 2001 From: Zehao Zhang Date: Thu, 31 Oct 2024 10:28:59 +0800 Subject: [PATCH] fix(entities-plugins): wrong custom plugin tab active state [KM-647] `activeTab` is not reactive, causing the custom plugin to activate on the serverless CP --- .../src/components/PluginSelect.vue | 33 ++++++++++++------- 1 file changed, 21 insertions(+), 12 deletions(-) diff --git a/packages/entities/entities-plugins/src/components/PluginSelect.vue b/packages/entities/entities-plugins/src/components/PluginSelect.vue index d6ad064ae0..1acee0519a 100644 --- a/packages/entities/entities-plugins/src/components/PluginSelect.vue +++ b/packages/entities/entities-plugins/src/components/PluginSelect.vue @@ -309,18 +309,27 @@ const noSearchResults = computed((): boolean => { return (Object.keys(pluginsList.value).length > 0 && !hasFilteredResults.value) }) -const tabs = props.config.app === 'konnect' - ? [{ - hash: '#kong', - title: t('plugins.select.tabs.kong.title'), - }, - { - hash: '#custom', - title: t('plugins.select.tabs.custom.title'), - disabled: props.disableCustomPlugins, - }] - : [] -const activeTab = ref(tabs.length ? route?.hash || tabs[0]?.hash || '' : '') +const tabs = computed(() => { + return props.config.app === 'konnect' + ? [{ + hash: '#kong', + title: t('plugins.select.tabs.kong.title'), + }, + { + hash: '#custom', + title: t('plugins.select.tabs.custom.title'), + disabled: props.disableCustomPlugins, + }] + : [] +}) +const activeTab = computed(() => { + let hash = tabs.value.length ? route?.hash || tabs.value[0]?.hash || '' : '' + // If custom plugins are disabled, default to kong tab + if (hash === '#custom' && props.disableCustomPlugins) { + hash = '#kong' + } + return hash +}) const buildPluginList = (): PluginCardList => { // If availableOnServer is false, we included unavailable plugins from pluginMeta in addition to available plugins