move selector into component in useSelector example to fix shared selector issue; add note that warns about shared selector issues

Author: MrWolfZ

docs/api/hooks.md

@@ -88,18 +88,23 @@ import React from 'react'
 import { useSelector } from 'react-redux'
 import { createSelector } from 'reselect'
 
-const allOtherTodos = createSelector(
-  state => state.todos,
-  (_, id) => id,
-  (todos, id) => todos.filter(todo => todo.id !== id)
-)
-
 export const OtherTodoListItems = ({ id }) => {
-  const otherTodos = useSelector(s => allOtherTodos(s, id), [id])
+  const selectAllOtherTodos = createSelector(
+    state => state.todos,
+    todos => todos.filter(todo => todo.id !== id)
+  )
+
+  // the id in the deps ensures the same selector reference
+  // is used on reach render as long as the id does not
+  // change, thereby allowing the selector to memoize on
+  // the state
+  const otherTodos = useSelector(selectAllOtherTodos, [id])
   return <div>{otherTodos.length}</div>
 }
 ```
 
+> **Note**: When using memoizing selectors like in the example above, but declared outside the component, make sure you are [correctly handling the props](https://github.com/reduxjs/reselect#accessing-react-props-in-selectors).
+
 ## `useActions()`
 
 ```js