LaLeV/wacrm
1
0
Fork 0
mirror of https://github.com/Luchexx/wacrm.git synced 2026-11-02 09:19:51 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(mobile): tiered columns on the broadcasts table

Browse Source 
Every column rendered at every width, relying on horizontal scroll.
A 375px phone had to swipe sideways just to read a name. Matches
the tiering contacts already uses:

- Mobile (<sm): Name + Status only.
- sm+: adds Recipients, Date.
- md+: adds Template.
- lg+: adds Delivery + Read rate bars.

Desktop (≥lg) unchanged — all seven columns visible as before.

Salvaged from the closed PR #52 — the OG-image portion of that PR
is already on main via PR #55, so only the broadcasts-table change
is shipped here.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Arnas Donauskas 2026-04-19 12:51:49 +03:00
parent 6a38fce6f6
commit 8a43cc6e2f
No known key found for this signature in database
1 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/(dashboard)/broadcasts/page.tsx
View File

@ -211,14 +211,14 @@ export default function BroadcastsPage() {
<TableHeader> <TableHeader>
<TableRow className="border-slate-800 hover:bg-transparent"> <TableRow className="border-slate-800 hover:bg-transparent">
<TableHead className="text-slate-400">Name</TableHead> <TableHead className="text-slate-400">Name</TableHead>
<TableHead className="text-slate-400">Template</TableHead> <TableHead className="hidden text-slate-400 md:table-cell">Template</TableHead>
<TableHead className="text-slate-400 text-right"> <TableHead className="hidden text-right text-slate-400 sm:table-cell">
Recipients Recipients
</TableHead> </TableHead>
<TableHead className="text-slate-400">Delivery</TableHead> <TableHead className="hidden text-slate-400 lg:table-cell">Delivery</TableHead>
<TableHead className="text-slate-400">Read</TableHead> <TableHead className="hidden text-slate-400 lg:table-cell">Read</TableHead>
<TableHead className="text-slate-400">Status</TableHead> <TableHead className="text-slate-400">Status</TableHead>
<TableHead className="text-slate-400">Date</TableHead> <TableHead className="hidden text-slate-400 sm:table-cell">Date</TableHead>
</TableRow> </TableRow>
</TableHeader> </TableHeader>
<TableBody> <TableBody>
@ -233,20 +233,20 @@ export default function BroadcastsPage() {
<TableCell className="font-medium text-white"> <TableCell className="font-medium text-white">
{broadcast.name} {broadcast.name}
</TableCell> </TableCell>
<TableCell className="text-slate-300"> <TableCell className="hidden text-slate-300 md:table-cell">
{broadcast.template_name} {broadcast.template_name}
</TableCell> </TableCell>
<TableCell className="text-right text-slate-300 tabular-nums"> <TableCell className="hidden text-right text-slate-300 tabular-nums sm:table-cell">
{broadcast.total_recipients} {broadcast.total_recipients}
</TableCell> </TableCell>
<TableCell> <TableCell className="hidden lg:table-cell">
<RateCell <RateCell
value={broadcast.delivered_count} value={broadcast.delivered_count}
total={broadcast.total_recipients} total={broadcast.total_recipients}
color="bg-emerald-500" color="bg-emerald-500"
/> />
</TableCell> </TableCell>
<TableCell> <TableCell className="hidden lg:table-cell">
<RateCell <RateCell
value={broadcast.read_count} value={broadcast.read_count}
total={broadcast.total_recipients} total={broadcast.total_recipients}
@ -266,7 +266,7 @@ export default function BroadcastsPage() {
{status.label} {status.label}
</span> </span>
</TableCell> </TableCell>
<TableCell className="text-slate-400"> <TableCell className="hidden text-slate-400 sm:table-cell">
{new Date(broadcast.created_at).toLocaleDateString()} {new Date(broadcast.created_at).toLocaleDateString()}
</TableCell> </TableCell>
</TableRow> </TableRow>