antosubash
diff --git a/‎src/src/app/admin/cms/pages/[id]/edit/page.tsx‎
Lines changed: 22 additions & 15 deletions b/‎src/src/app/admin/cms/pages/[id]/edit/page.tsx‎
Lines changed: 22 additions & 15 deletions
diff --git a/‎src/src/app/admin/cms/pages/create/page.tsx‎
Lines changed: 4 additions & 12 deletions b/‎src/src/app/admin/cms/pages/create/page.tsx‎
Lines changed: 4 additions & 12 deletions
diff --git a/‎src/src/app/admin/layout.tsx‎
Lines changed: 3 additions & 0 deletions b/‎src/src/app/admin/layout.tsx‎
Lines changed: 3 additions & 0 deletions
diff --git a/‎src/src/app/admin/loading.tsx‎
Lines changed: 10 additions & 0 deletions b/‎src/src/app/admin/loading.tsx‎
Lines changed: 10 additions & 0 deletions
diff --git a/‎src/src/app/admin/page.tsx‎
Lines changed: 37 additions & 9 deletions b/‎src/src/app/admin/page.tsx‎
Lines changed: 37 additions & 9 deletions
diff --git a/‎src/src/app/globals.css‎
Lines changed: 40 additions & 0 deletions b/‎src/src/app/globals.css‎
Lines changed: 40 additions & 0 deletions
@@ -15,7 +15,7 @@ import { useGrantedPolicies } from '@/lib/hooks/useGrantedPolicies'
 import { usePage } from '@/lib/hooks/usePages'
 import { Permissions } from '@/lib/utils'
 import { useQueryClient } from '@tanstack/react-query'
-import { ArrowLeft, Clock, RefreshCw, Save } from 'lucide-react'
+import { ArrowLeft, Clock, RefreshCw, Save, Eye } from 'lucide-react'
 import { useParams, useRouter } from 'next/navigation'
 import { useCallback, useEffect, useState } from 'react'
 import { Controller, useForm } from 'react-hook-form'
@@ -44,7 +44,6 @@ export default function EditPage() {
   const [isSubmitting, setIsSubmitting] = useState(false)
   const [formErrors, setFormErrors] = useState<Record<string, string[]>>({})
   const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false)
-  const [isPublished, setIsPublished] = useState(false)
   const [isFormLoaded, setIsFormLoaded] = useState(false)
 
   const {
@@ -147,7 +146,6 @@ export default function EditPage() {
         style: pageData.style || '',
         concurrencyStamp: pageData.concurrencyStamp || '',
       })
-      setIsPublished(pageData.isHomePage || false)
       setIsFormLoaded(true)
     }
   }, [page, reset])
@@ -239,7 +237,9 @@ export default function EditPage() {
       queryClient.invalidateQueries({ queryKey: [QueryNames.GetPage, pageId] })
       queryClient.invalidateQueries({ queryKey: [QueryNames.GetPages] })
       localStorage.removeItem(`page-draft-${pageId}`) // Clear draft after successful save
-      router.push('/admin/cms')
+      
+      // Remove the redirect - stay on the current page
+      // router.push('/admin/cms')
     } catch (err: unknown) {
       console.error('Page update error:', err)
 
@@ -371,17 +371,7 @@ export default function EditPage() {
                 Unsaved Changes
               </Badge>
             )}
-            <div className="flex items-center space-x-2">
-              <Switch
-                id="publish-status"
-                checked={isPublished}
-                onCheckedChange={setIsPublished}
-                disabled
-              />
-              <Label htmlFor="publish-status" className="text-sm">
-                {isPublished ? 'Home Page' : 'Regular Page'}
-              </Label>
-            </div>
+
 
             <Button
               size="sm"
