forked from M-Labs/web2019
28 lines
881 B
JavaScript
28 lines
881 B
JavaScript
import React from "react";
|
|
import {LevelUI} from "./warnings";
|
|
import {useShopStore} from "./shop_store";
|
|
import {compareArraysWithIds} from "./utils";
|
|
|
|
// #!render_count
|
|
import {useRenderCount} from "@uidotdev/usehooks";
|
|
|
|
|
|
export function CrateWarnings({crate_index}) {
|
|
// #!render_count
|
|
const renderCount = useRenderCount();
|
|
|
|
const crate_warnings = useShopStore(state => (state.crates[crate_index].warnings), compareArraysWithIds)
|
|
|
|
// #!render_count
|
|
console.log("CrateWarnings renders: ", renderCount)
|
|
// TODO UI/colors
|
|
return (
|
|
<div className="crate-info">
|
|
{crate_warnings.map((rule, index) => (
|
|
<p key={index} className="rule" style={{'color': LevelUI(rule.level).color}}>
|
|
<img src={LevelUI(rule.level).icon} /> <i>{rule.message}</i>
|
|
</p>
|
|
))}
|
|
</div>
|
|
)
|
|
} |