From dbfc9ddb5ba66170b0380500a120e8cf5eb0c552 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien?= <sgregoire@users.noreply.github.com>
Date: Thu, 6 Feb 2020 18:48:50 +0100
Subject: [PATCH] fix(carbon-components-react) Updated
 DataTableCustomSelectionProps accordingly to the Element's props (#42128)

* Updated DataTableCustomSelectionProps accordingly to the Element's props

* Added test for DataTable

* Fixed test lint
---
 .../carbon-components-react-tests.tsx         | 58 +++++++++++++++++++
 .../lib/components/DataTable/DataTable.d.ts   |  4 +-
 2 files changed, 60 insertions(+), 2 deletions(-)

diff --git a/types/carbon-components-react/carbon-components-react-tests.tsx b/types/carbon-components-react/carbon-components-react-tests.tsx
index db78811a37..87db4e8875 100644
--- a/types/carbon-components-react/carbon-components-react-tests.tsx
+++ b/types/carbon-components-react/carbon-components-react-tests.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import {
     AccordionItem,
     DataTable,
+    DataTableCustomRenderProps,
     DataTableHeader,
     DataTableRow,
     Slider,
@@ -169,6 +170,63 @@ const t4 = (
         }}
     />
 );
+// RenderProps are compatible with sub-elements
+interface T5RowType extends DataTableRow {
+    col1: number;
+    col2: number;
+}
+const t5RowItems: T5RowType[] = [
+    { id: "row0", col1: 0, col2: 0},
+    { id: "row1", col1: 1, col2: 1},
+];
+const t5Headers: DataTableHeader[] = [
+    {key: 'col1', header: 'First column'},
+    {key: 'col2', header: 'Second column'}
+];
+const t5 = (
+    <DataTable
+        rows={t5RowItems}
+        headers={t5Headers}
+        render={(renderProps: DataTableCustomRenderProps<T5RowType>) => (
+            <DataTable.TableContainer>
+                <DataTable.Table {...renderProps.getTableProps()}>
+                    <DataTable.TableHead>
+                        <DataTable.TableRow>
+                            <DataTable.TableSelectAll
+                                {...renderProps.getSelectionProps()}
+                            />
+                            {renderProps.headers.map(header => (
+                                <DataTable.TableHeader
+                                    {...renderProps.getHeaderProps({ header })}
+                                >
+                                    {header.header}
+                                </DataTable.TableHeader>
+                            ))}
+                            <DataTable.TableHeader />
+                        </DataTable.TableRow>
+                    </DataTable.TableHead>
+                    <DataTable.TableBody>
+                        {renderProps.rows.map(row => (
+                            <React.Fragment key={row.id}>
+                                <DataTable.TableRow {...renderProps.getRowProps({ row })}>
+                                    <DataTable.TableSelectRow
+                                        {...renderProps.getSelectionProps({ row })}
+                                    />
+                                    {row.cells.map(cell => (
+                                        <DataTable.TableCell key={cell.id}>
+                                            {cell.value}
+                                        </DataTable.TableCell>
+                                    ))}
+                                    <DataTable.TableCell key={`options${row.id}`} />
+                                </DataTable.TableRow>
+                            </React.Fragment>
+                        ))}
+                    </DataTable.TableBody>
+                </DataTable.Table>
+            </DataTable.TableContainer>
+        )}
+    />
+);
 
 // UIShell - Link
 interface TestCompProps {
diff --git a/types/carbon-components-react/lib/components/DataTable/DataTable.d.ts b/types/carbon-components-react/lib/components/DataTable/DataTable.d.ts
index 22bc4ad88d..7977fb858b 100644
--- a/types/carbon-components-react/lib/components/DataTable/DataTable.d.ts
+++ b/types/carbon-components-react/lib/components/DataTable/DataTable.d.ts
@@ -70,13 +70,13 @@ export interface DataTableCustomSelectionData<R extends DataTableRow = DataTable
 
 export interface DataTableCustomSelectionProps<R extends DataTableRow = DataTableRow> {
     ariaLabel?: string,
-    checked: R extends never ? boolean : R["isSelected"],
+    checked: R extends never ? boolean : NonNullable<R["isSelected"]>,
     disabled: R extends never ? never : R["disabled"],
     id: string,
     indeterminate: R extends never ? boolean : never,
     name: string,
     onSelect(event: React.MouseEvent<HTMLElement>): void,
-    radio: R extends never ? never : (Extract<DataTableProps["radio"], true> | null),
+    radio?: R extends never ? never : (Extract<DataTableProps["radio"], boolean>),
 }
 
 // endregion Row Types