import type { MRT_ColumnDef } from 'mantine-react-table';
import { useMemo } from 'react';

export default function CategoryColumns() {
	const columns = useMemo<MRT_ColumnDef<any>[]>(
		() => [
			{
				accessorFn: (row) => {
					if (row.id) {
						return `${row.id}`;
					}
					return '';
				},
				enableEditing: false,
				id: 'id',
				header: 'ID',
				size: 50,
				Cell: ({ renderedCellValue, row }) => renderedCellValue,
				Header: ({ column }) => column.columnDef.header,
			},
			{
				accessorFn: (row) => {
					if (row.category_name) {
						return `${row.category_name}`;
					}
					return '';
				},
				id: 'category_name',
				header: 'Name',
				size: 50,
				Cell: ({ renderedCellValue, row }) => renderedCellValue,
				Header: ({ column }) => column.columnDef.header,
			},
			{
				accessorFn: (row) => {
					if (row.category_index > -1) {
						return `${row.category_index}`;
					}
					return '';
				},
				enableEditing: false,
				id: 'category_index',
				header: 'Index',
				size: 50,
				Cell: ({ renderedCellValue, row }) => renderedCellValue,
				Header: ({ column }) => column.columnDef.header,
			},
			{
				accessorFn: (row) => {
					if (row.column_filter) {
						return `${row.column_filter}`;
					}
					return '';
				},
				id: 'column_filter',
				header: 'Filter Name',
				size: 50,
				Cell: ({ renderedCellValue, row }) => renderedCellValue,
				Header: ({ column }) => column.columnDef.header,
			},
		],
		[],
	);

	return columns;
}