create-nextblock 0.2.76 → 0.2.77

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-nextblock",
-  "version": "0.2.76",
+  "version": "0.2.77",
   "description": "",
   "main": "index.js",
   "bin": {

package/templates/nextblock-template/app/cms/CmsClientLayout.tsx

@@ -2,7 +2,7 @@
 "use client"
 
 import React, { type ReactNode, useEffect } from "react"
-import { useAuth } from "@/context/AuthContext"
+import { useAuth } from "../../context/AuthContext"
 import { useRouter, usePathname } from "next/navigation" // Import usePathname
 import Link from "next/link"
 import {
@@ -12,7 +12,7 @@ import {
 import { Button } from "@nextblock-cms/ui"
 import { Avatar, AvatarFallback, AvatarImage } from "@nextblock-cms/ui"
 import { cn } from "@nextblock-cms/utils"
-import { signOutAction } from "@/app/actions";
+import { signOutAction } from "../actions";
 import Image from "next/image";
 import { FeedbackModal } from "./components/FeedbackModal";
 
@@ -36,9 +36,10 @@ type NavItemProps = {
   writerOnly?: boolean
   isAdmin?: boolean
   isWriter?: boolean
+  onClick?: () => void
 }
 
-const NavItem = ({ href, icon: Icon, children, isActive, adminOnly, writerOnly, isAdmin, isWriter }: NavItemProps) => {
+const NavItem = ({ href, icon: Icon, children, isActive, adminOnly, writerOnly, isAdmin, isWriter, onClick }: NavItemProps) => {
   if (adminOnly && !isAdmin) return null
   if (writerOnly && !isWriter && !isAdmin) return null
 
@@ -46,6 +47,7 @@ const NavItem = ({ href, icon: Icon, children, isActive, adminOnly, writerOnly,
     <li>
       <Link
         href={href}
+        onClick={onClick}
         className={cn(
           "flex items-center gap-3 px-3 py-2 rounded-lg text-sm font-medium transition-all",
           isActive
@@ -139,6 +141,12 @@ export default function CmsClientLayout({ children }: { children: ReactNode }) {
     return () => window.removeEventListener('resize', handleResize);
   }, []);
 
+  const closeSidebarOnMobile = () => {
+    if (window.innerWidth < 768) {
+      setCmsSidebarOpen(false);
+    }
+  };
+
 
   // With server-side auth data, isLoading is initially false.
   // We show a spinner only if something client-side sets it to true (e.g., during logout).
@@ -230,16 +238,16 @@ export default function CmsClientLayout({ children }: { children: ReactNode }) {
 
           <nav className="px-3 py-4 flex-1 overflow-y-auto">
             <ul className="space-y-1.5">
-              <NavItem href="/cms/dashboard" icon={LayoutDashboard} isActive={pathname === "/cms/dashboard"} isAdmin={isAdmin} isWriter={isWriter}>
+              <NavItem href="/cms/dashboard" icon={LayoutDashboard} isActive={pathname === "/cms/dashboard"} isAdmin={isAdmin} isWriter={isWriter} onClick={closeSidebarOnMobile}>
                 Dashboard
               </NavItem>
-              <NavItem href="/cms/pages" icon={FileText} isActive={pathname.startsWith("/cms/pages")} writerOnly isAdmin={isAdmin} isWriter={isWriter}>
+              <NavItem href="/cms/pages" icon={FileText} isActive={pathname.startsWith("/cms/pages")} writerOnly isAdmin={isAdmin} isWriter={isWriter} onClick={closeSidebarOnMobile}>
                 Pages
               </NavItem>
-              <NavItem href="/cms/posts" icon={PenTool} isActive={pathname.startsWith("/cms/posts")} writerOnly isAdmin={isAdmin} isWriter={isWriter}>
+              <NavItem href="/cms/posts" icon={PenTool} isActive={pathname.startsWith("/cms/posts")} writerOnly isAdmin={isAdmin} isWriter={isWriter} onClick={closeSidebarOnMobile}>
                 Posts
               </NavItem>
-              <NavItem href="/cms/media" icon={ImageIconLucide} isActive={pathname.startsWith("/cms/media")} writerOnly isAdmin={isAdmin} isWriter={isWriter}>
+              <NavItem href="/cms/media" icon={ImageIconLucide} isActive={pathname.startsWith("/cms/media")} writerOnly isAdmin={isAdmin} isWriter={isWriter} onClick={closeSidebarOnMobile}>
                 Media
               </NavItem>
 
@@ -250,10 +258,10 @@ export default function CmsClientLayout({ children }: { children: ReactNode }) {
                       Administration
                     </p>
                   </div>
-                  <NavItem href="/cms/navigation" icon={ListTree} isActive={pathname.startsWith("/cms/navigation")} adminOnly isAdmin={isAdmin}>
+                  <NavItem href="/cms/navigation" icon={ListTree} isActive={pathname.startsWith("/cms/navigation")} adminOnly isAdmin={isAdmin} onClick={closeSidebarOnMobile}>
                     Navigation
                   </NavItem>
-                  <NavItem href="/cms/users" icon={Users} isActive={pathname.startsWith("/cms/users")} adminOnly isAdmin={isAdmin}>
+                  <NavItem href="/cms/users" icon={Users} isActive={pathname.startsWith("/cms/users")} adminOnly isAdmin={isAdmin} onClick={closeSidebarOnMobile}>
                     Manage Users
                   </NavItem>
                   <CollapsibleNavItem
@@ -263,16 +271,16 @@ export default function CmsClientLayout({ children }: { children: ReactNode }) {
                     adminOnly
                     isAdmin={isAdmin}
                   >
-                    <NavItem href="/cms/settings/languages" icon={LanguagesIconLucide} isActive={pathname.startsWith("/cms/settings/languages")} adminOnly isAdmin={isAdmin}>
+                    <NavItem href="/cms/settings/languages" icon={LanguagesIconLucide} isActive={pathname.startsWith("/cms/settings/languages")} adminOnly isAdmin={isAdmin} onClick={closeSidebarOnMobile}>
                       Languages
                    </NavItem>
-                   <NavItem href="/cms/settings/logos" icon={ImageIconLucide} isActive={pathname.startsWith("/cms/settings/logos")} adminOnly isAdmin={isAdmin}>
+                   <NavItem href="/cms/settings/logos" icon={ImageIconLucide} isActive={pathname.startsWith("/cms/settings/logos")} adminOnly isAdmin={isAdmin} onClick={closeSidebarOnMobile}>
                      Logos
                    </NavItem>
-                    <NavItem href="/cms/settings/copyright" icon={CopyrightIcon} isActive={pathname.startsWith("/cms/settings/copyright")} adminOnly isAdmin={isAdmin}>
+                    <NavItem href="/cms/settings/copyright" icon={CopyrightIcon} isActive={pathname.startsWith("/cms/settings/copyright")} adminOnly isAdmin={isAdmin} onClick={closeSidebarOnMobile}>
                       Copyright
                     </NavItem>
-                    <NavItem href="/cms/settings/extra-translations" icon={MessageSquare} isActive={pathname.startsWith("/cms/settings/extra-translations")} adminOnly isAdmin={isAdmin}>
+                    <NavItem href="/cms/settings/extra-translations" icon={MessageSquare} isActive={pathname.startsWith("/cms/settings/extra-translations")} adminOnly isAdmin={isAdmin} onClick={closeSidebarOnMobile}>
                       Extra Translations
                     </NavItem>
                  </CollapsibleNavItem>

package/templates/nextblock-template/app/cms/media/actions.ts

@@ -5,6 +5,8 @@ import { createClient } from "@nextblock-cms/db/server";
 import { revalidatePath } from "next/cache";
 import type { Database } from "@nextblock-cms/db";
 import { encodedRedirect } from "@nextblock-cms/utils/server";
+import { DeleteObjectCommand, DeleteObjectsCommand, CopyObjectCommand, ListObjectsV2Command, HeadObjectCommand } from "@aws-sdk/client-s3";
+import { getS3Client } from "@nextblock-cms/utils/server";
 
 type Media = Database['public']['Tables']['media']['Row'];
 
@@ -201,8 +203,6 @@ export async function deleteMediaItem(mediaId: string, objectKey: string) {
         return encodedRedirect("error", "/cms/media", "Forbidden: Insufficient permissions.");
     }
 
-    const { DeleteObjectCommand } = await import("@aws-sdk/client-s3");
-    const { getS3Client } = await import("@nextblock-cms/utils/server");
     const s3Client = await getS3Client();
     const R2_BUCKET_NAME = process.env.R2_BUCKET_NAME;
 
@@ -255,8 +255,6 @@ export async function deleteMultipleMediaItems(items: Array<{ id: string; object
     return { error: "No items selected for deletion." };
   }
 
-  const { DeleteObjectsCommand } = await import("@aws-sdk/client-s3"); // Use DeleteObjects for batch
-  const { getS3Client } = await import("@nextblock-cms/utils/server");
   const s3Client = await getS3Client();
   const R2_BUCKET_NAME = process.env.R2_BUCKET_NAME;
 
@@ -345,8 +343,6 @@ export async function moveMultipleMediaItems(
   };
   const folder = sanitizeFolder(destinationFolder);
 
-  const { CopyObjectCommand, DeleteObjectCommand, ListObjectsV2Command, HeadObjectCommand } = await import("@aws-sdk/client-s3");
-  const { getS3Client } = await import("@nextblock-cms/utils/server");
   const s3Client = await getS3Client();
   const R2_BUCKET_NAME = process.env.R2_BUCKET_NAME;
   const R2_PUBLIC_URL_BASE = process.env.NEXT_PUBLIC_R2_BASE_URL || '';

package/templates/nextblock-template/components/ResponsiveNav.tsx

@@ -348,26 +348,31 @@ export default function ResponsiveNav({
         {/* Menu Content (this part slides with the container above) */}
         <div className="fixed top-16 left-0 h-[calc(100vh-4rem)] w-full max-w-sm bg-background text-foreground shadow-xl p-5 z-50 flex flex-col">
           <nav className="flex-grow flex flex-col space-y-1 overflow-y-auto pt-6"> 
-            {renderMobileNavItems(hierarchicalNavItems)}
-            {canAccessCms && editPathDetails && (
-              <Link
-                href={editPathDetails.href}
-                className="block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-gray-100 dark:hover:bg-gray-700"
-                onClick={() => {
-                  toggleMobileMenu();
-                }}
-              >
-                {editPathDetails.label}
-              </Link>
-            )}
+            <div className="space-y-1">
+              {renderMobileNavItems(hierarchicalNavItems)}
+            </div>
+            
             {canAccessCms && (
-              <Link
-                href={cmsDashboardLinkHref}
-                className="block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-gray-100 dark:hover:bg-gray-700"
-                onClick={toggleMobileMenu}
-              >
-                {t('cms_dashboard')}
-              </Link>
+              <div className="mt-auto space-y-1 border-t border-gray-200 dark:border-gray-800">
+                {editPathDetails && (
+                  <Link
+                    href={editPathDetails.href}
+                    className="block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-gray-100 dark:hover:bg-gray-700"
+                    onClick={() => {
+                      toggleMobileMenu();
+                    }}
+                  >
+                    {editPathDetails.label}
+                  </Link>
+                )}
+                <Link
+                  href={cmsDashboardLinkHref}
+                  className="block px-3 py-2 rounded-md text-base font-medium text-foreground hover:bg-gray-100 dark:hover:bg-gray-700"
+                  onClick={toggleMobileMenu}
+                >
+                  {t('cms_dashboard')}
+                </Link>
+              </div>
             )}
           </nav>
 

package/templates/nextblock-template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextblock-cms/template",
-  "version": "0.2.53",
+  "version": "0.2.54",
   "private": true,
   "scripts": {
     "dev": "next dev",