63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
|
import React from "react";
|
||
|
|
import styles from "@/styles/dev-tools.module.css"
|
||
|
|
import { RichTreeView } from '@mui/x-tree-view/RichTreeView';
|
||
|
|
import { Container, Select, Stack, MenuItem, InputLabel, Typography } from "@mui/material"
|
||
|
|
import { buildingTypes, unitTypes } from "@/types/dev-tools-extra";
|
||
|
|
import { useEditor } from "@/hooks/useEditor";
|
||
|
|
|
||
|
|
const debugCard = [
|
||
|
|
{
|
||
|
|
id: "terrain_forest",
|
||
|
|
label: "Forest",
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
id: "terrain_haunted_forest",
|
||
|
|
label: "Haunted Forest",
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
id: 'terrain_undead_candy_forest',
|
||
|
|
label: "Undead Candy Forest"
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
]
|
||
|
|
},
|
||
|
|
]
|
||
|
|
|
||
|
|
export default function LeftMenu(){
|
||
|
|
|
||
|
|
//const [themes, setThemes] = React.useState<ThemeSelection[]>([]); // get from the database
|
||
|
|
const [menuMode, setMenuMode] = React.useState<"unit" | "card">("card");
|
||
|
|
const { changeCurrentDataId } = useEditor();
|
||
|
|
|
||
|
|
const handleSelectAsset = (_e: React.MouseEvent<Element, MouseEvent>, id: string) => {
|
||
|
|
changeCurrentDataId!(id);
|
||
|
|
}
|
||
|
|
return (
|
||
|
|
<Container className={styles.leftmenu}>
|
||
|
|
<Stack >
|
||
|
|
<Typography id="assetTypeFilter">Asset Type</Typography>
|
||
|
|
<Select className="assetTypeFilter">
|
||
|
|
<MenuItem value="">All</MenuItem>
|
||
|
|
{menuMode === "card" ?
|
||
|
|
buildingTypes.map((opt, i) => (<MenuItem value={opt} key={i}>{opt[0].toUpperCase() + opt.slice(1)}</MenuItem>)) :
|
||
|
|
unitTypes.map((opt, i) => (<MenuItem value={opt} key={i}>{opt[0].toUpperCase() + opt.slice(1)}</MenuItem>))
|
||
|
|
}
|
||
|
|
</Select>
|
||
|
|
|
||
|
|
<InputLabel id="themeFilter">Theme</InputLabel>
|
||
|
|
<Select className="themeFilter" label="Theme" >
|
||
|
|
<MenuItem value="">All</MenuItem>
|
||
|
|
</Select>
|
||
|
|
|
||
|
|
</Stack>
|
||
|
|
<Typography >
|
||
|
|
Current {menuMode}s created
|
||
|
|
</Typography>
|
||
|
|
<RichTreeView items={debugCard} onItemClick={handleSelectAsset}>
|
||
|
|
</RichTreeView>
|
||
|
|
</Container>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|