Looking at the FlexLayout react sample code there is this method to change the theme…which isn’t very React-like. Can this be done in a simpler way ?

    onThemeChange = (event: React.FormEvent) => {
        var target = event.target as HTMLSelectElement;

        let flexlayout_stylesheet: any = window.document.getElementById("flexlayout-stylesheet");
        let page_stylesheet = window.document.getElementById("page-stylesheet");
        let index = flexlayout_stylesheet.href.lastIndexOf("/");
        let newAddress = flexlayout_stylesheet.href.substr(0, index);

        let s1 = document.createElement("link");
        s1.setAttribute("id", "flexlayout-stylesheet");
        s1.setAttribute("rel", "stylesheet");
        s1.setAttribute("href", newAddress + "/" + target.value + ".css");

        let s2 = document.createElement("link");
        s2.setAttribute("id", "page-stylesheet");
        s2.setAttribute("rel", "stylesheet");
        s2.setAttribute("href", target.value + ".css");

        const promises: Promise<boolean>[] = [];
        promises.push(new Promise((resolve) => {
            s1.onload = () => resolve(true);
        }));
        promises.push(new Promise((resolve) => {
            s2.onload = () => resolve(true);
        }));
        document.head.appendChild(s1);
        document.head.appendChild(s2);

        Promise.all(promises).then(() => {
            document.head.removeChild(flexlayout_stylesheet);
            document.head.removeChild(page_stylesheet!);
            this.forceUpdate();
        });
    }