From 2595016186a118d8f9da921fbe6ed7111e5d5276 Mon Sep 17 00:00:00 2001
From: Alan Norbauer <norbauer@fb.com>
Date: Mon, 21 Oct 2019 10:25:04 -0700
Subject: [PATCH] Fix React warnings (#2221)

Summary:
**Summary**

Fix instances of the React warning:
```
React.jsx: Spreading a key to JSX is a deprecated pattern. ' +
        'Explicitly pass a key after spreading props in your JSX call. ' +
        'E.g. <ComponentName {...props} key={key} />'
```
originating from [React here](https://github.com/facebook/react/blob/18d2e0c03e4496a824fdb7f89ea2a3d60c30d49a/packages/react/src/ReactElementValidator.js#L366-L373)

This warning occurs when you spread a key with other props. There are probably more instances of this issue but these are the highest firing in our codebase.

**Test Plan**

`npm run lint && npm run test`
Pull Request resolved: https://github.com/facebook/draft-js/pull/2221

Reviewed By: mitermayer

Differential Revision: D18038272

Pulled By: steveluscher

fbshipit-source-id: 736236601ace92ae1e8d127e10bb35e393fa14b7
---
 src/component/base/DraftEditor.react.js                  | 6 ++++--
 src/component/contents/DraftEditorContents-core.react.js | 3 +--
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/component/base/DraftEditor.react.js b/src/component/base/DraftEditor.react.js
index 4cf47fd078..8458da6d87 100644
--- a/src/component/base/DraftEditor.react.js
+++ b/src/component/base/DraftEditor.react.js
@@ -352,7 +352,6 @@ class DraftEditor extends React.Component<DraftEditorProps, State> {
       customStyleFn,
       editorKey: this._editorKey,
       editorState,
-      key: 'contents' + this.state.contentsKey,
       textDirectionality,
     };
 
@@ -420,7 +419,10 @@ class DraftEditor extends React.Component<DraftEditorProps, State> {
               all DraftEditorLeaf nodes so it's first in postorder traversal.
             */}
             <UpdateDraftEditorFlags editor={this} editorState={editorState} />
-            <DraftEditorContents {...editorContentsProps} />
+            <DraftEditorContents
+              {...editorContentsProps}
+              key={'contents' + this.state.contentsKey}
+            />
           </div>
         </div>
       </div>
diff --git a/src/component/contents/DraftEditorContents-core.react.js b/src/component/contents/DraftEditorContents-core.react.js
index ae7d5eda53..e2f67b72ef 100644
--- a/src/component/contents/DraftEditorContents-core.react.js
+++ b/src/component/contents/DraftEditorContents-core.react.js
@@ -174,7 +174,6 @@ class DraftEditorContents extends React.Component<Props> {
         decorator,
         direction,
         forceSelection,
-        key,
         offsetKey,
         selection,
         tree: editorState.getBlockTree(key),
@@ -225,7 +224,7 @@ class DraftEditorContents extends React.Component<Props> {
       const child = React.createElement(
         Element,
         childProps,
-        <Component {...componentProps} />,
+        <Component {...componentProps} key={key} />,
       );
 
       processedBlocks.push({