chore: add skeletons to tables and loading.tsx files for routes and run formatting ♻️

app/(dashboard)/top-ups/page.tsx

@@ -1,4 +1,5 @@
 import { Suspense } from "react";
+import DevicesTableSkeleton from "@/components/device-table-skeleton";
 import DynamicFilter from "@/components/generic-filter";
 import { TopupsTable } from "@/components/topups-table";
 
@@ -78,7 +79,15 @@ export default async function Topups({
 					]}
 				/>
 			</div>
-			<Suspense key={query} fallback={"loading...."}>
+			<Suspense
+				key={query}
+				fallback={
+					<DevicesTableSkeleton
+						headers={["Details", "Status", "Amount"]}
+						length={10}
+					/>
+				}
+			>
 				<TopupsTable searchParams={searchParams} />
 			</Suspense>
 		</div>