Skip to content

Commit

Permalink
feat(monpix): hide empty block on skill review
Browse files Browse the repository at this point in the history
  • Loading branch information
@lionelB
lionelB committed Nov 23, 2023
1 parent dee5711 commit 922fa7c
Show file tree
Hide file tree
Showing 3 changed files with 110 additions and 90 deletions.
181 changes: 91 additions & 90 deletions mon-pix/app/components/routes/campaigns/assessment/skill-review.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -244,103 +244,104 @@
</div>
</PixBlock>
{{/if}}
{{#if this.showHeavyBlock}}
<PixBlock @shadow="heavy" class="skill-review__result-detail-container">

<PixBlock @shadow="heavy" class="skill-review__result-detail-container">

{{#if this.showCertifiableBadges}}
<div class="badge-certifiable-container">
{{#each this.certifiableBadgesOrderedByValidity as |badge|}}
<BadgeCardCertifiable
@title={{badge.title}}
@message={{badge.message}}
@imageUrl={{badge.imageUrl}}
@altMessage={{badge.altMessage}}
@isAcquired={{badge.isAcquired}}
@isValid={{badge.isValid}}
@isCertifiable={{badge.isCertifiable}}
@isAlwaysVisible={{badge.isAlwaysVisible}}
@acquisitionPercentage={{badge.acquisitionPercentage}}
/>
{{/each}}
</div>
{{/if}}
{{#if this.showCertifiableBadges}}
<div class="badge-certifiable-container">
{{#each this.certifiableBadgesOrderedByValidity as |badge|}}
<BadgeCardCertifiable
@title={{badge.title}}
@message={{badge.message}}
@imageUrl={{badge.imageUrl}}
@altMessage={{badge.altMessage}}
@isAcquired={{badge.isAcquired}}
@isValid={{badge.isValid}}
@isCertifiable={{badge.isCertifiable}}
@isAlwaysVisible={{badge.isAlwaysVisible}}
@acquisitionPercentage={{badge.acquisitionPercentage}}
/>
{{/each}}
</div>
{{/if}}

{{#if this.showNotCertifiableBadges}}
<h2 class="skill-review-result-detail__badge-subtitle">
{{t "pages.skill-review.badges-title"}}
</h2>
<div class="badge-container">
{{#each this.notCertifiableBadges as |badge|}}
<BadgeCard
@title={{badge.title}}
@message={{badge.message}}
@isAlwaysVisible={{badge.isAlwaysVisible}}
@acquisitionPercentage={{badge.acquisitionPercentage}}
@imageUrl={{badge.imageUrl}}
@altMessage={{badge.altMessage}}
@isAcquired={{badge.isAcquired}}
/>
{{/each}}
</div>
{{/if}}
{{#if this.showNotCertifiableBadges}}
<h2 class="skill-review-result-detail__badge-subtitle">
{{t "pages.skill-review.badges-title"}}
</h2>
<div class="badge-container">
{{#each this.notCertifiableBadges as |badge|}}
<BadgeCard
@title={{badge.title}}
@message={{badge.message}}
@isAlwaysVisible={{badge.isAlwaysVisible}}
@acquisitionPercentage={{badge.acquisitionPercentage}}
@imageUrl={{badge.imageUrl}}
@altMessage={{badge.altMessage}}
@isAcquired={{badge.isAcquired}}
/>
{{/each}}
</div>
{{/if}}

{{#if this.showImproveButton}}
<SkillReviewImprove @improve={{this.improve}} />
{{/if}}
{{#if this.showImproveButton}}
<SkillReviewImprove @improve={{this.improve}} />
{{/if}}

{{#unless @model.campaign.isForAbsoluteNovice}}
{{#if this.showStagesWithStars}}
<section class="skill-review-result-detail__content">
<h2 class="skill-review-competence-stages-result__title">
{{t "pages.skill-review.stage.title"}}
</h2>
{{#each-in this.competenceResultsGroupedByAreas as |area competenceResults|}}
<div class="skill-review-competence-stages-result__content">
<div class="skill-review-competence-stages-result__area">
<span
class="skill-review-competence-stages-result__border skill-review-competence__border--{{competenceResults.areaColor}}"
aria-hidden="true"
></span>
<h3 class="skill-review-competence-stages-result__subtitle">{{area}}</h3>
{{#unless @model.campaign.isForAbsoluteNovice}}
{{#if this.showStagesWithStars}}
<section class="skill-review-result-detail__content">
<h2 class="skill-review-competence-stages-result__title">
{{t "pages.skill-review.stage.title"}}
</h2>
{{#each-in this.competenceResultsGroupedByAreas as |area competenceResults|}}
<div class="skill-review-competence-stages-result__content">
<div class="skill-review-competence-stages-result__area">
<span
class="skill-review-competence-stages-result__border skill-review-competence__border--{{competenceResults.areaColor}}"
aria-hidden="true"
></span>
<h3 class="skill-review-competence-stages-result__subtitle">{{area}}</h3>
</div>
<Campaigns::Assessment::SkillReview::CompetenceStagesResult
@competenceResults={{competenceResults}}
@totalStage={{this.reachedStage.totalStage}}
/>
</div>
<Campaigns::Assessment::SkillReview::CompetenceStagesResult
@competenceResults={{competenceResults}}
@totalStage={{this.reachedStage.totalStage}}
/>
{{/each-in}}
</section>
{{else}}
<section class="skill-review-result-detail__content">
<div class="skill-review-result-detail__table-header">
<h2 class="skill-review-result-detail__subtitle">
{{t "pages.skill-review.details.title"}}
</h2>
{{#unless this.isFlashCampaign}}
<CircleChart @value={{this.masteryPercentage}}>
<span
aria-label="{{t 'pages.skill-review.details.result'}}"
class="skill-review-table-header__circle-chart-value"
>
{{t "pages.skill-review.details.percentage" rate=this.masteryRate}}
</span>
</CircleChart>
{{/unless}}
</div>
{{/each-in}}
</section>
{{else}}
<section class="skill-review-result-detail__content">
<div class="skill-review-result-detail__table-header">
<h2 class="skill-review-result-detail__subtitle">
{{t "pages.skill-review.details.title"}}
</h2>
{{#unless this.isFlashCampaign}}
<CircleChart @value={{this.masteryPercentage}}>
<span
aria-label="{{t 'pages.skill-review.details.result'}}"
class="skill-review-table-header__circle-chart-value"
>
{{t "pages.skill-review.details.percentage" rate=this.masteryRate}}
</span>
</CircleChart>
{{/unless}}
</div>
<Campaigns::Assessment::CampaignSkillReviewCompetenceResult
@competenceResults={{@model.campaignParticipationResult.competenceResults}}
/>
</section>
{{/if}}
<Campaigns::Assessment::CampaignSkillReviewCompetenceResult
@competenceResults={{@model.campaignParticipationResult.competenceResults}}
/>
</section>
{{/if}}

{{#unless this.isFlashCampaign}}
<div class="skill-review-result-detail__information">
<FaIcon @icon="circle-info" class="skill-review-information__info-icon" aria-hidden="true" />
<div class="skill-review-information__text">
{{t "pages.skill-review.information"}}
{{#unless this.isFlashCampaign}}
<div class="skill-review-result-detail__information">
<FaIcon @icon="circle-info" class="skill-review-information__info-icon" aria-hidden="true" />
<div class="skill-review-information__text">
{{t "pages.skill-review.information"}}
</div>
</div>
</div>
{{/unless}}
{{/unless}}
{{/unless}}
</PixBlock>
</PixBlock>
{{/if}}
</main>
9 changes: 9 additions & 0 deletions mon-pix/app/components/routes/campaigns/assessment/skill-review.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -174,6 +174,15 @@ export default class SkillReview extends Component {
return this.args.model.campaignParticipationResult.canImprove && !this.isShareButtonClicked;
}

get showHeavyBlock() {
return (
this.showCertifiableBadges ||
this.showNotCertifiableBadges ||
this.showImproveButton ||
!this.args.model.campaign.isForAbsoluteNovice
);
}

get competenceResultsGroupedByAreas() {
const competenceResults = this.args.model.campaignParticipationResult.get('competenceResults').toArray();
return competenceResults.reduce((acc, competenceResult) => {
Expand Down
10 changes: 10 additions & 0 deletions mon-pix/tests/integration/components/campaign/skill-review_test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -253,4 +253,14 @@ module('Integration | Component | Campaign | skill-review', function (hooks) {
assert.dom(screen.getByRole('button', { name: 'Annuler' })).exists();
});
});

test('it should not display skill review infos if isForabsoluteNovice is true', async function (assert) {
model.campaign.set('isForAbsoluteNovice', true);
this.set('model', model);

const screen = await render(hbs`<Routes::Campaigns::Assessment::SkillReview @model={{this.model}} />`);

assert.notOk(screen.queryByText(this.intl.t('pages.skill-review.stage.title')));
assert.notOk(screen.queryByText(this.intl.t('pages.skill-review.details.title')));
});
});

0 comments on commit 922fa7c

Please sign in to comment.