fix(frontend,backend): traite la revue de phyri0s sur la PR #93
Corrige les 10 points de la revue du systeme de design : garde-fou de route explicite pour /docs, /redoc et /static, ton distinct pour les alertes critical vs high, flex-shrink sur le bon element du badge, mutualisation du bloc ev-card dans _auth-page.scss, bouton de deconnexion migre vers ev-button (nouvel input fullWidth), tokens manquants (--color-danger-hover, --color-warning-text, --color-text-inverse, --color-critical), test de synchronisation des deux copies du logo, openapi_avec_logo qui enveloppe application.openapi au lieu de le reimplementer, doc du frontend et index mis a jour, et suppression du CSS mort .form-error.
This commit is contained in:
Johan LEROY
@@ -3,7 +3,9 @@
|
||||
<ev-card>
|
||||
<ev-brand class="auth-brand" />
|
||||
<h1>Nouveau mot de passe</h1>
|
||||
<p class="auth-subtitle">Votre mot de passe est provisoire, vous devez le modifier avant de continuer</p>
|
||||
<p class="auth-subtitle">
|
||||
Votre mot de passe est provisoire, vous devez le modifier avant de continuer
|
||||
</p>
|
||||
|
||||
<label class="form-label" for="current_password">Mot de passe actuel</label>
|
||||
<input
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
ev-card {
|
||||
padding: 3rem 2.5rem;
|
||||
box-shadow:
|
||||
0 20px 25px -5px rgba(0, 0, 0, 0.06),
|
||||
0 8px 10px -6px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.auth-brand {
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
font-size: 2.1rem;
|
||||
margin-bottom: 1.75rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 1.85rem;
|
||||
font-weight: 700;
|
||||
color: var(--color-text);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.auth-subtitle {
|
||||
margin: 0.4rem 0 2rem;
|
||||
color: var(--color-text-muted);
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.4;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
ev-alert {
|
||||
display: block;
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
ev-button {
|
||||
display: block;
|
||||
margin-top: 1.75rem;
|
||||
}
|
||||
|
||||
@@ -40,7 +40,9 @@ export class ChangePassword {
|
||||
},
|
||||
error: () => {
|
||||
this.isLoading.set(false);
|
||||
this.errorMessage.set(`Mot de passe actuel incorrect, ou nouveau mot de passe invalide (${this.passwordHint}).`);
|
||||
this.errorMessage.set(
|
||||
`Mot de passe actuel incorrect, ou nouveau mot de passe invalide (${this.passwordHint}).`,
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1,42 +1,3 @@
|
||||
ev-card {
|
||||
padding: 3rem 2.5rem;
|
||||
box-shadow:
|
||||
0 20px 25px -5px rgba(0, 0, 0, 0.06),
|
||||
0 8px 10px -6px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.auth-brand {
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
font-size: 2.1rem;
|
||||
margin-bottom: 1.75rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 1.85rem;
|
||||
font-weight: 700;
|
||||
color: var(--color-text);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.auth-subtitle {
|
||||
margin: 0.4rem 0 2rem;
|
||||
color: var(--color-text-muted);
|
||||
font-size: 0.95rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
ev-alert {
|
||||
display: block;
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
ev-button {
|
||||
display: block;
|
||||
margin-top: 1.75rem;
|
||||
}
|
||||
|
||||
.auth-link {
|
||||
margin-top: 1rem;
|
||||
font-size: 0.85rem;
|
||||
|
||||
@@ -7,7 +7,10 @@ import { Button } from '../../../shared/components/ui/button/button';
|
||||
import { Card } from '../../../shared/components/ui/card/card';
|
||||
import { Alert } from '../../../shared/components/ui/alert/alert';
|
||||
import { Brand } from '../../../shared/components/ui/brand/brand';
|
||||
import { MESSAGE_LIEN_RESET_INVALIDE, MOTIF_LIEN_RESET_INVALIDE } from '../../../shared/models/auth-redirect-reason';
|
||||
import {
|
||||
MESSAGE_LIEN_RESET_INVALIDE,
|
||||
MOTIF_LIEN_RESET_INVALIDE,
|
||||
} from '../../../shared/models/auth-redirect-reason';
|
||||
|
||||
@Component({
|
||||
selector: 'app-login',
|
||||
|
||||
@@ -7,7 +7,9 @@
|
||||
<p class="dashboard__subtitle">Consommation instantanée du parc</p>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="logout-button" (click)="onLogout()">Déconnexion</button>
|
||||
<ev-button class="logout-button" variant="secondary" [fullWidth]="false" (click)="onLogout()"
|
||||
>Déconnexion</ev-button
|
||||
>
|
||||
</header>
|
||||
|
||||
@if (error(); as message) {
|
||||
|
||||
@@ -115,18 +115,3 @@ h2 {
|
||||
.alert-item__message {
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.logout-button {
|
||||
padding: 0.5rem 1rem;
|
||||
background: var(--color-surface);
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--radius-sm);
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-label);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: var(--color-bg);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -148,4 +148,28 @@ describe('Dashboard', () => {
|
||||
expect(authMock.clearSession).toHaveBeenCalled();
|
||||
expect(routerMock.navigate).toHaveBeenCalledWith(['/login']);
|
||||
});
|
||||
|
||||
it('distingue le ton des sévérités high et critical', () => {
|
||||
const statsMock = { getSummary: vi.fn().mockReturnValue(of({ total_sites: 7, sites: [] })) };
|
||||
const alertsMock = { getAlerts: vi.fn().mockReturnValue(of([])) };
|
||||
|
||||
TestBed.configureTestingModule({
|
||||
imports: [Dashboard],
|
||||
providers: [
|
||||
{ provide: StatsService, useValue: statsMock },
|
||||
{ provide: AlertsService, useValue: alertsMock },
|
||||
],
|
||||
});
|
||||
|
||||
const fixture = TestBed.createComponent(Dashboard);
|
||||
const dashboard = fixture.componentInstance;
|
||||
|
||||
expect(dashboard.badgeToneForSeverity('low')).toBe('success');
|
||||
expect(dashboard.badgeToneForSeverity('medium')).toBe('warning');
|
||||
expect(dashboard.badgeToneForSeverity('high')).toBe('danger');
|
||||
expect(dashboard.badgeToneForSeverity('critical')).toBe('critical');
|
||||
expect(dashboard.badgeToneForSeverity('high')).not.toBe(
|
||||
dashboard.badgeToneForSeverity('critical'),
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -14,6 +14,7 @@ import { Card } from '../../shared/components/ui/card/card';
|
||||
import { Alert as EvAlert } from '../../shared/components/ui/alert/alert';
|
||||
import { Badge, BadgeTone } from '../../shared/components/ui/badge/badge';
|
||||
import { Brand } from '../../shared/components/ui/brand/brand';
|
||||
import { Button } from '../../shared/components/ui/button/button';
|
||||
|
||||
const REFRESH_INTERVAL_MS = 10000;
|
||||
const UNAVAILABLE_MESSAGE =
|
||||
@@ -23,13 +24,13 @@ const TON_PAR_SEVERITE: Record<AlertSeverity, BadgeTone> = {
|
||||
low: 'success',
|
||||
medium: 'warning',
|
||||
high: 'danger',
|
||||
critical: 'danger',
|
||||
critical: 'critical',
|
||||
};
|
||||
|
||||
@Component({
|
||||
selector: 'app-dashboard',
|
||||
standalone: true,
|
||||
imports: [DecimalPipe, ConsumptionGauge, SiteLoadChart, Card, EvAlert, Badge, Brand],
|
||||
imports: [DecimalPipe, ConsumptionGauge, SiteLoadChart, Card, EvAlert, Badge, Brand, Button],
|
||||
templateUrl: './dashboard.html',
|
||||
styleUrl: './dashboard.scss',
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user