ProviderLogin component

Build a Solid App
1

Hi

Can anyone point my to a sample usage of the ProviderLogin React component?

Thanks
Des

2

The ProviderLogin is used in the generated sample application found in the generator-solid-react application.

The usage is fairly simple - most of the parameters here are simply translations for labels (the component library does not assume any language and so all labels and text are passed in, so applications can both customize labels and add language support as needed.

 <ProviderLogin
              selectPlaceholder={t('login.selectPlaceholder')}
              inputPlaholder={t('login.inputPlaholder')}
              formButtonText={t('login.formButtonText')}
              btnTxtWebId={t('login.btnTxtWebId')}
              btnTxtProvider={t('login.btnTxtProvider')}
              className="provider-login-component"
              callbackUri={`${window.location.origin}/welcome`}
              errorsText={{
                unknown: t('login.errors.unknown'),
                webIdNotValid: t('login.errors.webIdNotValid'),
                emptyProvider: t('login.errors.emptyProvider'),
                emptyWebId: t('login.errors.emptyWebId')
              }}
              theme={{
                buttonLogin: 'ids-link',
                inputLogin: '',
                linkButton: ''
              }}
            />

The code usage above can be seen in the context of the generator here.

Usage documentation can be seen in the components repo as well. Included is an optional list of providers, if you want to customize the provider dropdown list.

Hope this helps!

1 Like
3

That’s perfect!

2 Likes