Just getting started with TypeScript. Can someone explain the meaning of this symbol <->? And, is ProductList actually a function in the code below?
export const ProductList: React.FC<-> = ({
displayLoader,
hasNextPage,
notFound,
onLoadMore,
products,
totalCount,
}) => {
const hasProducts = !!totalCount;
return (
<div className="products-list">
<div className="products-list__products container">
{hasProducts ? (
<>
<div className="products-list__products__grid">
{products.map(product => (
<Link
to={generateProductUrl(product.id, product.name)}
key={product.id}
>
<ProductListItem product={product} />
</Link>
))}
</div>
<div className="products-list__products__load-more">
{displayLoader ? (
<Loader />
) : (
hasNextPage && (
<Button secondary onClick={onLoadMore}>
Load more products
</Button>
)
)}
</div>
</>
) : (
<div className="products-list__products-not-found">{notFound}</div>
)}
</div>
</div>
);
};
Your guidance on this would be greatly appreciated. Thank you!