-
Notifications
You must be signed in to change notification settings - Fork 56
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[BUGFIX] Ajouter des paramètres dans l'URL du lien custom de fin de p…
- Loading branch information
Showing
4 changed files
with
254 additions
and
54 deletions.
There are no files selected for viewing
78 changes: 54 additions & 24 deletions
78
...onents/campaigns/assessment/results/evaluation-results-hero/custom-organization-block.gjs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,29 +1,59 @@ | ||
| import PixButtonLink from '@1024pix/pix-ui/components/pix-button-link'; | ||
| import Component from '@glimmer/component'; | ||
| import { t } from 'ember-intl'; | ||
| import { and } from 'ember-truth-helpers'; | ||
|
|
||
| import MarkdownToHtml from '../../../../markdown-to-html'; | ||
|
|
||
| <template> | ||
| <div class="evaluation-results-hero__organization-block"> | ||
| <h3 class="evaluation-results-hero-organization-block__title"> | ||
| {{t "pages.skill-review.organization-message"}} | ||
| </h3> | ||
| {{#if @customResultPageText}} | ||
| <MarkdownToHtml | ||
| class="evaluation-results-hero-organization-block__message" | ||
| @isInline={{true}} | ||
| @markdown={{@customResultPageText}} | ||
| /> | ||
| {{/if}} | ||
| {{#if (and @customResultPageButtonUrl @customResultPageButtonText)}} | ||
| <PixButtonLink | ||
| class="evaluation-results-hero-organization-block__link" | ||
| @href={{@customResultPageButtonUrl}} | ||
| @variant="secondary" | ||
| > | ||
| {{@customResultPageButtonText}} | ||
| </PixButtonLink> | ||
| {{/if}} | ||
| </div> | ||
| </template> | ||
| export default class EvaluationResultsCustomOrganizationBlock extends Component { | ||
| get customButtonUrl() { | ||
| if (this.args.campaign.customResultPageButtonUrl && this.args.campaign.customResultPageButtonText) { | ||
| const params = {}; | ||
|
|
||
| if (Number.isFinite(this.args.campaignParticipationResult.masteryRate)) { | ||
| params.masteryPercentage = Number(this.args.campaignParticipationResult.masteryRate * 100).toFixed(0); | ||
| } | ||
| params.externalId = this.args.campaignParticipationResult.participantExternalId ?? undefined; | ||
| params.stage = this.args.campaignParticipationResult.reachedStage?.get('threshold') ?? undefined; | ||
|
|
||
| return buildUrl(this.args.campaign.customResultPageButtonUrl, params); | ||
| } else { | ||
| return null; | ||
| } | ||
| } | ||
|
|
||
| <template> | ||
| <div class="evaluation-results-hero__organization-block"> | ||
| <h3 class="evaluation-results-hero-organization-block__title"> | ||
| {{t "pages.skill-review.organization-message"}} | ||
| </h3> | ||
| {{#if @campaign.customResultPageText}} | ||
| <MarkdownToHtml | ||
| class="evaluation-results-hero-organization-block__message" | ||
| @isInline={{true}} | ||
| @markdown={{@campaign.customResultPageText}} | ||
| /> | ||
| {{/if}} | ||
| {{#if this.customButtonUrl}} | ||
| <PixButtonLink | ||
| class="evaluation-results-hero-organization-block__link" | ||
| @href={{this.customButtonUrl}} | ||
| @variant="secondary" | ||
| > | ||
| {{@campaign.customResultPageButtonText}} | ||
| </PixButtonLink> | ||
| {{/if}} | ||
| </div> | ||
| </template> | ||
| } | ||
|
|
||
| function buildUrl(baseUrl, params) { | ||
| const Url = new URL(baseUrl); | ||
| const urlParams = new URLSearchParams(Url.search); | ||
| for (const key in params) { | ||
| if (params[key] !== undefined) { | ||
| urlParams.set(key, params[key]); | ||
| } | ||
| } | ||
| Url.search = urlParams.toString(); | ||
| return Url.toString(); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
163 changes: 163 additions & 0 deletions
163
mon-pix/tests/unit/components/campaigns/assessment/hero/custom-organization-block-test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,163 @@ | ||
| import { setupTest } from 'ember-qunit'; | ||
| import { module, test } from 'qunit'; | ||
|
|
||
| import createGlimmerComponent from '../../../../../helpers/create-glimmer-component'; | ||
|
|
||
| module('Unit | Component | Campaigns | Assessment | Results | Hero | Custom Organization Block', function (hooks) { | ||
| setupTest(hooks); | ||
|
|
||
| module('#customButtonUrl', function () { | ||
| module('when there is no custom link', function () { | ||
| test('should return null', async function (assert) { | ||
| // given | ||
| const store = this.owner.lookup('service:store'); | ||
|
|
||
| const component = createGlimmerComponent( | ||
| 'campaigns/assessment/results/evaluation-results-hero/custom-organization-block', | ||
| ); | ||
|
|
||
| component.args.campaign = store.createRecord('campaign', { | ||
| customResultPageButtonUrl: null, | ||
| customResultPageButtonText: 'useless label', | ||
| }); | ||
|
|
||
| // when | ||
| const url = component.customButtonUrl; | ||
|
|
||
| // then | ||
| assert.strictEqual(url, null); | ||
| }); | ||
| }); | ||
|
|
||
| module('when there is a custom link', function () { | ||
| test('should return the custom link', async function (assert) { | ||
| // given | ||
| const store = this.owner.lookup('service:store'); | ||
|
|
||
| const component = createGlimmerComponent( | ||
| 'campaigns/assessment/results/evaluation-results-hero/custom-organization-block', | ||
| ); | ||
|
|
||
| component.args.campaign = store.createRecord('campaign', { | ||
| customResultPageButtonUrl: 'https://pix.org/', | ||
| customResultPageButtonText: 'custom label', | ||
| }); | ||
| component.args.campaignParticipationResult = store.createRecord('campaign-participation-result', {}); | ||
|
|
||
| // when | ||
| const url = component.customButtonUrl; | ||
|
|
||
| // then | ||
| assert.strictEqual(url, 'https://pix.org/'); | ||
| }); | ||
|
|
||
| module('when there is a mastery rate', function () { | ||
| test('should return the custom link with a rounded mastery percentage search param', async function (assert) { | ||
| // given | ||
| const store = this.owner.lookup('service:store'); | ||
|
|
||
| const component = createGlimmerComponent( | ||
| 'campaigns/assessment/results/evaluation-results-hero/custom-organization-block', | ||
| ); | ||
|
|
||
| component.args.campaign = store.createRecord('campaign', { | ||
| customResultPageButtonUrl: 'https://pix.org/', | ||
| customResultPageButtonText: 'custom label', | ||
| }); | ||
| component.args.campaignParticipationResult = store.createRecord('campaign-participation-result', { | ||
| masteryRate: 0.755, | ||
| }); | ||
|
|
||
| // when | ||
| const url = component.customButtonUrl; | ||
|
|
||
| // then | ||
| assert.strictEqual(url, 'https://pix.org/?masteryPercentage=76'); | ||
| }); | ||
| }); | ||
|
|
||
| module('when there is an external id', function () { | ||
| test('should return the custom link with external id search param', async function (assert) { | ||
| // given | ||
| const store = this.owner.lookup('service:store'); | ||
|
|
||
| const component = createGlimmerComponent( | ||
| 'campaigns/assessment/results/evaluation-results-hero/custom-organization-block', | ||
| ); | ||
|
|
||
| component.args.campaign = store.createRecord('campaign', { | ||
| customResultPageButtonUrl: 'https://pix.org/', | ||
| customResultPageButtonText: 'custom label', | ||
| }); | ||
| component.args.campaignParticipationResult = store.createRecord('campaign-participation-result', { | ||
| participantExternalId: 'externalId', | ||
| }); | ||
|
|
||
| // when | ||
| const url = component.customButtonUrl; | ||
|
|
||
| // then | ||
| assert.strictEqual(url, 'https://pix.org/?externalId=externalId'); | ||
| }); | ||
| }); | ||
|
|
||
| module('when there is a stage', function () { | ||
| test('should return the custom link with stage threshold search param', async function (assert) { | ||
| // given | ||
| const store = this.owner.lookup('service:store'); | ||
|
|
||
| const component = createGlimmerComponent( | ||
| 'campaigns/assessment/results/evaluation-results-hero/custom-organization-block', | ||
| ); | ||
|
|
||
| component.args.campaign = store.createRecord('campaign', { | ||
| customResultPageButtonUrl: 'https://pix.org/', | ||
| customResultPageButtonText: 'custom label', | ||
| }); | ||
| const reachedStage = store.createRecord('reached-stage', { | ||
| threshold: 5, | ||
| }); | ||
| component.args.campaignParticipationResult = store.createRecord('campaign-participation-result', { | ||
| reachedStage, | ||
| }); | ||
|
|
||
| // when | ||
| const url = component.customButtonUrl; | ||
|
|
||
| // then | ||
| assert.strictEqual(url, 'https://pix.org/?stage=5'); | ||
| }); | ||
| }); | ||
|
|
||
| module('when there is all parameters', function () { | ||
| test('should return the custom link with all parameters', async function (assert) { | ||
| // given | ||
| const store = this.owner.lookup('service:store'); | ||
|
|
||
| const component = createGlimmerComponent( | ||
| 'campaigns/assessment/results/evaluation-results-hero/custom-organization-block', | ||
| ); | ||
|
|
||
| component.args.campaign = store.createRecord('campaign', { | ||
| customResultPageButtonUrl: 'https://pix.org/', | ||
| customResultPageButtonText: 'custom label', | ||
| }); | ||
| const reachedStage = store.createRecord('reached-stage', { | ||
| threshold: 5, | ||
| }); | ||
| component.args.campaignParticipationResult = store.createRecord('campaign-participation-result', { | ||
| reachedStage, | ||
| masteryRate: 0.75, | ||
| participantExternalId: 'externalId', | ||
| }); | ||
|
|
||
| // when | ||
| const url = component.customButtonUrl; | ||
|
|
||
| // then | ||
| assert.strictEqual(url, 'https://pix.org/?masteryPercentage=75&externalId=externalId&stage=5'); | ||
| }); | ||
| }); | ||
| }); | ||
| }); | ||
| }); |