From 6f2e883e745fc200b4742d604a8218a18e79458d Mon Sep 17 00:00:00 2001 From: Mitchell McCaffrey Date: Thu, 23 Apr 2020 21:19:52 +1000 Subject: [PATCH] Moved default maps to being stored in the database to stop overriding --- src/modals/SelectMapModal.js | 52 ++++++++++++++++++++++++------------ 1 file changed, 35 insertions(+), 17 deletions(-) diff --git a/src/modals/SelectMapModal.js b/src/modals/SelectMapModal.js index c1dbc71..c97b13a 100644 --- a/src/modals/SelectMapModal.js +++ b/src/modals/SelectMapModal.js @@ -22,33 +22,50 @@ function SelectMapModal({ isOpen, onRequestClose, onDone }) { const [imageLoading, setImageLoading] = useState(false); const [currentMap, setCurrentMap] = useState(null); - const [maps, setMaps] = useState(Object.values(defaultMaps)); + const [maps, setMaps] = useState([]); // Load maps from the database and ensure state is properly setup useEffect(() => { - async function loadMaps() { - let storedMaps = await db.table("maps").toArray(); - // reverse so maps are show in the order they were added - storedMaps.reverse(); - for (let map of storedMaps) { - // Recreate image urls for each map - map.source = URL.createObjectURL(map.file); + async function loadDefaultMaps() { + const defaultMapsWithIds = []; + const defaultMapStates = []; + // Store the default maps into the db in reverse so the whie map is first + // in the UI + const defaultMapArray = Object.values(defaultMaps).reverse(); + for (let i = 0; i < defaultMapArray.length; i++) { + const defaultMap = defaultMapArray[i]; + const id = `${defaultMap.id}--${shortid.generate()}`; + defaultMapsWithIds.push({ + ...defaultMap, + id, + timestamp: Date.now() + i, + }); + defaultMapStates.push({ ...defaultMapState, mapId: id }); } - setMaps((prevMaps) => [...storedMaps, ...prevMaps]); + await db.table("maps").bulkAdd(defaultMapsWithIds); + await db.table("states").bulkAdd(defaultMapStates); + setMaps(defaultMapsWithIds.sort((a, b) => b.timestamp - a.timestamp)); } - async function setupDefaultMapStatesIfNeeded() { - for (let defaultMap of Object.values(defaultMaps)) { - let state = await db.table("states").get(defaultMap.id); - if (!state) { - await db - .table("states") - .add({ ...defaultMapState, mapId: defaultMap.id }); + async function loadMaps() { + let storedMaps = await db.table("maps").toArray(); + + // If we have no stored maps load the default maps + if (storedMaps.length === 0) { + loadDefaultMaps(); + } else { + // Sort maps by the time they were added + storedMaps.sort((a, b) => b.timestamp - a.timestamp); + for (let map of storedMaps) { + // Recreate image urls for file based maps + if (map.file) { + map.source = URL.createObjectURL(map.file); + } } + setMaps(storedMaps); } } loadMaps(); - setupDefaultMapStatesIfNeeded(); }, []); const [gridX, setGridX] = useState(defaultMapSize); @@ -87,6 +104,7 @@ function SelectMapModal({ isOpen, onRequestClose, onDone }) { height: image.height, source: url, id: shortid.generate(), + timestamp: Date.now(), }); setImageLoading(false); };