Extending Account V3 with Patternfly

[rrodriguezOT]

Hi, Keycloak Community!

We extended account theme from V2 in Keycloak 17, and now we are trying to migrate to V3.

The account ui extension that we have uses patternfly so we added it to the new migration project. As a starting point we only migrated just one page that includes keycloak-js and patternfly.

We are following the keycloak-man example from keycloak-quickstarts, all works fine except for one thing. After the build and the deploy, when accessing that page, keycloak prompts that @patternfly/react-core is not recognized and we should use ./ or ../.

I've tried to build them making external package only react but didn't work.

How we have to reference patternfly to make it work with the theme extension?

Thank you.

[jonkoops]

It's currently not possible to import from @patternfly/react-code as it is bundled with the Account Console, making it unavailable at run-time. The only available imports for themes at this point are the React ones.

You can work around this by bundling PatternFly separately in your own code for now. I don't have any objections to also making PatternFly available, feel free to log an enhancement request so the team can evaluate it.

[rrodriguezOT]

In case we want to migrate my v2 theme into KC 24.x.x, we'll have to bundle patternfly or any other packages aside the available ones in our project to make it work, or even create a full bundled app with the entire account theme on it?

[jonkoops]

That is correct yes, there is work being done to simplify this, but it's still early days, so these are your options for now.