Merge pull request #6090 from marmelab/fix-list-ts

[TypeScript] Fix SimpleList and other list components can't be used without context
marmelab · Mar 29, 2021 · d56cf09 · d56cf09
2 parents 6be7dc6 + 5244b9a
commit d56cf09
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 5 deletions.
diff --git a/packages/ra-ui-materialui/src/list/SimpleList.tsx b/packages/ra-ui-materialui/src/list/SimpleList.tsx
@@ -18,6 +18,7 @@ import {
     sanitizeListRestProps,
     useListContext,
     Record,
+    RecordMap,
     Identifier,
 } from 'ra-core';
 
@@ -186,7 +187,8 @@ export type FunctionToElement = (
     id: Identifier
 ) => ReactElement | string;
 
-export interface SimpleListProps extends Omit<ListProps, 'classes'> {
+export interface SimpleListProps<RecordType extends Record = Record>
+    extends Omit<ListProps, 'classes'> {
     className?: string;
     classes?: ClassesOverride<typeof useStyles>;
     hasBulkActions?: boolean;
@@ -199,6 +201,12 @@ export interface SimpleListProps extends Omit<ListProps, 'classes'> {
     secondaryText?: FunctionToElement;
     tertiaryText?: FunctionToElement;
     rowStyle?: (record: Record, index: number) => any;
+    // can be injected when using the component without context
+    basePath?: string;
+    data?: RecordMap<RecordType>;
+    ids?: Identifier[];
+    loaded?: boolean;
+    total?: number;
 }
 
 const useLinkOrNotStyles = makeStyles(

diff --git a/packages/ra-ui-materialui/src/list/SingleFieldList.tsx b/packages/ra-ui-materialui/src/list/SingleFieldList.tsx
@@ -9,6 +9,9 @@ import {
     sanitizeListRestProps,
     useListContext,
     useResourceContext,
+    Record,
+    RecordMap,
+    Identifier,
 } from 'ra-core';
 
 import Link from '../Link';
@@ -129,19 +132,24 @@ SingleFieldList.propTypes = {
     children: PropTypes.element.isRequired,
     classes: PropTypes.object,
     className: PropTypes.string,
-    data: PropTypes.object,
+    data: PropTypes.any,
     ids: PropTypes.array,
     // @ts-ignore
     linkType: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
     resource: PropTypes.string,
 };
 
-export interface SingleFieldListProps
+export interface SingleFieldListProps<RecordType extends Record = Record>
     extends HtmlHTMLAttributes<HTMLDivElement> {
     className?: string;
     classes?: ClassesOverride<typeof useStyles>;
     linkType?: string | false;
     children: React.ReactElement;
+    // can be injected when using the component without context
+    basePath?: string;
+    data?: RecordMap<RecordType>;
+    ids?: Identifier[];
+    loaded?: boolean;
 }
 
 export default SingleFieldList;
diff --git a/packages/ra-ui-materialui/src/list/datagrid/Datagrid.tsx b/packages/ra-ui-materialui/src/list/datagrid/Datagrid.tsx
@@ -16,6 +16,8 @@ import {
     useVersion,
     Identifier,
     Record,
+    RecordMap,
+    SortPayload,
 } from 'ra-core';
 import {
     Checkbox,
@@ -337,7 +339,7 @@ Datagrid.propTypes = {
         field: PropTypes.string,
         order: PropTypes.string,
     }),
-    data: PropTypes.object,
+    data: PropTypes.any,
     // @ts-ignore
     expand: PropTypes.oneOfType([PropTypes.element, PropTypes.elementType]),
     hasBulkActions: PropTypes.bool,
@@ -356,7 +358,8 @@ Datagrid.propTypes = {
     isRowSelectable: PropTypes.func,
 };
 
-export interface DatagridProps extends Omit<TableProps, 'size' | 'classes'> {
+export interface DatagridProps<RecordType extends Record = Record>
+    extends Omit<TableProps, 'size' | 'classes' | 'onSelect'> {
     body?: ReactElement;
     classes?: ClassesOverride<typeof useDatagridStyles>;
     className?: string;
@@ -375,6 +378,17 @@ export interface DatagridProps extends Omit<TableProps, 'size' | 'classes'> {
     rowClick?: string | RowClickFunction;
     rowStyle?: (record: Record, index: number) => any;
     size?: 'medium' | 'small';
+    // can be injected when using the component without context
+    basePath?: string;
+    currentsort?: SortPayload;
+    data?: RecordMap<RecordType>;
+    ids?: Identifier[];
+    loaded?: boolean;
+    onSelect?: (ids: Identifier[]) => void;
+    onToggleItem?: (id: Identifier) => void;
+    setSort?: (sort: string, order?: string) => void;
+    selectedIds?: Identifier[];
+    total?: number;
 }
 
 export default Datagrid;