31 lines
991 B
TypeScript
31 lines
991 B
TypeScript
import React from "react";
|
|
import { IInventoryItem, IStoreItem } from "typings";
|
|
import StoreItem from "./StoreItem";
|
|
|
|
const StoreItemView = (props: {
|
|
inventoryItems: IInventoryItem[] | null | undefined;
|
|
storeItems: IStoreItem[];
|
|
buyStoreItem: (storeItemId: number) => void;
|
|
}) => {
|
|
return (
|
|
<div className="bg-gradient-to-tr from-purple-600 via-blue-600 to-indigo-700 h-auto p-1 rounded-xl rounded-xl col-span-5">
|
|
<div className="bg-slate-900 text-white p-8 rounded-xl h-full">
|
|
<h2 className="text-3xl font-bold mb-4 text-white">Store</h2>
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
{props.storeItems
|
|
.filter((item) => !item.isOwned)
|
|
.map((storeItem, id) => (
|
|
<StoreItem
|
|
key={id}
|
|
storeItem={storeItem}
|
|
buyStoreItem={props.buyStoreItem}
|
|
/>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default StoreItemView;
|