From 54a14470d2ade5549794775be2d23fd3091993c5 Mon Sep 17 00:00:00 2001
From: Maksim Nedoshev <m0ksem1337@gmail.com>
Date: Mon, 1 May 2023 13:13:14 +0300
Subject: [PATCH] feat(va-config): i18n config

---
 .../components/va-config/VaConfig.demo.vue    | 10 +++++++
 .../ui/src/components/va-config/VaConfig.vue  |  2 ++
 .../hooks/useGlobalConfigProvider.ts          | 26 ++++---------------
 .../ui/src/services/color/config/default.ts   |  9 ++-----
 .../src/services/color/config/make-config.ts  | 11 ++++++++
 5 files changed, 30 insertions(+), 28 deletions(-)
 create mode 100644 packages/ui/src/services/color/config/make-config.ts

diff --git a/packages/ui/src/components/va-config/VaConfig.demo.vue b/packages/ui/src/components/va-config/VaConfig.demo.vue
index dabf18a60d..8ef9b80aae 100644
--- a/packages/ui/src/components/va-config/VaConfig.demo.vue
+++ b/packages/ui/src/components/va-config/VaConfig.demo.vue
@@ -82,6 +82,14 @@
         <div style="background-color: var(--va-primary); color: var(--va-on-primary);">CSS variables</div>
        </va-config>
     </VbCard>
+
+    <VbCard title="i18n">
+      <va-config :i18n="{
+        dropzone: 'Завантажити файл',
+      }">
+        <va-file-upload  dropzone  />
+       </va-config>
+    </VbCard>
   </VbDemo>
 </template>
 
@@ -94,6 +102,7 @@ import { VaRating } from '../va-rating/'
 import { VaChip } from '../va-chip'
 import { VaConfig } from './'
 import { VaColorInput } from '../va-color-input/'
+import { VaFileUpload } from '../va-file-upload'
 
 export default {
   components: {
@@ -102,6 +111,7 @@ export default {
     VaConfig,
     VaChip,
     VaColorInput,
+    VaFileUpload,
   },
   data () {
     return {
diff --git a/packages/ui/src/components/va-config/VaConfig.vue b/packages/ui/src/components/va-config/VaConfig.vue
index e5df4f4839..f949d1543e 100644
--- a/packages/ui/src/components/va-config/VaConfig.vue
+++ b/packages/ui/src/components/va-config/VaConfig.vue
@@ -40,6 +40,7 @@ export default defineComponent({
     ...useComponentPresetProp,
     components: { type: Object as PropType<ComponentConfig>, default: () => ({}) },
     colors: { type: Object as PropType<PartialGlobalConfig['colors']>, default: () => ({}) },
+    i18n: { type: Object as PropType<PartialGlobalConfig['i18n']>, default: () => ({}) },
   },
   inheritAttrs: false,
   setup (props) {
@@ -52,6 +53,7 @@ export default defineComponent({
     const newConfig = useGlobalConfigProvider(computed(() => {
       return {
         colors: props.colors,
+        i18n: props.i18n,
       }
     }))
 
diff --git a/packages/ui/src/components/va-config/hooks/useGlobalConfigProvider.ts b/packages/ui/src/components/va-config/hooks/useGlobalConfigProvider.ts
index ca6f2c38c7..1e57284188 100644
--- a/packages/ui/src/components/va-config/hooks/useGlobalConfigProvider.ts
+++ b/packages/ui/src/components/va-config/hooks/useGlobalConfigProvider.ts
@@ -3,41 +3,25 @@ import cloneDeep from 'lodash/cloneDeep'
 import { provide, computed, Ref } from 'vue'
 import { useGlobalConfig } from '../../../composables'
 import { GLOBAL_CONFIG, GlobalConfig, GlobalConfigUpdater, PartialGlobalConfig } from '../../../services/global-config'
+import { makeColorsConfig } from '../../../services/color/config/make-config'
 
 export const useGlobalConfigProvider = (next: Ref<PartialGlobalConfig>) => {
-  const { globalConfig } = useGlobalConfig()
+  const { globalConfig, mergeGlobalConfig, setGlobalConfig, getGlobalConfig } = useGlobalConfig()
 
   const nextChain = computed(() => {
     const gcCopy = cloneDeep(globalConfig.value)
     const compiledCopy: GlobalConfig = {
       ...gcCopy,
-      colors: {
-        ...gcCopy.colors,
-        get variables () {
-          return this.presets[this.currentPresetName]
-        },
-        set variables (value) {
-          this.presets[this.currentPresetName] = value
-        },
-      },
+      colors: makeColorsConfig(gcCopy.colors),
     }
 
     return mergeDeep(compiledCopy, next.value) as GlobalConfig
   })
 
-  const getGlobalConfig = (): GlobalConfig => nextChain.value
-  const setGlobalConfig = (updater: GlobalConfig | GlobalConfigUpdater<GlobalConfig>) => {
-    throw new Error('setGlobalConfig can not be used in VaConfig')
-  }
-
-  const mergeGlobalConfig = (updater: PartialGlobalConfig | GlobalConfigUpdater<PartialGlobalConfig>) => {
-    throw new Error('mergeGlobalConfig can not be used in VaConfig')
-  }
-
   provide(GLOBAL_CONFIG, {
-    getGlobalConfig,
-    setGlobalConfig,
     mergeGlobalConfig,
+    setGlobalConfig,
+    getGlobalConfig,
     globalConfig: nextChain,
   })
 
diff --git a/packages/ui/src/services/color/config/default.ts b/packages/ui/src/services/color/config/default.ts
index 3666e41a73..4b3cea368f 100644
--- a/packages/ui/src/services/color/config/default.ts
+++ b/packages/ui/src/services/color/config/default.ts
@@ -1,13 +1,8 @@
 import type { ColorConfig } from '../types'
 import { presets } from '../presets'
+import { makeColorsConfig } from './make-config'
 
-export const getColorDefaultConfig = (): ColorConfig => ({
-  get variables () {
-    return this.presets[this.currentPresetName]
-  },
-  set variables (value) {
-    this.presets[this.currentPresetName] = value
-  },
+export const getColorDefaultConfig = (): ColorConfig => makeColorsConfig({
   threshold: 150,
   presets: {
     light: presets.light,
diff --git a/packages/ui/src/services/color/config/make-config.ts b/packages/ui/src/services/color/config/make-config.ts
new file mode 100644
index 0000000000..39bb2c66d3
--- /dev/null
+++ b/packages/ui/src/services/color/config/make-config.ts
@@ -0,0 +1,11 @@
+import { ColorConfig } from '../types'
+
+export const makeColorsConfig = (values: Omit<ColorConfig, 'variables'>): ColorConfig => ({
+  get variables () {
+    return this.presets[this.currentPresetName]
+  },
+  set variables (value) {
+    this.presets[this.currentPresetName] = value
+  },
+  ...values,
+})