thoughts-frontend/app/loading.tsx

@@ -0,0 +1,20 @@
+import { ThoughtSkeleton } from "@/components/loading-skeleton";
+
+export default function FeedLoading() {
+  return (
+    <div className="container mx-auto max-w-6xl p-4 sm:p-6">
+      <div className="grid grid-cols-1 lg:grid-cols-4 gap-8">
+        <aside className="hidden lg:block lg:col-span-1" />
+        <main className="col-span-1 lg:col-span-2 space-y-6">
+          <div className="h-10 w-32 bg-muted rounded animate-pulse mb-6" />
+          <div className="space-y-4">
+            <ThoughtSkeleton />
+            <ThoughtSkeleton />
+            <ThoughtSkeleton />
+          </div>
+        </main>
+        <aside className="hidden lg:block lg:col-span-1" />
+      </div>
+    </div>
+  );
+}

thoughts-frontend/app/search/loading.tsx

@@ -0,0 +1,12 @@
+import { ThoughtSkeleton } from "@/components/loading-skeleton";
+
+export default function SearchLoading() {
+  return (
+    <div className="container mx-auto max-w-2xl p-4 sm:p-6 space-y-4">
+      <div className="h-8 w-48 bg-muted rounded animate-pulse" />
+      <ThoughtSkeleton />
+      <ThoughtSkeleton />
+      <ThoughtSkeleton />
+    </div>
+  );
+}

thoughts-frontend/app/tags/[tagName]/loading.tsx

@@ -0,0 +1,12 @@
+import { ThoughtSkeleton } from "@/components/loading-skeleton";
+
+export default function TagLoading() {
+  return (
+    <div className="container mx-auto max-w-2xl p-4 sm:p-6 space-y-4">
+      <div className="h-8 w-40 bg-muted rounded animate-pulse" />
+      <ThoughtSkeleton />
+      <ThoughtSkeleton />
+      <ThoughtSkeleton />
+    </div>
+  );
+}

thoughts-frontend/app/thoughts/[thoughtId]/loading.tsx

@@ -0,0 +1,13 @@
+import { ThoughtSkeleton } from "@/components/loading-skeleton";
+
+export default function ThoughtLoading() {
+  return (
+    <div className="container mx-auto max-w-2xl p-4 sm:p-6 space-y-4">
+      <ThoughtSkeleton />
+      <div className="pl-6 border-l-2 border-primary border-dashed space-y-4">
+        <ThoughtSkeleton />
+        <ThoughtSkeleton />
+      </div>
+    </div>
+  );
+}