+
+ {canauxQuery.data?.length ?? 0} canal{(canauxQuery.data?.length ?? 0) > 1 ? "x" : ""}
+
+
+ {canauxQuery.isLoading && (
+
+ {[1, 2, 3].map((i) => (
+
+ ))}
+
+ )}
+ {!canauxQuery.isLoading && (!canauxQuery.data || canauxQuery.data.length === 0) && (
+
+
+
+
+
Aucun échange
+
+ Contactez un référent depuis la fiche d'un établissement pour démarrer un échange.
+
+
+ )}
+ {canauxQuery.data?.map((canal: Canal) => (
+
+ ))}
+
+
+ {!selectedCanalId ? (
+
+
+
+
+
Sélectionnez un canal
+
+ Choisissez un canal dans la liste à gauche pour consulter et participer à la discussion.
+
+
+ ) : (
+ <>
+ {/* En-tête du canal */}
+
+
+
{selectedCanal?.titre}
+ {selectedCanal?.description && (
+
{selectedCanal.description}
+ )}
+
+
+ {selectedCanal && (
+
+ {typeLabel(selectedCanal.type)}
+
+ )}
+ {selectedCanal?.visibilite === "prive" ? (
+
+
+ Privé
+
+ ) : (
+
+
+ Public
+
+ )}
+
+
+
+ {/* Messages */}
+
+ {messagesQuery.isLoading && (
+
+ {[1, 2, 3].map((i) => (
+
+ ))}
+
+ )}
+ {!messagesQuery.isLoading && messagesQuery.data?.length === 0 && (
+
+
+
Aucun message pour l'instant. Soyez le premier à écrire !
+
+ )}
+ {messagesQuery.data?.map((msg: Message) => {
+ const isMe = msg.auteurId === user?.id;
+ return (
+
+
+ {!isMe && (
+
{msg.auteurNom}
+ )}
+
+ {msg.contenu}
+
+
+ {new Date(msg.createdAt).toLocaleString("fr-FR", { hour: "2-digit", minute: "2-digit", day: "2-digit", month: "short" })}
+
+
+
+ );
+ })}
+
+
+
+ {/* Zone de saisie */}
+
+
+
+ >
+ )}
+