diff --git a/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table-columns.tsx b/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table-columns.tsx index 722e685db..f8ac333c8 100644 --- a/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table-columns.tsx +++ b/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table-columns.tsx @@ -5,18 +5,32 @@ import { StatusIndicator } from '@/components/status-indicator'; import { formatDate } from '@/lib/format'; import { Policy } from '@db'; import { ColumnDef } from '@tanstack/react-table'; +import { ExternalLink } from 'lucide-react'; +import Link from 'next/link'; -export function getPolicyColumns(): ColumnDef[] { +export function getPolicyColumns(orgId: string): ColumnDef[] { return [ { id: 'name', accessorKey: 'name', header: ({ column }) => , cell: ({ row }) => { + const policyName = row.getValue('name') as string; + const policyHref = `/${orgId}/policies/${row.original.id}`; + return ( -
- {row.getValue('name')} -
+ e.stopPropagation()} + className="group flex items-center gap-2" + > + + {policyName} + + + ); }, meta: { diff --git a/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table.tsx b/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table.tsx index 48f1a9957..54bb21a84 100644 --- a/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table.tsx +++ b/apps/app/src/app/(app)/[orgId]/policies/all/components/policies-table.tsx @@ -16,9 +16,10 @@ interface PoliciesTableProps { export function PoliciesTable({ promises }: PoliciesTableProps) { const [{ data, pageCount }] = React.use(promises); - const { orgId } = useParams(); + const params = useParams(); + const orgId = params.orgId as string; - const columns = React.useMemo(() => getPolicyColumns(), []); + const columns = React.useMemo(() => getPolicyColumns(orgId), [orgId]); const { table } = useDataTable({ data, diff --git a/apps/app/src/components/data-table/data-table.tsx b/apps/app/src/components/data-table/data-table.tsx index 9c4182fdd..642cf56ad 100644 --- a/apps/app/src/components/data-table/data-table.tsx +++ b/apps/app/src/components/data-table/data-table.tsx @@ -33,14 +33,14 @@ export function DataTable({ if (onRowClick) { onRowClick(row); } - if (getRowId) { + if (getRowId && rowClickBasePath) { const id = getRowId(row); router.push(`${rowClickBasePath}/${id}`); } }; - // Apply client-side filtering const filteredRows = table.getFilteredRowModel().rows; + const isRowClickable = !!(getRowId && rowClickBasePath) || !!onRowClick; return (
@@ -78,25 +78,27 @@ export function DataTable({ handleRowClick(row.original)} + className={cn(isRowClickable && 'hover:bg-muted/50 cursor-pointer')} + onClick={isRowClickable ? () => handleRowClick(row.original) : undefined} > - {row.getVisibleCells().map((cell, index) => ( - - {flexRender(cell.column.columnDef.cell, cell.getContext())} - - ))} + {row.getVisibleCells().map((cell, index) => { + return ( + + {flexRender(cell.column.columnDef.cell, cell.getContext())} + + ); + })} )) ) : (