Hoc :

• hoc takes a component and returns a component.
• Basically, it takes an existing component and enhances that component, and then returns a new component.
• Higher-order components are pure functions.

Example :

const withPromotedLabel =(card)=>{
	return (props)=>{
		<div>
			<div>recommended</div>
			<Card  {...props} />
		</div>
	}
}

Calling hoc :

const PromotedComponentHoc=withPromotedLabel(NormalCardComponent)

//Jsx :
data.promoted===true ?<PromotedComponentHoc data= data> :<NormalCardComponent data= data>