diff --git a/apps/sim/app/(auth)/login/loading.tsx b/apps/sim/app/(auth)/login/loading.tsx
new file mode 100644
index 00000000000..e42fb32e2e2
--- /dev/null
+++ b/apps/sim/app/(auth)/login/loading.tsx
@@ -0,0 +1,24 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function LoginLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/(auth)/oauth/consent/loading.tsx b/apps/sim/app/(auth)/oauth/consent/loading.tsx
new file mode 100644
index 00000000000..b6c3e192ced
--- /dev/null
+++ b/apps/sim/app/(auth)/oauth/consent/loading.tsx
@@ -0,0 +1,21 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function OAuthConsentLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/(auth)/reset-password/loading.tsx b/apps/sim/app/(auth)/reset-password/loading.tsx
new file mode 100644
index 00000000000..cd6a25a9b4f
--- /dev/null
+++ b/apps/sim/app/(auth)/reset-password/loading.tsx
@@ -0,0 +1,16 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function ResetPasswordLoading() {
+ return (
+
+ )
+}
diff --git a/apps/sim/app/(auth)/signup/loading.tsx b/apps/sim/app/(auth)/signup/loading.tsx
new file mode 100644
index 00000000000..4960851a805
--- /dev/null
+++ b/apps/sim/app/(auth)/signup/loading.tsx
@@ -0,0 +1,28 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function SignupLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/(auth)/sso/loading.tsx b/apps/sim/app/(auth)/sso/loading.tsx
new file mode 100644
index 00000000000..11acf1bec75
--- /dev/null
+++ b/apps/sim/app/(auth)/sso/loading.tsx
@@ -0,0 +1,16 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function SSOLoading() {
+ return (
+
+ )
+}
diff --git a/apps/sim/app/(auth)/verify/loading.tsx b/apps/sim/app/(auth)/verify/loading.tsx
new file mode 100644
index 00000000000..b41b5784f50
--- /dev/null
+++ b/apps/sim/app/(auth)/verify/loading.tsx
@@ -0,0 +1,12 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function VerifyLoading() {
+ return (
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/(landing)/blog/[slug]/loading.tsx b/apps/sim/app/(landing)/blog/[slug]/loading.tsx
new file mode 100644
index 00000000000..40352cabef1
--- /dev/null
+++ b/apps/sim/app/(landing)/blog/[slug]/loading.tsx
@@ -0,0 +1,59 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function BlogPostLoading() {
+ return (
+
+ {/* Header area */}
+
+ {/* Back link */}
+
+
+
+ {/* Image + title row */}
+
+ {/* Image */}
+
+
+
+ {/* Title + author */}
+
+
+ {/* Divider */}
+
+ {/* Date + description */}
+
+
+ {/* Article body */}
+
+
+ )
+}
diff --git a/apps/sim/app/(landing)/blog/authors/[id]/loading.tsx b/apps/sim/app/(landing)/blog/authors/[id]/loading.tsx
new file mode 100644
index 00000000000..113e93c8419
--- /dev/null
+++ b/apps/sim/app/(landing)/blog/authors/[id]/loading.tsx
@@ -0,0 +1,25 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_POST_COUNT = 4
+
+export default function AuthorLoading() {
+ return (
+
+
+
+
+
+
+ {Array.from({ length: SKELETON_POST_COUNT }).map((_, i) => (
+
+ ))}
+
+
+ )
+}
diff --git a/apps/sim/app/(landing)/blog/loading.tsx b/apps/sim/app/(landing)/blog/loading.tsx
new file mode 100644
index 00000000000..5fabbd4e792
--- /dev/null
+++ b/apps/sim/app/(landing)/blog/loading.tsx
@@ -0,0 +1,29 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_CARD_COUNT = 6
+
+export default function BlogLoading() {
+ return (
+
+
+
+
+ {Array.from({ length: SKELETON_CARD_COUNT }).map((_, i) => (
+
+ ))}
+
+
+ )
+}
diff --git a/apps/sim/app/(landing)/blog/tags/loading.tsx b/apps/sim/app/(landing)/blog/tags/loading.tsx
new file mode 100644
index 00000000000..6c395b3add4
--- /dev/null
+++ b/apps/sim/app/(landing)/blog/tags/loading.tsx
@@ -0,0 +1,20 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_TAG_COUNT = 12
+
+export default function TagsLoading() {
+ return (
+
+
+
+ {Array.from({ length: SKELETON_TAG_COUNT }).map((_, i) => (
+
+ ))}
+
+
+ )
+}
diff --git a/apps/sim/app/(landing)/privacy/loading.tsx b/apps/sim/app/(landing)/privacy/loading.tsx
new file mode 100644
index 00000000000..98727e7d450
--- /dev/null
+++ b/apps/sim/app/(landing)/privacy/loading.tsx
@@ -0,0 +1,59 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function PrivacyLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/(landing)/terms/loading.tsx b/apps/sim/app/(landing)/terms/loading.tsx
new file mode 100644
index 00000000000..5c9d573cafb
--- /dev/null
+++ b/apps/sim/app/(landing)/terms/loading.tsx
@@ -0,0 +1,52 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function TermsLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/changelog/loading.tsx b/apps/sim/app/changelog/loading.tsx
new file mode 100644
index 00000000000..e81c5c19e06
--- /dev/null
+++ b/apps/sim/app/changelog/loading.tsx
@@ -0,0 +1,38 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function ChangelogLoading() {
+ return (
+
+
+
+
+
+ {Array.from({ length: 4 }).map((_, i) => (
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/chat/[identifier]/loading.tsx b/apps/sim/app/chat/[identifier]/loading.tsx
new file mode 100644
index 00000000000..39521ac8912
--- /dev/null
+++ b/apps/sim/app/chat/[identifier]/loading.tsx
@@ -0,0 +1,39 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function ChatLoading() {
+ return (
+
+ )
+}
diff --git a/apps/sim/app/credential-account/[token]/loading.tsx b/apps/sim/app/credential-account/[token]/loading.tsx
new file mode 100644
index 00000000000..aa97c96ae0d
--- /dev/null
+++ b/apps/sim/app/credential-account/[token]/loading.tsx
@@ -0,0 +1,19 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function CredentialAccountLoading() {
+ return (
+
+
+
+ )
+}
diff --git a/apps/sim/app/form/[identifier]/loading.tsx b/apps/sim/app/form/[identifier]/loading.tsx
new file mode 100644
index 00000000000..6c8fd36d0ee
--- /dev/null
+++ b/apps/sim/app/form/[identifier]/loading.tsx
@@ -0,0 +1,29 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function FormLoading() {
+ return (
+
+
+
+ )
+}
diff --git a/apps/sim/app/invite/[id]/loading.tsx b/apps/sim/app/invite/[id]/loading.tsx
new file mode 100644
index 00000000000..cc73d0ec379
--- /dev/null
+++ b/apps/sim/app/invite/[id]/loading.tsx
@@ -0,0 +1,13 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function InviteLoading() {
+ return (
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/resume/[workflowId]/[executionId]/loading.tsx b/apps/sim/app/resume/[workflowId]/[executionId]/loading.tsx
new file mode 100644
index 00000000000..3c7197a7e96
--- /dev/null
+++ b/apps/sim/app/resume/[workflowId]/[executionId]/loading.tsx
@@ -0,0 +1,42 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function ResumeLoading() {
+ return (
+
+
+
+
+
+
+ {Array.from({ length: 3 }).map((_, i) => (
+
+ ))}
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/templates/[id]/loading.tsx b/apps/sim/app/templates/[id]/loading.tsx
new file mode 100644
index 00000000000..bb9f8c1f1e9
--- /dev/null
+++ b/apps/sim/app/templates/[id]/loading.tsx
@@ -0,0 +1,55 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function TemplateDetailLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/templates/loading.tsx b/apps/sim/app/templates/loading.tsx
new file mode 100644
index 00000000000..ae6b87ac503
--- /dev/null
+++ b/apps/sim/app/templates/loading.tsx
@@ -0,0 +1,36 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_CARD_COUNT = 8
+
+export default function TemplatesLoading() {
+ return (
+
+
+
+
+
+
+
+
+ {Array.from({ length: SKELETON_CARD_COUNT }).map((_, i) => (
+
+ ))}
+
+
+
+ )
+}
diff --git a/apps/sim/app/unsubscribe/loading.tsx b/apps/sim/app/unsubscribe/loading.tsx
new file mode 100644
index 00000000000..39d410d4245
--- /dev/null
+++ b/apps/sim/app/unsubscribe/loading.tsx
@@ -0,0 +1,13 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function UnsubscribeLoading() {
+ return (
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/files/[fileId]/view/loading.tsx b/apps/sim/app/workspace/[workspaceId]/files/[fileId]/view/loading.tsx
new file mode 100644
index 00000000000..c64c3a39e27
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/files/[fileId]/view/loading.tsx
@@ -0,0 +1,9 @@
+import { Loader2 } from 'lucide-react'
+
+export default function FileViewLoading() {
+ return (
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/files/loading.tsx b/apps/sim/app/workspace/[workspaceId]/files/loading.tsx
new file mode 100644
index 00000000000..806f4f73b30
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/files/loading.tsx
@@ -0,0 +1,62 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 5
+const COLUMN_COUNT = 6
+
+export default function FilesLoading() {
+ return (
+
+
+
+
+
+
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/home/loading.tsx b/apps/sim/app/workspace/[workspaceId]/home/loading.tsx
new file mode 100644
index 00000000000..98b656ef94e
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/home/loading.tsx
@@ -0,0 +1,22 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_LINE_COUNT = 4
+
+export default function HomeLoading() {
+ return (
+
+
+
+ {Array.from({ length: SKELETON_LINE_COUNT }).map((_, i) => (
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/loading.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/loading.tsx
new file mode 100644
index 00000000000..577be0ff2b0
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/loading.tsx
@@ -0,0 +1,67 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 5
+const COLUMN_COUNT = 4
+
+export default function DocumentLoading() {
+ return (
+
+
+
+
+
+
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/loading.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/loading.tsx
new file mode 100644
index 00000000000..ad27d19a9a7
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/loading.tsx
@@ -0,0 +1,69 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 5
+const COLUMN_COUNT = 7
+
+export default function KnowledgeBaseLoading() {
+ return (
+
+
+
+
+
+
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/loading.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/loading.tsx
new file mode 100644
index 00000000000..acb223d33a7
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/loading.tsx
@@ -0,0 +1,63 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 5
+const COLUMN_COUNT = 6
+
+export default function KnowledgeLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/loading.tsx b/apps/sim/app/workspace/[workspaceId]/logs/loading.tsx
new file mode 100644
index 00000000000..6c20d8d3774
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/logs/loading.tsx
@@ -0,0 +1,71 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 5
+const COLUMN_COUNT = 6
+
+export default function LogsLoading() {
+ return (
+
+
+
+
+
+
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/scheduled-tasks/loading.tsx b/apps/sim/app/workspace/[workspaceId]/scheduled-tasks/loading.tsx
new file mode 100644
index 00000000000..4bdba810493
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/scheduled-tasks/loading.tsx
@@ -0,0 +1,63 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 5
+const COLUMN_COUNT = 4
+
+export default function ScheduledTasksLoading() {
+ return (
+
+
+
+
+
+
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/[section]/loading.tsx b/apps/sim/app/workspace/[workspaceId]/settings/[section]/loading.tsx
new file mode 100644
index 00000000000..1413bedfc79
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/settings/[section]/loading.tsx
@@ -0,0 +1,15 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function SettingsLoading() {
+ return (
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/loading.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/loading.tsx
new file mode 100644
index 00000000000..3eb4cd58d01
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/loading.tsx
@@ -0,0 +1,51 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 8
+const COLUMN_COUNT = 5
+
+export default function TableDetailLoading() {
+ return (
+
+
+
+
+
+
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+ |
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+ |
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/loading.tsx b/apps/sim/app/workspace/[workspaceId]/tables/loading.tsx
new file mode 100644
index 00000000000..2ce948245ec
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/tables/loading.tsx
@@ -0,0 +1,61 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_ROW_COUNT = 5
+const COLUMN_COUNT = 6
+
+export default function TablesLoading() {
+ return (
+
+
+
+
+
+
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, i) => (
+
+
+ |
+ ))}
+
+
+
+ {Array.from({ length: SKELETON_ROW_COUNT }).map((_, rowIndex) => (
+
+ |
+
+ |
+ {Array.from({ length: COLUMN_COUNT }).map((_, colIndex) => (
+
+
+ |
+ ))}
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/templates/[id]/loading.tsx b/apps/sim/app/workspace/[workspaceId]/templates/[id]/loading.tsx
new file mode 100644
index 00000000000..f10ed17843c
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/templates/[id]/loading.tsx
@@ -0,0 +1,47 @@
+import { Skeleton } from '@/components/emcn'
+
+export default function TemplateDetailLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/templates/loading.tsx b/apps/sim/app/workspace/[workspaceId]/templates/loading.tsx
new file mode 100644
index 00000000000..41ae5d297d8
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/templates/loading.tsx
@@ -0,0 +1,38 @@
+import { Skeleton } from '@/components/emcn'
+
+const SKELETON_CARD_COUNT = 8
+
+export default function TemplatesLoading() {
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ {Array.from({ length: SKELETON_CARD_COUNT }).map((_, i) => (
+
+ ))}
+
+
+
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/loading.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/loading.tsx
new file mode 100644
index 00000000000..6a65da73c7e
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/loading.tsx
@@ -0,0 +1,11 @@
+import { Loader2 } from 'lucide-react'
+
+export default function WorkflowLoading() {
+ return (
+
+ )
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/w/loading.tsx b/apps/sim/app/workspace/[workspaceId]/w/loading.tsx
new file mode 100644
index 00000000000..9bb97126c6a
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/w/loading.tsx
@@ -0,0 +1,11 @@
+import { Loader2 } from 'lucide-react'
+
+export default function WorkflowsLoading() {
+ return (
+
+ )
+}