diff --git a/docs/src/pages/components/chips/ChipsPlayground.js b/docs/src/pages/components/chips/ChipsPlayground.js
index f659812b1848ce..97c890ffedeb64 100644
--- a/docs/src/pages/components/chips/ChipsPlayground.js
+++ b/docs/src/pages/components/chips/ChipsPlayground.js
@@ -24,7 +24,7 @@ const styles = (theme) => ({
 
 function ChipsPlayground(props) {
   const { classes } = props;
-  const [{ color, onDelete, avatar, icon, variant, size }, setState] = React.useState({
+  const [state, setState] = React.useState({
     color: 'default',
     onDelete: 'none',
     avatar: 'none',
@@ -32,12 +32,13 @@ function ChipsPlayground(props) {
     variant: 'default',
     size: 'medium',
   });
+  const { color, onDelete, avatar, icon, variant, size } = state;
 
   const handleChange = (event) => {
-    setState((state) => ({
+    setState({
       ...state,
       [event.target.name]: event.target.value,
-    }));
+    });
   };
 
   const handleDeleteExample = () => {
diff --git a/docs/src/pages/components/popover/AnchorPlayground.js b/docs/src/pages/components/popover/AnchorPlayground.js
index 352c0ce24a6b32..51f87d68ec7e49 100644
--- a/docs/src/pages/components/popover/AnchorPlayground.js
+++ b/docs/src/pages/components/popover/AnchorPlayground.js
@@ -68,19 +68,7 @@ function AnchorPlayground(props) {
   const { classes } = props;
   const anchorRef = React.useRef();
 
-  const [
-    {
-      open,
-      anchorOriginVertical,
-      anchorOriginHorizontal,
-      transformOriginVertical,
-      transformOriginHorizontal,
-      positionTop,
-      positionLeft,
-      anchorReference,
-    },
-    setState,
-  ] = React.useState({
+  const [state, setState] = React.useState({
     open: false,
     anchorOriginVertical: 'top',
     anchorOriginHorizontal: 'left',
@@ -91,32 +79,43 @@ function AnchorPlayground(props) {
     anchorReference: 'anchorEl',
   });
 
+  const {
+    open,
+    anchorOriginVertical,
+    anchorOriginHorizontal,
+    transformOriginVertical,
+    transformOriginHorizontal,
+    positionTop,
+    positionLeft,
+    anchorReference,
+  } = state;
+
   const handleChange = (event) => {
-    setState((state) => ({
+    setState({
       ...state,
       [event.target.name]: event.target.value,
-    }));
+    });
   };
 
   const handleNumberInputChange = (key) => (event) => {
-    setState((state) => ({
+    setState({
       ...state,
       [key]: parseInt(event.target.value, 10),
-    }));
+    });
   };
 
   const handleClickButton = () => {
-    setState((state) => ({
+    setState({
       ...state,
       open: true,
-    }));
+    });
   };
 
   const handleClose = () => {
-    setState((state) => ({
+    setState({
       ...state,
       open: false,
-    }));
+    });
   };
 
   let mode = '';