diff --git a/apps/meteor/client/components/FilterByText.tsx b/apps/meteor/client/components/FilterByText.tsx
index 1aeeb29a0a57..5c5a3d599e2f 100644
--- a/apps/meteor/client/components/FilterByText.tsx
+++ b/apps/meteor/client/components/FilterByText.tsx
@@ -1,26 +1,13 @@
-import { Box, Icon, TextInput, Button, Margins } from '@rocket.chat/fuselage';
+import { Box, Icon, TextInput, Margins } from '@rocket.chat/fuselage';
 import { useAutoFocus, useMergedRefs } from '@rocket.chat/fuselage-hooks';
 import { useTranslation } from '@rocket.chat/ui-contexts';
-import type { ReactNode, ChangeEvent, FormEvent } from 'react';
-import React, { forwardRef, memo, useCallback, useEffect, useState } from 'react';
+import type { ChangeEvent, FormEvent, HTMLAttributes } from 'react';
+import React, { forwardRef, memo, useCallback, useState } from 'react';
 
-type FilterByTextCommonProps = {
-	children?: ReactNode | undefined;
-	placeholder?: string;
-	onChange: (filter: { text: string }) => void;
+type FilterByTextProps = {
+	onChange: (filter: string) => void;
 	shouldAutoFocus?: boolean;
-};
-
-type FilterByTextPropsWithButton = FilterByTextCommonProps & {
-	displayButton: true;
-	textButton: string;
-	onButtonClick: () => void;
-};
-
-type FilterByTextProps = FilterByTextCommonProps | FilterByTextPropsWithButton;
-
-const isFilterByTextPropsWithButton = (props: any): props is FilterByTextPropsWithButton =>
-	'displayButton' in props && props.displayButton === true;
+} & Omit<HTMLAttributes<HTMLInputElement>, 'is' | 'onChange'>;
 
 const FilterByText = forwardRef<HTMLInputElement, FilterByTextProps>(function FilterByText(
 	{ placeholder, onChange: setFilter, shouldAutoFocus = false, children, ...props },
@@ -31,13 +18,10 @@ const FilterByText = forwardRef<HTMLInputElement, FilterByTextProps>(function Fi
 	const autoFocusRef = useAutoFocus(shouldAutoFocus);
 	const mergedRefs = useMergedRefs(ref, autoFocusRef);
 
-	const handleInputChange = useCallback((event: ChangeEvent<HTMLInputElement>) => {
+	const handleInputChange = (event: ChangeEvent<HTMLInputElement>) => {
 		setText(event.currentTarget.value);
-	}, []);
-
-	useEffect(() => {
-		setFilter({ text });
-	}, [setFilter, text]);
+		setFilter(event.currentTarget.value);
+	};
 
 	const handleFormSubmit = useCallback((event: FormEvent<HTMLFormElement>) => {
 		event.preventDefault();
@@ -47,6 +31,7 @@ const FilterByText = forwardRef<HTMLInputElement, FilterByTextProps>(function Fi
 		<Box mb={16} mi='neg-x4' is='form' onSubmit={handleFormSubmit} display='flex' flexWrap='wrap' alignItems='center'>
 			<Box mi={4} display='flex' flexGrow={1}>
 				<TextInput
+					{...props}
 					placeholder={placeholder ?? t('Search')}
 					ref={mergedRefs}
 					addon={<Icon name='magnifier' size='x20' />}
@@ -57,13 +42,7 @@ const FilterByText = forwardRef<HTMLInputElement, FilterByTextProps>(function Fi
 					aria-label={placeholder ?? t('Search')}
 				/>
 			</Box>
-			{isFilterByTextPropsWithButton(props) ? (
-				<Button onClick={props.onButtonClick} mis={8} primary>
-					{props.textButton}
-				</Button>
-			) : (
-				children && <Margins all='x4'>{children}</Margins>
-			)}
+			{children && <Margins inline={4}>{children}</Margins>}
 		</Box>
 	);
 });
diff --git a/apps/meteor/client/omnichannel/businessHours/BusinessHoursTable.tsx b/apps/meteor/client/omnichannel/businessHours/BusinessHoursTable.tsx
index 6fddd95859d8..b4220e420a9a 100644
--- a/apps/meteor/client/omnichannel/businessHours/BusinessHoursTable.tsx
+++ b/apps/meteor/client/omnichannel/businessHours/BusinessHoursTable.tsx
@@ -47,7 +47,7 @@ const BusinessHoursTable = () => {
 
 	return (
 		<>
-			<FilterByText onChange={({ text }) => setText(text)} />
+			<FilterByText onChange={setText} />
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/omnichannel/monitors/MonitorsTable.tsx b/apps/meteor/client/omnichannel/monitors/MonitorsTable.tsx
index a67057b9add1..62adc2a0405f 100644
--- a/apps/meteor/client/omnichannel/monitors/MonitorsTable.tsx
+++ b/apps/meteor/client/omnichannel/monitors/MonitorsTable.tsx
@@ -144,7 +144,7 @@ const MonitorsTable = () => {
 					</FieldRow>
 				</Field>
 			</Box>
-			{((isSuccess && data?.monitors.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }): void => setText(text)} />}
+			{((isSuccess && data?.monitors.length > 0) || queryHasChanged) && <FilterByText onChange={setText} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/omnichannel/slaPolicies/SlaTable.tsx b/apps/meteor/client/omnichannel/slaPolicies/SlaTable.tsx
index d550118a5017..01b4bfe90374 100644
--- a/apps/meteor/client/omnichannel/slaPolicies/SlaTable.tsx
+++ b/apps/meteor/client/omnichannel/slaPolicies/SlaTable.tsx
@@ -84,7 +84,7 @@ const SlaTable = ({ reload }: { reload: MutableRefObject<() => void> }) => {
 
 	return (
 		<>
-			{((isSuccess && data?.sla.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }): void => setFilter(text)} />}
+			{((isSuccess && data?.sla.length > 0) || queryHasChanged) && <FilterByText onChange={setFilter} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/omnichannel/tags/TagsTable.tsx b/apps/meteor/client/omnichannel/tags/TagsTable.tsx
index 3b9757134bed..a4b31cd4755c 100644
--- a/apps/meteor/client/omnichannel/tags/TagsTable.tsx
+++ b/apps/meteor/client/omnichannel/tags/TagsTable.tsx
@@ -70,7 +70,7 @@ const TagsTable = () => {
 
 	return (
 		<>
-			{((isSuccess && data?.tags.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }): void => setFilter(text)} />}
+			{((isSuccess && data?.tags.length > 0) || queryHasChanged) && <FilterByText onChange={setFilter} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/omnichannel/units/UnitsTable.tsx b/apps/meteor/client/omnichannel/units/UnitsTable.tsx
index fe95bc90d8a2..93734acb8de0 100644
--- a/apps/meteor/client/omnichannel/units/UnitsTable.tsx
+++ b/apps/meteor/client/omnichannel/units/UnitsTable.tsx
@@ -69,7 +69,7 @@ const UnitsTable = () => {
 
 	return (
 		<>
-			{((isSuccess && data?.units.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }): void => setFilter(text)} />}
+			{((isSuccess && data?.units.length > 0) || queryHasChanged) && <FilterByText onChange={setFilter} />}
 			{isLoading && (
 				<GenericTable aria-busy>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx b/apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
index abfa438d9ced..2bd795c3ccab 100644
--- a/apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
+++ b/apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
@@ -66,7 +66,7 @@ const CustomEmoji = ({ onClick, reload }: CustomEmojiProps) => {
 
 	return (
 		<>
-			<FilterByText onChange={({ text }): void => setText(text)} />
+			<FilterByText onChange={setText} />
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx b/apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx
index 58b1c4ea7b8a..5e8bd0c0fac9 100644
--- a/apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx
+++ b/apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx
@@ -64,7 +64,7 @@ const CustomSoundsTable = ({ reload, onClick }: CustomSoundsTableProps) => {
 
 	return (
 		<>
-			<FilterByText onChange={({ text }): void => setParams(text)} />
+			<FilterByText onChange={setParams} />
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx
index 59c4cdd74eb3..d18fc4a706a8 100644
--- a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx
+++ b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx
@@ -70,7 +70,7 @@ const CustomUserStatus = ({ reload, onClick }: CustomUserStatusProps): ReactElem
 
 	return (
 		<>
-			<FilterByText onChange={({ text }): void => setText(text)} />
+			<FilterByText onChange={setText} />
 			{data.length === 0 && <GenericNoResult />}
 			{data && data.length > 0 && (
 				<>
diff --git a/apps/meteor/client/views/admin/deviceManagement/DeviceManagementAdminTable/DeviceManagementAdminTable.tsx b/apps/meteor/client/views/admin/deviceManagement/DeviceManagementAdminTable/DeviceManagementAdminTable.tsx
index 026f1cb0de30..ebd1e762ff80 100644
--- a/apps/meteor/client/views/admin/deviceManagement/DeviceManagementAdminTable/DeviceManagementAdminTable.tsx
+++ b/apps/meteor/client/views/admin/deviceManagement/DeviceManagementAdminTable/DeviceManagementAdminTable.tsx
@@ -76,7 +76,7 @@ const DeviceManagementAdminTable = ({ reloadRef }: { reloadRef: MutableRefObject
 
 	return (
 		<>
-			<FilterByText placeholder={t('Search_Devices_Users')} onChange={({ text }): void => setText(text)} />
+			<FilterByText placeholder={t('Search_Devices_Users')} onChange={setText} />
 			<DeviceManagementTable
 				data={data}
 				phase={phase}
diff --git a/apps/meteor/client/views/admin/integrations/IntegrationsTable.tsx b/apps/meteor/client/views/admin/integrations/IntegrationsTable.tsx
index e2942f384c9d..2fd828f1507c 100644
--- a/apps/meteor/client/views/admin/integrations/IntegrationsTable.tsx
+++ b/apps/meteor/client/views/admin/integrations/IntegrationsTable.tsx
@@ -96,7 +96,7 @@ const IntegrationsTable = ({ type }: { type?: string }) => {
 
 	return (
 		<>
-			<FilterByText placeholder={t('Search_Integrations')} onChange={({ text }): void => setText(text)} />
+			<FilterByText placeholder={t('Search_Integrations')} onChange={setText} />
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/admin/moderation/helpers/ModerationFilter.tsx b/apps/meteor/client/views/admin/moderation/helpers/ModerationFilter.tsx
index 4fde3568b2aa..5414e3d06aa5 100644
--- a/apps/meteor/client/views/admin/moderation/helpers/ModerationFilter.tsx
+++ b/apps/meteor/client/views/admin/moderation/helpers/ModerationFilter.tsx
@@ -1,5 +1,5 @@
 import { useTranslation } from '@rocket.chat/ui-contexts';
-import React, { useCallback } from 'react';
+import React from 'react';
 
 import FilterByText from '../../../../components/FilterByText';
 import DateRangePicker from './DateRangePicker';
@@ -12,10 +12,8 @@ type ModerationFilterProps = {
 const ModerationFilter = ({ setText, setDateRange }: ModerationFilterProps) => {
 	const t = useTranslation();
 
-	const handleChange = useCallback(({ text }): void => setText(text), [setText]);
-
 	return (
-		<FilterByText shouldAutoFocus placeholder={t('Search')} onChange={handleChange}>
+		<FilterByText shouldAutoFocus placeholder={t('Search')} onChange={setText}>
 			<DateRangePicker onChange={setDateRange} />
 		</FilterByText>
 	);
diff --git a/apps/meteor/client/views/admin/users/UsersTable/UsersTableFilters.tsx b/apps/meteor/client/views/admin/users/UsersTable/UsersTableFilters.tsx
index 28508ac94ac5..e3b919ae4a02 100644
--- a/apps/meteor/client/views/admin/users/UsersTable/UsersTableFilters.tsx
+++ b/apps/meteor/client/views/admin/users/UsersTable/UsersTableFilters.tsx
@@ -20,7 +20,7 @@ const UsersTableFilters = ({ roleData, setUsersFilters }: UsersTableFiltersProps
 	const [text, setText] = useState('');
 
 	const handleSearchTextChange = useCallback(
-		({ text }) => {
+		(text) => {
 			setUsersFilters({ text, roles: selectedRoles });
 			setText(text);
 		},
diff --git a/apps/meteor/client/views/directory/tabs/channels/ChannelsTable/ChannelsTable.tsx b/apps/meteor/client/views/directory/tabs/channels/ChannelsTable/ChannelsTable.tsx
index 8ec510eed76d..cbd4671bc076 100644
--- a/apps/meteor/client/views/directory/tabs/channels/ChannelsTable/ChannelsTable.tsx
+++ b/apps/meteor/client/views/directory/tabs/channels/ChannelsTable/ChannelsTable.tsx
@@ -96,7 +96,7 @@ const ChannelsTable = () => {
 
 	return (
 		<>
-			<FilterByText placeholder={t('Search_Channels')} onChange={({ text }): void => setText(text)} />
+			<FilterByText placeholder={t('Search_Channels')} onChange={setText} />
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/directory/tabs/teams/TeamsTable/TeamsTable.tsx b/apps/meteor/client/views/directory/tabs/teams/TeamsTable/TeamsTable.tsx
index f33b359e4b07..43e6e0e6cdf6 100644
--- a/apps/meteor/client/views/directory/tabs/teams/TeamsTable/TeamsTable.tsx
+++ b/apps/meteor/client/views/directory/tabs/teams/TeamsTable/TeamsTable.tsx
@@ -73,7 +73,7 @@ const TeamsTable = () => {
 
 	return (
 		<>
-			<FilterByText placeholder={t('Teams_Search_teams')} onChange={({ text }): void => setText(text)} />
+			<FilterByText placeholder={t('Teams_Search_teams')} onChange={setText} />
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/directory/tabs/users/UsersTable/UsersTable.tsx b/apps/meteor/client/views/directory/tabs/users/UsersTable/UsersTable.tsx
index 5b69a59909ca..db01bdf59201 100644
--- a/apps/meteor/client/views/directory/tabs/users/UsersTable/UsersTable.tsx
+++ b/apps/meteor/client/views/directory/tabs/users/UsersTable/UsersTable.tsx
@@ -95,7 +95,7 @@ const UsersTable = ({ workspace = 'local' }): ReactElement => {
 
 	return (
 		<>
-			<FilterByText placeholder={t('Search_Users')} onChange={({ text }): void => setText(text)} />
+			<FilterByText placeholder={t('Search_Users')} onChange={setText} />
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/marketplace/AppsPage/AppsFilters.tsx b/apps/meteor/client/views/marketplace/AppsPage/AppsFilters.tsx
index f1332284c97f..a1f486395dbb 100644
--- a/apps/meteor/client/views/marketplace/AppsPage/AppsFilters.tsx
+++ b/apps/meteor/client/views/marketplace/AppsPage/AppsFilters.tsx
@@ -59,8 +59,8 @@ const AppsFilters = ({
 	const fixFiltersSize = breakpoints.includes('lg') ? { maxWidth: 'x200', minWidth: 'x200' } : null;
 
 	return (
-		<Box pi={24}>
-			<FilterByText placeholder={appsSearchPlaceholders[context]} onChange={({ text }): void => setText(text)}>
+		<Box pi={24} mbe={4}>
+			<FilterByText placeholder={appsSearchPlaceholders[context]} onChange={setText}>
 				{!isPrivateAppsPage && (
 					<RadioDropDown group={freePaidFilterStructure} onSelected={freePaidFilterOnSelected} flexGrow={1} {...fixFiltersSize} />
 				)}
diff --git a/apps/meteor/client/views/marketplace/components/CategoryFilter/TagList.tsx b/apps/meteor/client/views/marketplace/components/CategoryFilter/TagList.tsx
index ec5fb13f0fab..3cba9e81b357 100644
--- a/apps/meteor/client/views/marketplace/components/CategoryFilter/TagList.tsx
+++ b/apps/meteor/client/views/marketplace/components/CategoryFilter/TagList.tsx
@@ -8,14 +8,20 @@ type TagListProps = {
 	onClick: CategoryDropDownListProps['onSelected'];
 };
 
-const TagList = ({ categories, onClick }: TagListProps) => (
-	<ButtonGroup wrap small>
-		{categories.map((category) => (
-			<Chip flexShrink={0} key={category.id} onClick={(): void => onClick(category)} disabled={undefined} mbe={8}>
-				{category.label}
-			</Chip>
-		))}
-	</ButtonGroup>
-);
+const TagList = ({ categories, onClick }: TagListProps) => {
+	if (!categories.length) {
+		return null;
+	}
+
+	return (
+		<ButtonGroup wrap small>
+			{categories.map((category) => (
+				<Chip key={category.id} onClick={() => onClick(category)}>
+					{category.label}
+				</Chip>
+			))}
+		</ButtonGroup>
+	);
+};
 
 export default TagList;
diff --git a/apps/meteor/client/views/omnichannel/agents/AgentsTable/AgentsTable.tsx b/apps/meteor/client/views/omnichannel/agents/AgentsTable/AgentsTable.tsx
index 5d0e89e1008a..13e1498d7422 100644
--- a/apps/meteor/client/views/omnichannel/agents/AgentsTable/AgentsTable.tsx
+++ b/apps/meteor/client/views/omnichannel/agents/AgentsTable/AgentsTable.tsx
@@ -73,7 +73,7 @@ const AgentsTable = () => {
 	return (
 		<>
 			<AddAgent reload={refetch} />
-			{((isSuccess && data?.users.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }) => setFilter(text)} />}
+			{((isSuccess && data?.users.length > 0) || queryHasChanged) && <FilterByText onChange={setFilter} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/omnichannel/customFields/CustomFieldsTable.tsx b/apps/meteor/client/views/omnichannel/customFields/CustomFieldsTable.tsx
index d8609293c2c5..f8043a178857 100644
--- a/apps/meteor/client/views/omnichannel/customFields/CustomFieldsTable.tsx
+++ b/apps/meteor/client/views/omnichannel/customFields/CustomFieldsTable.tsx
@@ -75,7 +75,7 @@ const CustomFieldsTable = () => {
 
 	return (
 		<>
-			{((isSuccess && data?.customFields.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }) => setFilter(text)} />}
+			{((isSuccess && data?.customFields.length > 0) || queryHasChanged) && <FilterByText onChange={setFilter} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/omnichannel/departments/DepartmentsTable/DepartmentsTable.tsx b/apps/meteor/client/views/omnichannel/departments/DepartmentsTable/DepartmentsTable.tsx
index 7aee3f534d42..46ef80d5b0e3 100644
--- a/apps/meteor/client/views/omnichannel/departments/DepartmentsTable/DepartmentsTable.tsx
+++ b/apps/meteor/client/views/omnichannel/departments/DepartmentsTable/DepartmentsTable.tsx
@@ -91,7 +91,7 @@ const DepartmentsTable = ({ archived }: { archived: boolean }) => {
 
 	return (
 		<>
-			{((isSuccess && data?.departments.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }): void => setText(text)} />}
+			{((isSuccess && data?.departments.length > 0) || queryHasChanged) && <FilterByText onChange={setText} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/omnichannel/directory/calls/CallTable.tsx b/apps/meteor/client/views/omnichannel/directory/calls/CallTable.tsx
index 916a866b0431..2b529999fea1 100644
--- a/apps/meteor/client/views/omnichannel/directory/calls/CallTable.tsx
+++ b/apps/meteor/client/views/omnichannel/directory/calls/CallTable.tsx
@@ -95,7 +95,7 @@ const CallTable = () => {
 
 	return (
 		<>
-			{((isSuccess && data?.rooms.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }) => setText(text)} />}
+			{((isSuccess && data?.rooms.length > 0) || queryHasChanged) && <FilterByText onChange={setText} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/omnichannel/directory/chats/ChatTable.tsx b/apps/meteor/client/views/omnichannel/directory/chats/ChatTable.tsx
index e11a1c332066..c6d090c7547c 100644
--- a/apps/meteor/client/views/omnichannel/directory/chats/ChatTable.tsx
+++ b/apps/meteor/client/views/omnichannel/directory/chats/ChatTable.tsx
@@ -134,7 +134,7 @@ const ChatTable = () => {
 
 	return (
 		<>
-			{((isSuccess && data?.rooms.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }) => setText(text)} />}
+			{((isSuccess && data?.rooms.length > 0) || queryHasChanged) && <FilterByText onChange={setText} />}
 			{isLoading && (
 				<GenericTable>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/omnichannel/directory/contacts/ContactTable.tsx b/apps/meteor/client/views/omnichannel/directory/contacts/ContactTable.tsx
index 76fdce05c9bb..09ec19e6a2fe 100644
--- a/apps/meteor/client/views/omnichannel/directory/contacts/ContactTable.tsx
+++ b/apps/meteor/client/views/omnichannel/directory/contacts/ContactTable.tsx
@@ -1,4 +1,4 @@
-import { Pagination, States, StatesAction, StatesActions, StatesIcon, StatesTitle, Box } from '@rocket.chat/fuselage';
+import { Pagination, States, StatesAction, StatesActions, StatesIcon, StatesTitle, Box, Button } from '@rocket.chat/fuselage';
 import { useDebouncedState, useDebouncedValue, useMutableCallback } from '@rocket.chat/fuselage-hooks';
 import { useRoute, useTranslation } from '@rocket.chat/ui-contexts';
 import { hashQueryKey } from '@tanstack/react-query';
@@ -106,12 +106,11 @@ function ContactTable(): ReactElement {
 	return (
 		<>
 			{((isSuccess && data?.visitors.length > 0) || queryHasChanged) && (
-				<FilterByText
-					displayButton
-					textButton={t('New_contact')}
-					onButtonClick={onButtonNewClick}
-					onChange={({ text }): void => setTerm(text)}
-				/>
+				<FilterByText onChange={setTerm}>
+					<Button onClick={onButtonNewClick} primary>
+						{t('New_contact')}
+					</Button>
+				</FilterByText>
 			)}
 			{isLoading && (
 				<GenericTable>
diff --git a/apps/meteor/client/views/omnichannel/managers/ManagersTable.tsx b/apps/meteor/client/views/omnichannel/managers/ManagersTable.tsx
index afb2ae8f351b..a60d41c0c3aa 100644
--- a/apps/meteor/client/views/omnichannel/managers/ManagersTable.tsx
+++ b/apps/meteor/client/views/omnichannel/managers/ManagersTable.tsx
@@ -80,7 +80,7 @@ const ManagersTable = () => {
 	return (
 		<>
 			<AddManager reload={refetch} />
-			{((isSuccess && data?.users.length > 0) || queryHasChanged) && <FilterByText onChange={({ text }): void => setText(text)} />}
+			{((isSuccess && data?.users.length > 0) || queryHasChanged) && <FilterByText onChange={setText} />}
 			{isLoading && (
 				<GenericTable aria-busy>
 					<GenericTableHeader>{headers}</GenericTableHeader>
diff --git a/apps/meteor/client/views/room/webdav/WebdavFilePickerModal/WebdavFilePickerModal.tsx b/apps/meteor/client/views/room/webdav/WebdavFilePickerModal/WebdavFilePickerModal.tsx
index 4b75e496cefe..38895d4c211e 100644
--- a/apps/meteor/client/views/room/webdav/WebdavFilePickerModal/WebdavFilePickerModal.tsx
+++ b/apps/meteor/client/views/room/webdav/WebdavFilePickerModal/WebdavFilePickerModal.tsx
@@ -196,7 +196,7 @@ const WebdavFilePickerModal = ({ onUpload, onClose, account }: WebdavFilePickerM
 					</Box>
 				</Box>
 				<Box display='flex' flexDirection='column'>
-					<FilterByText onChange={({ text }): void => setFilterText(text)}>
+					<FilterByText onChange={setFilterText}>
 						{typeView === 'grid' && (
 							<Select value={sortBy} onChange={(value): void => handleSort(value as WebdavSortOptions)} options={options} />
 						)}