cyberpresidentvanellope/VOREStation
1
0
Fork 0
mirror of https://github.com/VOREStation/VOREStation.git synced 2026-07-22 04:28:33 +01:00
Code Issues Packages Projects Releases Wiki Activity

Improve ticket chat (#19192)

Browse Source 
* Improve ticket chat

* .
This commit is contained in:
Kashargul
2026-02-17 15:47:44 +01:00
committed by GitHub
parent 8bd1383b12
commit f177a342d7
3 changed files with 36 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tgui/packages/tgui/interfaces/Ticket.tsx
+10 -13
View File
@@ -60,6 +60,7 @@ export const Ticket = (props) => {
const [ticketChat, setTicketChat] = useState('');
const messagesEndRef: RefObject<HTMLDivElement | null> = useRef(null);
const inputRef: RefObject<HTMLInputElement | null> = useRef(null);
const {
id,
@@ -78,20 +79,14 @@ export const Ticket = (props) => {
useEffect(() => {
const scroll = messagesEndRef.current;
if (scroll) {
scroll.scrollTop = scroll.scrollHeight;
}
}, []);
if (!scroll) return;
useEffect(() => {
const scroll = messagesEndRef.current;
if (scroll) {
const height = scroll.scrollHeight;
const bottom = scroll.scrollTop + scroll.offsetHeight;
const scrollTracking = Math.abs(height - bottom) < 24;
if (scrollTracking) {
scroll.scrollTop = scroll.scrollHeight;
}
const isAtBottom =
Math.abs(scroll.scrollHeight - scroll.scrollTop - scroll.offsetHeight) <
24;
if (isAtBottom) {
scroll.scrollTop = scroll.scrollHeight;
}
}, [log]);
@@ -203,6 +198,7 @@ export const Ticket = (props) => {
ticket_ref: ticket_ref,
});
setTicketChat('');
requestAnimationFrame(() => inputRef.current?.focus());
}
}}
/>
@@ -215,6 +211,7 @@ export const Ticket = (props) => {
ticket_ref: ticket_ref,
});
setTicketChat('');
requestAnimationFrame(() => inputRef.current?.focus());
}}
>
Send
tgui/packages/tgui/interfaces/TicketChat.tsx
+11 -13
View File
@@ -47,24 +47,19 @@ export const TicketChat = (props) => {
const { id, level, handler, log } = data;
const messagesEndRef: RefObject<HTMLDivElement | null> = useRef(null);
const inputRef: RefObject<HTMLInputElement | null> = useRef(null);
useEffect(() => {
const scroll = messagesEndRef.current;
if (scroll) {
if (!scroll) return;
const isAtBottom =
Math.abs(scroll.scrollHeight - scroll.scrollTop - scroll.offsetHeight) <
24;
if (isAtBottom) {
scroll.scrollTop = scroll.scrollHeight;
}
}, []);
useEffect(() => {
const scroll = messagesEndRef.current;
if (scroll) {
const height = scroll.scrollHeight;
const bottom = scroll.scrollTop + scroll.offsetHeight;
const scrollTracking = Math.abs(height - bottom) < 24;
if (scrollTracking) {
scroll.scrollTop = scroll.scrollHeight;
}
}
}, [log]);
return (
@@ -114,6 +109,7 @@ export const TicketChat = (props) => {
autoFocus
autoSelect
fluid
ref={inputRef}
placeholder="Enter a message..."
value={ticketChat}
onChange={(value: string) => setTicketChat(value)}
@@ -121,6 +117,7 @@ export const TicketChat = (props) => {
if (KEY.Enter === e.key) {
act('send_msg', { msg: ticketChat });
setTicketChat('');
requestAnimationFrame(() => inputRef.current?.focus());
}
}}
/>
@@ -130,6 +127,7 @@ export const TicketChat = (props) => {
onClick={() => {
act('send_msg', { msg: ticketChat });
setTicketChat('');
requestAnimationFrame(() => inputRef.current?.focus());
}}
>
Send
tgui/packages/tgui/interfaces/TicketsPanel.tsx
+15 -13
View File
@@ -108,24 +108,19 @@ export const TicketsPanel = (props) => {
const [ticketChat, setTicketChat] = useState('');
const messagesEndRef: RefObject<HTMLDivElement | null> = useRef(null);
const inputRef: RefObject<HTMLInputElement | null> = useRef(null);
useEffect(() => {
const scroll = messagesEndRef.current;
if (scroll) {
if (!scroll) return;
const isAtBottom =
Math.abs(scroll.scrollHeight - scroll.scrollTop - scroll.offsetHeight) <
24;
if (isAtBottom) {
scroll.scrollTop = scroll.scrollHeight;
}
}, []);
useEffect(() => {
const scroll = messagesEndRef.current;
if (scroll) {
const height = scroll.scrollHeight;
const bottom = scroll.scrollTop + scroll.offsetHeight;
const scrollTracking = Math.abs(height - bottom) < 24;
if (scrollTracking) {
scroll.scrollTop = scroll.scrollHeight;
}
}
}, [selected_ticket?.log]);
const availableLevel = is_admin ? AdminLevel : MentorLevel;
@@ -359,6 +354,7 @@ export const TicketsPanel = (props) => {
autoFocus
autoSelect
fluid
ref={inputRef}
placeholder="Enter a message..."
value={ticketChat}
onChange={(value: string) => setTicketChat(value)}
@@ -366,6 +362,9 @@ export const TicketsPanel = (props) => {
if (KEY.Enter === e.key) {
act('send_msg', { msg: ticketChat });
setTicketChat('');
requestAnimationFrame(() =>
inputRef.current?.focus(),
);
}
}}
/>
@@ -375,6 +374,9 @@ export const TicketsPanel = (props) => {
onClick={() => {
act('send_msg', { msg: ticketChat });
setTicketChat('');
requestAnimationFrame(() =>
inputRef.current?.focus(),
);
}}
>
Send