How to wrap ViewController content inside MDCTabBarView container?

Question

I'm trying to implement a MDCBottomNavigationBar which contains a MDCTabBarView, which in turn contains 2 other views (shown as tabbed).

In my main controller I create the 4 controllers for the menu items at the bottom and implement MDCTabBarViewDelegate. When the user taps on a bottom menu item, they are presented with the corresponding controller. Now I want one of the controllers to contain a tab bar at the top, as shown in the demo image below. I have created the same MDCTabBarViewDelegate with 2 controllers and added them to the view. They are shown and they are switching whenever I change the tabs, but there are issues with how it looks. So, Tab 2 should contain the tab bar with App and All, and underneath the tab bar, the content of each tab should be shown.

Please check this image: Simulator Demo Image

The Green area should actually be the content of Tab 2 -> App. The problem is the Green area is displayed on the entire screen, instead of being displayed under the tab bar. The second problem is that my view controllers are showing a faded bar above the bottom menu. I tried to hide that bar with navigationController?.navigationBar.isHidden = true but nothing seems to work.

Can someone help me with the 2 issues above? I can't find a single resource / documentation about how to use this component on iOS. It would be great if you could even share some docs that I can read by myself, if not the answer.

Parent view controller:

class HomeController: UITabBarController {
    let firstC = FirstController()
    let secondC = SecondController()
    let thirdC = ThirdControllerController()
    let fourthC = FourthController()
    
    let bottomNavBar: MDCBottomNavigationBar = {
        let bottomNavBar = MDCBottomNavigationBar()
        
        bottomNavBar.titleVisibility = .always
        bottomNavBar.alignment = .justifiedAdjacentTitles
        
        return bottomNavBar
    }()
    
    let firstItem: MDCTabBarItem = {
        let firstItem = MDCTabBarItem()
        
        firstItem.title = "Tab 1"
        firstItem.image = UIImage(systemName: "house.fill")
        firstItem.tag = 0
        
        return firstItem
    }()
    
    let secondItem: MDCTabBarItem = {
        let secondItem = MDCTabBarItem()
        
        secondItem.title = "Tab 2"
        secondItem.image = UIImage(systemName: "house.fill")
        secondItem.tag = 1
        
        return secondItem
    }()
    
    let thirdItem: MDCTabBarItem = {
        let thirdItem = MDCTabBarItem()
        
        thirdItem.title = "Tab 3"
        thirdItem.image = UIImage(systemName: "house.fill")
        thirdItem.tag = 2
        
        return thirdItem
    }()
    
    let fourthItem: MDCTabBarItem = {
        let fourthItem = MDCTabBarItem()
        
        fourthItem.title = "Tab 4"
        fourthItem.image = UIImage(systemName: "house.fill")
        fourthItem.tag = 3
        
        return fourthItem
    }()

    override func viewDidLoad() {
        super.viewDidLoad()
        bottomNavBar.delegate = self
        
        bottomNavBar.items = [firstItem, secondItem, thirdItem, fourthItem]
        self.viewControllers = [
                firstC,
                secondC,
                thirdC,
                fourthC
            ]
        
        view.addSubview(bottomNavBar)
    }
}

// SecondC - inner controller

class SecondController: UITabBarController {
    let firstC = TabFirstC()
    let secondC = TabSecondC()

    let firstTab: MDCTabBarItem = {
        let tab = MDCTabBarItem(title: "App", image: nil, tag: 0)
        
        return tab
    }()
    
    let secondTab: MDCTabBarItem = {
        let tab = MDCTabBarItem(title: "All", image: nil, tag: 1)
        return tab
    }()
    
    let tabs: MDCTabBarView = {
        let tabs = MDCTabBarView()
        tabs.translatesAutoresizingMaskIntoConstraints = false
        return tabs
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        view.addSubview(tabs)
        
        viewControllers = [firstC, secondC]
        tabs.tabBarDelegate = self
        tabs.items = [firstTab, secondTab]
        tabs.selectedItem = firstTab
        
        
        NSLayoutConstraint.activate([
            tabs.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
            tabs.topAnchor.constraint(equalTo: logoImageView.safeAreaLayoutGuide.bottomAnchor, constant: 10),
            tabs.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
        ])

    }
}