MIF_E31222881/resources/js/Components/features/dashboard/components/UserChannels.jsx

45 lines
1.7 KiB
JavaScript

import TitleCard from "@/Components/Cards/TitleCard"
const userSourceData = [
{ source: "Facebook Ads", count: "26,345", conversionPercent: 10.2 },
{ source: "Google Ads", count: "21,341", conversionPercent: 11.7 },
{ source: "Instagram Ads", count: "34,379", conversionPercent: 12.4 },
{ source: "Affiliates", count: "12,359", conversionPercent: 20.9 },
{ source: "Organic", count: "10,345", conversionPercent: 10.3 },
]
function UserChannels() {
return (
<TitleCard title={"User Signup Source"}>
{/** Table Data */}
<div className="overflow-x-auto">
<table className="table w-full">
<thead>
<tr>
<th></th>
<th className="normal-case">Source</th>
<th className="normal-case">No of Users</th>
<th className="normal-case">Conversion</th>
</tr>
</thead>
<tbody>
{
userSourceData.map((u, k) => {
return (
<tr key={k}>
<th>{k + 1}</th>
<td>{u.source}</td>
<td>{u.count}</td>
<td>{`${u.conversionPercent}%`}</td>
</tr>
)
})
}
</tbody>
</table>
</div>
</TitleCard>
)
}
export default UserChannels