diff --git a/changes/issue-3291-empty-host-message-bug b/changes/issue-3291-empty-host-message-bug
new file mode 100644
index 0000000000..61146b520b
--- /dev/null
+++ b/changes/issue-3291-empty-host-message-bug
@@ -0,0 +1 @@
+* Fix empty host message when no hosts match search criteria
diff --git a/frontend/pages/hosts/ManageHostsPage/components/EmptyHosts/EmptyHosts.tsx b/frontend/pages/hosts/ManageHostsPage/components/EmptyHosts/EmptyHosts.tsx
index 06e0188564..5cecc1a3b9 100644
--- a/frontend/pages/hosts/ManageHostsPage/components/EmptyHosts/EmptyHosts.tsx
+++ b/frontend/pages/hosts/ManageHostsPage/components/EmptyHosts/EmptyHosts.tsx
@@ -5,7 +5,11 @@ import React from "react";
 
 const baseClass = "empty-hosts";
 
-const EmptyHosts = (pageIndex: number): JSX.Element => {
+interface IEmptyHostsProps {
+  pageIndex: number;
+}
+
+const EmptyHosts = ({ pageIndex }: IEmptyHostsProps): JSX.Element => {
   return (
     <div className={`${baseClass}`}>
       <div className={`${baseClass}__inner`}>