From 911e34e98d5bb0699f4887cc69d102594b42acfe Mon Sep 17 00:00:00 2001
From: PiEgg <marksz@teamsz.xyz>
Date: Sat, 7 Jan 2023 20:45:01 +0800
Subject: [PATCH] :bug: Fix: i18n bug

---
 src/main.ts                               |  1 +
 src/renderer/App.vue                      | 14 +++++++++++++-
 src/renderer/components/ConfigForm.vue    |  2 +-
 src/renderer/pages/Gallery.vue            |  1 -
 src/renderer/pages/UploaderConfigPage.vue |  4 ----
 src/renderer/pages/picbeds/index.vue      |  2 --
 src/renderer/store/index.ts               | 14 +++++++++++---
 src/renderer/utils/common.ts              |  4 ++--
 src/renderer/utils/mainMixin.ts           | 11 ++++++++---
 9 files changed, 36 insertions(+), 17 deletions(-)

diff --git a/src/main.ts b/src/main.ts
index e3b2de9..3b99a1c 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -32,6 +32,7 @@ app.config.globalProperties.$builtInPicBed = [
   'aliyun',
   'github'
 ]
+app.config.unwrapInjectedRef = true
 
 app.config.globalProperties.$$db = db
 app.config.globalProperties.$http = axios
diff --git a/src/renderer/App.vue b/src/renderer/App.vue
index 118ed22..0bfff0f 100644
--- a/src/renderer/App.vue
+++ b/src/renderer/App.vue
@@ -6,9 +6,11 @@
 
 <script lang="ts" setup>
 import { useStore } from '@/hooks/useStore'
-import { onBeforeMount } from 'vue'
+import { onBeforeMount, onMounted, onUnmounted } from 'vue'
 import { getConfig } from './utils/dataSender'
 import type { IConfig } from 'picgo'
