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

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

web/ui/react-app/public/index.html

@@ -15,8 +15,8 @@
       to Prometheus, both for asset loading as well as API accesses.
 
       The GLOBAL_CONSOLES_LINK placeholder magic value is replaced during serving by Prometheus
-      and set to the consoles link if it exists. It will render a "Consoles" link in the navbar when 
-      it is non-empty. 
+      and set to the consoles link if it exists. It will render a "Consoles" link in the navbar when
+      it is non-empty.
     -->
     <script>
       const GLOBAL_PATH_PREFIX='PATH_PREFIX_PLACEHOLDER';

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'));