fix: Afficher liste professions dès le focus du champ

- Ajouter useEffect pour charger professions techniciens au montage initial
- Ajouter état professionInputFocused pour afficher la liste dès le focus
- Corriger le bug où la liste ne s'affichait que si on tapait dans le champ
- Fonctionne pour les professions Artiste et Technicien
This commit is contained in:
odentas 2025-12-16 12:10:06 +01:00
parent 543cc2da95
commit f5805133d1

View file

@ -288,6 +288,7 @@ export default function ContractEditor({
(prefill.categorie as "Artiste" | "Technicien") || "Artiste"
);
const [professionQuery, setProfessionQuery] = useState("");
const [professionInputFocused, setProfessionInputFocused] = useState(false);
const [professionPick, setProfessionPick] = useState<ProfessionOption | null>(() => {
if (!prefill.profession) return null;
@ -1047,6 +1048,13 @@ export default function ContractEditor({
}
};
// Load technicians on mount if needed
useEffect(() => {
if (categoriePro === "Technicien") {
ensureTechniciensLoaded();
}
}, []); // Déclenché au montage initial
// Load technicians when category changes to Technicien
useEffect(() => {
if (categoriePro === "Technicien") {
@ -2409,9 +2417,11 @@ export default function ContractEditor({
<Input
value={professionQuery}
onChange={(e) => setProfessionQuery(e.target.value)}
onFocus={() => setProfessionInputFocused(true)}
onBlur={() => setTimeout(() => setProfessionInputFocused(false), 200)}
placeholder={`Rechercher une profession ${categoriePro.toLowerCase()}...`}
/>
{professionQuery && (
{(professionQuery || professionInputFocused) && (
<div className="absolute z-10 w-full mt-1 bg-white border rounded-md shadow-lg max-h-48 overflow-y-auto">
{categoriePro === "Artiste" ? (
filteredProfessions.length === 0 ? (