diff --git a/apps/admin.saladeaula.digital/app/components/abbr.tsx b/apps/admin.saladeaula.digital/app/components/abbr.tsx
new file mode 100644
index 0000000..9975a60
--- /dev/null
+++ b/apps/admin.saladeaula.digital/app/components/abbr.tsx
@@ -0,0 +1,16 @@
+type AbbrProps = {
+ children: string
+ maxLen?: number
+}
+
+export function Abbr({ children, maxLen = 30, ...props }: AbbrProps) {
+ if (children.length <= maxLen) {
+ return {children}
+ }
+
+ return (
+
+ {children.substring(0, maxLen).concat('...')}
+
+ )
+}
diff --git a/apps/admin.saladeaula.digital/app/components/data-table/column-header.tsx b/apps/admin.saladeaula.digital/app/components/data-table/column-header.tsx
index 0c52b82..ee49f4e 100644
--- a/apps/admin.saladeaula.digital/app/components/data-table/column-header.tsx
+++ b/apps/admin.saladeaula.digital/app/components/data-table/column-header.tsx
@@ -11,14 +11,15 @@ import { cn } from '@repo/ui/lib/utils'
interface DataTableColumnHeaderProps
extends React.HTMLAttributes {
column: Column
- title: string
}
export function DataTableColumnHeader({
column,
- title,
className
}: DataTableColumnHeaderProps) {
+ // @ts-ignore
+ const title = column.columnDef?.meta?.title ?? column.id
+
if (!column.getCanSort()) {
return {title}
}
diff --git a/apps/admin.saladeaula.digital/app/components/data-table/data-table.tsx b/apps/admin.saladeaula.digital/app/components/data-table/data-table.tsx
index 14a63f6..2c2694d 100644
--- a/apps/admin.saladeaula.digital/app/components/data-table/data-table.tsx
+++ b/apps/admin.saladeaula.digital/app/components/data-table/data-table.tsx
@@ -10,7 +10,13 @@ import {
type Table,
type VisibilityState
} from '@tanstack/react-table'
-import { createContext, useEffect, useState, type ReactNode } from 'react'
+import {
+ createContext,
+ useContext,
+ useEffect,
+ useState,
+ type ReactNode
+} from 'react'
import { useSearchParams } from 'react-router'
import { Card, CardContent } from '@repo/ui/components/ui/card'
@@ -36,7 +42,17 @@ interface DataTableProps {
hiddenColumn?: string[]
}
-export const TableContext = createContext<{ table: Table } | null>(null)
+const TableContext = createContext<{ table: Table } | null>(null)
+
+export function useDataTable() {
+ const ctx = useContext(TableContext) as { table: Table } | null
+
+ if (!ctx) {
+ throw new Error('TableContext is null')
+ }
+
+ return ctx
+}
export function DataTable({
children,
@@ -68,6 +84,9 @@ export function DataTable({
const newState =
typeof updater === 'function' ? updater({ pageIndex, pageSize }) : updater
+ onRowSelectionChange?.([])
+ setRowSelection({})
+
setSearchParams((searchParams) => {
searchParams.set('p', newState?.pageIndex.toString())
searchParams.set('perPage', newState?.pageSize.toString())
diff --git a/apps/admin.saladeaula.digital/app/components/data-table/view-options.tsx b/apps/admin.saladeaula.digital/app/components/data-table/view-options.tsx
index 4b6d2d0..bd46f09 100644
--- a/apps/admin.saladeaula.digital/app/components/data-table/view-options.tsx
+++ b/apps/admin.saladeaula.digital/app/components/data-table/view-options.tsx
@@ -1,8 +1,5 @@
'use client'
-import { useContext } from 'react'
-
-import { type Table } from '@tanstack/react-table'
import { Columns2Icon } from 'lucide-react'
import { Button } from '@repo/ui/components/ui/button'
@@ -13,20 +10,14 @@ import {
DropdownMenuTrigger
} from '@repo/ui/components/ui/dropdown-menu'
import { cn } from '@repo/ui/lib/utils'
-import { TableContext } from './data-table'
+import { useDataTable } from './data-table'
export function DataTableViewOptions({
className
}: {
className: string
}) {
- const ctx = useContext(TableContext) as { table: Table } | null
-
- if (!ctx) {
- throw new Error('TableContext is null')
- }
-
- const { table } = ctx
+ const { table } = useDataTable()
return (
@@ -43,13 +34,16 @@ export function DataTableViewOptions({
typeof column.accessorFn !== 'undefined' && column.getCanHide()
)
.map((column) => {
+ // @ts-ignore
+ const title = column.columnDef?.meta?.title ?? column.id
+
return (
column.toggleVisibility(!!value)}
>
- {column.columnDef?.meta?.title ?? column.id}
+ {title}
)
})}
diff --git a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments._index/columns.tsx b/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments._index/columns.tsx
index a31114c..d8de1ad 100644
--- a/apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments._index/columns.tsx
+++ b/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[] = [
(table.getIsSomePageRowsSelected() && 'indeterminate')
}
onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
+ className="cursor-pointer"
aria-label="Selecionar tudo"
/>
),
@@ -54,6 +56,7 @@ export const columns: ColumnDef[] = [
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[] = [
- - {user.name}
- -
- {user.email}
+
-
+ {user.name}
+
+ -
+ {user.email}
@@ -88,11 +93,7 @@ export const columns: ColumnDef[] = [
cell: ({ row }) => {
const { name } = row.getValue('course') as { name: string }
- return (
-
- {name}
-
- )
+ return {name}
}
},
{
@@ -129,9 +130,7 @@ export const columns: ColumnDef[] = [
},
{
accessorKey: 'created_at',
- header: ({ column }) => (
-
- ),
+ header: ({ column }) => ,
meta: { title: 'Cadastrado em' },
enableSorting: true,
enableHiding: true,
@@ -139,9 +138,7 @@ export const columns: ColumnDef[] = [
},
{
accessorKey: 'started_at',
- header: ({ column }) => (
-
- ),
+ header: ({ column }) => ,
meta: { title: 'Iniciado em' },
enableSorting: true,
enableHiding: true,
@@ -149,9 +146,7 @@ export const columns: ColumnDef[] = [
},
{
accessorKey: 'completed_at',
- header: ({ column }) => (
-
- ),
+ header: ({ column }) => ,
meta: { title: 'ConcluĂdo em' },
enableSorting: true,
enableHiding: true,
@@ -159,9 +154,7 @@ export const columns: ColumnDef[] = [
},
{
accessorKey: 'failed_at',
- header: ({ column }) => (
-
- ),
+ header: ({ column }) => ,
meta: { title: 'Reprovado em' },
enableSorting: true,
enableHiding: true,
@@ -169,9 +162,7 @@ export const columns: ColumnDef[] = [
},
{
accessorKey: 'canceled_at',
- header: ({ column }) => (
-
- ),
+ header: ({ column }) => ,
meta: { title: 'Cancelado em' },
enableSorting: true,
enableHiding: true,
diff --git a/apps/admin.saladeaula.digital/app/routes/_.$orgid.users._index/columns.tsx b/apps/admin.saladeaula.digital/app/routes/_.$orgid.users._index/columns.tsx
index 6ac0610..d2593dd 100644
--- a/apps/admin.saladeaula.digital/app/routes/_.$orgid.users._index/columns.tsx
+++ b/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[] = [
- - {name}
- -
- {email}
+
-
+ {name}
+
+ -
+ {email}