refactor pass config as prop

renderer/src/web/item-check/WidgetItemCheck.vue

@@ -2,7 +2,7 @@
   <Widget :config="{ ...config, anchor }" move-handles="none" :removable="false" :inline-edit="false">
     <template v-if="item">
       <MapCheck v-if="isMapLike"
-        :item="item" />
+        :item="item" :config="config.maps" />
       <ItemInfo v-else
         :item="item" />
     </template>

renderer/src/web/map-check/MapCheck.vue

@@ -19,7 +19,7 @@
     </div>
     <div v-else class="py-2 flex flex-col">
       <MapStatButton v-for="stat in mapStats" :key="stat.matcher"
-        :stat="stat" />
+        :stat="stat" :config="config" />
       <div v-for="stat of item.unknownModifiers" :key="stat.type + '/' + stat.text"
         class="py-1 px-8">
         <span class="text-orange-400">{{ t('Not recognized modifier') }} &mdash;</span> {{ stat.text }}
@@ -35,22 +35,20 @@ import { useI18n } from 'vue-i18n'
 import { ItemRarity, ParsedItem } from '@/parser'
 import { prepareMapStats } from './prepare-map-stats'
 import { STAT_BY_MATCH_STR } from '@/assets/data'
-import { ItemCheckWidget } from '../item-check/widget.js'
-import { AppConfig } from '@/web/Config'
+import { MapCheckConfig } from './common.js'
 
 import MapStatButton from './MapStatButton.vue'
 
 const props = defineProps<{
-  item: ParsedItem
+  item: ParsedItem,
+  config: MapCheckConfig
 }>()
 
 const { t } = useI18n()
 
-const config = computed(() => AppConfig<ItemCheckWidget>('item-check')!.maps)
-
 const hasOutdatedTranslation = computed<boolean>(() => {
-  const idx = config.value.profile - 1
-  return config.value.selectedStats
+  const idx = props.config.profile - 1
+  return props.config.selectedStats
     .some(entry =>
       entry.decision[idx] !== '-' &&
       entry.decision[idx] !== 's' &&
@@ -70,8 +68,8 @@ const profiles = computed(() => {
   const ROMAN_NUMERALS = ['I', 'II', 'III']
   return ROMAN_NUMERALS.map((text, i) => ({
     text,
-    active: (config.value.profile === i + 1),
-    select: () => { config.value.profile = i + 1 }
+    active: (props.config.profile === i + 1),
+    select: () => { props.config.profile = i + 1 }
   }))
 })
 </script>

renderer/src/web/map-check/MapStatButton.vue

@@ -14,32 +14,30 @@
 
 <script setup lang="ts">
 import { computed, useCssModule } from 'vue'
-import { AppConfig } from '@/web/Config'
 import { PreparedStat } from './prepare-map-stats'
-import { ItemCheckWidget } from '../item-check/widget.js'
-import { nextDecision, decisionCreate } from './common.js'
+import { nextDecision, decisionCreate, type MapCheckConfig } from './common.js'
 
 import ItemModifierText from '../ui/ItemModifierText.vue'
 
 const props = defineProps<{
-  stat: PreparedStat
+  stat: PreparedStat,
+  config: MapCheckConfig
 }>()
 
 const $style = useCssModule()
 
-const config = computed(() => AppConfig<ItemCheckWidget>('item-check')!.maps)
-const entry = computed(() => config.value.selectedStats
+const entry = computed(() => props.config.selectedStats
   .find(({ matcher }) => matcher === props.stat.matcher))
 
 const decision = computed<string>({
   get () {
     if (!entry.value) return '-'
-    return entry.value.decision[config.value.profile - 1]
+    return entry.value.decision[props.config.profile - 1]
   },
   set (value) {
-    const newSet = decisionCreate(value, config.value.profile, entry.value?.decision)
+    const newSet = decisionCreate(value, props.config.profile, entry.value?.decision)
     if (!entry.value) {
-      config.value.selectedStats.push({
+      props.config.selectedStats.push({
         matcher: props.stat.matcher,
         decision: newSet
       })
@@ -50,14 +48,14 @@ const decision = computed<string>({
 })
 
 function newStatIconVisible (): boolean {
-  if (config.value.showNewStats) {
+  if (props.config.showNewStats) {
     return (decision.value === '-')
   }
   return false
 }
 
 function toggleSeenStatus () {
-  if (config.value.showNewStats) {
+  if (props.config.showNewStats) {
     decision.value = (decision.value === '-') ? 's' : '-'
   }
 }