Skip to content

Commit 0de2d4a

Browse files
JeyffreyJeyffrey
authored
refactor(admin): improve certification issue reports sub-components
1 parent 1383cb4 commit 0de2d4a

File tree

15 files changed

+344
-369
lines changed

15 files changed

+344
-369
lines changed

‎admin/app/components/certifications/certification/informations.gjs

+6-12
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@ import PixSelect from '@1024pix/pix-ui/components/pix-select';
44

55
import CertificationCompetenceList from '../competence-list';
66
import CertificationInfoField from '../info-field';
7-
import CertificationIssueReports from '../issue-reports';
87
import CertificationComments from './comments';
98
import CertificationInformationCandidate from './informations/candidate';
109
import CertificationInformationGlobalActions from './informations/global-actions';
10+
import CertificationInformationIssueReports from './informations/issue-reports';
1111
import CertificationInformationState from './informations/state';
1212

1313
<template>
@@ -110,17 +110,11 @@ import CertificationInformationState from './informations/state';
110110
</div>
111111
{{/if}}
112112

113-
{{#if @hasIssueReports}}
114-
<section
115-
class="certification-informations__row certification-informations__card certification-informations__certification-issue-reports"
116-
>
117-
<h2 class="card-title certification-informations__card__title">Signalements</h2>
118-
<CertificationIssueReports
119-
@hasImpactfulIssueReports={{@hasImpactfulIssueReports}}
120-
@hasUnimpactfulIssueReports={{@hasUnimpactfulIssueReports}}
121-
@impactfulCertificationIssueReports={{@impactfulCertificationIssueReports}}
122-
@unimpactfulCertificationIssueReports={{@unimpactfulCertificationIssueReports}}
123-
@resolveIssueReport={{@resolveIssueReport}}
113+
{{#if @certificationIssueReports.length}}
114+
<section class="certification-informations__row">
115+
<CertificationInformationIssueReports
116+
@certificationIssueReports={{@certificationIssueReports}}
117+
@certification={{@certification}}
124118
/>
125119
</section>
126120
{{/if}}

‎admin/app/components/certifications/certification/informations/issue-reports.gjs

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import Component from '@glimmer/component';
2+
3+
import CertificationIssueReport from './issue-reports/issue-report';
4+
5+
export default class CertificationInformationIssueReports extends Component {
6+
get impactfulCertificationIssueReports() {
7+
return this.args.certificationIssueReports.filter((issueReport) => issueReport.isImpactful);
8+
}
9+
10+
get unimpactfulCertificationIssueReports() {
11+
return this.args.certificationIssueReports.filter((issueReport) => !issueReport.isImpactful);
12+
}
13+
14+
<template>
15+
<div class="certification-informations__card">
16+
<h2 class="card-title certification-informations__card__title">Signalements</h2>
17+
{{#if this.impactfulCertificationIssueReports.length}}
18+
<h3 class="certification-issue-reports__subtitle certification-issue-reports__subtitle--with-action-required">
19+
{{this.impactfulCertificationIssueReports.length}}
20+
Signalement(s) impactant(s)
21+
</h3>
22+
<ul class="certification-issue-reports__list">
23+
{{#each this.impactfulCertificationIssueReports as |issueReport|}}
24+
<CertificationIssueReport @issueReport={{issueReport}} @certification={{@certification}} />
25+
{{/each}}
26+
</ul>
27+
{{/if}}
28+
{{#if this.unimpactfulCertificationIssueReports.length}}
29+
<h3
30+
class="certification-issue-reports__subtitle certification-issue-reports__subtitle--without-action-required"
31+
>
32+
{{this.unimpactfulCertificationIssueReports.length}}
33+
Signalement(s) non impactant(s)
34+
</h3>
35+
<ul class="certification-issue-reports__list certification-issue-reports__list--last">
36+
{{#each this.unimpactfulCertificationIssueReports as |issueReport|}}
37+
<CertificationIssueReport @issueReport={{issueReport}} />
38+
{{/each}}
39+
</ul>
40+
{{/if}}
41+
</div>
42+
</template>
43+
}

‎admin/app/components/certifications/issue-report.gjs ‎admin/app/components/certifications/certification/informations/issue-reports/issue-report.gjs

+3-4
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import Component from '@glimmer/component';
66
import { tracked } from '@glimmer/tracking';
77
import { and, not, or } from 'ember-truth-helpers';
88

9-
import CertificationIssueReportModal from './issue-reports/resolve-issue-report-modal';
9+
import CertificationIssueReportModal from './resolve-issue-report-modal';
1010

1111
export default class CertificationIssueReport extends Component {
1212
@service accessControl;
@@ -64,11 +64,10 @@ export default class CertificationIssueReport extends Component {
6464
<PixButton @size="small" @triggerAction={{this.toggleResolveModal}}>Modifier la résolution</PixButton>
6565
{{/if}}
6666
<CertificationIssueReportModal
67-
@toggleResolveModal={{this.toggleResolveModal}}
6867
@issueReport={{@issueReport}}
69-
@resolveIssueReport={{@resolveIssueReport}}
70-
@closeResolveModal={{this.closeResolveModal}}
68+
@certification={{@certification}}
7169
@displayModal={{this.showResolveModal}}
70+
@toggleResolveModal={{this.toggleResolveModal}}
7271
/>
7372
{{/if}}
7473
</li>

‎admin/app/components/certifications/issue-reports/resolve-issue-report-modal.gjs ‎admin/app/components/certifications/certification/informations/issue-reports/resolve-issue-report-modal.gjs

+25-13
Original file line numberDiff line numberDiff line change
@@ -3,39 +3,52 @@ import PixModal from '@1024pix/pix-ui/components/pix-modal';
33
import PixTextarea from '@1024pix/pix-ui/components/pix-textarea';
44
import { on } from '@ember/modifier';
55
import { action } from '@ember/object';
6+
import { service } from '@ember/service';
67
import Component from '@glimmer/component';
78
import { tracked } from '@glimmer/tracking';
89
import { t } from 'ember-intl';
910

10-
import focus from '../../../modifiers/focus';
11+
import focus from '../../../../../modifiers/focus';
1112

1213
export default class CertificationIssueReportModal extends Component {
13-
@tracked label = null;
14+
@service pixToast;
15+
16+
@tracked resolution = null;
1417
@tracked errorMessage = null;
1518

1619
@action
17-
resolve() {
20+
async onSubmit() {
1821
if (this._isInvalid()) {
1922
this.errorMessage = 'Le motif de résolution doit être renseigné.';
2023
return;
2124
}
2225

2326
this.errorMessage = null;
24-
this.args.resolveIssueReport(this.args.issueReport, this.label);
25-
this.args.closeResolveModal();
27+
28+
try {
29+
await this.args.issueReport.save({ adapterOptions: { resolutionLabel: this.resolution } });
30+
await this.args.certification.reload();
31+
32+
this.pixToast.sendSuccessNotification({ message: 'Le signalement a été résolu.' });
33+
} catch (error) {
34+
console.log('error', error);
35+
this.pixToast.sendErrorNotification({ message: 'Une erreur est survenue :\n' + error?.errors[0]?.detail });
36+
} finally {
37+
this.args.toggleResolveModal();
38+
}
2639
}
2740

2841
@action
29-
onChangeLabel(event) {
30-
this.label = event.target.value;
42+
onResolutionChange(event) {
43+
this.resolution = event.target.value;
3144
}
3245

3346
get actionName() {
3447
return this.args.issueReport.isResolved ? 'Modifier la résolution' : 'Résoudre ce signalement';
3548
}
3649

3750
_isInvalid() {
38-
return this.args.issueReport.isResolved && !this.label?.trim();
51+
return this.args.issueReport.isResolved && !this.resolution?.trim();
3952
}
4053

4154
<template>
@@ -47,7 +60,7 @@ export default class CertificationIssueReportModal extends Component {
4760
type="text"
4861
maxLength="255"
4962
@errorMessage={{this.errorMessage}}
50-
{{on "change" this.onChangeLabel}}
63+
{{on "change" this.onResolutionChange}}
5164
{{focus}}
5265
>
5366
<:label>Résolution</:label>
@@ -56,14 +69,13 @@ export default class CertificationIssueReportModal extends Component {
5669

5770
<:footer>
5871
<PixButton
59-
@type="submit"
60-
@size="small"
72+
@variant="secondary"
6173
class="pix-button--background-transparent-light"
62-
{{on "click" @toggleResolveModal}}
74+
@triggerAction={{@toggleResolveModal}}
6375
>
6476
{{t "common.actions.cancel"}}
6577
</PixButton>
66-
<PixButton @size="small" @triggerAction={{this.resolve}}>{{this.actionName}}</PixButton>
78+
<PixButton @triggerAction={{this.onSubmit}}>{{this.actionName}}</PixButton>
6779
</:footer>
6880
</PixModal>
6981
</template>

‎admin/app/components/certifications/issue-report.scss

-38
This file was deleted.

‎admin/app/components/certifications/issue-reports.gjs

-26
This file was deleted.

‎admin/app/controllers/authenticated/certifications/certification/informations.js

-36
Original file line numberDiff line numberDiff line change
@@ -22,31 +22,6 @@ export default class CertificationInformationsController extends Controller {
2222

2323
@tracked selectedJuryLevel = null;
2424

25-
@computed('model.certificationIssueReports.@each.isImpactful')
26-
get impactfulCertificationIssueReports() {
27-
return this.model.certificationIssueReports.filter((issueReport) => issueReport.isImpactful);
28-
}
29-
30-
@computed('model.certificationIssueReports.@each.isImpactful')
31-
get unimpactfulCertificationIssueReports() {
32-
return this.model.certificationIssueReports.filter((issueReport) => !issueReport.isImpactful);
33-
}
34-
35-
@computed('model.certificationIssueReports.@each.isImpactful')
36-
get hasIssueReports() {
37-
return Boolean(this.model.certificationIssueReports.length);
38-
}
39-
40-
@computed('model.certificationIssueReports.@each.isImpactful')
41-
get hasImpactfulIssueReports() {
42-
return Boolean(this.model.certificationIssueReports.filter((issueReport) => issueReport.isImpactful).length);
43-
}
44-
45-
@computed('model.certificationIssueReports.@each.isImpactful')
46-
get hasUnimpactfulIssueReports() {
47-
return Boolean(this.model.certificationIssueReports.filter((issueReport) => !issueReport.isImpactful).length);
48-
}
49-
5025
@computed('certification.status')
5126
get isCertificationCancelled() {
5227
return this.certification.status === 'cancelled';
@@ -69,17 +44,6 @@ export default class CertificationInformationsController extends Controller {
6944
return this.certification.version === 2;
7045
}
7146

72-
@action
73-
async resolveIssueReport(issueReport, resolutionLabel) {
74-
try {
75-
await issueReport.save({ adapterOptions: { resolutionLabel } });
76-
this.pixToast.sendSuccessNotification({ message: 'Le signalement a été résolu.' });
77-
} catch (error) {
78-
this.pixToast.sendErrorNotification({ message: 'Une erreur est survenue :\n' + error?.errors[0]?.detail });
79-
}
80-
await this.certification.reload();
81-
}
82-
8347
saveAssessmentResult(commentByJury) {
8448
this.certification.commentByJury = commentByJury;
8549
return this.certification.save({ adapterOptions: { updateJuryComment: true } });

‎admin/app/styles/app.scss

-1
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,6 @@
101101
@use 'flatpickr' as *;
102102

103103
/* App/Components */
104-
@use 'certifications/issue-report' as *;
105104
@use 'certifications/certification/details-v3' as *;
106105
@use 'certification-centers/certification-center-form' as *;
107106
@use 'certification-centers/information' as *;

‎admin/app/styles/components/certification-issue-reports.scss

+43
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
@use 'pix-design-tokens/typography';
2+
3+
// List
14
.certification-issue-reports {
25
&__title {
36
margin-bottom: 16px;
@@ -35,3 +38,43 @@
3538
}
3639
}
3740
}
41+
42+
// Item
43+
.certification-issue-report {
44+
display: flex;
45+
align-items: center;
46+
border-bottom: var(--pix-neutral-15) solid 1px;
47+
48+
&__resolution-status {
49+
width: 2rem;
50+
height: 2rem;
51+
margin-top: 24px;
52+
margin-bottom: 24px;
53+
margin-left: 24px;
54+
55+
&--resolved {
56+
fill: var(--pix-success-700);
57+
}
58+
59+
&--unresolved {
60+
fill: var(--pix-error-700);
61+
}
62+
}
63+
64+
&__details {
65+
margin-left: 16px;
66+
67+
&__label {
68+
color: var(--pix-neutral-500);
69+
font-weight: var(--pix-font-medium);
70+
71+
@extend %pix-body-s;
72+
}
73+
74+
&__resolution-message {
75+
color: var(--pix-neutral-100);
76+
77+
@extend %pix-body-s;
78+
}
79+
}
80+
}

‎admin/app/templates/authenticated/certifications/certification/informations.hbs

+1-6
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<Certifications::Certification::Informations
22
@certification={{this.certification}}
3+
@certificationIssueReports={{this.model.certificationIssueReports}}
34
@session={{this.model.session}}
45
@displayJuryLevelSelect={{this.displayJuryLevelSelect}}
56
@juryLevelOptions={{this.juryLevelOptions}}
@@ -9,12 +10,6 @@
910
@onEditJuryLevelSave={{this.onEditJuryLevelSave}}
1011
@shouldDisplayJuryLevelEditButton={{this.shouldDisplayJuryLevelEditButton}}
1112
@editJury={{this.editJury}}
12-
@hasIssueReports={{this.hasIssueReports}}
13-
@hasImpactfulIssueReports={{this.hasImpactfulIssueReports}}
14-
@hasUnimpactfulIssueReports={{this.hasUnimpactfulIssueReports}}
15-
@impactfulCertificationIssueReports={{this.impactfulCertificationIssueReports}}
16-
@unimpactfulCertificationIssueReports={{this.unimpactfulCertificationIssueReports}}
17-
@resolveIssueReport={{this.resolveIssueReport}}
1813
@onJuryCommentSave={{this.onJuryCommentSave}}
1914
@shouldDisplayPixScore={{this.shouldDisplayPixScore}}
2015
@onUpdateScore={{this.onUpdateScore}}

0 commit comments

Comments
 (0)