thallada/modmapper-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix load order re-applying and transition between sidebar pages

Browse Source
This commit is contained in:
Tyler Hallada 2022-03-02 23:23:06 -05:00
parent de445627bf
commit 96599cb2c8
5 changed files with 49 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
components/Map.tsx
View File

@ -290,14 +290,15 @@ const Map: React.FC = () => {
clearSelectedCells();
selectCell(cell);
}
} else if (
router.query.mod &&
typeof router.query.mod === "string" &&
selectedCells
) {
} else if (router.query.mod && typeof router.query.mod === "string") {
if (selectedCells) {
clearSelectedCell();
setSidebarOpen(true);
selectCells(selectedCells);
} else {
// TODO: this is so spaghetti
clearSelectedCell();
}
} else if (router.query.plugin && typeof router.query.plugin === "string") {
clearSelectedCells();
setSidebarOpen(true);
@ -320,9 +321,32 @@ const Map: React.FC = () => {
selectCells(cells);
}
}
} else {
clearSelectedCell();
} else if (plugins && plugins.length > 0 && pluginsPending === 0) {
clearSelectedCells();
clearSelectedCell();
const cells = plugins.reduce(
(acc: { x: number; y: number }[], plugin: PluginFile) => {
if (plugin.enabled && plugin.parsed) {
const newCells = [...acc];
for (const cell of plugin.parsed.cells) {
if (
cell.x !== undefined &&
cell.y !== undefined &&
cell.world_form_id === 60
) {
newCells.push({ x: cell.x, y: cell.y });
}
}
return newCells;
}
return acc;
},
[]
);
selectCells(cells);
} else {
clearSelectedCells();
clearSelectedCell();
}
}, [
selectedCell,
@ -346,49 +370,6 @@ const Map: React.FC = () => {
}
}, [router.query.mod, clearSelectedMod, heatmapLoaded]);
useEffect(() => {
if (!heatmapLoaded) return; // wait for all map layers to load
if (
plugins &&
plugins.length > 0 &&
pluginsPending === 0 &&
!router.query.cell &&
!router.query.mod &&
!router.query.plugin
) {
clearSelectedCells();
const cells = plugins.reduce(
(acc: { x: number; y: number }[], plugin: PluginFile) => {
if (plugin.enabled && plugin.parsed) {
const newCells = [...acc];
for (const cell of plugin.parsed.cells) {
if (
cell.x !== undefined &&
cell.y !== undefined &&
cell.world_form_id === 60
) {
newCells.push({ x: cell.x, y: cell.y });
}
}
return newCells;
}
return acc;
},
[]
);
selectCells(cells);
}
}, [
plugins,
pluginsPending,
heatmapLoaded,
clearSelectedCells,
selectCells,
router.query.cell,
router.query.mod,
router.query.plugin,
]);
useEffect(() => {
if (map.current) return; // initialize map only once
map.current = new mapboxgl.Map({

8
components/PluginTxtEditor.tsx
View File

@ -2,7 +2,7 @@ import { createPortal } from "react-dom";
import React, { useEffect, useState } from "react";
import { useAppSelector, useAppDispatch } from "../lib/hooks";
import { setPluginsTxt } from "../slices/pluginsTxt";
import { setPluginsTxtAndApplyLoadOrder } from "../slices/pluginsTxt";
import { applyLoadOrder } from "../slices/plugins";
import styles from "../styles/PluginTxtEditor.module.css";
@ -24,8 +24,6 @@ const PluginsLoader: React.FC<Props> = () => {
useEffect(() => {
setPluginsTxtShown(false);
console.log("going to apply!");
dispatch(applyLoadOrder());
}, [dispatch, pluginsTxt]);
const onPluginsTxtButtonClick = async () => {
@ -69,7 +67,9 @@ const PluginsLoader: React.FC<Props> = () => {
</button>
<button
onClick={() => {
dispatch(setPluginsTxt(editPluginsTxt ?? ""));
dispatch(
setPluginsTxtAndApplyLoadOrder(editPluginsTxt ?? "")
);
setPluginsTxtShown(false);
}}
>

4
pages/index.tsx
View File

@ -4,7 +4,7 @@ import "mapbox-gl/dist/mapbox-gl.css";
import Map from "../components/Map";
import { useAppDispatch } from "../lib/hooks";
import { setPluginsTxt } from "../slices/pluginsTxt";
import { setPluginsTxtAndApplyLoadOrder } from "../slices/pluginsTxt";
const Home: NextPage = () => {
const dispatch = useAppDispatch();
@ -74,7 +74,7 @@ const Home: NextPage = () => {
if (evt.dataTransfer.items && evt.dataTransfer.items.length > 0) {
const file = evt.dataTransfer.items[0].getAsFile();
if (file) {
dispatch(setPluginsTxt(await file.text()));
dispatch(setPluginsTxtAndApplyLoadOrder(await file.text()));
}
}
}}

3
slices/plugins.ts
View File

@ -1,5 +1,4 @@
import { createSlice, PayloadAction } from "@reduxjs/toolkit"
import { StateChangeTypes } from "downshift";
import type { AppState, AppThunk } from "../lib/store"
@ -98,7 +97,7 @@ export const applyLoadOrder = (): AppThunk => (dispatch, getState) => {
dispatch(setPlugins([...originalPlugins.sort((a, b) => b.lastModified - a.lastModified), ...newPlugins]));
}
export const addPluginInOrder = (plugin: PluginFile): AppThunk => (dispatch, getState) => {
export const addPluginInOrder = (plugin: PluginFile): AppThunk => (dispatch) => {
dispatch(addPlugin(plugin));
dispatch(applyLoadOrder());
}

10
slices/pluginsTxt.ts
View File

@ -1,6 +1,7 @@
import { createSlice, PayloadAction } from "@reduxjs/toolkit"
import type { AppState } from "../lib/store"
import type { AppState, AppThunk } from "../lib/store"
import { applyLoadOrder } from "./plugins";
export type PluginsTxtState = string;
@ -11,7 +12,7 @@ export const pluginsTxtSlice = createSlice({
initialState,
reducers: {
setPluginsTxt: (state, action: PayloadAction<string>) => action.payload,
clearPluginsTxt: (state) => "",
clearPluginsTxt: () => "",
},
})
@ -19,4 +20,9 @@ export const { setPluginsTxt, clearPluginsTxt } = pluginsTxtSlice.actions
export const selectPluginsTxt = (state: AppState) => state.pluginsTxt
export const setPluginsTxtAndApplyLoadOrder = (pluginsTxt: string): AppThunk => (dispatch) => {
dispatch(setPluginsTxt(pluginsTxt));
dispatch(applyLoadOrder());
}
export default pluginsTxtSlice.reducer