withAuthenticationRequired on component vs. on the routes, which is recommended?

Say I have a Dashboard view at /dashboard route and a Settings view at /settings route. According to documentation, I can protected them with auth by applying withAuthenticationRequired on both route components.

  <Route path="/dashboard" component={withAuthenticationRequired(Dashboard)} />
  <Route path="/settings" component={withAuthenticationRequired(Settings)} />

But another approach is to apply withAuthenticationRequired HOC directly on the whole routes tree.

const ProtectedRoutes = (
    <Route path="/dashboard" component={Dashboard} />
    <Route path="/settings" component={Settings} />

export default withAuthenticationRequired(ProtectedRoutes);

Which is preferred and why?