From 18342a0f44a55cc15943095063fc3a5500a7521b Mon Sep 17 00:00:00 2001 From: Jeremiah <42397676+jlsnow301@users.noreply.github.com> Date: Sun, 20 Apr 2025 04:41:52 -0700 Subject: [PATCH] [no gbp] Fixes tgui say input focus, again (#90608) --- code/datums/keybinding/communication.dm | 6 ++- tgui/packages/tgui-say/TguiSay.tsx | 55 +++++++++-------------- tgui/packages/tgui-say/constants.ts | 3 +- tgui/packages/tgui-say/helpers.ts | 3 -- tgui/packages/tgui-say/styles/main.scss | 6 --- tgui/packages/tgui-say/styles/styles.scss | 11 +++-- 6 files changed, 35 insertions(+), 49 deletions(-) diff --git a/code/datums/keybinding/communication.dm b/code/datums/keybinding/communication.dm index 92c8f3c4984..482363fdd1f 100644 --- a/code/datums/keybinding/communication.dm +++ b/code/datums/keybinding/communication.dm @@ -11,7 +11,8 @@ . = ..() if(.) return - winset(user, null, "command=[user.tgui_say_create_open_command(SAY_CHANNEL)]") + winset(user, null, "command=[user.tgui_say_create_open_command(SAY_CHANNEL)];") + winset(user, "tgui_say.browser", "focus=true") return TRUE /datum/keybinding/client/communication/radio @@ -26,6 +27,7 @@ if(.) return winset(user, null, "command=[user.tgui_say_create_open_command(RADIO_CHANNEL)]") + winset(user, "tgui_say.browser", "focus=true") return TRUE /datum/keybinding/client/communication/ooc @@ -39,6 +41,7 @@ if(.) return winset(user, null, "command=[user.tgui_say_create_open_command(OOC_CHANNEL)]") + winset(user, "tgui_say.browser", "focus=true") return TRUE /datum/keybinding/client/communication/me @@ -52,4 +55,5 @@ if(.) return winset(user, null, "command=[user.tgui_say_create_open_command(ME_CHANNEL)]") + winset(user, "tgui_say.browser", "focus=true") return TRUE diff --git a/tgui/packages/tgui-say/TguiSay.tsx b/tgui/packages/tgui-say/TguiSay.tsx index 24eea6e4be5..b4a2724d78f 100644 --- a/tgui/packages/tgui-say/TguiSay.tsx +++ b/tgui/packages/tgui-say/TguiSay.tsx @@ -1,13 +1,6 @@ import './styles/main.scss'; -import { - FormEvent, - KeyboardEvent, - MouseEvent, - useEffect, - useRef, - useState, -} from 'react'; +import { useEffect, useRef, useState } from 'react'; import { dragStartHandler } from 'tgui/drag'; import { isEscape, KEY } from 'tgui-core/keys'; import { BooleanLike, classes } from 'tgui-core/react'; @@ -28,13 +21,6 @@ type ByondProps = { scale: BooleanLike; }; -const ROWS: Record = { - Small: 1, - Medium: 2, - Large: 3, - Width: 1, // not used -} as const; - export function TguiSay() { const innerRef = useRef(null); const channelIterator = useRef(new ChannelIterator()); @@ -48,9 +34,9 @@ export function TguiSay() { const [currentPrefix, setCurrentPrefix] = useState< keyof typeof RADIO_PREFIXES | null >(null); - const [size, setSize] = useState(WindowSize.Small); - const [maxLength, setMaxLength] = useState(1024); const [lightMode, setLightMode] = useState(false); + const [maxLength, setMaxLength] = useState(1024); + const [size, setSize] = useState(WindowSize.Small); const [value, setValue] = useState(''); const position = useRef([window.screenX, window.screenY]); @@ -100,7 +86,7 @@ export function TguiSay() { } } - function handleButtonClick(event: MouseEvent): void { + function handleButtonClick(event: React.MouseEvent): void { isDragging.current = true; setTimeout(() => { @@ -172,7 +158,7 @@ export function TguiSay() { messages.current.channelIncrementMsg(iterator.isVisible()); } - function handleInput(event: FormEvent): void { + function handleInput(event: React.FormEvent): void { const iterator = channelIterator.current; let newValue = event.currentTarget.value; @@ -197,7 +183,9 @@ export function TguiSay() { setValue(newValue); } - function handleKeyDown(event: KeyboardEvent): void { + function handleKeyDown( + event: React.KeyboardEvent, + ): void { if (event.getModifierState('AltGraph')) return; switch (event.key) { @@ -230,20 +218,14 @@ export function TguiSay() { } function handleOpen(data: ByondOpen): void { - const { channel } = data; - const iterator = channelIterator.current; - // Catches the case where the modal is already open - if (iterator.isSay()) { - iterator.set(channel); - } + channelIterator.current.set(data.channel); - setButtonContent(iterator.current()); - windowOpen(iterator.current(), scale.current); + setCurrentPrefix(null); + setButtonContent(channelIterator.current.current()); - const input = innerRef.current; - setTimeout(() => { - input?.focus(); - }, 1); + windowOpen(channelIterator.current.current(), scale.current); + + innerRef.current?.focus(); } function handleProps(data: ByondProps): void { @@ -279,8 +261,8 @@ export function TguiSay() { } if (size !== newSize) { - setSize(newSize); windowSet(newSize, scale.current); + setSize(newSize); } }, [value]); @@ -313,13 +295,16 @@ export function TguiSay() {