I have a query regarding the Shadcn/UI - Data Table component. In my case, I am working with a list of users where each row has a delete button in the last column. Upon clicking the delete button, a confirmation dialog pops up. Currently, I am implementing this functionality by including the Dialog component in the "columns" file. I am wondering if this is the most efficient approach or if there is a better solution available. I suspect that I may be unnecessarily rendering the Dialog component for every row.
export const columns: ColumnDef<Users>[] = [
{
accessorKey: 'name',
header: ({ column }) => {
return 'name'
},
cell: ({ row }) => {
return row.original.name
},
},
{
accessorKey: 'delete',
header: '',
cell: ({ row }) => {
return
<Dialog> ... </Dialog> //Do we really need to render the Dialog component for each row?
},
},
]