aws-amplify / amplify-ui

Amplify UI is a collection of accessible, themeable, performant React (and more!) components that can connect directly to the cloud.
https://ui.docs.amplify.aws
Apache License 2.0
789 stars 257 forks source link

@aws-amplify/ui-vue should support federated sign in through Cognito User Pools #4330

Open spensireli opened 11 months ago

spensireli commented 11 months ago

On which framework/platform would you like to see this feature implemented?

Vue

Which UI component is this feature-request for?

Authenticator

Please describe your feature-request in detail.

This is identical to the request here which was likely misinterpreted - https://github.com/aws-amplify/amplify-ui/issues/2716

I have been unable to find documentation related to usage of the hosted UI with cognito identity providers. See image below as an example when you use the AWS hosted UI for cognito and it can show your user pools IDP's.

Screen Shot 2023-08-08 at 4 34 26 PM

The features offered here - https://ui.docs.amplify.aws/vue/connected-components/authenticator/configuration#social-providers

Only show social providers and password authentication. However in this usecase and OP's usecase in the issue 2716 is where we are using Cognito as the Oauth provider.

Please describe a solution you'd like.

It would be nice to have support of Cognito as an Oauth provider i.e. "sign in with your provider" as shown in the hosted UI generated by AWS.

We love contributors! Is this something you'd be interested in working on?

reesscot commented 11 months ago

It's true that custom federated signin outside of the standard options (amazon, apple, facebook, google), is not automatically detected in the Vue Authenticator the way it is in Hosted UI. We are looking into adding this feature.

In the meantime, it is possible to add a custom header or footer to the SignIn page which would accomplish something similar: https://ui.docs.amplify.aws/vue/connected-components/authenticator/customization#headers--footers You custom header or footer should add Button which calls Auth.federatedSignIn on click with your custom provider name: https://aws-amplify.github.io/amplify-js/api/classes/authclass.html#federatedsignin

Auth.federatedSignIn({ customProvider: 'my-provider' })
quarryman commented 9 months ago

@reesscot hi Can you please confirm this statement is also true for other frameworks and amplify-react also doesnt have support for autodetection of custom IDp prviders from pool?