From 3ac2fe567415d1fc0eb0ad26d9d996339cad2d1f Mon Sep 17 00:00:00 2001
From: Malcolm Kee <malcolm.keeweesiong@gmail.com>
Date: Wed, 10 Nov 2021 02:10:09 +0800
Subject: [PATCH] fix regression when refactoring to context api (#89)

---
 demo/index.js                   | 27 ++++++++++++++++-----------
 package.json                    |  2 +-
 src/components/Container.js     | 19 +++++++++++--------
 src/components/SectionButton.js |  5 -----
 4 files changed, 28 insertions(+), 25 deletions(-)

diff --git a/demo/index.js b/demo/index.js
index 9db4393..4b3538e 100644
--- a/demo/index.js
+++ b/demo/index.js
@@ -12,7 +12,6 @@ const config = {
   placeholder: "Welcome to Mobiledoc!",
   willCreateEditor:() => { console.log('creating editor...'); },
   didCreateEditor:(e) => { console.log('created editor:', e); },
-  onChange:(doc) => { console.log(doc); }
 };
 
 const imgPayload = { caption: "Edit this right meow!", src: "http://www.placekitten.com/200/200" };
@@ -33,16 +32,22 @@ const ClickCounterButton = () => {
   return <button onClick={onClick}>Click Counter Atom</button>;
 };
 
+const App = () => {
+  const [state, setState] = React.useState(undefined);
+
+  return (
+    <div>
+      <ReactMobiledoc.Container {...config} mobiledoc={state} onChange={setState}>
+        <ReactMobiledoc.Toolbar />
+        <ImageButton />
+        <ClickCounterButton />
+        <ReactMobiledoc.Editor />
+      </ReactMobiledoc.Container>
+      <pre>{JSON.stringify(state, null, 2)}</pre>
+    </div>
+  );
+};
 
-
-ReactDOM.render(
-  <ReactMobiledoc.Container {...config}>
-    <ReactMobiledoc.Toolbar />
-    <ImageButton />
-    <ClickCounterButton />
-    <ReactMobiledoc.Editor />
-  </ReactMobiledoc.Container>,
-  document.getElementById('root')
-);
+ReactDOM.render(<App />, document.getElementById('root'));
 
 require("!style-loader!css-loader!../node_modules/mobiledoc-kit/dist/mobiledoc.css");
diff --git a/package.json b/package.json
index 52e05c0..167bf48 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-mobiledoc-editor",
-  "version": "0.12.1",
+  "version": "0.12.2",
   "description": "A Mobiledoc editor for React apps",
   "repository": "joshfrench/react-mobiledoc-editor",
   "homepage": "https://github.com/joshfrench/react-mobiledoc-editor",
diff --git a/src/components/Container.js b/src/components/Container.js
index 6827efa..740367e 100644
--- a/src/components/Container.js
+++ b/src/components/Container.js
@@ -29,13 +29,9 @@ class Container extends React.Component {
     this.editor = new Mobiledoc.Editor(editorOptions);
 
     this.editor.inputModeDidChange(this.setActiveTags);
-
-    if (typeof this.props.onChange === 'function') {
-      this.editor.postDidChange(() => {
-        const mobiledoc = this.editor.serialize(this.props.serializeVersion);
-        this.props.onChange(mobiledoc);
-      });
-    }
+    this.editor.postDidChange(() => {
+      this.handleChange();
+    });
 
     if (typeof this.props.didCreateEditor === 'function') {
       this.props.didCreateEditor(this.editor);
@@ -56,7 +52,7 @@ class Container extends React.Component {
     /* eslint-disable no-unused-vars */
     /* deconstruct out non-React props before passing to children */
     const { atoms, autofocus, cardProps, cards, children, didCreateEditor, html, mobiledoc, options,
-      placeholder, serializeVersion, spellcheck, willCreateEditor, ...componentProps } = this.props;
+      placeholder, serializeVersion, spellcheck, willCreateEditor, onChange, ...componentProps } = this.props;
     /* eslint-enable no-unused-vars */
     return <div {...componentProps}>
       <ReactMobileDocContext.Provider
@@ -85,6 +81,13 @@ class Container extends React.Component {
       })
     });
   }
+
+  handleChange = () => {
+    if (typeof this.props.onChange === 'function') {
+      const mobiledoc = this.editor.serialize(this.props.serializeVersion);
+      this.props.onChange(mobiledoc);
+    }
+  };
 }
 
 Container.propTypes = {
diff --git a/src/components/SectionButton.js b/src/components/SectionButton.js
index b66d08d..c178275 100644
--- a/src/components/SectionButton.js
+++ b/src/components/SectionButton.js
@@ -19,9 +19,4 @@ SectionButton.propTypes = {
   children: PropTypes.node
 };
 
-SectionButton.contextTypes = {
-  editor: PropTypes.object,
-  activeSectionTags: PropTypes.array
-};
-
 export default SectionButton;