web2019/static/js/shop/Legend.jsx
Egor Savkin 14c365b20f Add legend to help users discover options
Signed-off-by: Egor Savkin <es@m-labs.hk>
2024-01-09 10:14:53 +08:00

21 lines
604 B
JavaScript

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>
}