Marbes/Luncher
5
2
Fork 0
Code Issues 6 Pull Requests Packages Projects Releases Wiki Activity

Podpora příhlášení pomocí Enter

Browse Source
This commit is contained in:
Martin Berka 2023-06-02 20:27:52 +02:00
parent 16bb467bcd
commit 1a02587b83
1 changed files with 16 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
client/src/Login.tsx
View File

@ -1,4 +1,4 @@
import React, { useRef } from 'react'; import React, { useCallback, useRef } from 'react';
import { Button } from 'react-bootstrap'; import { Button } from 'react-bootstrap';
import { useAuth } from './context/auth'; import { useAuth } from './context/auth';
import './Login.css'; import './Login.css';
@ -10,20 +10,26 @@ export default function Login() {
const auth = useAuth(); const auth = useAuth();
const loginRef = useRef<HTMLInputElement>(null); const loginRef = useRef<HTMLInputElement>(null);
const doLogin = useCallback(() => {
// Netuším proč mě TypeScript seřve když se to pokusím zchainovat dohromady
if (loginRef?.current?.value && loginRef?.current?.value.length > 0) {
auth?.setLogin(loginRef.current.value);
}
}, []);
if (!auth || !auth.login) { if (!auth || !auth.login) {
return <div className='login'> return <div className='login'>
<div className='login-inner'> <div className='login-inner'>
<p style={{ fontSize: "12px", marginTop: "10px" }}>Zobrazované jméno by mělo být ideálně vaše jméno a příjmení, nebo přezdívka, pod kterou vás kolegové dokážou snadno identifikovat. Jméno lze kdykoliv upravit/smazat v local storage prohlížeče.<br />PS: Enter nefunguje</p> <p style={{ fontSize: "12px", marginTop: "10px" }}>
Zobrazované jméno: <input style={{ marginTop: "10px" }} ref={loginRef} type='text' /> Zobrazované jméno by mělo být vaše jméno nebo přezdívka, pod kterou vás kolegové dokážou snadno identifikovat.
<Button onClick={() => { </p>
// Netuším proč mě TypeScript seřve když se to pokusím zchainovat dohromady Zobrazované jméno: <input style={{ marginTop: "10px" }} ref={loginRef} type='text' onKeyDown={event => {
if (loginRef?.current?.value && loginRef?.current?.value.length > 0) { if (event.key === 'Enter') {
auth?.setLogin(loginRef.current.value); doLogin()
} }
}} style={{ marginTop: "20px" }}>Uložit</Button> }} />
<Button onClick={doLogin} style={{ marginTop: "20px" }}>Uložit</Button>
</div> </div>
</div> </div>
} }
// TODO nějaký loader
return <div>TODO</div>;
} }