@auto-engineer/frontend-generator-react-graphql 1.7.0 → 1.9.0

package/dist/src/generator/templates/page.ejs

@@ -1,16 +1,30 @@
-<% organisms.forEach(org => { -%>
-import { <%= org %> } from "@/components/organisms/<%= org %>";
-<% }) -%>
+<%
+  // Convert template name to PascalCase for import (define at top for use throughout)
+  const templateComponentName = template ? template.split(/[-_\s]+/).map(w => w.charAt(0).toUpperCase() + w.slice(1)).join('') : 'div';
+-%>
 <% if (template) { -%>
-import { <%= template.split(/[-_\s]+/).map(w => w.charAt(0).toUpperCase() + w.slice(1)).join('') %> } from "@/components/templates/<%= template %>";
+import { <%= templateComponentName %> } from "@/components/templates/<%= template %>";
 <% } -%>
 <% if (typeGuidance && typeGuidance.imports && typeGuidance.imports.length > 0) { -%>
 import { <%= typeGuidance.imports.join(', ') %> } from '@/gql/graphql';
 <% } -%>
 
+// PAGE: <%= name %>
+// Route: <%= route %>
 // <%= description %>
+//
+// Pages are specific instances of templates with real representative content.
+// They populate the template's layout structure with actual data and behavior.
+//
+<% if (template) { -%>
+// Template: <%= template %>
+<% if (templateDescription) { -%>
+// Template Purpose: <%= templateDescription %>
+<% } -%>
+<% } -%>
 <% if (specs && specs.length) { -%>
-// Specs:
+//
+// Page Specs:
 <% specs.forEach(spec => { -%>
 // - <%- spec %>
 <% }) -%>
@@ -21,6 +35,11 @@ import { <%= typeGuidance.imports.join(', ') %> } from '@/gql/graphql';
 // PAGE COMPOSITION - Spec Coverage Analysis
 // ──────────────────────────────────────────────────────────────────────────────
 //
+// This page uses the "<%= template %>" template which contains:
+<% organisms.forEach(org => { -%>
+// - <%= org %>
+<% }) -%>
+//
 <% if (specs && specs.length > 0) { -%>
 // YOUR SPECS (what this page must accomplish):
 //
@@ -28,39 +47,59 @@ import { <%= typeGuidance.imports.join(', ') %> } from '@/gql/graphql';
 <%   const coveredBy = organisms.find(org => organismSpecs[org]?.includes(spec)); -%>
 //   [<%= coveredBy ? '✓' : ' ' %>] <%= spec %>
 <%   if (coveredBy) { -%>
-//       └─ Implemented by <%= coveredBy %>
+//       └─ Implemented by <%= coveredBy %> (via template)
 <%   } -%>
 <% }); -%>
 //
 <% } -%>