@@ -395,6 +385,23 @@ export default function EditPage() {
               {isLoading ? 'Loading...' : 'Refresh'}
             </Button>
 
+            {page && (page as VoloCmsKitAdminPagesPageDto).slug && (
+              <Button
+                size="sm"
+                variant="outline"
+                onClick={() => {
+                  const slug = (page as VoloCmsKitAdminPagesPageDto).slug
+                  if (slug) {
+                    window.open(`/pages/${slug}`, '_blank')
+                  }
+                }}
+                disabled={!page || !(page as VoloCmsKitAdminPagesPageDto).slug}
+              >
+                <Eye className="w-4 h-4 mr-2" />
+                View Page
+              </Button>
+            )}
+
             <Button size="sm" disabled={isSubmitting} onClick={handleSubmit(onSubmit)}>
               <Save className="w-4 h-4 mr-2" />
               {isSubmitting ? 'Saving...' : 'Save Changes'}
 
@@ -47,7 +47,6 @@ export default function CreatePage() {
   const router = useRouter()
   const [isSubmitting, setIsSubmitting] = useState(false)
   const [formErrors, setFormErrors] = useState<Record<string, string[]>>({})
-  const [isPublished, setIsPublished] = useState(false)
 
   const {
     handleSubmit,
@@ -118,7 +117,6 @@ export default function CreatePage() {
         content: contentToSubmit,
         script: data.script || '',
         style: data.style || '',
-        isPublished,
       }
 
       await pageAdminCreate({
@@ -127,14 +125,15 @@ export default function CreatePage() {
 
       toast({
         title: 'Success',
-        description: `Page ${isPublished ? 'published' : 'created'} successfully.`,
+        description: 'Page created successfully.',
         variant: 'default',
       })
 
       // Invalidate and refetch pages list
       queryClient.invalidateQueries({ queryKey: ['pages'] })
 
-      router.push('/admin/cms/pages')
+      // Remove the redirect - stay on the current page
+      // router.push('/admin/cms/pages')
     } catch (error: any) {
       console.error('Error creating page:', error)
 
@@ -207,16 +206,9 @@ export default function CreatePage() {
           </div>
 
           <div className="flex items-center gap-3">
-            <div className="flex items-center space-x-2">
-              <Switch id="publish-status" checked={isPublished} onCheckedChange={setIsPublished} />
-              <Label htmlFor="publish-status" className="text-sm">
-                {isPublished ? 'Published' : 'Draft'}
-              </Label>
-            </div>
-
             <Button size="sm" disabled={isSubmitting} onClick={handleSubmit(onSubmit)}>
               <Save className="w-4 h-4 mr-2" />
-              {isSubmitting ? 'Creating...' : isPublished ? 'Publish' : 'Create Page'}
+              {isSubmitting ? 'Creating...' : 'Create Page'}
             </Button>
           </div>
         </div>
 
@@ -2,6 +2,9 @@ import AdminLayout from '@/layout/admin-layout'
 import { setUpLayoutConfig } from '@/lib/auth'
 import React from 'react'
 
+// Force dynamic rendering for admin pages since they use cookies and server-side features
+export const dynamic = 'force-dynamic'
+
 /**
  * AdminRootLayout component serves as the root layout for the admin section of the application.
  * It wraps its children with the AdminLayout component.
 
@@ -0,0 +1,10 @@
+import { AdminLoading } from '@/components/ui/AdminLoading'
+
+/**
+ * Next.js loading component for the admin page.
+ * This file is automatically used by Next.js to show a loading state
+ * while the admin page is being rendered.
+ */
+export default function AdminPageLoading() {
+  return <AdminLoading />
+} 
@@ -19,15 +19,38 @@ import {
 } from 'lucide-react'
 import Link from 'next/link'
 
+// Force dynamic rendering since this page uses server-side API calls and authentication
+export const dynamic = 'force-dynamic'
+
 /**
  * The AdminIndex component is an asynchronous function that fetches the application configuration
  * and displays a comprehensive admin dashboard with user information and system status.
+ * Next.js will automatically show the loading.tsx component while this page is loading.
  *
  * @returns A React component that renders a modern admin dashboard with user details and system information.
  */
 export default async function AdminIndex() {
-  const { data } = await abpApplicationConfigurationGet()
-  const appConfig = data as ApplicationConfigurationDto
+  const response = await abpApplicationConfigurationGet()
+  let appConfig = response.data as ApplicationConfigurationDto
+
+  // Provide fallback data if appConfig is null or undefined
+  if (!appConfig) {
+    appConfig = {
+      localization: undefined,
+      auth: undefined,
+      setting: undefined,
+      currentUser: undefined,
+      features: undefined,
+      globalFeatures: undefined,
+      multiTenancy: undefined,
+      currentTenant: undefined,
+      timing: undefined,
+      clock: undefined,
+      objectExtensions: undefined,
+      extraProperties: undefined,
+    } as ApplicationConfigurationDto
+  }
+
   const currentUser = appConfig?.currentUser
 
   const getInitials = (name?: string | null, surname?: string | null) => {
@@ -38,13 +61,18 @@ export default async function AdminIndex() {
 
   const formatDate = (dateString?: string) => {
     if (!dateString) return 'N/A'
-    return new Date(dateString).toLocaleDateString('en-US', {
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
-      hour: '2-digit',
-      minute: '2-digit',
-    })
+    try {
+      return new Date(dateString).toLocaleDateString('en-US', {
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
+      })
+    } catch (err) {
+      console.error('Error formatting date:', err)
+      return 'Invalid Date'
+    }
   }
 
   return (
 
@@ -2,6 +2,15 @@
 @import 'tw-animate-css';
 @import '@measured/puck/dist/index.css';
 
+/* Custom utilities */
+.scrollbar-hide {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+.scrollbar-hide::-webkit-scrollbar {
+  display: none;
+}
+
 @custom-variant dark (&:is(.dark *));
 
 @theme {
@@ -42,6 +51,9 @@
 
   --animate-accordion-down: accordion-down 0.2s ease-out;
   --animate-accordion-up: accordion-up 0.2s ease-out;
+  --animate-fade-in: fade-in 0.8s ease-out;
+  --animate-slide-up: slide-up 0.8s ease-out;
+  --animate-slide-down: slide-down 0.8s ease-out;
 
   @keyframes accordion-down {
     from {
@@ -59,6 +71,34 @@
       height: 0;
     }
   }
+  @keyframes fade-in {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+  @keyframes slide-up {
+    from {
+      opacity: 0;
+      transform: translateY(30px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+  @keyframes slide-down {
+    from {
+      opacity: 0;
+      transform: translateY(-30px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
 }
 
 @utility container {