diff --git a/app/(dashboard)/parental-control/loading.tsx b/app/(dashboard)/parental-control/loading.tsx
index b28a7e1..2167cfd 100644
--- a/app/(dashboard)/parental-control/loading.tsx
+++ b/app/(dashboard)/parental-control/loading.tsx
@@ -2,21 +2,24 @@ import DevicesTableSkeleton from "@/components/device-table-skeleton";
 import { Skeleton } from "@/components/ui/skeleton";
 
 export default function LoadingComponent() {
-	return (
-		<div>
-			<div className="flex justify-between items-center border rounded-md border-dashed font-bold title-bg py-4 px-2 mb-4">
-				<Skeleton className="w-48 h-8" />
-				<Skeleton className="w-20 h-8" />
-			</div>
-			<div
-				id="user-filters"
-				className=" pb-4 gap-4 flex sm:flex-row flex-col items-start justify-endO"
-			>
-				<DevicesTableSkeleton
-					headers={["Device Name", "Mac Address", "Vendor", "#"]}
-					length={10}
-				/>
-			</div>
-		</div>
-	);
+  return (
+    <div>
+      <div className="flex justify-between items-center border rounded-md border-dashed font-bold title-bg py-4 px-2 mb-4">
+        <Skeleton className="w-48 h-8" />
+        <Skeleton className="w-20 h-8" />
+      </div>
+      <div>
+        <Skeleton className="w-full rounded-md mt-5 mb-6 sm:w-48 h-9" />
+      </div>
+      <div
+        id="user-filters"
+        className=" pb-4 gap-4 flex sm:flex-row flex-col items-start justify-endO"
+      >
+        <DevicesTableSkeleton
+          headers={["Device Name", "Mac Address", "Vendor", "#"]}
+          length={10}
+        />
+      </div>
+    </div>
+  );
 }
diff --git a/app/(dashboard)/top-ups/loading.tsx b/app/(dashboard)/top-ups/loading.tsx
index 8788ddc..fa2ad55 100644
--- a/app/(dashboard)/top-ups/loading.tsx
+++ b/app/(dashboard)/top-ups/loading.tsx
@@ -2,21 +2,24 @@ import DevicesTableSkeleton from "@/components/device-table-skeleton";
 import { Skeleton } from "@/components/ui/skeleton";
 
 export default function LoadingComponent() {
-	return (
-		<div>
-			<div className="flex justify-between items-center border rounded-md border-dashed font-bold title-bg py-4 px-2 mb-4">
-				<Skeleton className="w-48 h-8" />
-				<Skeleton className="w-20 h-8" />
-			</div>
-			<div
-				id="user-filters"
-				className=" pb-4 gap-4 flex sm:flex-row flex-col items-start justify-endO"
-			>
-				<DevicesTableSkeleton
-					headers={["Details", "Status", "Amount"]}
-					length={10}
-				/>
-			</div>
-		</div>
-	);
+  return (
+    <div>
+      <div className="flex justify-between items-center border rounded-md border-dashed font-bold title-bg py-4 px-2 mb-4">
+        <Skeleton className="w-48 h-8" />
+        <Skeleton className="w-20 h-8" />
+      </div>
+      <div>
+        <Skeleton className="w-full rounded-md mt-5 mb-6 sm:w-48 h-9" />
+      </div>
+      <div
+        id="user-filters"
+        className=" pb-4 gap-4 flex sm:flex-row flex-col items-start justify-endO"
+      >
+        <DevicesTableSkeleton
+          headers={["Details", "Status", "Amount"]}
+          length={10}
+        />
+      </div>
+    </div>
+  );
 }