Fix last errors

front/src/components/TwoFaActivationInput.tsx

@@ -30,18 +30,19 @@ export const TwoFACode: React.FC<TwoFACodeProps> = ({ setShowInvalidate }) => {
   });
 
   const handleCodeChange = (e: any) => {
+    console.log('[TwoFAActivationInput] - On change');
     setCode(e.target.value);
   };
 
   const handleSubmit = (event: any) => {
+    console.log('[TwoFAActivationInput] - Submitting');
     event.preventDefault();
   };
 
   return (
-    <form onSubmit={handleSubmit} className="flex flex-col items-center">
+    <form onSubmit={() => mutation.mutate(code)} className="flex flex-col items-center">
       <input
         className="rounded-md border border-dark-3 bg-white-3 p-1 invalid:border-red focus:border-blue focus:outline-none"
-        type="test"
         name="2FAcode"
         onChange={handleCodeChange}
       />

front/src/components/chat/DmCreate.tsx

@@ -15,36 +15,40 @@ interface DmChannelProps {
 
 const DmCreate = ({ setShowModal, socket, users, setCurrentChannel }: DmChannelProps) => {
   const [searchUser, setSearchUser] = useState<string>('');
-  const [userSelected, setUserSelected] = useState<HTMLButtonElement | null>(null);
-  const [userName, setUserName] = useState<string>('');
+  const [userButtonSelected, setUserButtonSelected] = useState<HTMLButtonElement | null>(null);
+  const [selectedLogin, setSelectedLogin] = useState<string>('');
 
   useEffect(() => {
     socket.on('dm', (data) => {
       setCurrentChannel(data.channel);
     });
   }, []);
 
+  const useSetLogin = (displayName: string): void => {
+    const selectedUser = users?.find((user) => user.displayName == displayName);
+    setSelectedLogin(selectedUser?.login || '');
+    return;
+  };
+
   const selectUser = (e: React.MouseEvent<HTMLButtonElement>) => {
-    setUserName(e.currentTarget.firstChild?.textContent || '');
-    if (e.currentTarget !== userSelected) {
-      if (userSelected) {
-        userSelected.style.backgroundColor = '#FFFFFF';
-        userSelected.style.color = '#000000';
+    useSetLogin(e.currentTarget.firstChild?.textContent || '');
+    if (e.currentTarget !== userButtonSelected) {
+      if (userButtonSelected) {
+        userButtonSelected.style.backgroundColor = '#FFFFFF';
+        userButtonSelected.style.color = '#000000';
       }
       e.currentTarget.style.backgroundColor = '#37626D';
       e.currentTarget.style.color = '#FFFFFF';
-      setUserSelected(e.currentTarget);
+      setUserButtonSelected(e.currentTarget);
     }
   };
 
   const handleDirectMessage = () => {
-    //Need to be replace by socker.emit('createDM', {login: username})
     const message = document.querySelector<HTMLButtonElement>('#firstMessage')?.value;
-    socket.emit('dm', { login: userName, content: message });
+    socket.emit('dm', { login: selectedLogin, content: message });
     socket.on('dm', (data) => {
       setCurrentChannel(data.channel);
     });
-    // TODO send notification if error
     setShowModal(false);
   };