From 34c668b4d9e0cb7b520b6023d0e40a7163479cd1 Mon Sep 17 00:00:00 2001 From: Randall Morey Date: Tue, 25 May 2021 17:56:22 -0400 Subject: [PATCH 1/3] =?UTF-8?q?feat:=20=F0=9F=8E=B8=20textarea=20and=20sel?= =?UTF-8?q?ect=20should=20support=20contexual=20usage?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/rose/form/select/index.hbs | 53 ++++++++++---- .../rose/form/select/index.stories.mdx | 25 +++++++ .../components/rose/form/textarea/index.hbs | 70 +++++++++++++------ .../rose/form/textarea/index.stories.mdx | 21 ++++++ .../components/rose/form/select-test.js | 24 +++++++ .../components/rose/form/textarea-test.js | 22 ++++++ 6 files changed, 178 insertions(+), 37 deletions(-) diff --git a/addons/rose/addon/components/rose/form/select/index.hbs b/addons/rose/addon/components/rose/form/select/index.hbs index 7210298ec..565643e5f 100644 --- a/addons/rose/addon/components/rose/form/select/index.hbs +++ b/addons/rose/addon/components/rose/form/select/index.hbs @@ -1,16 +1,13 @@ -
- - - {{@label}} - - - {{#if @helperText}} - - {{@helperText}} - - {{/if}} - +{{#if @contextual}} {{yield (hash + label=(component 'rose/form/label' + for=this.id + error=@error + ) + helperText=(component 'rose/form/helper-text' + id=(concat 'helper-text-' this.id) + error=@error + ) field=(component 'rose/form/select/select' id=this.id name=@name @@ -20,7 +17,35 @@ error=@error aria-describedby=(concat (if @helperText (concat 'helper-text-' this.id)) (if @error (concat ' errors-' this.id))) ) - errors=(component 'rose/form/errors' id=(concat 'errors-' this.id)) + errors=(component 'rose/form/errors' + id=(concat 'errors-' this.id) + ) )}} +{{else}} +
-
+ + {{@label}} + + + {{#if @helperText}} + + {{@helperText}} + + {{/if}} + + {{yield (hash + field=(component 'rose/form/select/select' + id=this.id + name=@name + value=@value + onChange=@onChange + disabled=@disabled + error=@error + aria-describedby=(concat (if @helperText (concat 'helper-text-' this.id)) (if @error (concat ' errors-' this.id))) + ) + errors=(component 'rose/form/errors' id=(concat 'errors-' this.id)) + )}} + +
+{{/if}} diff --git a/addons/rose/addon/components/rose/form/select/index.stories.mdx b/addons/rose/addon/components/rose/form/select/index.stories.mdx index 114c205a0..6574fcd53 100644 --- a/addons/rose/addon/components/rose/form/select/index.stories.mdx +++ b/addons/rose/addon/components/rose/form/select/index.stories.mdx @@ -112,3 +112,28 @@ Renders a form select element. } }} + + + {{ + template: hbs` + +
+ Label +
+ Help +
+ + Value 1 + Value 2 + Value 3 + +
+ + An error occurred. + +
+ + `, + context: {}, + }} + diff --git a/addons/rose/addon/components/rose/form/textarea/index.hbs b/addons/rose/addon/components/rose/form/textarea/index.hbs index f9dd29891..8bc67af1a 100644 --- a/addons/rose/addon/components/rose/form/textarea/index.hbs +++ b/addons/rose/addon/components/rose/form/textarea/index.hbs @@ -1,26 +1,50 @@ -
- - - {{@label}} - - - {{#if @helperText}} - - {{@helperText}} - - {{/if}} - - - +{{#if @contextual}} {{yield (hash - errors=(component 'rose/form/errors' id=(concat 'errors-' this.id)) + label=(component 'rose/form/label' + for=this.id + error=@error + ) + helperText=(component 'rose/form/helper-text' + id=(concat 'helper-text-' this.id) + error=@error + ) + field=(component 'rose/form/textarea/textarea' + id=this.id + name=@name + value=@value + disabled=@disabled + error=@error + aria-describedby=(concat (if @helperText (concat 'helper-text-' this.id)) (if @error (concat ' errors-' this.id))) + ) + errors=(component 'rose/form/errors' + id=(concat 'errors-' this.id) + ) )}} +{{else}} +
-
+ + {{@label}} + + + {{#if @helperText}} + + {{@helperText}} + + {{/if}} + + + + {{yield (hash + errors=(component 'rose/form/errors' id=(concat 'errors-' this.id)) + )}} + +
+{{/if}} diff --git a/addons/rose/addon/components/rose/form/textarea/index.stories.mdx b/addons/rose/addon/components/rose/form/textarea/index.stories.mdx index e1f9aad3b..5851d4b12 100644 --- a/addons/rose/addon/components/rose/form/textarea/index.stories.mdx +++ b/addons/rose/addon/components/rose/form/textarea/index.stories.mdx @@ -70,3 +70,24 @@ Renders a simple form textarea. } }} + + + {{ + template: hbs` + +
+ Label +
+ Help +
+ +
+ + An error occurred. + +
+ + `, + context: {}, + }} + diff --git a/addons/rose/tests/integration/components/rose/form/select-test.js b/addons/rose/tests/integration/components/rose/form/select-test.js index 3e4dd1df0..692efe098 100644 --- a/addons/rose/tests/integration/components/rose/form/select-test.js +++ b/addons/rose/tests/integration/components/rose/form/select-test.js @@ -144,4 +144,28 @@ module('Integration | Component | rose/form/select', function (hooks) { `); await fillIn('[name="my-select"]', 'value-1'); }); + + test('it supports a fully contextual usage', async function (assert) { + assert.expect(5); + await render(hbs` + + Label + Help + + value-1 + + + An error occurred. + + + `); + assert.notOk( + find('.rose-form-input'), + 'The form field wrapper element is not present in contextual mode' + ); + assert.ok(find('.rose-form-label.error')); + assert.ok(find('.rose-form-helper-text.error')); + assert.ok(find('.rose-form-select-field.error')); + assert.ok(find('.rose-form-error-message')); + }); }); diff --git a/addons/rose/tests/integration/components/rose/form/textarea-test.js b/addons/rose/tests/integration/components/rose/form/textarea-test.js index 56c698e61..938aeba9d 100644 --- a/addons/rose/tests/integration/components/rose/form/textarea-test.js +++ b/addons/rose/tests/integration/components/rose/form/textarea-test.js @@ -57,4 +57,26 @@ module('Integration | Component | rose/form/textarea', function (hooks) { await render(hbs``); assert.ok(await find('.error')); }); + + test('it supports a fully contextual usage', async function (assert) { + assert.expect(5); + await render(hbs` + + Label + Help + + + An error occurred. + + + `); + assert.notOk( + find('.rose-form-input'), + 'The form field wrapper element is not present in contextual mode' + ); + assert.ok(find('.rose-form-label.error')); + assert.ok(find('.rose-form-helper-text.error')); + assert.ok(find('.rose-form-input-field.error')); + assert.ok(find('.rose-form-error-message')); + }); }); From 28d18e389c8a3dd6a4e7a78d8e798c9816133af2 Mon Sep 17 00:00:00 2001 From: Susmitha Girumala Date: Tue, 1 Jun 2021 12:55:35 -0400 Subject: [PATCH 2/3] chore: Fix js lint errors --- addons/api/addon/services/storage.js | 5 +++-- addons/auth/addon/authenticators/base.js | 7 +++---- addons/core/addon/authenticators/oidc.js | 4 ++-- addons/core/addon/authenticators/password.js | 4 ++-- 4 files changed, 10 insertions(+), 10 deletions(-) diff --git a/addons/api/addon/services/storage.js b/addons/api/addon/services/storage.js index ea1b7138d..d9b7aa495 100644 --- a/addons/api/addon/services/storage.js +++ b/addons/api/addon/services/storage.js @@ -76,8 +76,9 @@ export default class StorageService extends Service { const inMemory = get(config, 'storage.memory'); // Get the global context object (window) via service lookup, // because just reaching for a global is icky - const globalContext = getOwner(this).lookup('service:-document') - .documentElement.parentNode.defaultView; + const globalContext = + getOwner(this).lookup('service:-document').documentElement.parentNode + .defaultView; // If memory storage enabled, return the memory storage instance, // otherwise return localStorage. return inMemory ? this.#memoryStorage : globalContext.localStorage; diff --git a/addons/auth/addon/authenticators/base.js b/addons/auth/addon/authenticators/base.js index bdc69d504..deeea5a0d 100644 --- a/addons/auth/addon/authenticators/base.js +++ b/addons/auth/addon/authenticators/base.js @@ -72,10 +72,9 @@ export default class BaseAuthenticator extends SimpleAuthBaseAuthenticator { */ async restore(data) { if (!data) return reject(); - return this.validateToken( - data.attributes.token, - data.attributes.id - ).then(() => this.normalizeData(data)); + return this.validateToken(data.attributes.token, data.attributes.id).then( + () => this.normalizeData(data) + ); } /** diff --git a/addons/core/addon/authenticators/oidc.js b/addons/core/addon/authenticators/oidc.js index f159fa87f..245dc97cd 100644 --- a/addons/core/addon/authenticators/oidc.js +++ b/addons/core/addon/authenticators/oidc.js @@ -76,8 +76,8 @@ export default class OIDCAuthenticator extends BaseOIDCAuthenticator { * @param {string} token */ addTokenToAuthorization(token) { - const adapterPrototype = this.store.adapterFor('application').constructor - .prototype; + const adapterPrototype = + this.store.adapterFor('application').constructor.prototype; const headers = adapterPrototype?.headers; if (!headers) adapterPrototype.headers = {}; adapterPrototype.headers.Authorization = null; diff --git a/addons/core/addon/authenticators/password.js b/addons/core/addon/authenticators/password.js index 186731a7d..a2dfc8131 100644 --- a/addons/core/addon/authenticators/password.js +++ b/addons/core/addon/authenticators/password.js @@ -91,8 +91,8 @@ export default class PasswordAuthenticator extends BasePasswordAuthenticator { * @param {string} token */ addTokenToAuthorization(token) { - const adapterPrototype = this.store.adapterFor('application').constructor - .prototype; + const adapterPrototype = + this.store.adapterFor('application').constructor.prototype; const headers = adapterPrototype?.headers; if (!headers) adapterPrototype.headers = {}; adapterPrototype.headers.Authorization = null; From 77d71871167271342e8bbf3bf7101fa5abdbc570 Mon Sep 17 00:00:00 2001 From: Carlos Alcaide Date: Tue, 1 Jun 2021 11:07:48 -0700 Subject: [PATCH 3/3] =?UTF-8?q?chore:=20=F0=9F=A4=96=20Fix=20lint=20errors?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Fix lint errors --- addons/api/addon/services/storage.js | 5 ++--- addons/auth/addon/authenticators/base.js | 7 ++++--- addons/core/addon/authenticators/oidc.js | 4 ++-- addons/core/addon/authenticators/password.js | 4 ++-- 4 files changed, 10 insertions(+), 10 deletions(-) diff --git a/addons/api/addon/services/storage.js b/addons/api/addon/services/storage.js index d9b7aa495..ea1b7138d 100644 --- a/addons/api/addon/services/storage.js +++ b/addons/api/addon/services/storage.js @@ -76,9 +76,8 @@ export default class StorageService extends Service { const inMemory = get(config, 'storage.memory'); // Get the global context object (window) via service lookup, // because just reaching for a global is icky - const globalContext = - getOwner(this).lookup('service:-document').documentElement.parentNode - .defaultView; + const globalContext = getOwner(this).lookup('service:-document') + .documentElement.parentNode.defaultView; // If memory storage enabled, return the memory storage instance, // otherwise return localStorage. return inMemory ? this.#memoryStorage : globalContext.localStorage; diff --git a/addons/auth/addon/authenticators/base.js b/addons/auth/addon/authenticators/base.js index deeea5a0d..bdc69d504 100644 --- a/addons/auth/addon/authenticators/base.js +++ b/addons/auth/addon/authenticators/base.js @@ -72,9 +72,10 @@ export default class BaseAuthenticator extends SimpleAuthBaseAuthenticator { */ async restore(data) { if (!data) return reject(); - return this.validateToken(data.attributes.token, data.attributes.id).then( - () => this.normalizeData(data) - ); + return this.validateToken( + data.attributes.token, + data.attributes.id + ).then(() => this.normalizeData(data)); } /** diff --git a/addons/core/addon/authenticators/oidc.js b/addons/core/addon/authenticators/oidc.js index 245dc97cd..f159fa87f 100644 --- a/addons/core/addon/authenticators/oidc.js +++ b/addons/core/addon/authenticators/oidc.js @@ -76,8 +76,8 @@ export default class OIDCAuthenticator extends BaseOIDCAuthenticator { * @param {string} token */ addTokenToAuthorization(token) { - const adapterPrototype = - this.store.adapterFor('application').constructor.prototype; + const adapterPrototype = this.store.adapterFor('application').constructor + .prototype; const headers = adapterPrototype?.headers; if (!headers) adapterPrototype.headers = {}; adapterPrototype.headers.Authorization = null; diff --git a/addons/core/addon/authenticators/password.js b/addons/core/addon/authenticators/password.js index a2dfc8131..186731a7d 100644 --- a/addons/core/addon/authenticators/password.js +++ b/addons/core/addon/authenticators/password.js @@ -91,8 +91,8 @@ export default class PasswordAuthenticator extends BasePasswordAuthenticator { * @param {string} token */ addTokenToAuthorization(token) { - const adapterPrototype = - this.store.adapterFor('application').constructor.prototype; + const adapterPrototype = this.store.adapterFor('application').constructor + .prototype; const headers = adapterPrototype?.headers; if (!headers) adapterPrototype.headers = {}; adapterPrototype.headers.Authorization = null;