MDBDropdownToggle title not displaying in hamburger menu

Expected behavior: Using the hamburger menu, the dropdown title will display

Actual behavior: While dropdown menu still works, the title disappears on smaller screens

Resources (screenshots, code snippets etc.)

Here is my code:

  import React, { Component } from 'react';
import {
  MDBContainer,
  MDBNavbar,
  MDBNavbarBrand,
  MDBNavbarNav,
  MDBNavItem,
  MDBNavLink,
  MDBNavbarToggler,
  MDBCollapse,
  MDBDropdown,
  MDBDropdownToggle,
  MDBDropdownMenu,
  MDBDropdownItem,
  MDBIcon,
} from 'mdbreact';
import { BrowserRouter as Router } from 'react-router-dom';

class NavbarPage extends Component {
  state = {
    isOpen: false,
  };

  toggleCollapse = () => {
    this.setState({ isOpen: !this.state.isOpen });
  };

  render() {
    return (
      <MDBNavbar color='blue lighten-1' dark expand='md'>
        <MDBContainer>
          <MDBNavbarBrand href='/'>
            <strong className='white-text'>PBRF</strong>
          </MDBNavbarBrand>
          <MDBNavbarToggler onClick={this.toggleCollapse} />
          <MDBCollapse id='navbarCollapse3' isOpen={this.state.isOpen} navbar>
            <MDBNavbarNav right>
              <MDBNavItem>
                <MDBDropdown>
                  <MDBDropdownToggle nav caret>
                    //Doesn't appear on smaller screens
                    <div className='d-none d-md-inline'>Phage Therapy</div>
                  </MDBDropdownToggle>
                  <MDBDropdownMenu className='dropdown-default'>
                    <MDBDropdownItem href='/phagetherapy/bio'>
                      What is it?
                    </MDBDropdownItem>
                    <MDBDropdownItem href='/phagetherapy/resources'>
                      Resources
                    </MDBDropdownItem>
                  </MDBDropdownMenu>
                </MDBDropdown>
              </MDBNavItem>
              <MDBNavItem>
                <MDBDropdown>
                  <MDBDropdownToggle nav caret>
                    //Doesn't appear on smaller screens
                    <div className='d-none d-md-inline'>About Us</div>
                  </MDBDropdownToggle>
                  <MDBDropdownMenu className='dropdown-default'>
                    <MDBDropdownItem href='/about/board'>
                      Board Of Directors
                    </MDBDropdownItem>
                    <MDBDropdownItem href='/about/sab'>
                      Scientific Advisory Board
                    </MDBDropdownItem>
                  </MDBDropdownMenu>
                </MDBDropdown>
              </MDBNavItem>
              <MDBNavItem>
                <MDBNavLink to='/donate'>Donate</MDBNavLink>
              </MDBNavItem>
              <MDBNavItem>
                <MDBNavLink to='/contact'>Contact</MDBNavLink>
              </MDBNavItem>
            </MDBNavbarNav>
          </MDBCollapse>
        </MDBContainer>
      </MDBNavbar>
    );
  }
}

export default NavbarPage;