From 050a3dd602b1bbef235618e316f49a03c9fef6c2 Mon Sep 17 00:00:00 2001
From: PiEgg <marksz@teamsz.xyz>
Date: Sun, 22 Oct 2023 14:00:51 +0800
Subject: [PATCH] :bug: Fix: can't add new config for picbed

ISSUES CLOSED: #1184
---
 src/main/events/picgoCoreIPC.ts        |  9 +++++----
 src/renderer/components/ConfigForm.vue | 20 ++++++++++----------
 src/renderer/hooks/useConfigForm.ts    |  4 +++-
 src/renderer/pages/picbeds/index.vue   | 14 ++++++--------
 src/universal/events/constants.ts      |  1 +
 5 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/src/main/events/picgoCoreIPC.ts b/src/main/events/picgoCoreIPC.ts
index de70b21..c8e6cda 100644
--- a/src/main/events/picgoCoreIPC.ts
+++ b/src/main/events/picgoCoreIPC.ts
@@ -29,7 +29,8 @@ import {
   OPEN_WINDOW,
   GET_LANGUAGE_LIST,
   SET_CURRENT_LANGUAGE,
-  GET_CURRENT_LANGUAGE
+  GET_CURRENT_LANGUAGE,
+  GET_PICBED_CONFIG
 } from '#/events/constants'
 
 import { GalleryDB } from 'apis/core/datastore'
