From 777be0b4aec322c72295a2b995e2d1fb74ce5873 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Fri, 20 Sep 2024 20:58:50 +0200
Subject: [PATCH] ref > store

---
 src/components/zone/Tiles.vue | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/src/components/zone/Tiles.vue b/src/components/zone/Tiles.vue
index de3891c..5c1401d 100644
--- a/src/components/zone/Tiles.vue
+++ b/src/components/zone/Tiles.vue
@@ -6,8 +6,7 @@
 import config from '@/config'
 import { useScene } from 'phavuer'
 import { useZoneStore } from '@/stores/zone'
-import { onBeforeMount, onBeforeUnmount, ref } from 'vue'
-import { storeToRefs } from 'pinia'
+import { onBeforeMount, onBeforeUnmount } from 'vue'
 import { placeTile, setAllTiles } from '@/composables/zoneComposable'
 import Controls from '@/components/utilities/Controls.vue'
 
@@ -16,15 +15,14 @@ const emit = defineEmits(['tilemap:create'])
 const zoneStore = useZoneStore()
 const scene = useScene()
 
-const { zone } = storeToRefs(zoneStore)
 const zoneTilemap = createTilemap()
 const tiles = createTileLayer()
 let tileArray = createTileArray()
 
 function createTilemap() {
   const zoneData = new Phaser.Tilemaps.MapData({
-    width: zone.value?.width,
-    height: zone.value?.height,
+    width: zoneStore.zone?.width,
+    height: zoneStore.zone?.height,
     tileWidth: config.tile_size.x,
     tileHeight: config.tile_size.y,
     orientation: Phaser.Tilemaps.Orientation.ISOMETRIC,
@@ -36,7 +34,7 @@ function createTilemap() {
 }
 
 function createTileLayer() {
-  const tilesFromZone = zone.value?.tiles || []
+  const tilesFromZone = zoneStore.zone?.tiles || []
   const uniqueTiles = new Set(tilesFromZone.flat().filter(Boolean))
 
   const tilesetImages = Array.from(uniqueTiles).map((tile, index) => {
@@ -53,13 +51,13 @@ function createTileLayer() {
 }
 
 function createTileArray() {
-  return Array.from({ length: zone.value?.width ?? 0 }, () => Array.from({ length: zone.value?.height ?? 0 }, () => 'blank_tile'))
+  return Array.from({ length: zoneStore.zone?.width ?? 0 }, () => Array.from({ length: zoneStore.zone?.height ?? 0 }, () => 'blank_tile'))
 }
 
 onBeforeMount(() => {
-  if (zone.value?.tiles) {
-    setAllTiles(zoneTilemap, tiles, zone.value.tiles)
-    tileArray = zone.value.tiles.map((row) => row.map((tileId) => tileId || 'blank_tile'))
+  if (zoneStore.zone?.tiles) {
+    setAllTiles(zoneTilemap, tiles, zoneStore.zone.tiles)
+    tileArray = zoneStore.zone.tiles.map((row) => row.map((tileId) => tileId || 'blank_tile'))
   } else {
     tileArray.forEach((row, y) => row.forEach((_, x) => placeTile(zoneTilemap, tiles, x, y, 'blank_tile')))
   }