title: Equivalent to <Redirect to="/login" /> using Navigate in react-router-dom v6?
body: <p>I had the following piece of code while using react-router-dom v5 that redirected me to login if the user wasn't authenticated and to the rest of the application if he was:</p>
  <pre><code>!isAuthenticated ? (
                  &lt;&gt;
                      &lt;Route path=&quot;/login&quot; exact component={Login} /&gt;
                      &lt;Redirect to=&quot;/login&quot; /&gt;
                  &lt;/&gt;
              ) : (
                  &lt;div className=&quot;d-flex flex-column min-vh-100&quot;&gt;
                      &lt;main&gt;
                          &lt;Container className=&quot;mt-4&quot;&gt;
                              &lt;Switch&gt;
                                  &lt;Route path=&quot;/&quot; exact component={Home} /&gt;
                                  &lt;Route path=&quot;/collections&quot; component={Collections} /&gt;
                                  &lt;Redirect to=&quot;/&quot; /&gt;
                              &lt;/Switch&gt;
                          &lt;/Container&gt;
                      &lt;/main&gt;
                  &lt;/div&gt;
              )}
  </code></pre>
  <p>After upgrading to react-router-dom v6, I had to do some refactoring which ended up looking like this:</p>
  <pre><code>!isAuthenticated ? (
                  &lt;&gt;
                      &lt;Routes&gt;
                          &lt;Route path=&quot;/login&quot; element={&lt;Login /&gt;} /&gt;
                      &lt;/Routes&gt;
                      &lt;Navigate replace to=&quot;/login&quot; /&gt;
                  &lt;/&gt;
              ) : (
                  &lt;div className=&quot;d-flex flex-column min-vh-100&quot;&gt;
                      &lt;main&gt;
                          &lt;Container className=&quot;mt-4&quot;&gt;
                              &lt;Routes&gt;
                                  &lt;Route path=&quot;/&quot; element={&lt;Home /&gt;} /&gt;
                                  &lt;Route path=&quot;/collections&quot; element={&lt;Collections /&gt;} /&gt;
                              &lt;/Routes&gt;
                              &lt;Navigate to=&quot;/&quot; /&gt;
                          &lt;/Container&gt;
                      &lt;/main&gt;
                  &lt;/div&gt;
              )}
  </code></pre>
  <p>From what I understand, <code>&lt;Navigate replace to=&quot;/login&quot; /&gt;</code> is the react-router-dom v6 equivalent of <code>&lt;Redirect to=&quot;/login&quot; /&gt;</code>, but right now my code puts me in an infinite loop. Why is this happening?</p>