-// Available Organisms:
+<% if (templateSpecs && templateSpecs.length > 0) { -%>
+// TEMPLATE LAYOUT SPECS (handled by template):
+//
+<% templateSpecs.forEach(spec => { -%>
+//   • <%= spec %>
+<% }); -%>
+//
+<% } -%>
+// Available Organisms (via template):
 //
 <% organisms.forEach(org => { -%>
 <%   const orgSpecs = organismSpecs[org]; -%>
 <%   if (orgSpecs && orgSpecs.length > 0) { -%>
 // **<%= org %>** capabilities:
-<%     orgSpecs.forEach(spec => { -%>
+<%     orgSpecs.slice(0, 5).forEach(spec => { -%>
 //   • <%= spec %>
 <%     }); -%>
+<%     if (orgSpecs.length > 5) { -%>
+//   • ... and <%= orgSpecs.length - 5 %> more specs
+<%     } -%>
 //
 <%   } else { -%>
 // **<%= org %>**
-//   (Organism with specific purpose - compose as needed)
+//   (Organism with specific purpose)
 //
 <%   } -%>
 <% }); -%>
-// Composition Rules:
+// Page Responsibilities:
 //
-// 1. ✓ Checked specs = already implemented by organism
-// 2. [ ] Unchecked specs = your responsibility
-// 3. Your job: compose organisms into page layout
+// 1. ✓ Checked specs = implemented by organism in template
+// 2. [ ] Unchecked specs = your responsibility to implement
+// 3. Pages provide real data to populate template structure
+// 4. Handle page-level navigation and routing
+// 5. Manage page-specific state if needed
 //
 <% } -%>
+<% if (navigation && navigation.length > 0) { -%>
+//
+// NAVIGATION:
+<% navigation.forEach(nav => { -%>
+// - On "<%= nav.on %>" → Navigate to <%= nav.to %>
+<% }) -%>
+<% } -%>
 <% if (typeGuidance && (typeGuidance.queryGuidance.length > 0 || typeGuidance.mutationGuidance.length > 0 || typeGuidance.enumGuidance.length > 0)) { -%>
 //
-// CRITICAL - TYPE GUIDANCE - Child organism data requirements
+// CRITICAL - TYPE GUIDANCE - Data requirements for this page
 //
-// The following operations are used by child organisms.
+// The following operations are used by organisms in this page's template.
 // You can either:
 //   A) Fetch here and pass as props (recommended for shared data/mutations)
 //   B) Let each organism fetch its own data (simpler, but may duplicate queries)
@@ -81,35 +120,60 @@ import { <%= typeGuidance.imports.join(', ') %> } from '@/gql/graphql';
 <% }) -%>
 <% } -%>
 //
-// CRITICAL - CONTAINER-AWARE RESPONSIVE DESIGN:
-//
-// THIS COMPONENT WILL BE USED IN UNPREDICTABLE CONTAINER SIZES:
-// - Narrow sidebars: 300-400px
-// - Medium containers: 500-800px
-// - Wide layouts: 800px+
-// - Mobile viewports: 320-640px
-// - Flex layouts where space is shared with siblings (flex-1)
-//
-// 🎯 MANDATORY RESPONSIVE PATTERNS:
-//
-// 1. GRIDS: Always start mobile-first, progressively enhance
-//    WRONG: grid grid-cols-3
-//    RIGHT: grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3
-//
-// 2. TEXT SIZING: Use responsive classes, never fixed large sizes
-//    WRONG: text-5xl (too big for narrow containers)
-//    RIGHT: text-2xl sm:text-3xl lg:text-4xl
-//
-// 3. FLEX LAYOUTS: Prefer flex-col with responsive row breakpoints
-//    RIGHT: flex flex-col lg:flex-row gap-4
-//
-// 4. PREVENT OVERFLOW: Use min-w-0 and truncation
-//    RIGHT: min-w-0 truncate OR overflow-hidden
-//
-// 5. MENTAL TEST: Would this work in a 320px wide container?
-//    If no → make it responsive!
+// ------------------------------------------------------------------------------
+// PAGE-LEVEL CONSIDERATIONS & VISUAL REQUIREMENTS
+// ------------------------------------------------------------------------------
+//
+// As a PAGE (not a template or component), this component:
+// - Is the entry point for route "<%= route %>"
+// - Should handle route parameters if needed
+// - May coordinate data fetching for child organisms
+// - Should handle page-level loading and error states
+//
+// VISUAL REQUIREMENTS FOR PAGES:
+//
+// LOADING STATES (use beautiful skeletons, not spinners):
+//   - Use Skeleton components that match the layout of actual content
+//   - Include skeletons for title, grid items, and other key elements
+//   - Maintain the same spacing and structure as loaded state
+//   - Example pattern:
+//     if (loading) return (
+//       <<%= template ? templateComponentName : 'div' %>>
+//         {/* Skeleton layout matching content structure */}
+//       </<%= template ? templateComponentName : 'div' %>>
+//     );
+//
+// ERROR STATES (user-friendly, not technical):
+//   - Center the error message vertically and horizontally
+//   - Include an error icon with appropriate styling
+//   - Use clear, non-technical language
+//   - Provide a recovery action (refresh, go back, etc.)
+//   - Example pattern:
+//     if (error) return (
+//       <<%= template ? templateComponentName : 'div' %>>
+//         {/* Centered error with icon, message, and action button */}
+//       </<%= template ? templateComponentName : 'div' %>>
+//     );
+//
+// IMPLEMENTATION PATTERN:
+//
+// 1. SIMPLE PAGE (template handles everything):
+//    return <<%= template ? templateComponentName : 'div' %> />;
+//
+// 2. PAGE WITH PROPS/CHILDREN (pass additional content):
+//    return (
+//      <<%= template ? templateComponentName : 'div' %>>
+//        {/* Additional page-specific content */}
+//      </<%= template ? templateComponentName : 'div' %>>
+//    );
+//
+// 3. PAGE WITH DATA FETCHING (with beautiful loading/error states):
+//    const { data, loading, error } = useQuery(SomeQuery);
+//    if (loading) return <PageSkeleton />;  // Custom skeleton component
+//    if (error) return <PageError error={error} />;  // Custom error component
+//    return <<%= template ? templateComponentName : 'div' %> data={data} />;
 //
 
 export function <%= name %>() {
-    return <div />;
-}
+    return <<%= templateComponentName %> />;
+}

