diff --git a/dashboard/src/components/entity-table/table.tsx b/dashboard/src/components/entity-table/table.tsx
index f6bded7..aeb7b6a 100644
--- a/dashboard/src/components/entity-table/table.tsx
+++ b/dashboard/src/components/entity-table/table.tsx
@@ -13,7 +13,7 @@ import {
 
 import { useTranslation } from "react-i18next"
 import { useEntityTableContext } from "./entity-table-provider"
-import { LoaderCircle } from "lucide-react"
+import { LoaderIcon } from "lucide-react"
 
 interface DataTableProps<TData, TValue> {
     columns: ColumnDef<TData, TValue>[]
@@ -50,7 +50,7 @@ export function EntityDataTable<TData, TValue>({
                 {isLoading ? (
                     <TableRow className="w-full">
                         <TableCell colSpan={columns.length} className="h-24 text-center">
-                            <LoaderCircle className="w-5 h-5 animate-spin text-primary" />
+                            <LoaderIcon className="w-5 h-5 animate-spin text-primary" />
                         </TableCell>
                     </TableRow>
                 ) : (
diff --git a/dashboard/src/features/hosts/tables/inbound-hosts/index.tsx b/dashboard/src/features/hosts/tables/inbound-hosts/index.tsx
index f37b0ca..ab436fd 100644
--- a/dashboard/src/features/hosts/tables/inbound-hosts/index.tsx
+++ b/dashboard/src/features/hosts/tables/inbound-hosts/index.tsx
@@ -16,7 +16,7 @@ import { InboundNotSelectedAlertDialog } from './inbound-not-selected-alert-dial
 export const InboundHostsTable = () => {
     const { data: inbounds } = useInboundsQuery()
     const [selectedInbound, setSelectedInbound] = useState<string | undefined>(inbounds[0]?.id !== undefined ? String(inbounds[0].id) : undefined)
-    const { data } = useHostsQuery(Number(selectedInbound))
+    const { data, isLoading } = useHostsQuery(Number(selectedInbound))
 
     const [mutationDialogOpen, setMutationDialogOpen] = useDialog();
     const [deleteDialogOpen, setDeleteDialogOpen] = useDialog();
@@ -79,6 +79,7 @@ export const InboundHostsTable = () => {
                 setSelectedInbound={setSelectedInbound}
                 onCreate={onCreate}
                 onOpen={onOpen}
+                isLoading={isLoading}
             />
         </div>
     )
diff --git a/dashboard/src/features/hosts/tables/inbound-hosts/table.tsx b/dashboard/src/features/hosts/tables/inbound-hosts/table.tsx
index 58aaa95..e72f570 100644
--- a/dashboard/src/features/hosts/tables/inbound-hosts/table.tsx
+++ b/dashboard/src/features/hosts/tables/inbound-hosts/table.tsx
@@ -34,6 +34,7 @@ import { useState } from "react"
 import { InboundType } from "@marzneshin/features/inbounds"
 import { Server } from "lucide-react"
 import { InboundOption } from "./inbound"
+import { LoaderIcon } from "lucide-react"
 
 interface InboundHostsDataTableProps<TData, TValue> {
     columns: ColumnDef<TData, TValue>[]
@@ -44,6 +45,7 @@ interface InboundHostsDataTableProps<TData, TValue> {
     setSelectedInbound: (s: string) => void
     onCreate?: () => void
     onOpen?: (object: TData) => void
+    isLoading: boolean
 }
 
 export function InboundHostsDataTable<TData, TValue>({
@@ -55,6 +57,7 @@ export function InboundHostsDataTable<TData, TValue>({
     inbounds,
     selectedInbound,
     setSelectedInbound,
+    isLoading,
 }: InboundHostsDataTableProps<TData, TValue>) {
     const [sorting, setSorting] = useState<SortingState>([])
     const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([])
@@ -136,7 +139,7 @@ export function InboundHostsDataTable<TData, TValue>({
                             ))}
                         </TableHeader>
                         <TableBody>
-                            {table.getRowModel().rows?.length ? (
+                            {isLoading && <LoaderIcon className="w-5 h-5 animate-spin text-primary" />} {!isLoading && table.getRowModel().rows?.length ? (
                                 table.getRowModel().rows.map((row) => (
                                     <TableRow
                                         key={row.id}