refactor(livechat): fix some lint warnings

tassoevan · tassoevan · commit 708d73562c07 · 2026-05-04T15:56:59.000-03:00
diff --git a/packages/livechat/src/components/Form/HookFormExample/stories.tsx b/packages/livechat/src/components/Form/HookFormExample/stories.tsx
@@ -1,36 +1,36 @@
 import { action } from '@storybook/addon-actions';
 import type { Meta, StoryFn } from '@storybook/preact';
 import type { ComponentProps } from 'preact';
-import type { JSXInternal } from 'preact/src/jsx';
 import { Controller, useForm } from 'react-hook-form';
 
 import { Form, PasswordInput, SelectInput, TextInput, FormField } from '..';
 import { Button } from '../../Button';
 import { ButtonGroup } from '../../ButtonGroup';
 
+type FormData = {
+	text: string;
+	password: string;
+	options: string;
+};
+
 export default {
 	title: 'Forms/HookFormExample',
 	component: Form,
-	args: {
-		onSubmit: (event) => {
-			action('submit')(event);
-		},
-	},
 	parameters: {
 		layout: 'centered',
 	},
 } satisfies Meta<ComponentProps<typeof Form>>;
 
-export const Default: StoryFn<ComponentProps<typeof Form>> = (args) => {
+export const Default: StoryFn<ComponentProps<typeof Form>> = () => {
 	const {
 		handleSubmit,
 		formState: { errors },
 		control,
 		reset,
-	} = useForm();
+	} = useForm<FormData>();
 
 	return (
-		<Form onSubmit={handleSubmit(args.onSubmit as any) as unknown as JSXInternal.GenericEventHandler<HTMLFormElement>}>
+		<Form onSubmit={handleSubmit(action('submit'))}>
 			<FormField label='Text' description='Input field for plain text' error={errors?.text?.message?.toString()}>
 				<Controller name='text' control={control} rules={{ required: true }} render={({ field }) => <TextInput {...field} />} />
 			</FormField>
diff --git a/packages/livechat/src/definitions/triggerMessage.d.ts b/packages/livechat/src/definitions/triggerMessage.d.ts
@@ -4,7 +4,7 @@ export type TriggerMessage = {
 	msg?: string;
 	token: string;
 	u: Serialized<IOmnichannelAgent>;
-	ts: string;
+	ts: number;
 	_id: string;
 	trigger: boolean;
 };
diff --git a/packages/livechat/src/helpers/canRenderMessage.ts b/packages/livechat/src/helpers/canRenderMessage.ts
@@ -31,7 +31,9 @@ export const getHiddenSystemMessages = () => {
 	return [...configHiddenSystemMessages, ...localHiddenSystemMessages] as string[];
 };
 
-export const canRenderMessage = ({ t }: { t: string }) => {
+export const canRenderMessage = ({ t }: { t?: string }) => {
+	if (!t) return true;
+
 	const hiddenSystemMessages = getHiddenSystemMessages();
 
 	return !msgTypesNotRendered.includes(t) && !hiddenSystemMessages.includes(t);
diff --git a/packages/livechat/src/lib/triggerActions.ts b/packages/livechat/src/lib/triggerActions.ts
@@ -17,7 +17,7 @@ export const sendMessageAction = async (_: string, action: ILivechatSendMessageA
 		msg: action.params?.msg,
 		token,
 		u: agent,
-		ts: new Date().toISOString(),
+		ts: new Date().getTime(),
 		_id: createToken(),
 		trigger: true,
 	};
@@ -32,7 +32,7 @@ export const sendMessageAction = async (_: string, action: ILivechatSendMessageA
 	}
 
 	if (agent && '_id' in agent) {
-		await store.setState({ agent });
+		store.setState({ agent });
 		parentCall('callback', 'assign-agent', normalizeAgent(agent));
 	}
 
@@ -80,7 +80,7 @@ export const sendMessageExternalServiceAction = async (
 				msg,
 				token,
 				u: agent,
-				ts: new Date().toISOString(),
+				ts: new Date().getTime(),
 				_id: createToken(),
 				trigger: true,
 			}));
@@ -98,7 +98,7 @@ export const sendMessageExternalServiceAction = async (
 		);
 
 		if (agent && '_id' in agent) {
-			await store.setState({ agent });
+			store.setState({ agent });
 			parentCall('callback', 'assign-agent', normalizeAgent(agent));
 		}
 
diff --git a/packages/livechat/src/lib/triggerUtils.ts b/packages/livechat/src/lib/triggerUtils.ts
@@ -1,10 +1,10 @@
 import type { ILivechatAgent, ILivechatTrigger, ILivechatTriggerAction, ILivechatTriggerType, Serialized } from '@rocket.chat/core-typings';
 
 import { Livechat } from '../api';
+import { processUnread } from './main';
 import type { Agent } from '../definitions/agents';
 import { upsert } from '../helpers/upsert';
 import store from '../store';
-import { processUnread } from './main';
 
 type AgentPromise = { username: string } | Serialized<ILivechatAgent> | null;
 
@@ -27,14 +27,11 @@ const getNextAgentFromQueue = async () => {
 	const dep = department || defaultDepartment;
 
 	let agent = null;
-	try {
-		const tempAgent = await Livechat.nextAgent({ department: dep });
 
-		if (isAgentWithInfo(tempAgent?.agent)) {
-			agent = tempAgent.agent;
-		}
-	} catch (error) {
-		return Promise.reject(error);
+	const tempAgent = await Livechat.nextAgent({ department: dep });
+
+	if (isAgentWithInfo(tempAgent?.agent)) {
+		agent = tempAgent.agent;
 	}
 
 	store.setState({ defaultAgent: { ...agent, department: dep, ts: Date.now() } as Agent });
@@ -47,23 +44,20 @@ export const getAgent = async (triggerAction: ILivechatTriggerAction): Promise<A
 		return agentPromise;
 	}
 
-	agentPromise = new Promise(async (resolve, reject) => {
+	agentPromise = new Promise((resolve, reject) => {
 		const { sender, name = '' } = triggerAction.params || {};
 
 		if (sender === 'custom') {
 			resolve({ username: name });
 		}
 
 		if (sender === 'queue') {
-			try {
-				const agent = await getNextAgentFromQueue();
-				resolve(agent);
-			} catch (_) {
-				resolve({ username: 'rocket.cat' });
-			}
+			getNextAgentFromQueue()
+				.then((agent) => resolve(agent))
+				.catch(() => resolve({ username: 'rocket.cat' }));
 		}
 
-		return reject('Unknown sender type.');
+		return reject(new Error('Unknown sender type'));
 	});
 
 	// expire the promise cache as well
@@ -74,8 +68,8 @@ export const getAgent = async (triggerAction: ILivechatTriggerAction): Promise<A
 	return agentPromise;
 };
 
-export const upsertMessage = async (message: Record<string, unknown>) => {
-	await store.setState({
+export const upsertMessage = async (message: { _id: string; msg?: string; t?: string; ts: number }) => {
+	store.setState({
 		messages: upsert(
 			store.state.messages,
 			message,
@@ -89,12 +83,12 @@ export const upsertMessage = async (message: Record<string, unknown>) => {
 
 export const removeMessage = async (messageId: string) => {
 	const { messages } = store.state;
-	await store.setState({ messages: messages.filter(({ _id }) => _id !== messageId) });
+	store.setState({ messages: messages.filter(({ _id }) => _id !== messageId) });
 };
 
 export const removeTriggerMessage = async (messageId: string) => {
 	const { renderedTriggers } = store.state;
-	await store.setState({ renderedTriggers: renderedTriggers.filter(({ _id }) => _id !== messageId) });
+	store.setState({ renderedTriggers: renderedTriggers.filter(({ _id }) => _id !== messageId) });
 };
 
 export const hasTriggerCondition = (conditionName: ILivechatTriggerType) => (trigger: ILivechatTrigger) => {
@@ -122,9 +116,9 @@ export const requestTriggerMessages = async ({
 
 		const { response } = await Livechat.rest.post(`/v1/livechat/triggers/${triggerId}/external-service/call`, { extraData, token });
 		return response.contents;
-	} catch (_) {
+	} catch (error) {
 		if (!fallbackMessage) {
-			throw Error('Unable to fetch message from external service.');
+			throw Error('Unable to fetch message from external service.', { cause: error });
 		}
 
 		return [{ msg: fallbackMessage, order: 0 }];
diff --git a/packages/livechat/src/routes/Chat/connector.tsx b/packages/livechat/src/routes/Chat/connector.tsx
@@ -1,5 +1,5 @@
 import type { TFunction } from 'i18next';
-import type { FunctionalComponent } from 'preact';
+import type { Ref } from 'preact';
 import { useContext } from 'preact/hooks';
 import { withTranslation } from 'react-i18next';
 
@@ -9,7 +9,7 @@ import { canRenderMessage } from '../../helpers/canRenderMessage';
 import { formatAgent } from '../../helpers/formatAgent';
 import { StoreContext } from '../../store';
 
-export const ChatConnector: FunctionalComponent<{ path: string; default: boolean; t: TFunction }> = ({ ref, t }) => {
+export const ChatConnector = ({ ref, t }: { path: string; default: boolean; t: TFunction; ref?: Ref<any> }) => {
 	const { theme } = useContext(ScreenContext);
 	const {
 		config: {
diff --git a/packages/livechat/src/routes/LeaveMessage/index.tsx b/packages/livechat/src/routes/LeaveMessage/index.tsx
@@ -1,7 +1,5 @@
 import type { FunctionalComponent } from 'preact';
 import { useContext, useRef } from 'preact/hooks';
-import type { JSXInternal } from 'preact/src/jsx';
-import type { FieldValues, SubmitHandler } from 'react-hook-form';
 import { Controller, useForm } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 
@@ -44,7 +42,7 @@ const LeaveMessage: FunctionalComponent<{ path: string }> = () => {
 		handleSubmit,
 		formState: { errors, isDirty, isValid, isSubmitting },
 		control,
-	} = useForm({ mode: 'onChange' });
+	} = useForm<FormValues>({ mode: 'onChange' });
 
 	const customOfflineTitle = iframe?.theme?.offlineTitle;
 
@@ -58,7 +56,7 @@ const LeaveMessage: FunctionalComponent<{ path: string }> = () => {
 			message,
 		};
 
-		await dispatch({ loading: true });
+		dispatch({ loading: true });
 
 		try {
 			// TODO: Remove intersection after ts refactor of parseOfflineMessage
@@ -73,10 +71,10 @@ const LeaveMessage: FunctionalComponent<{ path: string }> = () => {
 			const errorMessage = (error as { error: string })?.error;
 			console.error(errorMessage);
 			const alert = { id: createToken(), children: errorMessage, error: true, timeout: 5000 };
-			await dispatch({ alerts: (alerts.push(alert), alerts) });
+			dispatch({ alerts: (alerts.push(alert), alerts) });
 			return false;
 		} finally {
-			await dispatch({ loading: false });
+			dispatch({ loading: false });
 		}
 	};
 
@@ -97,7 +95,7 @@ const LeaveMessage: FunctionalComponent<{ path: string }> = () => {
 
 						<Form
 							// The price of using react-hook-form on a preact project ¯\_(ツ)_/¯
-							onSubmit={handleSubmit(onSubmit as SubmitHandler<FieldValues>) as unknown as JSXInternal.GenericEventHandler<HTMLFormElement>}
+							onSubmit={handleSubmit(onSubmit)}
 							id='leaveMessage'
 						>
 							<FormField required label={t('name')} error={errors.name?.message?.toString()}>
diff --git a/packages/livechat/src/routes/Register/index.tsx b/packages/livechat/src/routes/Register/index.tsx
@@ -1,8 +1,6 @@
 import type { FunctionalComponent } from 'preact';
 import { useContext, useEffect, useMemo, useRef } from 'preact/hooks';
-import type { JSXInternal } from 'preact/src/jsx';
 import { route } from 'preact-router';
-import type { FieldValues, SubmitHandler } from 'react-hook-form';
 import { Controller, useForm } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 
@@ -21,9 +19,6 @@ import Triggers from '../../lib/triggers';
 import { StoreContext } from '../../store';
 import type { StoreState } from '../../store';
 
-// Custom field as in the form payload
-type FormPayloadCustomField = { [key: string]: string };
-
 export type RegisterFormValues = { name: string; email: string; department?: string; [key: string]: any };
 
 export const Register: FunctionalComponent<{ path: string }> = () => {
@@ -71,17 +66,7 @@ export const Register: FunctionalComponent<{ path: string }> = () => {
 		});
 	};
 
-	const onSubmit = async ({
-		name,
-		email,
-		department,
-		...customFields
-	}: {
-		name: string;
-		email: string;
-		department?: string;
-		customFields: FormPayloadCustomField;
-	}) => {
+	const onSubmit = async ({ name, email, department, ...customFields }: RegisterFormValues) => {
 		const guestDepartment = department || defaultDepartment;
 		const fields = {
 			name,
@@ -93,7 +78,7 @@ export const Register: FunctionalComponent<{ path: string }> = () => {
 
 		try {
 			const { visitor: user } = await Livechat.grantVisitor({ visitor: { ...fields, token } });
-			await dispatch({
+			dispatch({
 				user,
 				...(user.contactManager && { agent: user.contactManager }),
 			} as Omit<StoreState['user'], 'ts'>);
@@ -130,7 +115,7 @@ export const Register: FunctionalComponent<{ path: string }> = () => {
 					<Form
 						id='register'
 						// The price of using react-hook-form on a preact project ¯\_(ツ)_/¯
-						onSubmit={handleSubmit(onSubmit as SubmitHandler<FieldValues>) as unknown as JSXInternal.GenericEventHandler<HTMLFormElement>}
+						onSubmit={handleSubmit(onSubmit)}
 					>
 						<div id='top' ref={topRef} style={{ height: '1px', width: '100%' }} />
 						<p className={createClassName(styles, 'register__message')}>{message || defaultMessage}</p>
diff --git a/packages/livechat/src/routes/SwitchDepartment/index.tsx b/packages/livechat/src/routes/SwitchDepartment/index.tsx
@@ -63,25 +63,25 @@ const SwitchDepartment = (_: SwitchDepartmentProps) => {
 
 		if (!room) {
 			const { visitor: user } = await Livechat.grantVisitor({ visitor: { department, token } });
-			await dispatch({
+			dispatch({
 				user: user as StoreState['user'],
 				alerts: (alerts.push({ id: createToken(), children: t('department_switched'), success: true }), alerts),
 			});
 			route('/');
 			return;
 		}
 
-		await dispatch({ loading: true });
+		dispatch({ loading: true });
 		try {
 			const { _id: rid } = room;
 			const result = await Livechat.transferChat({ rid, department });
 			const { success } = result;
 
 			if (!success) {
-				throw t('no_available_agents_to_transfer');
+				throw new Error(t('no_available_agents_to_transfer'));
 			}
 
-			await dispatch({ iframe: { ...iframe, guest: { ...guest, department } }, loading: false } as Pick<StoreState, 'iframe' | 'loading'>);
+			dispatch({ iframe: { ...iframe, guest: { ...guest, department } }, loading: false } as Pick<StoreState, 'iframe' | 'loading'>);
 			await loadConfig();
 
 			await ModalManager.alert({
@@ -91,11 +91,11 @@ const SwitchDepartment = (_: SwitchDepartmentProps) => {
 			route('/');
 		} catch (error) {
 			console.error(error);
-			await dispatch({
+			dispatch({
 				alerts: (alerts.push({ id: createToken(), children: t('no_available_agents_to_transfer'), warning: true }), alerts),
 			});
 		} finally {
-			await dispatch({ loading: false });
+			dispatch({ loading: false });
 		}
 	};
 
diff --git a/packages/livechat/src/routes/TriggerMessage/container.tsx b/packages/livechat/src/routes/TriggerMessage/container.tsx
@@ -1,4 +1,4 @@
-import type { FunctionalComponent } from 'preact';
+import type { Ref } from 'preact';
 import { useContext, useEffect } from 'preact/hooks';
 import { route } from 'preact-router';
 
@@ -9,7 +9,7 @@ import { formatAgent } from '../../helpers/formatAgent';
 import { parentCall } from '../../lib/parentCall';
 import { StoreContext } from '../../store';
 
-export const TriggerMessageContainer: FunctionalComponent<{ path: string }> = ({ ref }) => {
+export const TriggerMessageContainer = ({ ref }: { path: string; ref?: Ref<any> }) => {
 	const { messages, agent, unread } = useContext(StoreContext);
 	const { theme, onRestore } = useContext(ScreenContext);
 
diff --git a/packages/livechat/src/store/index.tsx b/packages/livechat/src/store/index.tsx
@@ -61,7 +61,7 @@ export type StoreState = {
 		customFields?: CustomField[];
 		enabled?: boolean;
 	};
-	messages: any[];
+	messages: { _id: string; msg?: string; t?: string; ts: number }[];
 	user?: Serialized<ILivechatVisitor>;
 	guest?: Serialized<ILivechatVisitorDTO>;
 	sound: {
@@ -190,8 +190,9 @@ window.addEventListener('visibilitychange', () => {
 		return;
 	}
 
-	!store.state.minimized && !store.state.triggered && parentCall('openWidget');
-	store.state.iframe.visible ? parentCall('showWidget') : parentCall('hideWidget');
+	if (!store.state.minimized && !store.state.triggered) parentCall('openWidget');
+	if (store.state.iframe.visible) parentCall('showWidget');
+	else parentCall('hideWidget');
 });
 
 window.addEventListener('beforeunload', () => {
diff --git a/packages/livechat/src/widget.ts b/packages/livechat/src/widget.ts