@@ -223,14 +224,14 @@ const handleNPMError = (): IDispose => {
 }
 
 const handleGetPicBedConfig = () => {
-  ipcMain.on('getPicBedConfig', (event: IpcMainEvent, type: string) => {
+  ipcMain.on(GET_PICBED_CONFIG, (event: IpcMainEvent, type: string) => {
     const name = picgo.helper.uploader.get(type)?.name || type
     if (picgo.helper.uploader.get(type)?.config) {
       const _config = picgo.helper.uploader.get(type)!.config!(picgo)
       const config = handleConfigWithFunction(_config)
-      event.sender.send('getPicBedConfig', config, name)
+      event.sender.send(GET_PICBED_CONFIG, config, name)
     } else {
-      event.sender.send('getPicBedConfig', [], name)
+      event.sender.send(GET_PICBED_CONFIG, [], name)
     }
   })
 }
diff --git a/src/renderer/components/ConfigForm.vue b/src/renderer/components/ConfigForm.vue
index ede9cab..c1b4a93 100644
--- a/src/renderer/components/ConfigForm.vue
+++ b/src/renderer/components/ConfigForm.vue
@@ -45,13 +45,7 @@ const $route = useRoute()
 const $form = ref<IFormInstance>()
 const configList = ref<IPicGoPluginConfig[]>([])
 const formModel = reactive<IStringKeyMap>({})
-
-watch(toRefs(props.config), (val: IPicGoPluginConfig[]) => {
-  handleConfig(val)
-}, {
-  deep: true,
-  immediate: true
-})
+const isUploader = props.type === 'uploader'
 
 async function validate (): Promise<IStringKeyMap | false> {
   const res = await $form.value?.validate() || false
@@ -74,14 +68,13 @@ function getConfigType () {
   }
 }
 
-const isUploader = props.type === 'uploader'
-
 const handleConfigForm = useConfigForm()
 
 async function handleConfig (inputConfig: IPicGoPluginConfig[]) {
   const currentConfig = await getCurConfigFormData()
+  const resetConfig = isUploader && !$route.params.configId
   Object.assign(formModel, currentConfig)
-  configList.value = handleConfigForm(inputConfig, formModel, currentConfig)
+  configList.value = handleConfigForm(inputConfig, formModel, currentConfig, resetConfig)
 }
 
 async function getCurConfigFormData () {
@@ -101,6 +94,13 @@ async function resetConfig () {
   Object.assign(formModel, config)
 }
 
+watch(toRefs(props.config), (val: IPicGoPluginConfig[]) => {
+  handleConfig(val)
+}, {
+  deep: true,
+  immediate: true
+})
+
 defineExpose({
   validate,
   getConfigType,
diff --git a/src/renderer/hooks/useConfigForm.ts b/src/renderer/hooks/useConfigForm.ts
index 3f3cc54..96355aa 100644
--- a/src/renderer/hooks/useConfigForm.ts
+++ b/src/renderer/hooks/useConfigForm.ts
@@ -4,13 +4,15 @@ import { cloneDeep, union } from 'lodash'
  * @param configList origin config list
  * @param formModel el-form form model for default value
  * @param currentConfig current config
+ * @param resetConfigForm reset form model -> clear default value
  * @returns transformed config list
  */
 export const useConfigForm = () => {
-  return (configList: IPicGoPluginConfig[], formModel: IStringKeyMap, currentConfig?: IStringKeyMap) => {
+  return (configList: IPicGoPluginConfig[], formModel: IStringKeyMap, currentConfig?: IStringKeyMap, resetConfigForm?: boolean) => {
     if (configList.length > 0) {
       return cloneDeep(configList).map((item) => {
         // if (!configId) return item
+        if (resetConfigForm) return item
         let defaultValue = item.default !== undefined
           ? item.default
           : item.type === 'checkbox'
diff --git a/src/renderer/pages/picbeds/index.vue b/src/renderer/pages/picbeds/index.vue
index 2acdb16..5c96ec9 100644
--- a/src/renderer/pages/picbeds/index.vue
+++ b/src/renderer/pages/picbeds/index.vue
@@ -43,16 +43,17 @@
 </template>
 <script lang="ts" setup>
 import { IRPCActionType } from '~/universal/types/enum'
-import { ref, onBeforeUnmount, onBeforeMount } from 'vue'
+import { ref, onBeforeMount } from 'vue'
 import { T as $T } from '@/i18n/index'
 import { sendToMain, triggerRPC } from '@/utils/dataSender'
 import { useRoute, useRouter } from 'vue-router'
 import ConfigForm from '@/components/ConfigForm.vue'
 // import mixin from '@/utils/ConfirmButtonMixin'
 import {
-  ipcRenderer,
   IpcRendererEvent
 } from 'electron'
+import { GET_PICBED_CONFIG } from '~/universal/events/constants'
+import { useIPCOn } from '@/hooks/useIPC'
 const type = ref('')
 const config = ref<IPicGoPluginConfig[]>([])
 const picBedName = ref('')
@@ -61,9 +62,10 @@ const $router = useRouter()
 const $configForm = ref<InstanceType<typeof ConfigForm> | null>(null)
 type.value = $route.params.type as string
 
+useIPCOn(GET_PICBED_CONFIG, getPicBeds)
+
 onBeforeMount(() => {
-  sendToMain('getPicBedConfig', $route.params.type)
-  ipcRenderer.on('getPicBedConfig', getPicBeds)
+  sendToMain(GET_PICBED_CONFIG, $route.params.type)
 })
 
 const handleConfirm = async () => {
@@ -85,10 +87,6 @@ function getPicBeds (event: IpcRendererEvent, _config: IPicGoPluginConfig[], nam
   picBedName.value = name
 }
 
-onBeforeUnmount(() => {
-  ipcRenderer.removeListener('getPicBedConfig', getPicBeds)
-})
-
 </script>
 <script lang="ts">
 export default {
diff --git a/src/universal/events/constants.ts b/src/universal/events/constants.ts
index daa9ad6..4bbd8ae 100644
--- a/src/universal/events/constants.ts
+++ b/src/universal/events/constants.ts
@@ -36,6 +36,7 @@ export const FORCE_UPDATE = 'FORCE_UPDATE'
 export const OPEN_WINDOW = 'OPEN_WINDOW'
 export const GET_PICBEDS = 'GET_PICBEDS'
 export const RPC_ACTIONS = 'RPC_ACTIONS'
+export const GET_PICBED_CONFIG = 'GET_PICBED_CONFIG'
 // i18n
 export const GET_CURRENT_LANGUAGE = 'GET_CURRENT_LANGUAGE'
 export const GET_LANGUAGE_LIST = 'GET_LANGUAGE_LIST'