forked from M-Labs/web2019
21 lines
604 B
React
21 lines
604 B
React
|
import React from "react";
|
||
|
|
import {useShopStore} from "./shop_store";
|
||
|
|
|
||
|
|
export function LegendItem({icon, description}) {
|
||
|
|
return (
|
||
|
|
<tr>
|
||
|
|
<td className="p-1"><img className="" width="20px" src={icon} alt={description}/></td>
|
||
|
|
<td className="p-1"><span> {description} </span></td>
|
||
|
|
</tr>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export function Legend() {
|
||
|
|
const legend = useShopStore(state => state.legend);
|
||
|
|
|
||
|
|
return <table>
|
||
|
|
<tbody>
|
||
|
|
{legend.map((item, i) => <LegendItem key={"legend_item"+i} icon={item.icon} description={item.description}/>)}
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
}
|