feat: add multiple layout components with suspense fallback for loading states

src/app/master-data/area/detail/layout.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function AreaLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}

src/app/master-data/kandang/detail/layout.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function KandangLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}

src/app/master-data/location/detail/layout.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function LocationLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}

src/app/master-data/nonstock/detail/layout.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function NonstockLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}

src/app/master-data/product-category/detail/layout.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function ProductCategoryLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}

src/app/master-data/product/detail/layout.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function ProductLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}

src/app/master-data/uom/detail/layout.tsx

@@ -0,0 +1,17 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function UomLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}

src/app/master-data/warehouse/detail/layout.tsx

@@ -0,0 +1,21 @@
+'use client';
+
+import { Suspense } from 'react';
+
+export default function WarehouseLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <Suspense
+      fallback={
+        <div className='w-full flex flex-row justify-center items-center p-4'>
+          <span className='loading loading-spinner loading-xl' />
+        </div>
+      }
+    >
+      {children}
+    </Suspense>
+  );
+}