Fix Exposed Props for List, Create, Edit and Show

marmelab · Nov 6, 2020 · 5f05229 · 5f05229
1 parent 4ab0f8c
commit 5f05229
Show file tree

Hide file tree

Showing 9 changed files with 42 additions and 34 deletions.
diff --git a/packages/ra-ui-materialui/src/detail/Create.tsx b/packages/ra-ui-materialui/src/detail/Create.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Children, cloneElement, useMemo } from 'react';
+import { Children, cloneElement, ReactElement, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import Card from '@material-ui/core/Card';
 import { makeStyles } from '@material-ui/core/styles';
@@ -57,9 +57,9 @@ import { CreateProps } from '../types';
  * );
  * export default App;
  */
-const Create = (props: CreateProps) => (
-    <CreateView {...props} {...useCreateController(props)} />
-);
+const Create = (
+    props: CreateProps & { children?: ReactElement | null }
+): ReactElement => <CreateView {...props} {...useCreateController(props)} />;
 
 Create.propTypes = {
     actions: PropTypes.element,
@@ -165,7 +165,9 @@ export const CreateView = (props: CreateViewProps) => {
 
 interface CreateViewProps
     extends CreateProps,
-        Omit<CreateControllerProps, 'resource'> {}
+        Omit<CreateControllerProps, 'resource'> {
+    children?: ReactElement | null;
+}
 
 CreateView.propTypes = {
     actions: PropTypes.element,

diff --git a/packages/ra-ui-materialui/src/detail/Edit.tsx b/packages/ra-ui-materialui/src/detail/Edit.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Children, cloneElement, useMemo } from 'react';
+import { Children, cloneElement, ReactElement, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import Card from '@material-ui/core/Card';
 import CardContent from '@material-ui/core/CardContent';
@@ -61,9 +61,9 @@ import { EditProps } from '../types';
  * );
  * export default App;
  */
-const Edit = (props: EditProps): JSX.Element => (
-    <EditView {...props} {...useEditController(props)} />
-);
+const Edit = (
+    props: EditProps & { children?: ReactElement | null }
+): ReactElement => <EditView {...props} {...useEditController(props)} />;
 
 Edit.propTypes = {
     actions: PropTypes.element,
@@ -85,9 +85,11 @@ Edit.propTypes = {
     undoable: PropTypes.bool,
 };
 
-interface EditViewProps
+export interface EditViewProps
     extends EditProps,
-        Omit<EditControllerProps, 'resource'> {}
+        Omit<EditControllerProps, 'resource'> {
+    children?: ReactElement | null;
+}
 
 export const EditView = (props: EditViewProps) => {
     const {

diff --git a/...a-ui-materialui/src/detail/EditGuesser.js → ...-ui-materialui/src/detail/EditGuesser.tsx b/...a-ui-materialui/src/detail/EditGuesser.js → ...-ui-materialui/src/detail/EditGuesser.tsx
@@ -7,10 +7,11 @@ import {
     getElementsFromRecords,
 } from 'ra-core';
 
-import { EditView } from './Edit';
+import { EditView, EditViewProps } from './Edit';
 import editFieldTypes from './editFieldTypes';
+import { EditProps } from '../types';
 
-const EditViewGuesser = props => {
+const EditViewGuesser = (props: EditViewProps) => {
     const { record, resource } = props;
     const [inferredChild, setInferredChild] = useState(null);
     useEffect(() => {
@@ -47,7 +48,7 @@ ${inferredChild.getRepresentation()}
 
 EditViewGuesser.propTypes = EditView.propTypes;
 
-const EditGuesser = props => (
+const EditGuesser = (props: EditProps) => (
     <EditViewGuesser {...props} {...useEditController(props)} />
 );
 

diff --git a/packages/ra-ui-materialui/src/detail/Show.tsx b/packages/ra-ui-materialui/src/detail/Show.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { cloneElement, Children } from 'react';
+import { cloneElement, Children, ReactElement } from 'react';
 import PropTypes from 'prop-types';
 import Card from '@material-ui/core/Card';
 import { makeStyles } from '@material-ui/core/styles';
@@ -53,9 +53,9 @@ import { ShowProps } from '../types';
  * );
  * export default App;
  */
-const Show = (props: ShowProps) => (
-    <ShowView {...props} {...useShowController(props)} />
-);
+const Show = (
+    props: ShowProps & { children?: ReactElement | null }
+): ReactElement => <ShowView {...props} {...useShowController(props)} />;
 
 Show.propTypes = {
     actions: PropTypes.element,
@@ -72,9 +72,11 @@ Show.propTypes = {
     title: PropTypes.node,
 };
 
-interface ShowViewProps
+export interface ShowViewProps
     extends ShowProps,
-        Omit<ShowControllerProps, 'resource'> {}
+        Omit<ShowControllerProps, 'resource'> {
+    children?: ReactElement | null;
+}
 
 export const ShowView = (props: ShowViewProps) => {
     const {

diff --git a/...a-ui-materialui/src/detail/ShowGuesser.js → ...-ui-materialui/src/detail/ShowGuesser.tsx b/...a-ui-materialui/src/detail/ShowGuesser.js → ...-ui-materialui/src/detail/ShowGuesser.tsx
@@ -7,10 +7,11 @@ import {
     getElementsFromRecords,
 } from 'ra-core';
 
-import { ShowView } from './Show';
+import { ShowView, ShowViewProps } from './Show';
 import showFieldTypes from './showFieldTypes';
+import { ShowProps } from '../types';
 
-const ShowViewGuesser = props => {
+const ShowViewGuesser = (props: ShowViewProps) => {
     const { record, resource } = props;
     const [inferredChild, setInferredChild] = useState(null);
     useEffect(() => {
@@ -47,7 +48,7 @@ ${inferredChild.getRepresentation()}
 
 ShowViewGuesser.propTypes = ShowView.propTypes;
 
-const ShowGuesser = props => (
+const ShowGuesser = (props: ShowProps) => (
     <ShowViewGuesser {...props} {...useShowController(props)} />
 );
 

diff --git a/packages/ra-ui-materialui/src/list/List.tsx b/packages/ra-ui-materialui/src/list/List.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { FC } from 'react';
+import { ReactElement } from 'react';
 import PropTypes from 'prop-types';
 import {
     useCheckMinimumRequiredProps,
@@ -57,7 +57,9 @@ import { ListProps } from '../types';
  *     </List>
  * );
  */
-const List: FC<ListProps> = props => {
+const List = (
+    props: ListProps & { children?: ReactElement | null }
+): ReactElement => {
     useCheckMinimumRequiredProps('List', ['children'], props);
     const controllerProps = useListController(props);
     return (

diff --git a/packages/ra-ui-materialui/src/list/ListGuesser.tsx b/packages/ra-ui-materialui/src/list/ListGuesser.tsx
@@ -32,7 +32,7 @@ import { ListProps } from '../types';
  *     </Admin>
  * );
  */
-const ListGuesser: FC<ListProps> = props => {
+const ListGuesser = (props: ListProps) => {
     const controllerProps = useListController(props);
     return (
         <ListContextProvider value={controllerProps}>
@@ -41,7 +41,7 @@ const ListGuesser: FC<ListProps> = props => {
     );
 };
 
-const ListViewGuesser: FC<ListViewProps> = props => {
+const ListViewGuesser = (props: ListViewProps) => {
     const { ids, data, resource } = props;
     const [inferredChild, setInferredChild] = useState(null);
     useEffect(() => {

diff --git a/packages/ra-ui-materialui/src/list/ListView.tsx b/packages/ra-ui-materialui/src/list/ListView.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Children, cloneElement, FC } from 'react';
+import { Children, cloneElement, FC, ReactElement } from 'react';
 import PropTypes from 'prop-types';
 import Card from '@material-ui/core/Card';
 import classnames from 'classnames';
@@ -22,7 +22,7 @@ import DefaultActions from './ListActions';
 import Empty from './Empty';
 import { ListProps } from '../types';
 
-export const ListView: FC<ListViewProps> = props => {
+export const ListView = (props: ListViewProps) => {
     const {
         actions,
         aside,
@@ -199,7 +199,9 @@ const useStyles = makeStyles(
 
 export interface ListViewProps
     extends Omit<ListProps, 'basePath' | 'hasCreate' | 'perPage' | 'resource'>,
-        ListControllerProps {}
+        ListControllerProps {
+    children?: ReactElement | null;
+}
 
 const sanitizeRestProps: (
     props: Omit<

diff --git a/packages/ra-ui-materialui/src/types.ts b/packages/ra-ui-materialui/src/types.ts
@@ -9,7 +9,6 @@ import {
 } from 'ra-core';
 
 export interface ListProps extends ResourceComponentProps {
-    children?: ReactElement;
     actions?: ReactElement | false;
     aside?: ReactElement;
     bulkActionButtons?: ReactElement | false;
@@ -28,7 +27,6 @@ export interface ListProps extends ResourceComponentProps {
 }
 
 export interface EditProps extends ResourceComponentPropsWithId {
-    children?: ReactElement;
     actions?: ReactElement | false;
     aside?: ReactElement;
     classes?: any;
@@ -42,7 +40,6 @@ export interface EditProps extends ResourceComponentPropsWithId {
 }
 
 export interface CreateProps extends ResourceComponentProps {
-    children?: ReactElement;
     actions?: ReactElement | false;
     aside?: ReactElement;
     classes?: any;
@@ -56,7 +53,6 @@ export interface CreateProps extends ResourceComponentProps {
 }
 
 export interface ShowProps extends ResourceComponentPropsWithId {
-    children?: ReactElement;
     actions?: ReactElement | false;
     aside?: ReactElement;
     classes?: any;