Load map data inside a composable instead of Pinia store

2025-01-25 02:38:40 +01:00 · 2025-01-25 02:38:40 +01:00 · 7a51323682
commit 7a51323682
parent 807bc2066e
14 changed files with 120 additions and 125 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -2535,9 +2535,9 @@
      }
    },
    "node_modules/electron-to-chromium": {
-      "version": "1.5.87",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.87.tgz",
-      "integrity": "sha512-mPFwmEWmRivw2F8x3w3l2m6htAUN97Gy0kwpO++2m9iT1Gt8RCFVUfv9U/sIbHJ6rY4P6/ooqFL/eL7ock+pPg==",
+      "version": "1.5.88",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.88.tgz",
+      "integrity": "sha512-K3C2qf1o+bGzbilTDCTBhTQcMS9KW60yTAaTeeXsfvQuTDDwlokLam/AdqlqcSy9u4UainDgsHV23ksXAOgamw==",
      "dev": true,
      "license": "ISC"
    },
--- a/src/application/utilities.ts
+++ b/src/application/utilities.ts
@ -1,6 +1,6 @@
-import type { BaseStorage } from '@/storage/baseStorage'
 import config from '@/application/config'
 import type { HttpResponse } from '@/application/types'
+import type { BaseStorage } from '@/storage/baseStorage'

 export function uuidv4() {
  return '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, (c) => (+c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (+c / 4)))).toString(16))
--- a/src/components/gameMaster/assetManager/partials/tile/TileDetails.vue
+++ b/src/components/gameMaster/assetManager/partials/tile/TileDetails.vue
@ -33,7 +33,6 @@ import { computed, onBeforeUnmount, onMounted, ref, toRaw, watch } from 'vue'

 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()
-const mapEditorStore = useMapEditorStore()

 const selectedTile = computed(() => assetManagerStore.selectedTile)

@ -72,10 +71,6 @@ function refreshTileList(unsetSelectedTile = true) {
    if (unsetSelectedTile) {
      assetManagerStore.setSelectedTile(null)
    }
-
-    if (mapEditorStore.active) {
-      mapEditorStore.setTileList(response)
-    }
  })
 }

--- a/src/components/gameMaster/mapEditor/Map.vue
+++ b/src/components/gameMaster/mapEditor/Map.vue
@ -9,7 +9,7 @@ import MapEventTiles from '@/components/gameMaster/mapEditor/mapPartials/MapEven
 import MapTiles from '@/components/gameMaster/mapEditor/mapPartials/MapTiles.vue'
 import PlacedMapObjects from '@/components/gameMaster/mapEditor/mapPartials/PlacedMapObjects.vue'
 import { useMapEditorStore } from '@/stores/mapEditorStore'
-import { onUnmounted, shallowRef } from 'vue'
+import { onMounted, onUnmounted, shallowRef } from 'vue'

 const mapEditorStore = useMapEditorStore()
 const tileMap = shallowRef<Phaser.Tilemaps.Tilemap>()
--- a/src/components/gameMaster/mapEditor/mapPartials/MapTiles.vue
+++ b/src/components/gameMaster/mapEditor/mapPartials/MapTiles.vue
@ -5,17 +5,19 @@
 <script setup lang="ts">
 import config from '@/application/config'
 import Controls from '@/components/utilities/Controls.vue'
-import { createTileArray, getTile, loadAllTilesIntoScene, placeTile, setLayerTiles } from '@/composables/mapComposable'
+import { createTileArray, getTile, placeTile, setLayerTiles } from '@/composables/mapComposable'
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
 import { TileStorage } from '@/storage/storages'
 import { useMapEditorStore } from '@/stores/mapEditorStore'
 import { useScene } from 'phavuer'
-import { onBeforeMount, onMounted, onUnmounted, shallowRef, watch } from 'vue'
+import { onMounted, onUnmounted, shallowRef, watch } from 'vue'

 import Tileset = Phaser.Tilemaps.Tileset

 const emit = defineEmits(['tileMap:create'])

 const scene = useScene()
