title: Redirect after login React js
body: <p>I can't figure out how to solve this.
  I have a login page, after the login you should be redirect to your profile page.
  I got this error:
  No routes matched location &quot;/Profile/Profile&quot;</p>
  <p>my files structure looks like this:</p>
  <ul>
  <li>Components (folder)</li>
  <li>
  <ul>
  <li>Login (folder)</li>
  </ul>
  </li>
  <li>
  <ul>
  <li>
  <ul>
  <li>Login.jsx</li>
  </ul>
  </li>
  </ul>
  </li>
  <li>
  <ul>
  <li>Profile (folder)</li>
  </ul>
  </li>
  <li>
  <ul>
  <li>
  <ul>
  <li>Profile.jsx</li>
  </ul>
  </li>
  </ul>
  </li>
  </ul>
  <p>Login.jsx</p>
  <pre><code>const [errorMessages, setErrorMessages] = useState({});
      const [isSubmitted, setIsSubmitted] = useState(false);
      const navigate = useNavigate();
  
      // User login info
      const database = [{
          username: 'user',
          password: 'pass'
      }
      ];
  
      // Error messages
      const errors = {
          uname: &quot;invalid username&quot;,
          pass: &quot;invalid password&quot;
      };
  
  
      const handlesubmit=(event)=&gt;{
  
          // Prevent page reload
          event.preventDefault();
          var { uname, pass } = document.forms[0];
  
          // Find user login info
          const userData = database.find((user) =&gt; user.username === uname.value);
  
          // Compare user info
          if (userData) {
              if (userData.password !== pass.value) {
                // Invalid password
                setErrorMessages({ name: &quot;pass&quot;, message: errors.pass });
              } else {
                setIsSubmitted(true);
                navigate(&quot;../Profile/Profile&quot;);
              }
            } else {
              // Username not found
              setErrorMessages({ name: &quot;uname&quot;, message: errors.uname });
          }
  
      };
  </code></pre>