title: Why am I getting this error message in JSX - x Expression expected?
body: <p>I'm receiving errors stating - x Expression expected and Unterminated regexp literal...<a href="https://i.stack.imgur.com/rgYx7.png" rel="nofollow noreferrer">1</a></p>
  <p>The code I'm having issues with is the following:</p>
  <pre class="lang-js prettyprint-override"><code>import Link from 'next/link';
  import React from 'react';
  import {useContext} from &quot;react&quot;;
  import {UserContext} from &quot;../lib/context&quot;;
  
  // Top Navbar
  export default function Navbar() {
      const { user, username } = useContext(UserContext)
  
      return (
          &lt;nav className='navbar'&gt;
              &lt;ul&gt;
                  &lt;li&gt;
                      &lt;Link href=&quot;/&quot;&gt;
                          &lt;button&gt;FEED&lt;/button&gt;
                      &lt;/Link&gt;
                  &lt;/li&gt;
  
                  {/* user is signed in and has username */}
                  {username &amp;&amp; (
                      &lt;div&gt;
                          &lt;li className='push-left'&gt;
                              &lt;Link href=&quot;/admin&quot;&gt;
                                  &lt;button className=&quot;btn-blue&quot;&gt;Write Posts&lt;/button&gt;
                              &lt;/Link&gt;
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;Link href={`/${username}`}&gt;
                                  &lt;img src={user?.photoURL} alt=/&gt;
                              &lt;/Link&gt;
                          &lt;/li&gt;
                      &lt;/div&gt;
                  )}
  
  
                  {/* user is not signed in OR has not created username */}
                  {!username &amp;&amp; (
                      &lt;li&gt;
                          &lt;Link href=&quot;/enter&quot;&gt;
                              &lt;button className=&quot;btn-blue&quot;&gt;Log in&lt;/button&gt;
                          &lt;/Link&gt;
                      &lt;/li&gt;
                  )}
              &lt;/ul&gt;
          &lt;/nav&gt;
      )
  }
  </code></pre>
  <p>Does anyone have an idea as to why this may be happening?</p>