Hi Team,

I'm trying to create a dx component of widget type with Page as subtype where on click of a button I want to override the theme of the portal that the user is currently logged into using below PCore API

PCore.getEnvironmentInfo().setTheme(theme); I have attached the full code snippet here. After publishing this component to Pega and added to Home Landing page on region B right side. I can see the component as part of the Home page in the work portal. On click of the button, I see that the theme json object is getting set which I confirmed from console using PCore.getEnvironmentInfo().getTheme();. But the portal is not reflecting the overridden theme which is set. I expect the portal to re render using the overridden theme set on click of the button component. Kindly help me to understand why the portal is not refreshed with the updated theme despite the theme got set using settheme.

import {Button } from '@pega/cosmos-react-core';
import './create-nonce';

import StyledPegaTestToggleThemev3Wrapper from './styles';

// interface for props

function ApplyTheme() {
  const themeConfig = {
    base: {
      palette: {
        'app-background': '#f7f7f7',
        'brand-primary': '#bdca07',
        interactive: '#4207ca'
      }
    },
    components: {
      button: {
        color: '#4207ca',
        'secondary-color': '#4207ca'
      }
    }
  };
  PCore.getEnvironmentInfo().setTheme(themeConfig);
}


function PegaTestToggleThemev3() {


  return (
    <StyledPegaTestToggleThemev3Wrapper>

    <Button
            label="Click here to change protal theme"
            onClick={ApplyTheme}
          >
    Change Theme v3
          </Button>


    </StyledPegaTestToggleThemev3Wrapper>
  );

}

export default(PegaTestToggleThemev3);