From 98f8f7f175d6d269544edfc251e38076d664d459 Mon Sep 17 00:00:00 2001
From: Poyraz Avsever <poyrazavsever@hotmail.com>
Date: Tue, 10 Mar 2026 10:29:37 +0300
Subject: [PATCH] feat: add loading and page skeleton components

---
 app/loading.tsx              |  5 +++++
 components/page-skeleton.tsx | 26 ++++++++++++++++++++++++++
 2 files changed, 31 insertions(+)
 create mode 100644 app/loading.tsx
 create mode 100644 components/page-skeleton.tsx

diff --git a/app/loading.tsx b/app/loading.tsx
new file mode 100644
index 0000000..374e363
--- /dev/null
+++ b/app/loading.tsx
@@ -0,0 +1,5 @@
+import { PageSkeleton } from "@/components/page-skeleton";
+
+export default function Loading() {
+  return <PageSkeleton />;
+}
diff --git a/components/page-skeleton.tsx b/components/page-skeleton.tsx
new file mode 100644
index 0000000..90322ad
--- /dev/null
+++ b/components/page-skeleton.tsx
@@ -0,0 +1,26 @@
+import { Skeleton } from "poyraz-ui/atoms";
+
+export function PageSkeleton() {
+  return (
+    <section aria-busy="true" aria-live="polite" className="space-y-8">
+      <div className="space-y-3">
+        <Skeleton className="h-5 w-28 rounded-sm" />
+        <Skeleton className="h-10 w-full rounded-sm" />
+        <Skeleton className="h-4 w-5/6 rounded-sm" />
+        <Skeleton className="h-4 w-2/3 rounded-sm" />
+      </div>
+
+      <div className="grid gap-4 sm:grid-cols-2">
+        <Skeleton className="h-40 w-full rounded-sm" />
+        <Skeleton className="h-40 w-full rounded-sm" />
+      </div>
+
+      <div className="space-y-3">
+        <Skeleton className="h-4 w-24 rounded-sm" />
+        <Skeleton className="h-4 w-full rounded-sm" />
+        <Skeleton className="h-4 w-full rounded-sm" />
+        <Skeleton className="h-4 w-4/5 rounded-sm" />
+      </div>
+    </section>
+  );
+}