js react react-shortcutの使い方

Question

react-shortcut

上記に挙げたurlのreact-shortcut自作のアプリに導入したいと思っています。

私が解釈した必要な作業としては
１

npm install react-shortcuts

２
keymap.js（ショートカットキーに名前を対応させたもの）を作成、メインファイル（App.jsなど？？）からrequireする
(import keymap from './keymap'をメインファイルに記述)

３
ショートカットコンポーネントの受け入れ態勢を作る
App.js（？）に

import { ShortcutManager } from 'react-shortcuts'
const shortcutManager = new ShortcutManager(keymap)

を追加し、さらに

class App extends React.Component {
  getChildContext() {
    return { shortcuts: shortcutManager }
  }
}

App.childContextTypes = {
  shortcuts: PropTypes.object.isRequired
}

getchildContextの関数とApp.childContextTypesのプロパティを記述。
（ただ、ここでApp.childContextTypesをどこに記述すれば良いかわかりませんでした……）

５.
別ファイルを作成（TodoItem.jsなど）
class TodoItem
を記述する

という流れで解釈しています。
正直に申し上げて何をやっているか理解半分なのですが、これでいいでしょうか？？
３の関数とプロパティ値を記述する部分が元のアプリのどこに入れるべきかわからないです……

Answer 1

https://codesandbox.io/s/l40jjo48nl

githubレポジトリにデモコードへのリンクが貼られているので、そちらをみれば質問の答えは分かるかと思います。

import PropTypes from 'prop-types';

context apiを使うには、prop-typesを使う必要があるので、prop-typesをインストール&インポートするのを忘れずに。

https://www.npmjs.com/package/prop-types

詳しくは公式ドキュメントを参照してください。
https://reactjs.org/docs/context.html

補足

ここでApp.childContextTypesをどこに記述すれば良いかわかりませんでした……

class App extends React.Component {
  getChildContext() {
    return { shortcuts: shortcutManager }
  }
}

App.childContextTypes = {
  shortcuts: PropTypes.object.isRequired
}

既に適切な場所に記述出来ています。これはこれで正しいです。

class App extends React.Component {
  static childContextTypes = {
    shortcuts: React.PropTypes.object.isRequired
  }
}

ただ、公式のデモコードを見ると、このような書き方をしていると思います。
これがもう１つの質問の方にも投稿されていた内容と関連する、Class Fieldシンタックスです。
こういった書き方も可能です。