import React from 'react'; import {Cart} from "./Cart"; import {CrateMode} from "./CrateMode"; import {CrateWarnings} from "./CrateWarnings"; import {useShopStore} from "./shop_store"; // #!render_count import {useRenderCount} from "@uidotdev/usehooks"; /** * Component that displays the main crate with reminder rules. * It includes and rules */ export function Crate({crate_index}) { // #!render_count const renderCount = useRenderCount(); const crate = useShopStore((state) => state.crates[crate_index], (a, b) => a.length === b.length && a.id === b.id); const modes_order = useShopStore((state) => state.modes_order); const onDeleteCrate = useShopStore((state) => state.delCrate); // #!render_count console.log("Crate renders: ", renderCount) return (
{ modes_order.includes(crate.crate_mode) ? (
onDeleteCrate(crate.id)}> Delete crate remove
) : <> }
); }