First look at the multi-tab panel (sidePanes)

loadModernPanel.js

if (typeof (MEA) == "undefined") { MEA = {} };
if (typeof (MEA.Apps) == "undefined") { MEA.Apps = {} };
if (typeof (MEA.Apps.RD) == "undefined") { MEA.Apps.RD = {} };

MEA.Apps.RD = {
    onLoad: async function () {
        //Xrm.Panel.loadPanel("WebResources/mea_/Webpages/Youtube.html", "Panel 1");
        
        var sidePanes = Xrm.App.sidePanes;
        sidePanes.state = 0
        
        var pane1Config = {
            title: "Youtube",
            imageSrc: "https://img.icons8.com/office/16/000000/youtube.png",
            badge: true, 
        }
        var pane2Config = {
            title: "Twitter",
            imageSrc: "https://img.icons8.com/fluent/48/000000/twitter.png",
            badge: true, 
        }
        var pane3Config = {
            title: "Activities",
            imageSrc: "https://img.icons8.com/ios/50/000000/task-planning.png",
            badge: true,
            alwaysRender:false
        }
        var pane1 = await sidePanes.createPane(pane1Config);
        var pane2 = await sidePanes.createPane(pane2Config);
        var pane3 = await sidePanes.createPane(pane3Config);
        sidePanes.state = 0

        var pageInput1 = {
            pageType: "webresource",
            webresourceName: "mea_/Webpages/Youtube.html"
        };
        var pageInput2 = {
            pageType: "webresource",
            webresourceName: "mea_/Webpages/twitter.html"
        };
        var pageInput3 = {
            pageType: "entitylist",
            entityName: "activitypointer", 
            viewId: "58295bc0-bce4-eb11-bacb-000d3a9587a6"
        };

        await pane1.navigate(pageInput1);
        await pane2.navigate(pageInput2);
        await pane3.navigate(pageInput3);
        
    }
}