franpcode/format_twitter_projects_accounts_tweets
1
0
Fork 0
mirror of https://github.com/FranP-code/format_twitter_projects_accounts_tweets.git synced 2025-10-13 00:32:19 +00:00
Code Issues 1 Packages Projects Releases Wiki Activity

Remove likes column, expand media, and center checkboxes

Browse Source
This commit is contained in:
Francisco Pessano
2025-07-13 21:15:32 -03:00
committed by GitHub
parent 63d65249d3
commit 6e69a55d19
1 changed files with 6 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
astro-app/src/components/ProjectsTable.tsx
View File

@@ -76,7 +76,7 @@ export function ProjectsTable({ projects, title, showUrlColumn = true, onSeenSta
const isSeen = seenProjects.has(projectId); const isSeen = seenProjects.has(projectId);
return ( return (
<div className="flex justify-center"> <div className="flex justify-center items-center">
<input <input
type="checkbox" type="checkbox"
className="w-4 h-4 rounded border-border bg-background" className="w-4 h-4 rounded border-border bg-background"
@@ -186,22 +186,22 @@ export function ProjectsTable({ projects, title, showUrlColumn = true, onSeenSta
columnHelper.accessor('media_thumbnail', { columnHelper.accessor('media_thumbnail', {
header: 'Media', header: 'Media',
cell: ({ row }) => ( cell: ({ row }) => (
<div className="w-full flex justify-center"> <div className="w-full flex justify-center items-center">
{row.original.media_thumbnail ? ( {row.original.media_thumbnail ? (
<img <img
src={row.original.media_thumbnail} src={row.original.media_thumbnail}
alt="Project preview" alt="Project preview"
className="w-16 h-16 object-cover rounded-lg" className="w-20 h-20 object-cover rounded-lg"
loading="lazy" loading="lazy"
/> />
) : ( ) : (
<div className="w-16 h-16 bg-muted rounded-lg flex items-center justify-center"> <div className="w-20 h-20 bg-muted rounded-lg flex items-center justify-center">
<span className="text-xs text-muted-foreground text-center">No media</span> <span className="text-xs text-muted-foreground text-center">No media</span>
</div> </div>
)} )}
</div> </div>
), ),
size: 90, size: 130,
}), }),
columnHelper.accessor('created_at', { columnHelper.accessor('created_at', {
header: ({ column }) => ( header: ({ column }) => (
@@ -228,30 +228,6 @@ export function ProjectsTable({ projects, title, showUrlColumn = true, onSeenSta
</div> </div>
), ),
size: 120, size: 120,
}),
columnHelper.accessor('favorite_count', {
header: ({ column }) => (
<Button
variant="ghost"
onClick={() => column.toggleSorting(column.getIsSorted() === 'asc')}
className="h-auto p-0 font-semibold hover:bg-transparent justify-center w-full"
>
Likes
{column.getIsSorted() === 'asc' ? (
<ArrowUp className="ml-2 h-4 w-4" />
) : column.getIsSorted() === 'desc' ? (
<ArrowDown className="ml-2 h-4 w-4" />
) : (
<ArrowUpDown className="ml-2 h-4 w-4" />
)}
</Button>
),
cell: ({ row }) => (
<div className="text-sm font-medium w-full text-center">
{row.original.favorite_count.toLocaleString()}
</div>
),
size: 80,
}) })
], [showUrlColumn, seenProjects]); ], [showUrlColumn, seenProjects]);
@@ -286,7 +262,7 @@ export function ProjectsTable({ projects, title, showUrlColumn = true, onSeenSta
}, [projects]); }, [projects]);
// Calculate total width // Calculate total width
const totalWidth = table.getHeaderGroups()[0]?.headers.reduce((acc, header) => acc + header.getSize(), 0) || 880; const totalWidth = table.getHeaderGroups()[0]?.headers.reduce((acc, header) => acc + header.getSize(), 0) || 850;
return ( return (
<div className="space-y-4"> <div className="space-y-4">