Merge pull request #6 from dcwither/dcwither/fix-examples

Dcwither/fix examples
dcwither · Aug 24, 2018 · 5635bce · 5635bce
2 parents 159ee86 + c4bf205
commit 5635bce
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 18 deletions.
diff --git a/examples/question-form.js b/examples/question-form.js
@@ -58,7 +58,7 @@ export default class QuestionForm extends React.Component {
       value: { id },
       onCancel
     } = this.props;
-    if (id) {
+    if (!isNil(id)) {
       return (
         <React.Fragment>
           <Button variant="raised" color="default" onClick={onCancel}>

diff --git a/examples/questions-with-form.js b/examples/questions-with-form.js
@@ -11,8 +11,18 @@ export default class QuestionsWithForm extends React.Component {
 
   state = {
     nextId: 2,
-    questions: [
-      {
+    questions: {
+      0: {
+        author: {
+          firstName: "Bob",
+          lastName: "B"
+        },
+        body: "I installed package x and now my code doesn't work.",
+        id: 0,
+        tags: ["javascript"],
+        title: "I have a bug"
+      },
+      1: {
         author: {
           firstName: "Alice",
           lastName: "A"
@@ -22,18 +32,8 @@ export default class QuestionsWithForm extends React.Component {
         id: 1,
         tags: ["react", "redux"],
         title: "How do I connect a component to react redux"
-      },
-      {
-        author: {
-          firstName: "Bob",
-          lastName: "B"
-        },
-        body: "I installed package x and now my code doesn't work.",
-        id: 0,
-        tags: ["javascript"],
-        title: "I have a bug"
       }
-    ]
+    }
   };
 
   handleCommit = (message, value) => {
@@ -56,7 +56,7 @@ export default class QuestionsWithForm extends React.Component {
         }));
       case "DELETE":
         return this.setState(prevState => ({
-          questions: omit(prevState.questions, value.id)
+          questions: omit([value.id], prevState.questions)
         }));
       default:
         throw new Error("bad message");
@@ -68,7 +68,7 @@ export default class QuestionsWithForm extends React.Component {
     sortBy(prop("id")),
     reverse,
     map(question => (
-      <Editable value={question} onCommit={this.handleCommit}>
+      <Editable key={question.id} value={question} onCommit={this.handleCommit}>
         {editableProps => <QuestionForm {...editableProps} />}
       </Editable>
     ))

diff --git a/index.js b/index.js
diff --git a/stories/index.js b/stories/index.js
@@ -18,13 +18,14 @@ storiesOf("ReactEditable", module)
     const FormContainer = composeWithState(QuestionForm);
     return (
       <FormContainer
-        value={{
+        initialValue={{
           author: {
             firstName: "Alice",
             lastName: "B"
           },
           body:
             "I've been doing x, y, and z and it hasn't been working. [Reference](http://example.com) says I should do w but I'm not sure how...",
+          id: 1,
           tags: ["react", "redux"],
           title: "How do I connect a component to react redux"
         }}