import { AssetView } from "../AssetView/AssetView";
import { useAllAssetsCardContext } from "../contexts/useAllAssetsCardContext";

interface Props {
	groupId: string;
	depth: number;
}

export function AssetListView(props: Props) {
	const context = useAllAssetsCardContext();

	const assets = context.assets.filter((x) =>
		x.groupIds.includes(props.groupId),
	);

	return (
		<>
			{assets.map((asset) => (
				<AssetView key={asset.id} asset={asset} depth={props.depth} />
			))}
		</>
	);
}