+import bus from './utils/bus'
+import { FORCE_UPDATE } from '~/universal/events/constants'
 
 const store = useStore()
 onBeforeMount(async () => {
@@ -18,6 +20,16 @@ onBeforeMount(async () => {
   }
 })
 
+onMounted(() => {
+  bus.on(FORCE_UPDATE, () => {
+    store?.updateForceUpdateTime()
+  })
+})
+
+onUnmounted(() => {
+  bus.off(FORCE_UPDATE)
+})
+
 </script>
 
 <script lang="ts">
diff --git a/src/renderer/components/ConfigForm.vue b/src/renderer/components/ConfigForm.vue
index c9d738e..368cf4c 100644
--- a/src/renderer/components/ConfigForm.vue
+++ b/src/renderer/components/ConfigForm.vue
@@ -73,7 +73,7 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { reactive, ref, watch, defineExpose, toRefs } from 'vue'
+import { reactive, ref, watch, toRefs } from 'vue'
 import { cloneDeep, union } from 'lodash'
 import { getConfig } from '@/utils/dataSender'
 import { useRoute } from 'vue-router'
diff --git a/src/renderer/pages/Gallery.vue b/src/renderer/pages/Gallery.vue
index 6095d8d..10323e7 100644
--- a/src/renderer/pages/Gallery.vue
+++ b/src/renderer/pages/Gallery.vue
@@ -549,7 +549,6 @@ async function handlePasteStyleChange (val: string) {
 }
 
 onBeforeUnmount(() => {
-  console.log('unmounted')
   ipcRenderer.removeAllListeners('updateGallery')
   ipcRenderer.removeListener(GET_PICBEDS, getPicBeds)
 })
diff --git a/src/renderer/pages/UploaderConfigPage.vue b/src/renderer/pages/UploaderConfigPage.vue
index 5d537fd..f01fece 100644
--- a/src/renderer/pages/UploaderConfigPage.vue
+++ b/src/renderer/pages/UploaderConfigPage.vue
@@ -112,26 +112,22 @@ onBeforeRouteUpdate((to, from, next) => {
   if (to.params.type && (to.name === UPLOADER_CONFIG_PAGE)) {
     type.value = to.params.type as string
     getCurrentConfigList()
-    console.log(type.value)
   }
   next()
 })
 
 onBeforeMount(() => {
   type.value = $route.params.type as string
-  console.log(type.value)
   getCurrentConfigList()
 })
 
 async function getCurrentConfigList () {
   const configList = await triggerRPC<IUploaderConfigItem>(IRPCActionType.GET_PICBED_CONFIG_LIST, type.value)
-  console.log(configList)
   curConfigList.value = configList?.configList ?? []
   defaultConfigId.value = configList?.defaultId ?? ''
 }
 
 function openEditPage (configId: string) {
-  console.log(configId, type.value, defaultConfigId.value)
   $router.push({
     name: PICBEDS_PAGE,
     params: {
diff --git a/src/renderer/pages/picbeds/index.vue b/src/renderer/pages/picbeds/index.vue
index 39f3433..2acdb16 100644
--- a/src/renderer/pages/picbeds/index.vue
+++ b/src/renderer/pages/picbeds/index.vue
@@ -60,7 +60,6 @@ const $route = useRoute()
 const $router = useRouter()
 const $configForm = ref<InstanceType<typeof ConfigForm> | null>(null)
 type.value = $route.params.type as string
-console.log('picbed type', $route.params.type)
 
 onBeforeMount(() => {
   sendToMain('getPicBedConfig', $route.params.type)
@@ -69,7 +68,6 @@ onBeforeMount(() => {
 
 const handleConfirm = async () => {
   const result = (await $configForm.value?.validate()) || false
-  console.log(result)
   if (result !== false) {
     await triggerRPC<void>(IRPCActionType.UPDATE_UPLOADER_CONFIG, type.value, result?._id, result)
     const successNotification = new Notification($T('SETTINGS_RESULT'), {
diff --git a/src/renderer/store/index.ts b/src/renderer/store/index.ts
index e15c740..015392e 100644
--- a/src/renderer/store/index.ts
+++ b/src/renderer/store/index.ts
@@ -1,4 +1,4 @@
-import { reactive, InjectionKey, readonly, App, UnwrapRef } from 'vue'
+import { reactive, InjectionKey, readonly, App, UnwrapRef, ref } from 'vue'
 import { saveConfig } from '@/utils/dataSender'
 
 export interface IState {
@@ -8,6 +8,7 @@ export interface IState {
 export interface IStore {
   state: UnwrapRef<IState>
   setDefaultPicBed: (type: string) => void;
+  updateForceUpdateTime: () => void;
 }
 
 export const storeKey: InjectionKey<IStore> = Symbol('store')
@@ -17,6 +18,8 @@ const state: IState = reactive({
   defaultPicBed: 'smms'
 })
 
+const forceUpdateTime = ref<number>(Date.now())
+
 // methods
 const setDefaultPicBed = (type: string) => {
   saveConfig({
@@ -24,14 +27,19 @@ const setDefaultPicBed = (type: string) => {
     'picBed.uploader': type
   })
   state.defaultPicBed = type
-  console.log(state)
+}
+
+const updateForceUpdateTime = () => {
+  forceUpdateTime.value = Date.now()
 }
 
 export const store = {
   install (app: App) {
     app.provide(storeKey, {
       state: readonly(state),
-      setDefaultPicBed
+      setDefaultPicBed,
+      updateForceUpdateTime
     })
+    app.provide('forceUpdateTime', forceUpdateTime)
   }
 }
diff --git a/src/renderer/utils/common.ts b/src/renderer/utils/common.ts
index 92bf022..11bf6e0 100644
--- a/src/renderer/utils/common.ts
+++ b/src/renderer/utils/common.ts
@@ -22,7 +22,7 @@ export const trimValues = (obj: IStringKeyMap) => {
 /**
  * get raw data from reactive or ref
  */
-export const getRawData = (args: any) => {
+export const getRawData = (args: any): any => {
   if (Array.isArray(args)) {
     const data = args.map((item: any) => {
       if (isRef(item)) {
@@ -31,7 +31,7 @@ export const getRawData = (args: any) => {
       if (isReactive(item)) {
         return toRaw(item)
       }
-      return item
+      return getRawData(item)
     })
     return data
   }
diff --git a/src/renderer/utils/mainMixin.ts b/src/renderer/utils/mainMixin.ts
index d8269aa..dc67966 100644
--- a/src/renderer/utils/mainMixin.ts
+++ b/src/renderer/utils/mainMixin.ts
@@ -1,11 +1,16 @@
-import { ComponentOptions, getCurrentInstance } from 'vue'
+import { ComponentOptions } from 'vue'
 import { FORCE_UPDATE, GET_PICBEDS } from '~/universal/events/constants'
 import bus from '~/renderer/utils/bus'
 import { ipcRenderer } from 'electron'
 export const mainMixin: ComponentOptions = {
+  inject: ['forceUpdateTime'],
+
   created () {
-    bus.on(FORCE_UPDATE, () => {
-      getCurrentInstance()?.proxy?.$forceUpdate()
+    // FIXME: may be memory leak
+    this?.$watch('forceUpdateTime', (newVal: number, oldVal: number) => {
+      if (oldVal !== newVal) {
+        this?.$forceUpdate()
+      }
     })
   },