Add otpLogin.userOtpCredentials for custom loginResetOtp page (login-reset-otp.ftl)

[tadstr]

I'm trying to implement the login-reset-otp.ftl to keycloakify. How do I get access to the otpLogin object
const { url, otpLogin, message, auth } = kcContext;

[garronej]

Hello @tadstr,

So Keycloakify does not yet provide the login-reset-otp.ftl page out of the box unfortunately.
If you want to make a PR for it, it would be very welcome: https://docs.keycloakify.dev/contributing#adding-support-for-a-new-page
Otherwise you can follow the section "I do it only for my project": https://docs.keycloakify.dev/limitations

In any case, if typescript gives you an error when you try to access otpLogin it does not mean that it isn't there at runtime, just that it isn't declared in the type definition.
You can console.log(kcContext) to see what's actually in there.

Hope it helps,

[tadstr]

Thanks @garronej
So do you mean that every object in kcContext will always be available at runtime and I just need to match the name with the right keycloak ftl page, right?
I see the devices when console.log(otpLogin?.userOtpCredentials) since I put it in the mockData

export const { getKcContext } = createGetKcContext<KcContextExtension>({
  mockData: [
    {
      pageId: "login-reset-otp.ftl",
      otpLogin: {
        userOtpCredentials: [
          {
            id: "id1",
            userLabel: "label1",
          },
          {
            id: "id2",
            userLabel: "label2",
          },
        ],
      },
    },
  ]
});

However, after building the theme and copy the theme file to keycloak and use it. The console.log(otpLogin?.userOtpCredentials) return undefined

[garronej]

I mean that what typescript say is in the kcContext is completely decorelated that what is actually in the kcContext.
Just do console.log(window.kcContext) in your browser debugger tool. You'll see everything that is there.
If what you are looking for is not there the only way to change that is to configure your Keycloak server differently.
There is nothing that you can do from Keycloakify.