React Login Widget / Idp SSO issues

Hello! I’ve recently hit a pretty hard roadblock when trying to use the react self-hosted widget in my react app, and also have Idps log into the same app. I’m able to log into the app using the widget just fine, but Idps are not able to get in.

Here’s my configuration:
image

Here’s the url I’m trying to use to authorize into my local react application:

https://{dev}.okta.com/oauth2/v1/authorize?idp={idp}&client_id={client_id}&response_type=code&response_mode=fragment&scope=openid%20email&redirect_uri=http://localhost:3000/login/callback&state=WM6D&nonce=YsG76jo

Once I go to this URL, I’ll get one of two errors, depending on if I have PKCE enabled or disabled in the configuration

For PKCE disabled, I get this error:

For PKCE enabled, I get this error in the callback string:
http://localhost:3000/login/callback#state=WM6D&error=invalid_request&error_description=PKCE+code+challenge+is+required+when+the+token+endpoint+authentication+method+is+%27NONE%27

I don’t have a special callback, I’m just using the LoginCallback component that’s in the majority of the tutorials:
image

I believe that my problem has something to do with the issues I’m experiencing has to do with the PKCE flow coming from an Idp, but I’m not sure how to fix it. I haven’t found documentation on how to use both the hosted widget (with the callback component) and Idps.

Do I need to implement a custom callback? Is my authorize URL setup incorrectly? Is there a setting I need to change?

I really appreciate any feedback. If you need more information to help, I’m happy to provide it.