Limitation in personalization of oauth icon

[xav-hydra]

Describe the bug

I am using Keycloak to authenticate to pgAdmin (oauth), and since there is no Font Awesome Keycloak icon, I would like to be able to use any type of icon, not just the brand ones.

As we can see in the pgadmin source

<Icon className={'fab '+oauth.OAUTH2_ICON} style={{ fontSize: '1.5em', marginRight: '8px' }} />{gettext('Login with %s', oauth.OAUTH2_DISPLAY_NAME)}
                  /\
                  ||

The fab icon specification is mandatory.

To Reproduce

Put any other icon that is not a fab icon in the OAUTH2_ICON ( doc ) variable.

Expected behavior

Any icon should appear.

Error message

none

Screenshots

example with right-to-bracket icon same result with or without any other type of Font Awesome icon type in OAUTH2_ICON (here fas)

Additional context

none

[florian-sabonchi]

Hello, can i work in it?

[khushboovashi]

Hello, can i work in it?

Yes, you can.

[xav-hydra]

Hello, can't we just remove the fab prefix and update the doc accordingly ? Should be an quick "fix".

[florian-sabonchi]

Hello, can't we just remove the fab prefix and update the doc accordingly ? Should be an quick "fix".

but then we also need an Option to import other Stylesheet

[divStar]

Edit: actually since between fab, fas and others the last one wins, setting OAUTH2_ICON = 'fas fa-key' actually works! This is what the Login button looks like HTML-wise:

<button class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorPrimary BasePage-button css-1s9pqej" tabindex="0" type="submit" name="oauth2_button" value="Zitadel" style="background-color: rgb(28, 48, 84);">
  <span class="material-icons notranslate MuiIcon-root MuiIcon-fontSizeMedium fab fas fa-key css-hi9vdz" aria-hidden="true" style="font-size: 1.5em; margin-right: 8px;"></span>Login with Zitadel</button>

Note, that fas takes precedence over fab, because it's later in the list - so the fa-key icon renders properly.