update

apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments._index/columns.tsx

@@ -9,6 +9,7 @@ import { Checkbox } from '@repo/ui/components/ui/checkbox'
 import { Progress } from '@repo/ui/components/ui/progress'
 import { cn, initials } from '@repo/ui/lib/utils'
 
+import { Abbr } from '@/components/abbr'
 import { DataTableColumnHeader } from '@/components/data-table/column-header'
 import { labels, statuses } from './data'
 
@@ -46,6 +47,7 @@ export const columns: ColumnDef<Enrollment>[] = [
           (table.getIsSomePageRowsSelected() && 'indeterminate')
         }
         onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
+        className="cursor-pointer"
         aria-label="Selecionar tudo"
       />
     ),
@@ -54,6 +56,7 @@ export const columns: ColumnDef<Enrollment>[] = [
         checked={row.getIsSelected()}
         disabled={!row.getCanSelect()}
         onCheckedChange={(value) => row.toggleSelected(!!value)}
+        className="cursor-pointer"
         aria-label="Selecionar linha"
       />
     )
@@ -72,9 +75,11 @@ export const columns: ColumnDef<Enrollment>[] = [
           </Avatar>
 
           <ul>
-            <li className="font-bold truncate max-w-62">{user.name}</li>
-            <li className="text-muted-foreground text-sm truncate max-w-62">
-              {user.email}
+            <li className="font-bold">
+              <Abbr>{user.name}</Abbr>
+            </li>
+            <li className="text-muted-foreground text-sm">
+              <Abbr>{user.email}</Abbr>
             </li>
           </ul>
         </div>
@@ -88,11 +93,7 @@ export const columns: ColumnDef<Enrollment>[] = [
     cell: ({ row }) => {
       const { name } = row.getValue('course') as { name: string }
 
-      return (
-        <abbr className="truncate max-w-62 block" title={name}>
-          {name}
-        </abbr>
-      )
+      return <Abbr>{name}</Abbr>
     }
   },
   {
@@ -129,9 +130,7 @@ export const columns: ColumnDef<Enrollment>[] = [
   },
   {
     accessorKey: 'created_at',
-    header: ({ column }) => (
-      <DataTableColumnHeader column={column} title="Cadastrado em" />
-    ),
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
     meta: { title: 'Cadastrado em' },
     enableSorting: true,
     enableHiding: true,
@@ -139,9 +138,7 @@ export const columns: ColumnDef<Enrollment>[] = [
   },
   {
     accessorKey: 'started_at',
-    header: ({ column }) => (
-      <DataTableColumnHeader column={column} title="Iniciado em" />
-    ),
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
     meta: { title: 'Iniciado em' },
     enableSorting: true,
     enableHiding: true,
@@ -149,9 +146,7 @@ export const columns: ColumnDef<Enrollment>[] = [
   },
   {
     accessorKey: 'completed_at',
-    header: ({ column }) => (
-      <DataTableColumnHeader column={column} title="Concluído em" />
-    ),
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
     meta: { title: 'Concluído em' },
     enableSorting: true,
     enableHiding: true,
@@ -159,9 +154,7 @@ export const columns: ColumnDef<Enrollment>[] = [
   },
   {
     accessorKey: 'failed_at',
-    header: ({ column }) => (
-      <DataTableColumnHeader column={column} title="Reprovado em" />
-    ),
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
     meta: { title: 'Reprovado em' },
     enableSorting: true,
     enableHiding: true,
@@ -169,9 +162,7 @@ export const columns: ColumnDef<Enrollment>[] = [
   },
   {
     accessorKey: 'canceled_at',
-    header: ({ column }) => (
-      <DataTableColumnHeader column={column} title="Cancelado em" />
-    ),
+    header: ({ column }) => <DataTableColumnHeader column={column} />,
     meta: { title: 'Cancelado em' },
     enableSorting: true,
     enableHiding: true,

apps/admin.saladeaula.digital/app/routes/_.$orgid.users._index/columns.tsx

@@ -5,6 +5,7 @@ import { type ColumnDef } from '@tanstack/react-table'
 import { ArrowRight } from 'lucide-react'
 import { NavLink } from 'react-router'
 
+import { Abbr } from '@/components/abbr'
 import { Avatar, AvatarFallback } from '@repo/ui/components/ui/avatar'
 import { Button } from '@repo/ui/components/ui/button'
 import { Spinner } from '@repo/ui/components/ui/spinner'
@@ -41,9 +42,11 @@ export const columns: ColumnDef<User>[] = [
           </Avatar>
 
           <ul>
-            <li className="font-bold truncate max-w-62">{name}</li>
-            <li className="text-muted-foreground text-sm truncate max-w-92">
-              {email}
+            <li className="font-bold">
+              <Abbr>{name}</Abbr>
+            </li>
+            <li className="text-muted-foreground text-sm">
+              <Abbr>{email}</Abbr>
             </li>
           </ul>
         </div>