+const mapEditor = useMapEditorComposable()
 const mapEditorStore = useMapEditorStore()
 const tileStorage = new TileStorage()

@ -24,8 +26,8 @@ const tileLayer = shallowRef<Phaser.Tilemaps.TilemapLayer>()

 function createTileMap() {
  const mapData = new Phaser.Tilemaps.MapData({
-    width: mapEditorStore.map?.width,
-    height: mapEditorStore.map?.height,
+    width: mapEditor.currentMap.value?.width,
+    height: mapEditor.currentMap.value?.height,
    tileWidth: config.tile_size.width,
    tileHeight: config.tile_size.height,
    orientation: Phaser.Tilemaps.Orientation.ISOMETRIC,
@ -59,7 +61,7 @@ function pencil(pointer: Phaser.Input.Pointer) {
  if (!tileMap.value || !tileLayer.value) return

  // Check if map is set
-  if (!mapEditorStore.map) return
+  if (!mapEditor.currentMap.value) return

  // Check if tool is pencil
  if (mapEditorStore.tool !== 'pencil') return
@ -84,14 +86,14 @@ function pencil(pointer: Phaser.Input.Pointer) {
  placeTile(tileMap.value, tileLayer.value, tile.x, tile.y, mapEditorStore.selectedTile)

  // Adjust mapEditorStore.map.tiles
-  mapEditorStore.map.tiles[tile.y][tile.x] = mapEditorStore.selectedTile
+  mapEditor.currentMap.value.tiles[tile.y][tile.x] = mapEditor.currentMap.value.tiles[tile.y][tile.x]
 }

 function eraser(pointer: Phaser.Input.Pointer) {
  if (!tileMap.value || !tileLayer.value) return

  // Check if map is set
-  if (!mapEditorStore.map) return
+  if (!mapEditor.currentMap.value) return

  // Check if tool is pencil
  if (mapEditorStore.tool !== 'eraser') return
@ -116,14 +118,14 @@ function eraser(pointer: Phaser.Input.Pointer) {
  placeTile(tileMap.value, tileLayer.value, tile.x, tile.y, 'blank_tile')

  // Adjust mapEditorStore.map.tiles
-  mapEditorStore.map.tiles[tile.y][tile.x] = 'blank_tile'
+  mapEditor.currentMap.value.tiles[tile.y][tile.x] = 'blank_tile'
 }

 function paint(pointer: Phaser.Input.Pointer) {
  if (!tileMap.value || !tileLayer.value) return

  // Check if map is set
-  if (!mapEditorStore.map) return
+  if (!mapEditor.currentMap.value) return

  // Check if tool is pencil
  if (mapEditorStore.tool !== 'paint') return
@ -144,7 +146,7 @@ function paint(pointer: Phaser.Input.Pointer) {
  setLayerTiles(tileMap.value, tileLayer.value, createTileArray(tileMap.value.width, tileMap.value.height, mapEditorStore.selectedTile))

  // Adjust mapEditorStore.map.tiles
-  mapEditorStore.map.tiles = createTileArray(tileMap.value.width, tileMap.value.height, mapEditorStore.selectedTile)
+  mapEditor.currentMap.value.tiles = createTileArray(tileMap.value.width, tileMap.value.height, mapEditor.currentMap.value.tiles)
 }

 // When alt is pressed, and the pointer is down, select the tile that the pointer is over
@ -152,7 +154,7 @@ function tilePicker(pointer: Phaser.Input.Pointer) {
  if (!tileMap.value || !tileLayer.value) return

  // Check if map is set
-  if (!mapEditorStore.map) return
+  if (!mapEditor.currentMap.value) return

  // Check if tool is pencil
  if (mapEditorStore.tool !== 'pencil') return
@ -174,34 +176,35 @@ function tilePicker(pointer: Phaser.Input.Pointer) {
  if (!tile) return

  // Select the tile
-  mapEditorStore.setSelectedTile(mapEditorStore.map.tiles[tile.y][tile.x])
+  mapEditorStore.setSelectedMapObject(mapEditor.currentMap.value.tiles[tile.y][tile.x])
 }

 watch(
  () => mapEditorStore.shouldClearTiles,
  (shouldClear) => {
-    if (shouldClear && mapEditorStore.map && tileMap.value && tileLayer.value) {
+    if (shouldClear && mapEditor.currentMap.value && tileMap.value && tileLayer.value) {
      const blankTiles = createTileArray(tileMap.value.width, tileMap.value.height, 'blank_tile')
      setLayerTiles(tileMap.value, tileLayer.value, blankTiles)
-      mapEditorStore.map.tiles = blankTiles
+      mapEditor.currentMap.value.tiles = blankTiles
      mapEditorStore.resetClearTilesFlag()
    }
  }
 )

 onMounted(async () => {
-  if (!mapEditorStore.map?.tiles) return
+  if (!mapEditor.currentMap.value?.tiles) return
+  console.log(mapEditor.currentMap.value)

  tileMap.value = createTileMap()
  tileLayer.value = await createTileLayer(tileMap.value)

  // First fill the entire map with blank tiles using current map dimensions
-  const blankTiles = createTileArray(mapEditorStore.map.width, mapEditorStore.map.height, 'blank_tile')
+  const blankTiles = createTileArray(mapEditor.currentMap.value.width, mapEditor.currentMap.value.height, 'blank_tile')

  // Then overlay the map tiles, but only within the current map dimensions
-  const mapTiles = mapEditorStore.map.tiles
-  for (let y = 0; y < mapEditorStore.map.height; y++) {
-    for (let x = 0; x < mapEditorStore.map.width; x++) {
+  const mapTiles = mapEditor.currentMap.value.tiles
+  for (let y = 0; y < mapEditor.currentMap.value.height; y++) {
+    for (let x = 0; x < mapEditor.currentMap.value.width; x++) {
      if (mapTiles[y] && mapTiles[y][x] !== undefined) {
        blankTiles[y][x] = mapTiles[y][x]
      }
--- a/src/components/gameMaster/mapEditor/partials/MapList.vue
+++ b/src/components/gameMaster/mapEditor/partials/MapList.vue
@ -32,6 +32,7 @@
 import type { Map, UUID } from '@/application/types'
 import CreateMap from '@/components/gameMaster/mapEditor/partials/CreateMap.vue'
 import Modal from '@/components/utilities/Modal.vue'
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
 import { MapStorage } from '@/storage/storages'
 import { useGameStore } from '@/stores/gameStore'
 import { useMapEditorStore } from '@/stores/mapEditorStore'
@ -40,6 +41,7 @@ import { onMounted, ref } from 'vue'
 const gameStore = useGameStore()
 const mapEditorStore = useMapEditorStore()

+const mapEditor = useMapEditorComposable()
 const mapStorage = new MapStorage()
 const mapList = ref<Map[]>([])

@ -52,8 +54,8 @@ async function fetchMaps() {
 }

 function loadMap(id: UUID) {
-  gameStore.connection?.emit('gm:map:request', { mapId: id }, (response: UUID) => {
-    mapEditorStore.setMapId(response)
+  gameStore.connection?.emit('gm:map:request', { mapId: id }, (response: Map) => {
+    mapEditor.loadMap(response)
  })
  mapEditorStore.toggleMapListModal()
 }
--- a/src/components/gameMaster/mapEditor/partials/MapSettings.vue
+++ b/src/components/gameMaster/mapEditor/partials/MapSettings.vue
@ -47,60 +47,53 @@
 </template>

 <script setup lang="ts">
+import type { UUID } from '@/application/types'
+import { uuidv4 } from '@/application/utilities'
 import Modal from '@/components/utilities/Modal.vue'
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
 import { useMapEditorStore } from '@/stores/mapEditorStore'
 import { ref, watch } from 'vue'

+const mapEditor = useMapEditorComposable()
 const mapEditorStore = useMapEditorStore()
 const screen = ref('settings')

-mapEditorStore.setMapName(mapEditorStore.map?.name)
-mapEditorStore.setMapWidth(mapEditorStore.map?.width)
-mapEditorStore.setMapHeight(mapEditorStore.map?.height)
-mapEditorStore.setMapPvp(mapEditorStore.map?.pvp)
-mapEditorStore.setMapEffects(mapEditorStore.map?.mapEffects)
-
-const name = ref(mapEditorStore.mapSettings?.name)
-const width = ref(mapEditorStore.mapSettings?.width)
-const height = ref(mapEditorStore.mapSettings?.height)
-const pvp = ref(mapEditorStore.mapSettings?.pvp)
-const mapEffects = ref(mapEditorStore.mapSettings?.mapEffects || [])
+const name = ref(mapEditor.currentMap.value?.name)
+const width = ref(mapEditor.currentMap.value?.width)
+const height = ref(mapEditor.currentMap.value?.height)
+const pvp = ref(mapEditor.currentMap.value?.pvp)
+const mapEffects = ref(mapEditor.currentMap.value?.mapEffects || [])

 watch(name, (value) => {
-  mapEditorStore.setMapName(value)
+  mapEditor.updateProperty('name', value!)
 })

 watch(width, (value) => {
-  mapEditorStore.setMapWidth(value)
+  mapEditor.updateProperty('width', value!)
 })

 watch(height, (value) => {
-  mapEditorStore.setMapHeight(value)
+  mapEditor.updateProperty('height', value!)
 })

 watch(pvp, (value) => {
-  mapEditorStore.setMapPvp(value)
+  mapEditor.updateProperty('pvp', value!)
 })

-watch(
-  mapEffects,
-  (value) => {
-    mapEditorStore.setMapEffects(value)
-  },
-  { deep: true }
-)
+watch(mapEffects, (value) => {
+  mapEditor.updateProperty('mapEffects', value!)
+})

 const addEffect = () => {
  mapEffects.value.push({
-    id: Date.now().toString(), // Simple unique id generation
-    mapId: mapEditorStore.map?.id,
-    map: mapEditorStore.map,
+    id: uuidv4() as UUID, // Simple unique id generation
+    map: mapEditor.currentMap.value!,
    effect: '',
    strength: 1
  })
 }

-const removeEffect = (index) => {
+const removeEffect = (index: number) => {
  mapEffects.value.splice(index, 1)
 }
 </script>
--- a/src/components/gameMaster/mapEditor/partials/TileList.vue
+++ b/src/components/gameMaster/mapEditor/partials/TileList.vue
@ -228,9 +228,5 @@ function isActiveTile(tile: Tile): boolean {

 onMounted(async () => {
  isModalOpen.value = true
-  gameStore.connection?.emit('gm:tile:list', {}, (response: Tile[]) => {
-    mapEditorStore.setTileList(response)
-    response.forEach((tile) => processTile(tile))
-  })
 })
 </script>
--- a/src/components/gameMaster/mapEditor/partials/Toolbar.vue
+++ b/src/components/gameMaster/mapEditor/partials/Toolbar.vue
@ -1,7 +1,7 @@
 <template>
  <div class="flex justify-center p-5">
    <div class="toolbar fixed bottom-0 left-0 m-3 rounded flex bg-gray solid border-solid border-2 border-gray-500 text-gray-300 p-1.5 px-3 h-10">
-      <div ref="toolbar" class="tools flex gap-2.5" v-if="mapEditorStore.map">
+      <div ref="toolbar" class="tools flex gap-2.5" v-if="mapEditor.currentMap.value">
        <button class="flex justify-center items-center min-w-10 p-0 relative" :class="{ 'border-0 border-b-[3px] border-solid border-cyan gap-2.5': mapEditorStore.tool === 'move' }" @click="handleClick('move')">
          <img class="invert w-5 h-5" src="/assets/icons/mapEditor/move.svg" alt="Move camera" /> <span class="h-5" :class="{ 'ml-2.5': mapEditorStore.tool !== 'move' }">(M)</span>
        </button>
@ -68,13 +68,13 @@

        <div class="w-px bg-cyan"></div>

-        <button class="flex justify-center items-center min-w-10 p-0 relative" @click="handleClick('settings')" v-if="mapEditorStore.map"><img class="invert w-5 h-5" src="/assets/icons/mapEditor/gear.svg" alt="Map settings" /> <span class="h-5 ml-2.5">(Z)</span></button>
+        <button class="flex justify-center items-center min-w-10 p-0 relative" @click="handleClick('settings')"><img class="invert w-5 h-5" src="/assets/icons/mapEditor/gear.svg" alt="Map settings" /> <span class="h-5 ml-2.5">(Z)</span></button>
      </div>

      <div class="toolbar fixed bottom-0 right-0 m-3 rounded flex bg-gray solid border-solid border-2 border-gray-500 text-gray-300 p-1.5 px-3 h-10 space-x-2">
        <button class="btn-cyan px-3.5" @click="() => mapEditorStore.toggleMapListModal()">Load</button>
-        <button class="btn-cyan px-3.5" @click="() => emit('save')" v-if="mapEditorStore.map">Save</button>
-        <button class="btn-cyan px-3.5" @click="() => emit('clear')" v-if="mapEditorStore.map">Clear</button>
+        <button class="btn-cyan px-3.5" @click="() => emit('save')" v-if="mapEditor.currentMap.value">Save</button>
+        <button class="btn-cyan px-3.5" @click="() => emit('clear')" v-if="mapEditor.currentMap.value">Clear</button>
        <button class="btn-cyan px-3.5" @click="() => mapEditorStore.toggleActive()">Exit</button>
      </div>
    </div>
@ -82,10 +82,12 @@
 </template>

 <script setup lang="ts">
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
 import { useMapEditorStore } from '@/stores/mapEditorStore'
 import { onClickOutside } from '@vueuse/core'
 import { onBeforeUnmount, onMounted, ref } from 'vue'

+const mapEditor = useMapEditorComposable()
 const mapEditorStore = useMapEditorStore()

 const emit = defineEmits(['save', 'clear'])
--- a/src/components/screens/Loading.vue
+++ b/src/components/screens/Loading.vue
@ -15,10 +15,10 @@
 </template>

 <script setup lang="ts" async>
+import { downloadCache } from '@/application/utilities'
 import { CharacterHairStorage, CharacterTypeStorage, MapObjectStorage, MapStorage, SpriteStorage, TileStorage } from '@/storage/storages'
 import { useGameStore } from '@/stores/gameStore'
 import { ref } from 'vue'
-import { downloadCache } from '@/application/utilities'

 const gameStore = useGameStore()

--- a/src/components/screens/MapEditor.vue
+++ b/src/components/screens/MapEditor.vue
@ -4,7 +4,7 @@
      <Scene name="main" @preload="preloadScene">
        <div v-if="!isLoaded" class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 text-white text-3xl font-ui">Loading...</div>
        <div v-else>
-          <Map :key="mapEditorStore.mapId" />
+          <Map :key="mapEditor.currentMap.value?.id" />
          <Toolbar @save="save" @clear="clear" />
          <MapList />
          <TileList />
@ -29,16 +29,19 @@ import TeleportModal from '@/components/gameMaster/mapEditor/partials/TeleportMo
 import TileList from '@/components/gameMaster/mapEditor/partials/TileList.vue'
 import Toolbar from '@/components/gameMaster/mapEditor/partials/Toolbar.vue'
 import { loadAllTilesIntoScene } from '@/composables/mapComposable'
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
+import { MapStorage } from '@/storage/storages'
 import { useGameStore } from '@/stores/gameStore'
 import { useMapEditorStore } from '@/stores/mapEditorStore'
 import { Game, Scene } from 'phavuer'
-import { ref } from 'vue'
+import { ref, watch } from 'vue'

+const mapStorage = new MapStorage()
+const mapEditor = useMapEditorComposable()
 const gameStore = useGameStore()
 const mapEditorStore = useMapEditorStore()

 const isLoaded = ref(false)
-const currentMap = ref<MapT | null>(null)

 const gameConfig = {
  name: config.name,
@ -75,18 +78,18 @@ const preloadScene = async (scene: Phaser.Scene) => {
 }

 function save() {
-  if (!mapEditorStore.map) return
+  if (!mapEditor.currentMap.value) return

  const data = {
-    mapId: mapEditorStore.map.id,
-    name: mapEditorStore.mapSettings.name,
-    width: mapEditorStore.mapSettings.width,
-    height: mapEditorStore.mapSettings.height,
-    tiles: mapEditorStore.map.tiles,
-    pvp: mapEditorStore.map.pvp,
-    mapEffects: mapEditorStore.map.mapEffects?.map(({ id, effect, strength }) => ({ id, effect, strength })) ?? [],
-    mapEventTiles: mapEditorStore.map.mapEventTiles?.map(({ id, type, positionX, positionY, teleport }) => ({ id, type, positionX, positionY, teleport })) ?? [],
-    placedMapObjects: mapEditorStore.map.placedMapObjects?.map(({ id, mapObject, depth, isRotated, positionX, positionY }) => ({ id, mapObject, depth, isRotated, positionX, positionY })) ?? []
+    mapId: mapEditor.currentMap.value.id,
+    name: mapEditor.currentMap.value.name,
+    width: mapEditor.currentMap.value.width,
+    height: mapEditor.currentMap.value.height,
+    tiles: mapEditor.currentMap.value.tiles,
+    pvp: mapEditor.currentMap.value.pvp,
+    mapEffects: mapEditor.currentMap.value.mapEffects?.map(({ id, effect, strength }) => ({ id, effect, strength })) ?? [],
+    mapEventTiles: mapEditor.currentMap.value.mapEventTiles?.map(({ id, type, positionX, positionY, teleport }) => ({ id, type, positionX, positionY, teleport })) ?? [],
+    placedMapObjects: mapEditor.currentMap.value.placedMapObjects?.map(({ id, mapObject, depth, isRotated, positionX, positionY }) => ({ id, mapObject, depth, isRotated, positionX, positionY })) ?? []
  }

  if (mapEditorStore.isSettingsModalShown) {
@ -94,16 +97,15 @@ function save() {
  }

  gameStore.connection?.emit('gm:map:update', data, (response: MapT) => {
-    mapEditorStore.setMap(response)
+    mapStorage.update(response.id, response)
  })
 }

 function clear() {
-  if (!mapEditorStore.map) return
+  if (!mapEditor.currentMap.value) return

-  // Clear objects, event tiles and tiles
-  mapEditorStore.map.placedMapObjects = []
-  mapEditorStore.map.mapEventTiles = []
+  // Clear placed objects, event tiles and tiles
+  mapEditor.clearMap()
  mapEditorStore.triggerClearTiles()
 }
 </script>
--- a/src/composables/useMapEditorComposable.ts
+++ b/src/composables/useMapEditorComposable.ts
@ -0,0 +1,31 @@
+import type { Map } from '@/application/types'
+import { ref } from 'vue'
+
+const currentMap = ref<Map | null>(null)
+
+export function useMapEditorComposable() {
+  const loadMap = (map: Map) => {
+    currentMap.value = map
+  }
+
+  const updateProperty = <K extends keyof Map>(property: K, value: Map[K]) => {
+    if (currentMap.value) {
+      currentMap.value[property] = value
+    }
+  }
+
+  const clearMap = () => {
+    if (!currentMap.value) return
+
+    currentMap.value.placedMapObjects = []
+    currentMap.value.mapEventTiles = []
+    currentMap.value.tiles = []
+  }
+
+  return {
+    currentMap,
+    loadMap,
+    updateProperty,
+    clearMap
+  }
+}
--- a/src/storage/baseStorage.ts
+++ b/src/storage/baseStorage.ts
@ -23,6 +23,14 @@ export class BaseStorage<T extends { id: string }> {
    }
  }

+  async update(id: string, item: Partial<T>) {
+    try {
+      await this.dexie.table(this.tableName).update(id, item)
+    } catch (error) {
+      console.error(`Failed to update ${this.tableName} ${id}:`, error)
+    }
+  }
+
  async delete(id: string) {
    try {
      await this.dexie.table(this.tableName).delete(id)
--- a/src/stores/mapEditorStore.ts
+++ b/src/stores/mapEditorStore.ts
@ -1,8 +1,8 @@
-import type { Map, MapEffect, MapObject, Tile, UUID } from '@/application/types'
+import type { MapObject } from '@/application/types'
 import { defineStore } from 'pinia'

 export type TeleportSettings = {
-  toMap: Map | null
+  toMapId: string
  toPositionX: number
  toPositionY: number
  toRotation: number
@ -12,12 +12,9 @@ export const useMapEditorStore = defineStore('mapEditor', {
  state: () => {
    return {
      active: false,
-      mapId: '',
      tool: 'move',
      drawMode: 'tile',
      eraserMode: 'tile',
-      tileList: [] as Tile[],
-      mapObjectList: [] as MapObject[],
      selectedTile: '',
      selectedMapObject: null as MapObject | null,
      isTileListModalShown: false,
@ -26,15 +23,8 @@ export const useMapEditorStore = defineStore('mapEditor', {
      isCreateMapModalShown: false,
      isSettingsModalShown: false,
      shouldClearTiles: false,
-      mapSettings: {
-        name: '',
-        width: 0,
-        height: 0,
-        pvp: false,
-        mapEffects: [] as MapEffect[]
-      },
      teleportSettings: {
-        toMap: null,
+        toMapId: '',
        toPositionX: 0,
        toPositionY: 0,
        toRotation: 0
@ -46,24 +36,6 @@ export const useMapEditorStore = defineStore('mapEditor', {
      if (this.active) this.reset()
      this.active = !this.active
    },
-    setMapId(mapId: UUID) {
-      this.mapId = mapId
-    },
-    setMapName(name: string) {
-      this.mapSettings.name = name
-    },
-    setMapWidth(width: number) {
-      this.mapSettings.width = width
-    },
-    setMapHeight(height: number) {
-      this.mapSettings.height = height
-    },
-    setMapPvp(pvp: boolean) {
-      this.mapSettings.pvp = pvp
-    },
-    setMapEffects(mapEffects: MapEffect[]) {
-      this.mapSettings.mapEffects = mapEffects
-    },
    setTool(tool: string) {
      this.tool = tool
    },
@ -73,12 +45,6 @@ export const useMapEditorStore = defineStore('mapEditor', {
    setEraserMode(mode: string) {
      this.eraserMode = mode
    },
-    setTileList(tiles: Tile[]) {
-      this.tileList = tiles
-    },
-    setMapObjectList(objects: MapObject[]) {
-      this.mapObjectList = objects
-    },
    setSelectedTile(tile: string) {
      this.selectedTile = tile
    },
@ -105,9 +71,6 @@ export const useMapEditorStore = defineStore('mapEditor', {
      this.shouldClearTiles = false
    },
    reset() {
-      this.mapId = ''
-      this.tileList = []
-      this.mapObjectList = []
      this.tool = 'move'
      this.drawMode = 'tile'
      this.selectedTile = ''