UI: OIDC provider logo fix (#20263)

* glimmerize role-jwt model, update test for use new case

* Fix issue #8949

* Update test

* Add changelog
This commit is contained in:
Chelsea Shaw 2023-04-19 14:30:18 -05:00 committed by GitHub
parent 9e34c0b543
commit 879844d300
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 31 additions and 20 deletions

3
changelog/20263.txt Normal file
View File

@ -0,0 +1,3 @@
```release-note:bug
ui: Fix OIDC provider logo showing when domain doesn't match
```

View File

@ -4,33 +4,32 @@
*/ */
import Model, { attr } from '@ember-data/model'; import Model, { attr } from '@ember-data/model';
import { computed } from '@ember/object';
import parseURL from 'core/utils/parse-url'; import parseURL from 'core/utils/parse-url';
const DOMAIN_STRINGS = { const DOMAIN_STRINGS = {
github: 'GitHub', 'github.com': 'GitHub',
gitlab: 'GitLab', 'gitlab.com': 'GitLab',
google: 'Google', 'google.com': 'Google',
ping: 'Ping', 'ping.com': 'Ping',
okta: 'Okta', 'okta.com': 'Okta',
auth0: 'Auth0', 'auth0.com': 'Auth0',
}; };
const PROVIDER_WITH_LOGO = ['GitLab', 'Google', 'Auth0']; const PROVIDER_WITH_LOGO = ['GitLab', 'Google', 'Auth0'];
export { DOMAIN_STRINGS, PROVIDER_WITH_LOGO }; export { DOMAIN_STRINGS, PROVIDER_WITH_LOGO };
export default Model.extend({ export default class RoleJwtModel extends Model {
authUrl: attr('string'), @attr('string') authUrl;
providerName: computed('authUrl', function () { get providerName() {
const { hostname } = parseURL(this.authUrl); const { hostname } = parseURL(this.authUrl);
const firstMatch = Object.keys(DOMAIN_STRINGS).find((name) => hostname.includes(name)); const firstMatch = Object.keys(DOMAIN_STRINGS).find((name) => hostname.includes(name));
return DOMAIN_STRINGS[firstMatch] || null; return DOMAIN_STRINGS[firstMatch] || null;
}), }
providerButtonComponent: computed('providerName', function () { get providerButtonComponent() {
const { providerName } = this; const { providerName } = this;
return PROVIDER_WITH_LOGO.includes(providerName) ? `auth-button-${providerName.toLowerCase()}` : null; return PROVIDER_WITH_LOGO.includes(providerName) ? `auth-button-${providerName.toLowerCase()}` : null;
}), }
}); }

View File

@ -29,26 +29,35 @@ module('Unit | Model | role-jwt', function (hooks) {
test('it provides a providerName for listed known providers', function (assert) { test('it provides a providerName for listed known providers', function (assert) {
assert.expect(12); assert.expect(12);
Object.keys(DOMAIN_STRINGS).forEach((domainPart) => { Object.keys(DOMAIN_STRINGS).forEach((domain) => {
const model = this.owner.lookup('service:store').createRecord('role-jwt', { const model = this.owner.lookup('service:store').createRecord('role-jwt', {
authUrl: `http://provider-${domainPart}.com`, authUrl: `http://provider-${domain}`,
}); });
const expectedName = DOMAIN_STRINGS[domainPart]; const expectedName = DOMAIN_STRINGS[domain];
assert.strictEqual(model.providerName, expectedName, `computes providerName: ${expectedName}`); assert.strictEqual(model.providerName, expectedName, `computes providerName: ${expectedName}`);
if (PROVIDER_WITH_LOGO.includes(expectedName)) { if (PROVIDER_WITH_LOGO.includes(expectedName)) {
assert.strictEqual( assert.strictEqual(
model.providerButtonComponent, model.providerButtonComponent,
`auth-button-${domainPart}`, `auth-button-${expectedName.toLowerCase()}`,
`computes providerButtonComponent: ${domainPart}` `computes providerButtonComponent: ${domain}`
); );
} else { } else {
assert.strictEqual( assert.strictEqual(
model.providerButtonComponent, model.providerButtonComponent,
null, null,
`computes providerButtonComponent: ${domainPart}` `computes providerButtonComponent: ${domain}`
); );
} }
}); });
}); });
test('it does not return provider unless domain matches completely', function (assert) {
assert.expect(2);
const model = this.owner.lookup('service:store').createRecord('role-jwt', {
authUrl: `http://custom-auth0-provider.com`,
});
assert.strictEqual(model.providerName, null, `no providerName for custom URL`);
assert.strictEqual(model.providerButtonComponent, null, 'no providerButtonComponent for custom URL');
});
}); });