From 6e69a55d19925fe75b02188734e42a13e19dab05 Mon Sep 17 00:00:00 2001
From: Francisco Pessano <76450203+FranP-code@users.noreply.github.com>
Date: Sun, 13 Jul 2025 21:15:32 -0300
Subject: [PATCH] Remove likes column, expand media, and center checkboxes

---
 astro-app/src/components/ProjectsTable.tsx | 36 ++++------------------
 1 file changed, 6 insertions(+), 30 deletions(-)

diff --git a/astro-app/src/components/ProjectsTable.tsx b/astro-app/src/components/ProjectsTable.tsx
index f43b8be..23a3b8a 100644
--- a/astro-app/src/components/ProjectsTable.tsx
+++ b/astro-app/src/components/ProjectsTable.tsx
@@ -76,7 +76,7 @@ export function ProjectsTable({ projects, title, showUrlColumn = true, onSeenSta
         const isSeen = seenProjects.has(projectId);
         
         return (
-          <div className="flex justify-center">
+          <div className="flex justify-center items-center">
             <input
               type="checkbox"
               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', {
       header: 'Media',
       cell: ({ row }) => (
-        <div className="w-full flex justify-center">
+        <div className="w-full flex justify-center items-center">
           {row.original.media_thumbnail ? (
             <img
               src={row.original.media_thumbnail}
               alt="Project preview"
-              className="w-16 h-16 object-cover rounded-lg"
+              className="w-20 h-20 object-cover rounded-lg"
               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>
             </div>
           )}
         </div>
       ),
-      size: 90,
+      size: 130,
     }),
     columnHelper.accessor('created_at', {
       header: ({ column }) => (
@@ -228,30 +228,6 @@ export function ProjectsTable({ projects, title, showUrlColumn = true, onSeenSta
         </div>
       ),
       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]);
 
@@ -286,7 +262,7 @@ export function ProjectsTable({ projects, title, showUrlColumn = true, onSeenSta
   }, [projects]);
 
   // 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 (
     <div className="space-y-4">