Skip to content

Commit a72fe5c

Browse files
fix(columns): disable hiding and set consistent size for table columns
1 parent 397c3b1 commit a72fe5c

File tree

15 files changed

+194
-144
lines changed

15 files changed

+194
-144
lines changed

resources/js/pages/admin/permissions/column.tsx

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,8 @@ export const columns: ColumnDef<Permission>[] = [
2121
accessorKey: 'id',
2222
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
2323
enableSorting: true,
24+
enableHiding: false,
25+
size: 40,
2426
},
2527
{
2628
accessorKey: 'title',
@@ -51,17 +53,18 @@ export const columns: ColumnDef<Permission>[] = [
5153
},
5254
{
5355
id: 'actions',
54-
cell: ({ row }) => {
56+
cell: function Cell({ row }) {
5557
const perm = row.original;
5658

57-
const viewLink = permissions.show(perm.id).url;
59+
const viewRoute = permissions.show(perm.id);
60+
const editRoute = permissions.edit(perm.id);
5861

5962
return (
6063
<DropdownMenu>
6164
<DropdownMenuTrigger asChild>
62-
<Button variant="ghost" className="h-8 w-8 p-0">
65+
<Button variant="ghost" className="size-8 p-0">
6366
<span className="sr-only">Open menu</span>
64-
<MoreHorizontal className="h-4 w-4" />
67+
<MoreHorizontal className="size-4" />
6568
</Button>
6669
</DropdownMenuTrigger>
6770
<DropdownMenuContent align="end">
@@ -74,12 +77,19 @@ export const columns: ColumnDef<Permission>[] = [
7477
</DropdownMenuItem>
7578
<DropdownMenuSeparator />
7679
<DropdownMenuItem asChild>
77-
<Link href={viewLink}>View</Link>
80+
<Link href={viewRoute} as="button">
81+
View
82+
</Link>
83+
</DropdownMenuItem>
84+
<DropdownMenuItem asChild>
85+
<Link href={editRoute} as="button">
86+
Edit
87+
</Link>
7888
</DropdownMenuItem>
79-
<DropdownMenuItem>Edit</DropdownMenuItem>
8089
</DropdownMenuContent>
8190
</DropdownMenu>
8291
);
8392
},
93+
size: 40,
8494
},
8595
];

resources/js/pages/admin/roles/column.tsx

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,8 @@ export const columns: ColumnDef<Role>[] = [
2121
accessorKey: 'id',
2222
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
2323
enableSorting: true,
24+
enableHiding: false,
25+
size: 40,
2426
},
2527
{
2628
accessorKey: 'name',
@@ -51,19 +53,19 @@ export const columns: ColumnDef<Role>[] = [
5153
},
5254
{
5355
id: 'actions',
54-
cell: ({ row }) => {
56+
cell: function Cell({ row }) {
5557
const role = row.original;
5658
const disabled = role.name === 'Super Admin';
5759

58-
const editLink = disabled ? '' : roles.edit(role.id);
60+
const editRoute = disabled ? '' : roles.edit(role.id);
5961
const disabledStyle = disabled ? 'opacity-50 pointer-events-none' : '';
6062

6163
return (
6264
<DropdownMenu>
6365
<DropdownMenuTrigger asChild>
64-
<Button variant="ghost" className="h-8 w-8 p-0">
66+
<Button variant="ghost" className="size-8 p-0">
6567
<span className="sr-only">Open menu</span>
66-
<MoreHorizontal className="h-4 w-4" />
68+
<MoreHorizontal className="size-4" />
6769
</Button>
6870
</DropdownMenuTrigger>
6971
<DropdownMenuContent align="end">
@@ -73,14 +75,16 @@ export const columns: ColumnDef<Role>[] = [
7375
</DropdownMenuItem>
7476
<DropdownMenuSeparator />
7577
<DropdownMenuItem className={disabledStyle} asChild>
76-
<Link href={editLink} prefetch>
78+
<Link href={editRoute} as="button">
7779
Edit
7880
</Link>
7981
</DropdownMenuItem>
82+
{/* TODO: Implement delete role functionality */}
8083
<DropdownMenuItem className={disabledStyle}>Delete</DropdownMenuItem>
8184
</DropdownMenuContent>
8285
</DropdownMenu>
8386
);
8487
},
88+
size: 40,
8589
},
8690
];

resources/js/pages/admin/users/column.tsx

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@ export const columns: ColumnDef<User>[] = [
2222
accessorKey: 'id',
2323
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
2424
enableSorting: true,
25+
enableHiding: false,
26+
size: 40,
2527
},
2628
{
2729
accessorKey: 'name',
@@ -66,7 +68,7 @@ export const columns: ColumnDef<User>[] = [
6668
},
6769
{
6870
id: 'actions',
69-
cell: ({ row }) => {
71+
cell: function Cell({ row }) {
7072
const user = row.original;
7173

7274
return (
@@ -87,14 +89,19 @@ export const columns: ColumnDef<User>[] = [
8789
</DropdownMenuItem>
8890
<DropdownMenuSeparator />
8991
<DropdownMenuItem asChild>
90-
<Link href={users.show(user.id)}>View</Link>
92+
<Link href={users.show(user.id)} as="button">
93+
View
94+
</Link>
9195
</DropdownMenuItem>
9296
<DropdownMenuItem asChild>
93-
<Link href={users.edit(user.id)}>Edit</Link>
97+
<Link href={users.edit(user.id)} as="button">
98+
Edit
99+
</Link>
94100
</DropdownMenuItem>
95101
</DropdownMenuContent>
96102
</DropdownMenu>
97103
);
98104
},
105+
size: 40,
99106
},
100107
];

resources/js/pages/appointments/patient/column.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ export const column: ColumnDef<TableAppointment>[] = [
1010
accessorKey: 'id',
1111
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
1212
enableSorting: true,
13+
enableHiding: false,
14+
size: 40,
1315
},
1416
{
1517
accessorKey: 'reason_for_visit',

resources/js/pages/dashboard/tables/patient-column.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,9 @@ import { ColumnDef } from '@tanstack/react-table';
66
export const patientColumn: ColumnDef<UpcomingAppointment>[] = [
77
{
88
accessorKey: 'id',
9-
header: 'ID',
109
enableSorting: false,
10+
enableHiding: false,
11+
size: 40,
1112
},
1213
{
1314
accessorKey: 'date',

resources/js/pages/doctor/prescriptions/column.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@ export const column: ColumnDef<TablePrescription>[] = [
2222
accessorKey: 'id',
2323
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
2424
enableSorting: true,
25+
enableHiding: false,
26+
size: 40,
2527
},
2628
{
2729
id: 'patient_info.first_name',
@@ -85,15 +87,15 @@ export const column: ColumnDef<TablePrescription>[] = [
8587

8688
{
8789
id: 'actions',
88-
cell: ({ row }) => {
90+
cell: function Cell({ row }) {
8991
const patient = row.original.patient_info;
9092

9193
return (
9294
<DropdownMenu>
9395
<DropdownMenuTrigger asChild>
94-
<Button variant="ghost" className="h-8 w-8 p-0">
96+
<Button variant="ghost" className="size-8 p-0">
9597
<span className="sr-only">Open menu</span>
96-
<MoreHorizontal className="h-4 w-4" />
98+
<MoreHorizontal className="size-4" />
9799
</Button>
98100
</DropdownMenuTrigger>
99101
<DropdownMenuContent align="end">
@@ -137,5 +139,6 @@ export const column: ColumnDef<TablePrescription>[] = [
137139
</DropdownMenu>
138140
);
139141
},
142+
size: 40,
140143
},
141144
];

resources/js/pages/employees/column.tsx

Lines changed: 27 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@ export const column: ColumnDef<TableEmployeeInfo>[] = [
2323
accessorKey: 'id',
2424
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
2525
enableSorting: true,
26+
enableHiding: false,
27+
size: 40,
2628
},
2729
{
2830
accessorKey: 'first_name',
@@ -67,28 +69,31 @@ export const column: ColumnDef<TableEmployeeInfo>[] = [
6769

6870
{
6971
id: 'actions',
70-
cell: ({ row }) => (
71-
<DropdownMenu>
72-
<DropdownMenuTrigger asChild>
73-
<Button variant="ghost" className="h-8 w-8 p-0">
74-
<span className="sr-only">Open menu</span>
75-
<MoreHorizontal className="h-4 w-4" />
76-
</Button>
77-
</DropdownMenuTrigger>
78-
<DropdownMenuContent align="end">
79-
<DropdownMenuLabel>Actions</DropdownMenuLabel>
80-
<DropdownMenuItem asChild>
81-
<DropdownMenuCopyButton content={row.original.full_name}>Copy Name</DropdownMenuCopyButton>
82-
</DropdownMenuItem>
72+
cell: function Cell({ row }) {
73+
return (
74+
<DropdownMenu>
75+
<DropdownMenuTrigger asChild>
76+
<Button variant="ghost" className="size-8 p-0">
77+
<span className="sr-only">Open menu</span>
78+
<MoreHorizontal className="size-4" />
79+
</Button>
80+
</DropdownMenuTrigger>
81+
<DropdownMenuContent align="end">
82+
<DropdownMenuLabel>Actions</DropdownMenuLabel>
83+
<DropdownMenuItem asChild>
84+
<DropdownMenuCopyButton content={row.original.full_name}>Copy Name</DropdownMenuCopyButton>
85+
</DropdownMenuItem>
8386

84-
<DropdownMenuSeparator />
85-
<DropdownMenuItem asChild>
86-
<Link href={employee_info.show(row.original.id)} prefetch>
87-
Show
88-
</Link>
89-
</DropdownMenuItem>
90-
</DropdownMenuContent>
91-
</DropdownMenu>
92-
),
87+
<DropdownMenuSeparator />
88+
<DropdownMenuItem asChild>
89+
<Link href={employee_info.show(row.original.id)} as="button">
90+
Show
91+
</Link>
92+
</DropdownMenuItem>
93+
</DropdownMenuContent>
94+
</DropdownMenu>
95+
);
96+
},
97+
size: 40,
9398
},
9499
];

resources/js/pages/invoices/column.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@ export const column: ColumnDef<InvoiceWithRelations>[] = [
2222
accessorKey: 'id',
2323
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
2424
enableSorting: true,
25+
enableHiding: false,
26+
size: 40,
2527
},
2628
{
2729
accessorKey: 'consultation_date',
@@ -71,23 +73,22 @@ export const column: ColumnDef<InvoiceWithRelations>[] = [
7173

7274
{
7375
id: 'actions',
74-
cell: ({ row }) => {
76+
cell: function Cell({ row }) {
7577
const notes = row.original.notes;
7678

7779
return (
7880
<DropdownMenu>
7981
<DropdownMenuTrigger asChild>
80-
<Button variant="ghost" className="h-8 w-8 p-0">
82+
<Button variant="ghost" className="size-8 p-0">
8183
<span className="sr-only">Open menu</span>
82-
<MoreHorizontal className="h-4 w-4" />
84+
<MoreHorizontal className="size-4" />
8385
</Button>
8486
</DropdownMenuTrigger>
8587
<DropdownMenuContent align="end">
8688
<DropdownMenuLabel>Actions</DropdownMenuLabel>
8789
<DropdownMenuItem asChild>
8890
<DropdownMenuCopyButton content={notes}>Copy Notes</DropdownMenuCopyButton>
8991
</DropdownMenuItem>
90-
9192
<DropdownMenuSeparator />
9293
<DropdownMenuItem asChild>
9394
<a href={generatePdf(row.original.id).url} target="_blank" rel="external">
@@ -98,5 +99,6 @@ export const column: ColumnDef<InvoiceWithRelations>[] = [
9899
</DropdownMenu>
99100
);
100101
},
102+
size: 40,
101103
},
102104
];

resources/js/pages/manage/articles/column.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,8 @@ export const column: ColumnDef<TableArticle>[] = [
3232
accessorKey: 'id',
3333
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
3434
enableSorting: true,
35+
enableHiding: false,
36+
size: 40,
3537
},
3638
{
3739
accessorKey: 'title',
@@ -80,7 +82,7 @@ export const column: ColumnDef<TableArticle>[] = [
8082

8183
{
8284
id: 'actions',
83-
cell: ({ row }) => {
85+
cell: function Cell({ row }) {
8486
const title = row.original.title;
8587

8688
return (
@@ -127,5 +129,6 @@ export const column: ColumnDef<TableArticle>[] = [
127129
</DropdownMenu>
128130
);
129131
},
132+
size: 40,
130133
},
131134
];

resources/js/pages/manage/articles/my-column.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,8 @@ export const myColumn: ColumnDef<TableArticle>[] = [
3232
accessorKey: 'id',
3333
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
3434
enableSorting: true,
35+
enableHiding: false,
36+
size: 40,
3537
},
3638
{
3739
accessorKey: 'title',
@@ -72,7 +74,7 @@ export const myColumn: ColumnDef<TableArticle>[] = [
7274
},
7375
{
7476
id: 'actions',
75-
cell: ({ row }) => {
77+
cell: function Cell({ row }) {
7678
const title = row.original.title;
7779

7880
return (
@@ -122,5 +124,6 @@ export const myColumn: ColumnDef<TableArticle>[] = [
122124
</DropdownMenu>
123125
);
124126
},
127+
size: 40,
125128
},
126129
];

0 commit comments

Comments
 (0)