coco/ixion
coco
/
ixion
mirror of https://github.com/cocosolos/ixion.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Hide URL input field when loss of focus

This commit is contained in:
Corey 2024-05-23 22:50:18 -04:00
parent 1bbd4569a8
commit ae4a3d9954
Signed by: coco
GPG Key ID: 051138DA6AEE3E60
1 changed files with 33 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
client/src/components/Header/AddServer.tsx
View File

@ -59,11 +59,12 @@ export default function AddServer({ servers, setServers }: AddServerProps) {
setShowAddServer((prev) => !prev);
};
const handleSubmit = async (event: React.KeyboardEvent<HTMLFormElement>) => {
const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
event.preventDefault();
if (inputRef.current) {
const inputText = inputRef.current.value;
setIsLoading(true);
try {
const response = await postData(inputText);
if (response.success) {
showAlert({
@ -74,18 +75,26 @@ export default function AddServer({ servers, setServers }: AddServerProps) {
navigate(`/server/${encodeURIComponent(response.data.url)}`);
setServers([response.data, ...servers]);
}
if (inputRef.current) {
inputRef.current.value = '';
toggleShowAddServer();
}
inputRef.current.value = '';
} else {
showAlert({
message: response.message || 'Failed to send data to backend.',
severity: 'error',
});
setTimeout(() => {
inputRef.current?.focus();
}, 0);
}
} catch (error) {
showAlert({
message: 'An error occurred during submission.',
severity: 'error',
});
} finally {
setIsLoading(false);
}
}
};
const handleKeyUp = async (event: React.KeyboardEvent<HTMLInputElement>) => {
@ -93,7 +102,7 @@ export default function AddServer({ servers, setServers }: AddServerProps) {
case 'Escape': {
if (inputRef.current) {
if (inputRef.current.value === '') {
toggleShowAddServer();
inputRef.current.blur();
} else {
inputRef.current.value = '';
}
@ -104,6 +113,12 @@ export default function AddServer({ servers, setServers }: AddServerProps) {
}
};
const handleBlur = () => {
if (!isLoading && inputRef.current && inputRef.current.value === '') {
toggleShowAddServer();
}
};
return (
<>
<Box ref={containerRef} className="overflow-hidden pl-4">
@ -123,6 +138,7 @@ export default function AddServer({ servers, setServers }: AddServerProps) {
'aria-label': 'add-server',
}}
onKeyUp={handleKeyUp}
onBlur={handleBlur}
disabled={isLoading}
endAdornment={
isLoading && (