improve profile

This commit is contained in:
Nicola Malizia
2025-10-10 20:21:55 +02:00
parent 74a2c00e29
commit 82a342ca25

View File

@@ -4,7 +4,7 @@ import React, { useState, useEffect } from 'react';
import { useParams, useNavigate, Link } from 'react-router-dom'; import { useParams, useNavigate, Link } from 'react-router-dom';
import { getCelebrityById, updateCelebrity, deleteCelebrity } from '../services/api'; import { getCelebrityById, updateCelebrity, deleteCelebrity } from '../services/api';
import EditableField from './EditableField'; import EditableField from './EditableField';
import './CelebrityProfile.css'; // Importa il nuovo CSS per il layout del profilo import './CelebrityProfile.css';
function CelebrityProfile() { function CelebrityProfile() {
const { id } = useParams(); const { id } = useParams();
@@ -39,12 +39,10 @@ function CelebrityProfile() {
try { try {
const updatedCelebrity = await updateCelebrity(id, payload); const updatedCelebrity = await updateCelebrity(id, payload);
// Aggiorna lo stato locale per un feedback immediato
setCelebrity((prev) => ({ ...prev, [fieldName]: newValue })); setCelebrity((prev) => ({ ...prev, [fieldName]: newValue }));
console.log('Salvataggio riuscito:', updatedCelebrity); console.log('Salvataggio riuscito:', updatedCelebrity);
} catch (err) { } catch (err) {
console.error(`Errore durante il salvataggio del campo ${fieldName}:`, err); console.error(`Errore durante il salvataggio del campo ${fieldName}:`, err);
// Rilancia l'errore in modo che il componente figlio possa gestirlo
throw err; throw err;
} }
}; };
@@ -89,12 +87,11 @@ function CelebrityProfile() {
{error && <p className="error-message">Errore: {error}</p>} {error && <p className="error-message">Errore: {error}</p>}
<details open> <details open>
<summary><h3>Dati Personali</h3></summary> <summary><h3>Dati Anagrafici</h3></summary>
<div className="profile-grid"> <div className="profile-grid">
<EditableField label="Data di nascita" name="birth_date" value={celebrity.birth_date} type="date" onSave={handleFieldSave} /> <EditableField label="Data di nascita" name="birth_date" value={celebrity.birth_date} type="date" onSave={handleFieldSave} />
<EditableField label="Luogo di nascita" name="birth_place" value={celebrity.birth_place} onSave={handleFieldSave} /> <EditableField label="Luogo di nascita" name="birth_place" value={celebrity.birth_place} onSave={handleFieldSave} />
<EditableField label="Nazionalità" name="nationality" value={celebrity.nationality} onSave={handleFieldSave} /> <EditableField label="Nazionalità" name="nationality" value={celebrity.nationality} onSave={handleFieldSave} />
<EditableField label="Etnia" name="ethnicity" value={celebrity.ethnicity} onSave={handleFieldSave} />
<EditableField label="Genere" name="gender" value={celebrity.gender} type="select" options={genderOptions} onSave={handleFieldSave} /> <EditableField label="Genere" name="gender" value={celebrity.gender} type="select" options={genderOptions} onSave={handleFieldSave} />
<EditableField label="Sessualità" name="sexuality" value={celebrity.sexuality} onSave={handleFieldSave} /> <EditableField label="Sessualità" name="sexuality" value={celebrity.sexuality} onSave={handleFieldSave} />
</div> </div>
@@ -102,13 +99,20 @@ function CelebrityProfile() {
</details> </details>
<details> <details>
<summary><h3>Aspetto Fisico e Misure</h3></summary> <summary><h3>Aspetto Fisico</h3></summary>
<div className="profile-grid">
<EditableField label="Etnia" name="ethnicity" value={celebrity.ethnicity} onSave={handleFieldSave} />
<EditableField label="Colore Capelli" name="hair_color" value={celebrity.hair_color} onSave={handleFieldSave} />
<EditableField label="Colore Occhi" name="eye_color" value={celebrity.eye_color} onSave={handleFieldSave} />
<EditableField label="Corporatura" name="body_type" value={celebrity.body_type} onSave={handleFieldSave} />
</div>
</details>
<details>
<summary><h3>Misure Corporee</h3></summary>
<div className="profile-grid"> <div className="profile-grid">
<EditableField label="Altezza (cm)" name="height_cm" value={celebrity.height_cm} type="number" onSave={handleFieldSave} /> <EditableField label="Altezza (cm)" name="height_cm" value={celebrity.height_cm} type="number" onSave={handleFieldSave} />
<EditableField label="Peso (kg)" name="weight_kg" value={celebrity.weight_kg} type="number" onSave={handleFieldSave} /> <EditableField label="Peso (kg)" name="weight_kg" value={celebrity.weight_kg} type="number" onSave={handleFieldSave} />
<EditableField label="Corporatura" name="body_type" value={celebrity.body_type} onSave={handleFieldSave} />
<EditableField label="Colore Capelli" name="hair_color" value={celebrity.hair_color} onSave={handleFieldSave} />
<EditableField label="Colore Occhi" name="eye_color" value={celebrity.eye_color} onSave={handleFieldSave} />
<EditableField label="Seno (cm)" name="bust_cm" value={celebrity.bust_cm} type="number" onSave={handleFieldSave} /> <EditableField label="Seno (cm)" name="bust_cm" value={celebrity.bust_cm} type="number" onSave={handleFieldSave} />
<EditableField label="Vita (cm)" name="waist_cm" value={celebrity.waist_cm} type="number" onSave={handleFieldSave} /> <EditableField label="Vita (cm)" name="waist_cm" value={celebrity.waist_cm} type="number" onSave={handleFieldSave} />
<EditableField label="Fianchi (cm)" name="hips_cm" value={celebrity.hips_cm} type="number" onSave={handleFieldSave} /> <EditableField label="Fianchi (cm)" name="hips_cm" value={celebrity.hips_cm} type="number" onSave={handleFieldSave} />