React UI: Use null value for determining consoles link display (#6790)

Signed-off-by: Julius Volz <julius.volz@gmail.com>

web/ui/react-app/src/Navbar.test.tsx

@@ -18,7 +18,7 @@ describe('Navbar should contain console Link', () => {
 
 describe('Navbar should not contain consoles link', () => {
   it('with empty string in consolesLink', () => {
-    const app = shallow(<Navigation pathPrefix="/path/prefix" consolesLink="" />);
+    const app = shallow(<Navigation pathPrefix="/path/prefix" consolesLink={null} />);
     expect(
       app.contains(
         <NavItem>

web/ui/react-app/src/Navbar.tsx

@@ -29,9 +29,9 @@ const Navigation: FC<PathPrefixProps & NavbarProps> = ({ pathPrefix, consolesLin
       </Link>
       <Collapse isOpen={isOpen} navbar style={{ justifyContent: 'space-between' }}>
         <Nav className="ml-0" navbar>
-          {consolesLink !== '' && (
+          {consolesLink !== null && (
             <NavItem>
-              <NavLink href={`${consolesLink}`}>Consoles</NavLink>
+              <NavLink href={consolesLink}>Consoles</NavLink>
             </NavItem>
           )}
           <NavItem>

web/ui/react-app/src/index.tsx

@@ -10,7 +10,8 @@ declare const GLOBAL_PATH_PREFIX: string;
 declare const GLOBAL_CONSOLES_LINK: string;
 
 let prefix = GLOBAL_PATH_PREFIX;
-let consolesLink = GLOBAL_CONSOLES_LINK;
+let consolesLink: string | null = GLOBAL_CONSOLES_LINK;
+
 if (GLOBAL_PATH_PREFIX === 'PATH_PREFIX_PLACEHOLDER' || GLOBAL_PATH_PREFIX === '/' || !isPresent(GLOBAL_PATH_PREFIX)) {
   // Either we are running the app outside of Prometheus, so the placeholder value in
   // the index.html didn't get replaced, or we have a '/' prefix, which we also need to
@@ -24,7 +25,7 @@ if (
   GLOBAL_CONSOLES_LINK === '' ||
   !isPresent(GLOBAL_CONSOLES_LINK)
 ) {
-  consolesLink = '';
+  consolesLink = null;
 }
 
 ReactDOM.render(<App pathPrefix={prefix} consolesLink={consolesLink} />, document.getElementById('root'));