feat: page Achievements + soins renommé + bouton soins en combat
All checks were successful
CI/CD — Build & Deploy / Build & Deploy (push) Successful in 31s

Page /achievements : 20 succès groupés par catégorie (Combat, Progression,
Économie, Équipement), progress bars, paliers bronze/silver/gold,
bouton réclamer, compteur débloqués/total.

Renommage "repos" → "soins" partout (dashboard, budget, messages).
Bouton soins ajouté dans la page combat (accès rapide entre les fights).
Icône Trophy dans la sidebar pour les succès.
This commit is contained in:
2026-03-24 17:36:20 +01:00
parent 210f32b9cc
commit 4d254692b0
5 changed files with 244 additions and 11 deletions

View File

@@ -2,9 +2,10 @@ import { useState } from 'react';
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
import { combatApi, characterApi } from '../api/endpoints';
import type { Monster, CombatResult, CombatLog } from '../api/types';
import { Swords, Trophy, Skull, Clock, Zap } from 'lucide-react';
import { Swords, Trophy, Skull, Clock, Zap, Heart } from 'lucide-react';
const COMBAT_COST = 5;
const REST_COST = 10;
const ATTACK_TYPES = [
{ id: 'melee', label: 'Mêlée', emoji: '⚔️', stat: 'Force × 1.5' },
@@ -113,6 +114,13 @@ export function CombatPage() {
const endurance = char?.enduranceCurrent ?? 0;
const playerLevel = char?.level ?? 1;
const canFight = endurance >= COMBAT_COST;
const needsHeal = char ? char.hpCurrent < char.hpMax : false;
const canHeal = needsHeal && endurance >= REST_COST;
const healMut = useMutation({
mutationFn: () => characterApi.rest(),
onSuccess: () => qc.invalidateQueries({ queryKey: ['character'] }),
});
const { data: monsters, isLoading } = useQuery({
queryKey: ['monsters'],
@@ -190,6 +198,20 @@ export function CombatPage() {
))}
</div>
{/* Soins rapide */}
{needsHeal && (
<button
className="btn btn-ghost"
style={{ width: '100%', marginBottom: 8, fontSize: 12, display: 'flex', alignItems: 'center', gap: 6, justifyContent: 'center', opacity: canHeal ? 1 : 0.5 }}
disabled={healMut.isPending || !canHeal}
onClick={() => healMut.mutate()}
>
<Heart size={12} color="#e84040" />
{healMut.isPending ? 'Soins' : `Soins (+50% PV, ${REST_COST}⚡)`}
<span style={{ color: '#6b7a99', fontSize: 11 }}>— {char!.hpCurrent}/{char!.hpMax} PV</span>
</button>
)}
{/* Coût endurance */}
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6, marginBottom: 6, fontSize: 12, color: canFight ? '#5ba4f5' : '#e84040' }}>
<Zap size={12} /> Coût : {COMBAT_COST} endurance — Disponible : {endurance}