azure-devops-ui/Components/Tabs/TabProviderContext.js

React components for building web UI in Azure DevOps

import "../../CommonImports";
import "../../Core/core.css";
import "./Tabs.css";
import * as React from "react";
import { Observer } from '../../Observer';
export const TabProviderContext = React.createContext({
    selectedId: undefined,
    tabs: [],
    commandBarItems: [],
    renderContent: undefined,
    renderFilterBar: undefined
});
export class TabProvider extends React.Component {
    render() {
        return (React.createElement(Observer, { selectedTabId: this.props.selectedTabId, tabs: this.props.providers }, (props) => {
            const { selectedTabId } = props;
            let selectedTab = undefined;
            const tabs = [...props.tabs.sort((a, b) => (a.order || 100) - (b.order || 100))];
            tabs.forEach(tab => {
                if (tab.id === selectedTabId) {
                    selectedTab = tab;
                }
            });
            if (selectedTab === undefined) {
                selectedTab = {
                    id: selectedTabId,
                    name: undefined,
                    render: undefined
                };
            }
            return (React.createElement(TabProviderContext.Provider, { value: {
                    selectedId: selectedTab.id,
                    tabs: tabs,
                    commandBarItems: selectedTab.commandBarItems,
                    renderContent: selectedTab.render,
                    renderFilterBar: selectedTab.renderFilterBar
                } }, this.props.children));
        }));
    }
}