title: how to block a react-route based on device dimensions
body: <p>I am having a responsive react Web-Application where i need a specific route only for the case of mobile that is if the device width is less than
  something for example 'x' but all the routes have been created in the same file something like:</p>
  
  <pre><code>&lt;BrowserRouter&gt;
  &lt;Switch&gt;
    &lt;Route exact path='/login/' component={Login} /&gt;
    &lt;Redirect exact from='/' to='/login/' /&gt;
    &lt;Route exact path='/sample/' component={sample} /&gt;
  &lt;/Switch&gt;
  </code></pre>
  
  <p></p>
  
  <p>so the route is now accessible from devices with dimensions of more than 'x' width also how can i make the route available based on device width or how can i block a specific route based on device dimensions. </p>