reduxのProviderについて

Question

以下のサイトにProviderの役割について述べられています。
・react-redux が提供する。
・Redux と React を仲介する。
この Provider でラップされた Container は、内部で Store にアクセスできるようになる。
このおかげで、Container 内で直接 Storeにアクセスするコードを書く必要がなくなる。

Container をラップするそうなのですが、実際は
component（プレゼンテーション層）をラップしているようなので
どちらが正しいのでしょうか？

【私の見解】
dispatchしたいコンポネント側をラップするためのものなので
Container をラップするのは正解に思えます。
じゃななぜContainer をimportせずにcomponentをimportしているのか理解できません。

...
import { render } from 'react-dom'
import { Provider } from 'react-redux'
...
import App from './components/App'
...
render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById('root')
)

リンク内容

あともう一つわからないのが
componentからcontainerを呼んだり
containerからcomponentを呼んだりと頭の中が混乱しています。
これらは、どういったルールで決まっているのでしょうか？

components/App.js　⇒　containers/AddTodo.jsが前者
containers/AVisibleTodoList.js　⇒　components/TodoList.jsが後者

この法則性がぜんぜんわかりません