quelques modif sur les exemples

Author: RVassili

src/examples/use-context-1/ExampleUseContext102.tsx

@@ -30,14 +30,6 @@ const Consumer = () => {
 
   return (
     <ul>
-      <li>
-        <ActionButton
-          label="Do nothing state-wise"
-          onClick={() => {
-            /* NOOP */
-          }}
-        />
-      </li>
       <li>
         <ActionButton
           label="Increment"

src/examples/use-effect-1/ExampleUseEffect102.tsx

@@ -77,12 +77,7 @@ const ExampleUseState106 = () => {
   const [str, setStr] = React.useState<{ str: string }>({ str: "" });
 
   return (
-    <SubComponent
-      value={counter}
-      setValue={setCounter}
-      otherValue={str}
-      setOtherValue={setStr}
-    />
+    <SubComponent value={counter} setValue={setCounter} otherValue={str} setOtherValue={setStr} />
   );
 };
 

src/examples/use-effect-1/ExampleUseEffect103.tsx

@@ -28,7 +28,7 @@ const SubComponent = ({
     log("use effect");
     if (shouldSetSuperState) setOtherValue(otherValue);
     else setOtherState(otherValue);
-  }, [otherValue, setOtherState, setOtherValue, shouldSetSuperState]);
+  }, [otherValue, setOtherState, setOtherValue, shouldSetSuperState, log]);
 
   return (
     <>

src/examples/use-state-1/ExampleUseState102.tsx

@@ -1,24 +1,16 @@
 import React from "react";
 import ActionButton from "../../commons/ActionButton";
-import cloneDeep from "lodash.clonedeep";
 
 const ExampleUseState102 = () => {
-  const [state, setState] = React.useState<{ value: { data: number } }>({
+  const initial = {
     value: { data: 0 }
-  });
+  };
+  const [state, setState] = React.useState<{ value: { data: number } }>(initial);
 
   return (
     <>
       <pre>{JSON.stringify(state, null, 2)}</pre>
       <ul>
-        <li>
-          <ActionButton
-            label="Do nothing state-wise"
-            onClick={() => {
-              /* NOOP */
-            }}
-          />
-        </li>
         <li>
           <ActionButton
             label="Increment"
@@ -31,15 +23,7 @@ const ExampleUseState102 = () => {
           <ActionButton
             label="Reset to 0"
             onClick={() => {
-              setState({ value: { data: 0 } });
-            }}
-          />
-        </li>
-        <li>
-          <ActionButton
-            label="Re-apply state copy"
-            onClick={() => {
-              setState(cloneDeep(state));
+              setState(initial);
             }}
           />
         </li>

src/examples/use-state-1/ExampleUseState103.tsx

@@ -10,14 +10,6 @@ const ExampleUseState103 = () => {
     <>
       <pre>{JSON.stringify({ state }, null, 2)}</pre>
       <ul>
-        <li>
-          <ActionButton
-            label="Do nothing state-wise"
-            onClick={() => {
-              /* NOOP */
-            }}
-          />
-        </li>
         <li>
           <ActionButton
             label="Increment"

src/examples/use-state-1/ExampleUseState104.tsx

@@ -11,14 +11,6 @@ const ExampleUseState104 = () => {
     <>
       <pre>{JSON.stringify({ state, stateF }, null, 2)}</pre>
       <ul>
-        <li>
-          <ActionButton
-            label="Do nothing state-wise"
-            onClick={() => {
-              /* NOOP */
-            }}
-          />
-        </li>
         <li>
           <ActionButton
             label={"Change function basic"}

src/examples/use-state-1/ExampleUseState105.tsx

@@ -5,46 +5,21 @@ import { useLog } from "../../commons/ExampleBloc";
 const ExampleUseState105 = () => {
   const log = useLog();
 
-  const [numberState, setNumberState] = React.useState<number>(0);
-  const [stringState, setStringState] = React.useState<string>("");
+  const [render, setRender] = React.useState<boolean>(false);
   const [objectState, setObjectState] = React.useState<{ insideVal: string }>({
     insideVal: ""
   });
 
   return (
     <>
-      <pre>
-        {JSON.stringify({ numberState, stringState, objectState }, null, 2)}
-      </pre>
+      <pre>{JSON.stringify({ render, objectState }, null, 2)}</pre>
 
       <ul>
         <li>
           <ActionButton
-            label="Update numberState"
+            label="render"
             onClick={() => {
-              const s = Number.parseFloat(prompt("Value?") || "");
-              log("Will update", s);
-              setNumberState(s);
-            }}
-          />
-        </li>
-        <li>
-          <ActionButton
-            label="Update stringState"
-            onClick={() => {
-              const s = prompt("Value?") || "";
-              log("Will update", s);
-              setStringState(s);
-            }}
-          />
-        </li>
-        <li>
-          <ActionButton
-            label="Update objectState"
-            onClick={() => {
-              const s = prompt("Value?") || "";
-              log("Will update", s);
-              setObjectState({ insideVal: s });
+              setRender(b => !b);
             }}
           />
         </li>