package/dist/src/generator/templates/page.ejs.specs.js

@@ -7,33 +7,43 @@ const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 const pageTemplate = fs.readFileSync(path.resolve(__dirname, 'page.ejs'), 'utf-8');
 describe('page.ejs', () => {
-    it('should generate a basic page with organisms and no type guidance', () => {
+    it('should generate a basic page with template and organisms', () => {
         const content = ejs.render(pageTemplate, {
             name: 'Dashboard',
             description: 'Main dashboard page',
             organisms: ['StatsOverview', 'ActivityFeed'],
-            template: undefined,
+            template: 'DashboardTemplate',
+            templateDescription: 'Dashboard layout with stats and activity',
+            templateSpecs: [],
+            route: '/dashboard',
+            navigation: [],
             specs: [],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {},
         });
-        expect(content).toContain('import { StatsOverview } from "@/components/organisms/StatsOverview";');
-        expect(content).toContain('import { ActivityFeed } from "@/components/organisms/ActivityFeed";');
+        expect(content).toContain('import { DashboardTemplate } from "@/components/templates/DashboardTemplate";');
         expect(content).toContain('// Main dashboard page');
         expect(content).toContain('PAGE COMPOSITION');
         expect(content).toContain('export function Dashboard()');
+        expect(content).toContain('return <DashboardTemplate />');
     });
     it('should generate a page with organisms and specs', () => {
         const content = ejs.render(pageTemplate, {
             name: 'AdminPanel',
             description: 'Admin control panel',
             organisms: ['UserManagement', 'SystemSettings'],
-            template: undefined,
+            template: 'AdminTemplate',
+            templateDescription: 'Admin layout template',
+            templateSpecs: [],
+            route: '/admin',
+            navigation: [],
             specs: ['manage users', 'configure system'],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {},
         });
-        expect(content).toContain('// Specs:');
+        expect(content).toContain('// Page Specs:');
         expect(content).toContain('// - manage users');
         expect(content).toContain('// - configure system');
         expect(content).toContain('PAGE COMPOSITION');
@@ -43,8 +53,13 @@ describe('page.ejs', () => {
             name: 'UserProfile',
             description: 'User profile page',
             organisms: ['ProfileHeader', 'ProfileDetails'],
-            template: undefined,
+            template: 'ProfileTemplate',
+            templateDescription: 'Profile page layout',
+            templateSpecs: [],
+            route: '/profile',
+            navigation: [],
             specs: ['display user info', 'show activity history'],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {
                 ProfileHeader: ['display user info'],
@@ -53,29 +68,40 @@ describe('page.ejs', () => {
         });
         expect(content).toContain('YOUR SPECS (what this page must accomplish):');
         expect(content).toContain('[✓] display user info');
-        expect(content).toContain('└─ Implemented by ProfileHeader');
+        expect(content).toContain('└─ Implemented by ProfileHeader (via template)');
         expect(content).toContain('[✓] show activity history');
-        expect(content).toContain('└─ Implemented by ProfileDetails');
+        expect(content).toContain('└─ Implemented by ProfileDetails (via template)');
     });
-    it('should generate a page with template import', () => {
+    it('should generate a page with template import using PascalCase conversion', () => {
         const content = ejs.render(pageTemplate, {
             name: 'Settings',
             description: 'Settings page',
             organisms: ['GeneralSettings'],
             template: 'single-column-layout',
+            templateDescription: 'Single column layout template',
+            templateSpecs: [],
+            route: '/settings',
+            navigation: [],
             specs: [],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {},
         });
         expect(content).toContain('import { SingleColumnLayout } from "@/components/templates/single-column-layout";');
+        expect(content).toContain('return <SingleColumnLayout />');
     });
     it('should generate a page with type guidance', () => {
         const content = ejs.render(pageTemplate, {
             name: 'TodoList',
             description: 'Todo list page',
             organisms: ['TodoGrid'],
-            template: undefined,
+            template: 'TodoTemplate',
+            templateDescription: 'Todo page layout',
+            templateSpecs: [],
+            route: '/todos',
+            navigation: [],
             specs: ['display todos', 'filter by status'],
+            dataRequirements: [],
             typeGuidance: {
                 imports: ['Todo', 'TodoStatus'],
                 queryGuidance: [
@@ -97,8 +123,13 @@ describe('page.ejs', () => {
             name: 'TaskBoard',
             description: 'Task management board',
             organisms: ['TaskList', 'TaskFilters'],
-            template: undefined,
+            template: 'BoardTemplate',
+            templateDescription: 'Board layout template',
+            templateSpecs: [],
+            route: '/tasks',
+            navigation: [],
             specs: ['display tasks', 'filter by status', 'sort by date', 'search tasks'],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {
                 TaskList: ['display tasks', 'sort by date'],
@@ -106,21 +137,25 @@ describe('page.ejs', () => {
             },
         });
         expect(content).toContain('[✓] display tasks');
-        expect(content).toContain('└─ Implemented by TaskList');
+        expect(content).toContain('└─ Implemented by TaskList (via template)');
         expect(content).toContain('[✓] filter by status');
-        expect(content).toContain('└─ Implemented by TaskFilters');
+        expect(content).toContain('└─ Implemented by TaskFilters (via template)');
         expect(content).toContain('[✓] sort by date');
-        expect(content).toContain('└─ Implemented by TaskList');
+        expect(content).toContain('└─ Implemented by TaskList (via template)');
         expect(content).toContain('[ ] search tasks');
-        expect(content).not.toContain('search tasks\n//       └─');
     });
     it('should generate a page with NO spec coverage', () => {
         const content = ejs.render(pageTemplate, {
             name: 'Analytics',
             description: 'Analytics dashboard',
             organisms: ['ChartPanel', 'MetricsPanel'],
-            template: undefined,
+            template: 'AnalyticsTemplate',
+            templateDescription: 'Analytics layout template',
+            templateSpecs: [],
+            route: '/analytics',
+            navigation: [],
             specs: ['show revenue chart', 'display user metrics', 'export data'],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {
                 ChartPanel: ['render line chart', 'render bar chart'],
@@ -131,15 +166,19 @@ describe('page.ejs', () => {
         expect(content).toContain('[ ] display user metrics');
         expect(content).toContain('[ ] export data');
         expect(content).not.toContain('[✓]');
-        expect(content).not.toContain('└─ Implemented by');
     });
     it('should generate a page with mutation guidance', () => {
         const content = ejs.render(pageTemplate, {
             name: 'CreateItem',
             description: 'Create item page',
             organisms: ['ItemForm'],
-            template: undefined,
+            template: 'FormTemplate',
+            templateDescription: 'Form page layout',
+            templateSpecs: [],
+            route: '/items/new',
+            navigation: [],
             specs: ['collect item data', 'submit item'],
+            dataRequirements: [],
             typeGuidance: {
                 imports: ['CreateItemInput'],
                 queryGuidance: [],
@@ -152,15 +191,20 @@ describe('page.ejs', () => {
         });
         expect(content).toContain('CRITICAL - TYPE GUIDANCE');
         expect(content).toContain('Mutation - CreateItem:');
-        expect(content).toContain('Child organism data requirements');
+        expect(content).toContain('Data requirements for this page');
     });
     it('should generate a page with only mutation guidance (no queries)', () => {
         const content = ejs.render(pageTemplate, {
             name: 'DeleteConfirmation',
             description: 'Delete confirmation page',
             organisms: ['ConfirmDialog'],
-            template: undefined,
+            template: 'DialogTemplate',
+            templateDescription: 'Dialog layout template',
+            templateSpecs: [],
+            route: '/delete/:id',
+            navigation: [],
             specs: ['confirm deletion'],
+            dataRequirements: [],
             typeGuidance: {
                 imports: [],
                 queryGuidance: [],
@@ -181,7 +225,12 @@ describe('page.ejs', () => {
             description: 'Product catalog page',
             organisms: ['ProductGrid', 'ProductFilters'],
             template: 'two-column-layout',
+            templateDescription: 'Two column layout with sidebar',
+            templateSpecs: ['responsive sidebar', 'main content area'],
+            route: '/products',
+            navigation: [],
             specs: ['display products', 'filter products'],
+            dataRequirements: [],
             typeGuidance: {
                 imports: ['Product'],
                 queryGuidance: [
@@ -199,30 +248,59 @@ describe('page.ejs', () => {
         expect(content).toContain('CRITICAL - TYPE GUIDANCE');
         expect(content).toContain('[✓] display products');
         expect(content).toContain('[✓] filter products');
+        expect(content).toContain('return <TwoColumnLayout />');
     });
-    it('should include responsive design guidance', () => {
+    it('should include template specs when available', () => {
+        const content = ejs.render(pageTemplate, {
+            name: 'DashboardPage',
+            description: 'Main dashboard',
+            organisms: ['Header', 'Content'],
+            template: 'DashboardLayout',
+            templateDescription: 'Dashboard layout with header and content areas',
+            templateSpecs: ['fixed header', 'scrollable content area', 'responsive sidebar'],
+            route: '/',
+            navigation: [],
+            specs: [],
+            dataRequirements: [],
+            typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
+            organismSpecs: {},
+        });
+        expect(content).toContain('TEMPLATE LAYOUT SPECS (handled by template):');
+        expect(content).toContain('• fixed header');
+        expect(content).toContain('• scrollable content area');
+        expect(content).toContain('• responsive sidebar');
+    });
+    it('should include page-level considerations', () => {
         const content = ejs.render(pageTemplate, {
             name: 'SimpleList',
             description: 'Simple list page',
             organisms: ['ItemList'],
-            template: undefined,
+            template: 'ListTemplate',
+            templateDescription: 'List page layout',
+            templateSpecs: [],
+            route: '/items',
+            navigation: [],
             specs: ['show items'],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {},
         });
-        expect(content).toContain('CRITICAL - CONTAINER-AWARE RESPONSIVE DESIGN:');
-        expect(content).toContain('GRIDS: Always start mobile-first');
-        expect(content).toContain('grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3');
-        expect(content).toContain('TEXT SIZING: Use responsive classes');
-        expect(content).toContain('MENTAL TEST: Would this work in a 320px wide container?');
+        expect(content).toContain('PAGE-LEVEL CONSIDERATIONS & VISUAL REQUIREMENTS');
+        expect(content).toContain('Is the entry point for route "/items"');
+        expect(content).toContain('IMPLEMENTATION PATTERN');
     });
     it('should handle organisms without organismSpecs data', () => {
         const content = ejs.render(pageTemplate, {
             name: 'MixedPage',
             description: 'Page with documented and undocumented organisms',
             organisms: ['DocumentedOrg', 'UndocumentedOrg'],
-            template: undefined,
+            template: 'MixedTemplate',
+            templateDescription: 'Mixed content template',
+            templateSpecs: [],
+            route: '/mixed',
+            navigation: [],
             specs: ['feature A', 'feature B'],
+            dataRequirements: [],
             typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
             organismSpecs: {
                 DocumentedOrg: ['feature A'],
@@ -231,7 +309,29 @@ describe('page.ejs', () => {
         expect(content).toContain('**DocumentedOrg** capabilities:');
         expect(content).toContain('• feature A');
         expect(content).toContain('**UndocumentedOrg**');
-        expect(content).toContain('(Organism with specific purpose - compose as needed)');
+        expect(content).toContain('(Organism with specific purpose)');
+    });
+    it('should include navigation information', () => {
+        const content = ejs.render(pageTemplate, {
+            name: 'ProductPage',
+            description: 'Product detail page',
+            organisms: ['ProductDetails'],
+            template: 'DetailTemplate',
+            templateDescription: 'Detail page layout',
+            templateSpecs: [],
+            route: '/product/:id',
+            navigation: [
+                { on: 'Click Back', to: 'ProductListPage' },
+                { on: 'Click Buy', to: 'CheckoutPage' },
+            ],
+            specs: [],
+            dataRequirements: [],
+            typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
+            organismSpecs: {},
+        });
+        expect(content).toContain('NAVIGATION:');
+        expect(content).toContain('On "Click Back" → Navigate to ProductListPage');
+        expect(content).toContain('On "Click Buy" → Navigate to CheckoutPage');
     });
     describe('Edge Cases', () => {
         it('should handle empty organisms array', () => {
@@ -239,26 +339,37 @@ describe('page.ejs', () => {
                 name: 'EmptyPage',
                 description: 'Page without organisms',
                 organisms: [],
-                template: undefined,
+                template: 'EmptyTemplate',
+                templateDescription: 'Empty page layout',
+                templateSpecs: [],
+                route: '/empty',
+                navigation: [],
                 specs: [],
+                dataRequirements: [],
                 typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
                 organismSpecs: {},
             });
             expect(content).not.toContain('PAGE COMPOSITION');
-            expect(content).not.toContain('Composition Rules');
+            expect(content).not.toContain('Page Responsibilities');
             expect(content).toContain('export function EmptyPage()');
+            expect(content).toContain('return <EmptyTemplate />');
         });
         it('should handle undefined specs gracefully', () => {
             const content = ejs.render(pageTemplate, {
                 name: 'NoSpecs',
                 description: 'Page without specs',
                 organisms: ['SomeOrganism'],
-                template: undefined,
+                template: 'BasicTemplate',
+                templateDescription: 'Basic layout',
+                templateSpecs: [],
+                route: '/no-specs',
+                navigation: [],
                 specs: undefined,
+                dataRequirements: [],
                 typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
                 organismSpecs: {},
             });
-            expect(content).not.toContain('// Specs:');
+            expect(content).not.toContain('// Page Specs:');
             expect(content).not.toContain('YOUR SPECS');
             expect(content).toContain('PAGE COMPOSITION');
         });
@@ -267,8 +378,13 @@ describe('page.ejs', () => {
                 name: 'EmptySpecs',
                 description: 'Organisms with no documented specs',
                 organisms: ['Org1', 'Org2'],
-                template: undefined,
+                template: 'BasicTemplate',
+                templateDescription: 'Basic layout',
+                templateSpecs: [],
+                route: '/empty-specs',
+                navigation: [],
                 specs: ['feature X', 'feature Y'],
+                dataRequirements: [],
                 typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
                 organismSpecs: {
                     Org1: [],
@@ -279,6 +395,24 @@ describe('page.ejs', () => {
             expect(content).toContain('[ ] feature Y');
             expect(content).not.toContain('[✓]');
         });
+        it('should handle page without template (fallback to div)', () => {
+            const content = ejs.render(pageTemplate, {
+                name: 'NoTemplatePage',
+                description: 'Page without template',
+                organisms: [],
+                template: undefined,
+                templateDescription: '',
+                templateSpecs: [],
+                route: '/no-template',
+                navigation: [],
+                specs: [],
+                dataRequirements: [],
+                typeGuidance: { imports: [], queryGuidance: [], mutationGuidance: [], enumGuidance: [] },
+                organismSpecs: {},
+            });
+            expect(content).not.toContain('import {');
+            expect(content).toContain('return <div />');
+        });
     });
 });
 //# sourceMappingURL=page.ejs.specs.js.map