#321 - Show corresponding list when drawMode is selected & vice versa

Synced with main, cleaned up unused consts

src/components/gameMaster/mapEditor/partials/ListPanel.vue

@@ -27,14 +27,16 @@
 </template>
 
 <script setup lang="ts">
-import config from '@/application/config'
 import type { Tile } from '@/application/types'
 import { TileStorage } from '@/storage/storages'
 import { liveQuery } from 'dexie'
-import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { onMounted, onUnmounted, ref, watch } from 'vue'
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
 import TileList from '@/components/gameMaster/mapEditor/partials/lists/TileList.vue'
 import ObjectList from '@/components/gameMaster/mapEditor/partials/lists/MapObjectList.vue'
 
+const mapEditor = useMapEditorComposable()
+
 const isOpen = ref(false)
 const tileStorage = new TileStorage()
 const searchQuery = ref('')
@@ -47,6 +49,22 @@ defineExpose({
   toggle: () => (isOpen.value = !isOpen.value)
 })
 
+watch(lists, (list) => {
+  if (list === 'tiles') {
+    mapEditor.setDrawMode('tile')
+  } else if (list === 'objects') {
+    mapEditor.setDrawMode('map_object')
+  }
+})
+
+watch(() => mapEditor.drawMode.value, (list) => {
+  if (list === 'tile') {
+    lists.value = 'tiles'
+  } else if (list === 'map_object') {
+    lists.value = 'objects'
+  }
+})
+
 let subscription: any = null
 
 onMounted(() => {

src/components/gameMaster/mapEditor/partials/Toolbar.vue

@@ -112,12 +112,8 @@ const toolbar = ref(null)
 const isMapEditorSettingsModalOpen = ref(false)
 const selectPencilOpen = ref(false)
 const selectEraserOpen = ref(false)
-const tileListShown = ref(false)
-const mapObjectListShown = ref(false)
 const checkboxValue = ref<Boolean>(false)
 
-defineExpose({ tileListShown, mapObjectListShown })
-
 // drawMode
 function setDrawMode(value: string) {
   if (mapEditor.tool.value === 'paint' || mapEditor.tool.value === 'pencil' || mapEditor.tool.value === 'eraser') {