mirror of
https://github.com/cinnyapp/cinny.git
synced 2024-11-20 14:59:55 +01:00
Improve SSO display on login page (#150)
sort SSO providers by alphabetical order, and reset provider list on homeserver change (to avoid having them if the homeserver is invalid)
This commit is contained in:
parent
ac364e5ab7
commit
ef161bbb31
1 changed files with 16 additions and 10 deletions
|
@ -10,6 +10,9 @@ function SSOButtons({ homeserver }) {
|
|||
const [identityProviders, setIdentityProviders] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
// Reset sso proviers to avoid displaying sso icons if the homeserver is not valid
|
||||
setIdentityProviders([]);
|
||||
|
||||
// If the homeserver passed in is not a fully-qualified domain name, do not update.
|
||||
if (!homeserver.match('^[a-zA-Z0-9][a-zA-Z0-9-]{1,61}[a-zA-Z0-9](?:\\.[a-zA-Z]{2,})+$')) {
|
||||
return;
|
||||
|
@ -49,16 +52,19 @@ function SSOButtons({ homeserver }) {
|
|||
<Text>OR</Text>
|
||||
</div>
|
||||
<div className="sso-buttons__container">
|
||||
{identityProviders.sort((idp) => !!idp.imageSrc).map((idp) => (
|
||||
<SSOButton
|
||||
key={idp.id}
|
||||
homeserver={idp.homeserver}
|
||||
id={idp.id}
|
||||
name={idp.name}
|
||||
type={idp.type}
|
||||
imageSrc={idp.imageSrc}
|
||||
/>
|
||||
))}
|
||||
{identityProviders
|
||||
// Sort by alphabetical order
|
||||
.sort((idp, idp2) => !!idp.imageSrc && idp.name > idp2.name)
|
||||
.map((idp) => (
|
||||
<SSOButton
|
||||
key={idp.id}
|
||||
homeserver={idp.homeserver}
|
||||
id={idp.id}
|
||||
name={idp.name}
|
||||
type={idp.type}
|
||||
imageSrc={idp.imageSrc}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue