title: Uncaught Error: [Topbar] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>
body: <p>I have looked at the previous questions and googled for the answer and I think I almost know what the issue in here is, but don't know how to solve it.</p>
  <pre><code>return (
      &lt;Router&gt;
        &lt;Routes&gt;
          &lt;Route path=&quot;/login&quot; element={&lt;Login /&gt;} /&gt;
          {admin &amp;&amp; (
            &lt;&gt;
              &lt;Topbar /&gt;
              &lt;div className=&quot;container&quot;&gt;
                &lt;Sidebar /&gt;
                &lt;Route path=&quot;/&quot; element={&lt;Home /&gt;} /&gt;
                &lt;Route path=&quot;/users&quot; element={&lt;UserList /&gt;} /&gt;
                &lt;Route path=&quot;/user/:userId&quot; element={&lt;User /&gt;} /&gt;
                &lt;Route path=&quot;/newUser&quot; element={&lt;NewUser /&gt;} /&gt;
                &lt;Route path=&quot;/products&quot; element={&lt;ProductList /&gt;} /&gt;
                &lt;Route path=&quot;/product/:productId&quot; element={&lt;Product /&gt;} /&gt;
                &lt;Route path=&quot;/newproduct&quot; element={&lt;NewProduct /&gt;} /&gt;
              &lt;/div&gt;
            &lt;/&gt;
          )}
        &lt;/Routes&gt;
      &lt;/Router&gt;
  </code></pre>
  <p>Please tell me how to setup the topar and slidebar components here.
  Requesting my fellow coders to look at this one and thanks in advance.</p>