1import React from 'react';
2import doc from './sortFunctionCol.mdx';
3import data from '../../constants/sampleMovieData';
4import DataTable from '../../../src/index';
5
6const caseInsensitiveSort = (rowA, rowB) => {
7	const a = rowA.title.toLowerCase();
8	const b = rowB.title.toLowerCase();
9
10	if (a > b) {
11		return 1;
12	}
13
14	if (b > a) {
15		return -1;
16	}
17
18	return 0;
19};
20
21const columns = [
22	{
23		name: 'Title',
24		selector: row => row.title,
25		sortable: true,
26		sortFunction: caseInsensitiveSort,
27	},
28	{
29		name: 'Director',
30		selector: row => row.director,
31		sortable: true,
32	},
33	{
34		name: 'Year',
35		selector: row => row.year,
36		sortable: true,
37	},
38];
39
40export const CustomColumnSort = () => {
41	return <DataTable title="Movie List" columns={columns} data={data} pagination />;
42};
43
44export default {
45	title: 'Sorting/Custom Column Sort',
46	component: CustomColumnSort,
47	parameters: {
48		docs: {
49			page: doc,
50		},
51	},
52};