[core] Fixes for upcoming eslint upgrade

benchmark/browser/scripts/benchmark.js

@@ -9,7 +9,9 @@ const http = require('http');
 const PORT = 1122;
 
 function sleep(ms) {
-  return new Promise((resolve) => setTimeout(resolve, ms));
+  return new Promise((resolve) => {
+    setTimeout(resolve, ms);
+  });
 }
 
 function createServer(options) {

docs/data/data-grid/accessibility/FocusManagement.js

@@ -6,11 +6,13 @@ import Grid from '@mui/material/Grid';
 import Link from '@mui/material/Link';
 import Typography from '@mui/material/Typography';
 
-const CorrectRenderLink = (props) => (
-  <Link tabIndex={props.tabIndex} href="/#tab-sequence">
-    more info
-  </Link>
-);
+function CorrectRenderLink(props) {
+  return (
+    <Link tabIndex={props.tabIndex} href="/#tab-sequence">
+      more info
+    </Link>
+  );
+}
 
 CorrectRenderLink.propTypes = {
   /**
@@ -19,7 +21,9 @@ CorrectRenderLink.propTypes = {
   tabIndex: PropTypes.oneOf([-1, 0]).isRequired,
 };
 
-const WrongRenderLink = () => <Link href="/#tab-sequence">more info</Link>;
+function WrongRenderLink() {
+  return <Link href="/#tab-sequence">more info</Link>;
+}
 
 const correctColumns = [
   { field: 'link', renderCell: CorrectRenderLink, width: 200 },

docs/data/data-grid/accessibility/FocusManagement.tsx

@@ -10,13 +10,17 @@ import Grid from '@mui/material/Grid';
 import Link from '@mui/material/Link';
 import Typography from '@mui/material/Typography';
 
-const CorrectRenderLink = (props: GridRenderCellParams) => (
-  <Link tabIndex={props.tabIndex} href="/#tab-sequence">
-    more info
-  </Link>
-);
+function CorrectRenderLink(props: GridRenderCellParams) {
+  return (
+    <Link tabIndex={props.tabIndex} href="/#tab-sequence">
+      more info
+    </Link>
+  );
+}
 
-const WrongRenderLink = () => <Link href="/#tab-sequence">more info</Link>;
+function WrongRenderLink() {
+  return <Link href="/#tab-sequence">more info</Link>;
+}
 
 const correctColumns: GridColumns = [
   { field: 'link', renderCell: CorrectRenderLink, width: 200 },

docs/data/data-grid/api-object/UseGridApiContext.js

@@ -4,7 +4,7 @@ import Button from '@mui/material/Button';
 import { DataGrid, GridToolbarContainer, useGridApiContext } from '@mui/x-data-grid';
 import { useDemoData } from '@mui/x-data-grid-generator';
 
-const CustomToolbar = () => {
+function CustomToolbar() {
   const apiRef = useGridApiContext();
 
   const handleGoToPage1 = () => apiRef.current.setPage(1);
@@ -14,7 +14,7 @@ const CustomToolbar = () => {
       <Button onClick={handleGoToPage1}>Go to page 1</Button>
     </GridToolbarContainer>
   );
-};
+}
 
 export default function UseGridApiContext() {
   const { data } = useDemoData({

docs/data/data-grid/api-object/UseGridApiContext.tsx

@@ -4,7 +4,7 @@ import Button from '@mui/material/Button';
 import { DataGrid, GridToolbarContainer, useGridApiContext } from '@mui/x-data-grid';
 import { useDemoData } from '@mui/x-data-grid-generator';
 
-const CustomToolbar = () => {
+function CustomToolbar() {
   const apiRef = useGridApiContext();
 
   const handleGoToPage1 = () => apiRef.current.setPage(1);
@@ -14,7 +14,7 @@ const CustomToolbar = () => {
       <Button onClick={handleGoToPage1}>Go to page 1</Button>
     </GridToolbarContainer>
   );
-};
+}
 
 export default function UseGridApiContext() {
   const { data } = useDemoData({

docs/data/data-grid/column-definition/RenderCellGrid.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import Button from '@mui/material/Button';
 import { DataGrid } from '@mui/x-data-grid';
 
-const RenderDate = (props) => {
+function RenderDate(props) {
   const { hasFocus, value } = props;
   const buttonElement = React.useRef(null);
   const rippleRef = React.useRef(null);
@@ -41,7 +41,7 @@ const RenderDate = (props) => {
       </Button>
     </strong>
   );
-};
+}
 
 RenderDate.propTypes = {
   /**

docs/data/data-grid/column-definition/RenderCellGrid.tsx

@@ -3,7 +3,7 @@ import Button from '@mui/material/Button';
 import { DataGrid, GridColDef, GridRenderCellParams } from '@mui/x-data-grid';
 import { TouchRippleActions } from '@mui/material/ButtonBase/TouchRipple';
 
-const RenderDate = (props: GridRenderCellParams<Date>) => {
+function RenderDate(props: GridRenderCellParams<Date>) {
   const { hasFocus, value } = props;
   const buttonElement = React.useRef<HTMLButtonElement | null>(null);
   const rippleRef = React.useRef<TouchRippleActions | null>(null);
@@ -41,7 +41,7 @@ const RenderDate = (props: GridRenderCellParams<Date>) => {
       </Button>
     </strong>
   );
-};
+}
 
 const columns: GridColDef[] = [
   {

docs/data/data-grid/column-groups/CustomizationDemo.js

@@ -49,15 +49,15 @@ const HeaderWithIconRoot = styled('div')(({ theme }) => ({
   },
 }));
 
-const HeaderWithIcon = (props) => {
+function HeaderWithIcon(props) {
   const { icon, ...params } = props;
 
   return (
     <HeaderWithIconRoot>
       <span>{params.headerName ?? params.groupId}</span> {icon}
     </HeaderWithIconRoot>
   );
-};
+}
 
 HeaderWithIcon.propTypes = {
   /**

docs/data/data-grid/column-groups/CustomizationDemo.tsx

@@ -57,15 +57,15 @@ const HeaderWithIconRoot = styled('div')(({ theme }) => ({
   },
 }));
 
-const HeaderWithIcon = (props: HeaderWithIconProps) => {
+function HeaderWithIcon(props: HeaderWithIconProps) {
   const { icon, ...params } = props;
 
   return (
     <HeaderWithIconRoot>
       <span>{params.headerName ?? params.groupId}</span> {icon}
     </HeaderWithIconRoot>
   );
-};
+}
 
 const columnGroupingModel: GridColumnGroupingModel = [
   {

docs/data/data-grid/demo/PopularFeaturesDemo.js

@@ -182,7 +182,7 @@ const getChipProperties = (plan) => {
   }
 };
 
-const PlanTag = (props) => {
+function PlanTag(props) {
   const chipPropperties = getChipProperties(props.plan);
   const avatar = !chipPropperties.avatarLink ? undefined : (
     <Avatar src={chipPropperties.avatarLink} />
@@ -195,21 +195,21 @@ const PlanTag = (props) => {
       label={props.plan}
     />
   );
-};
+}
 
 PlanTag.propTypes = {
   plan: PropTypes.string.isRequired,
 };
 
-const CustomToolbar = () => {
+function CustomToolbar() {
   return (
     <GridToolbarContainer sx={{ p: 1 }}>
       <GridToolbarQuickFilter />
     </GridToolbarContainer>
   );
-};
+}
 
-const RowDemo = (props) => {
+function RowDemo(props) {
   const { row } = props;
   const theme = useTheme();
   const gridBgColor = theme.palette.mode === 'dark' ? '#000' : '#fff';
@@ -222,7 +222,7 @@ const RowDemo = (props) => {
       </Box>
     </Box>
   );
-};
+}
 
 RowDemo.propTypes = {
   row: PropTypes.object.isRequired,

docs/data/data-grid/demo/PopularFeaturesDemo.tsx

@@ -197,7 +197,7 @@ const getChipProperties = (plan: string) => {
   }
 };
 
-const PlanTag = (props: { plan: string }) => {
+function PlanTag(props: { plan: string }) {
   const chipPropperties = getChipProperties(props.plan);
   const avatar = !chipPropperties.avatarLink ? undefined : (
     <Avatar src={chipPropperties.avatarLink} />
@@ -209,17 +209,17 @@ const PlanTag = (props: { plan: string }) => {
       label={props.plan}
     />
   );
-};
+}
 
-const CustomToolbar = () => {
+function CustomToolbar() {
   return (
     <GridToolbarContainer sx={{ p: 1 }}>
       <GridToolbarQuickFilter />
     </GridToolbarContainer>
   );
-};
+}
 
-const RowDemo = (props: { row: Row }) => {
+function RowDemo(props: { row: Row }) {
   const { row } = props;
   const theme = useTheme();
   const gridBgColor = theme.palette.mode === 'dark' ? '#000' : '#fff';
@@ -232,7 +232,7 @@ const RowDemo = (props: { row: Row }) => {
       </Box>
     </Box>
   );
-};
+}
 
 const columns: GridColDef[] = [
   {

docs/data/data-grid/editing/AskConfirmationBeforeSave.js

@@ -16,15 +16,15 @@ import Alert from '@mui/material/Alert';
 const useFakeMutation = () => {
   return React.useCallback(
     (user) =>
-      new Promise((resolve, reject) =>
+      new Promise((resolve, reject) => {
         setTimeout(() => {
           if (user.name?.trim() === '') {
             reject();
           } else {
             resolve(user);
           }
-        }, 200),
-      ),
+        }, 200);
+      }),
     [],
   );
 };

docs/data/data-grid/editing/AskConfirmationBeforeSave.tsx

@@ -30,15 +30,15 @@ interface User {
 const useFakeMutation = () => {
   return React.useCallback(
     (user: Partial<User>) =>
-      new Promise<Partial<User>>((resolve, reject) =>
+      new Promise<Partial<User>>((resolve, reject) => {
         setTimeout(() => {
           if (user.name?.trim() === '') {
             reject();
           } else {
             resolve(user);
           }
-        }, 200),
-      ),
+        }, 200);
+      }),
     [],
   );
 };

docs/data/data-grid/editing/ServerSidePersistence.js

@@ -11,15 +11,15 @@ import Alert from '@mui/material/Alert';
 const useFakeMutation = () => {
   return React.useCallback(
     (user) =>
-      new Promise((resolve, reject) =>
+      new Promise((resolve, reject) => {
         setTimeout(() => {
           if (user.name?.trim() === '') {
             reject(new Error("Error while saving user: name can't be empty."));
           } else {
             resolve({ ...user, name: user.name?.toUpperCase() });
           }
-        }, 200),
-      ),
+        }, 200);
+      }),
     [],
   );
 };

docs/data/data-grid/editing/ServerSidePersistence.tsx

@@ -25,15 +25,15 @@ interface User {
 const useFakeMutation = () => {
   return React.useCallback(
     (user: Partial<User>) =>
-      new Promise<Partial<User>>((resolve, reject) =>
+      new Promise<Partial<User>>((resolve, reject) => {
         setTimeout(() => {
           if (user.name?.trim() === '') {
             reject(new Error("Error while saving user: name can't be empty."));
           } else {
             resolve({ ...user, name: user.name?.toUpperCase() });
           }
-        }, 200),
-      ),
+        }, 200);
+      }),
     [],
   );
 };

docs/data/data-grid/events/CatalogOfEventsNoSnap.js

@@ -25,7 +25,7 @@ function getDataGridComponentNameFromProjectName(project) {
 
 const Description = styled(Typography)({ whiteSpace: 'nowrap' });
 
-const EventRow = ({ event }) => {
+function EventRow({ event }) {
   const example = React.useMemo(() => {
     const args = ['details, // GridCallbackDetails'];
     if (event.event) {
@@ -68,7 +68,7 @@ ${propExample}
       <HighlightedCode code={example} language="tsx" />
     </Box>
   );
-};
+}
 
 const COLUMNS = [
   {
@@ -120,11 +120,13 @@ const COLUMNS = [
   },
 ];
 
-const Toolbar = () => (
-  <GridToolbarContainer sx={{ p: 1 }}>
-    <GridToolbarQuickFilter />
-  </GridToolbarContainer>
-);
+function Toolbar() {
+  return (
+    <GridToolbarContainer sx={{ p: 1 }}>
+      <GridToolbarQuickFilter />
+    </GridToolbarContainer>
+  );
+}
 
 export default function CatalogOfEventsNoSnap() {
   return (

docs/data/data-grid/events/SubscribeToEventsHook.js

@@ -10,7 +10,7 @@ import Alert from '@mui/material/Alert';
 import Box from '@mui/material/Box';
 import Stack from '@mui/material/Stack';
 
-const Footer = () => {
+function Footer() {
   const [message, setMessage] = React.useState('');
   const apiRef = useGridApiContext();
 
@@ -26,7 +26,7 @@ const Footer = () => {
       {message && <Alert severity="info">{message}</Alert>}
     </React.Fragment>
   );
-};
+}
 
 export default function SubscribeToEventsHook() {
   const data = useMovieData();