@atlashub/smartstack-cli 4.48.0 → 4.49.0

package/templates/skills/business-analyse-html/html/ba-interactive.html

@@ -378,13 +378,13 @@ body {
 .nav-icon-section { font-size: 0.5rem; color: var(--accent); }
 .nav-icon-resource { font-size: 0.7rem; color: var(--border-light); }
 .nav-resource-link {
-    cursor: default;
+    cursor: pointer;
     font-size: 0.72rem;
     color: var(--text-muted);
     padding-top: 0.2rem;
     padding-bottom: 0.2rem;
 }
-.nav-resource-link:hover { background: transparent; color: var(--text-muted); }
+.nav-resource-link:hover { background: var(--bg-hover); color: var(--accent); }
 .nav-resources { margin-left: 0.5rem; }
 
 
@@ -1031,6 +1031,44 @@ body {
     color: var(--text-muted);
 }
 
+/* ============================================
+   STRUCTURE LEGEND
+   ============================================ */
+.struct-legend {
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: 10px;
+    padding: 0.75rem 1rem;
+    margin-bottom: 1.25rem;
+}
+.struct-legend-title {
+    font-size: 0.8rem;
+    font-weight: 600;
+    color: var(--text-muted);
+    margin-bottom: 0.5rem;
+}
+.struct-legend-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 0.4rem 1.5rem;
+}
+.struct-legend-item {
+    font-size: 0.78rem;
+    color: var(--text-muted);
+    line-height: 1.4;
+}
+.struct-legend-code {
+    display: inline-block;
+    font-weight: 600;
+    color: var(--accent);
+    background: rgba(6,182,212,0.1);
+    padding: 0.05rem 0.4rem;
+    border-radius: 3px;
+    font-size: 0.72rem;
+    margin-right: 0.3rem;
+    font-family: monospace;
+}
+
 /* ============================================
    SECTION GROUPS (Hierarchical Mode)
    ============================================ */
@@ -2762,7 +2800,7 @@ function renderModuleNavItem(mod) {
                 html += '<div class="nav-children nav-resources">';
                 resources.forEach(function(res) {
                     var resName = typeof res === 'string' ? res : (res.code || res.name || '');
-                    html += '<a class="nav-item nav-resource-link">';
+                    html += '<a class="nav-item nav-resource-link" onclick="showSection(\'module-spec-' + code + '\');switchTab(\'' + code + '\',\'mock\');scrollToMockup(\'' + code + '\',\'' + section.code + '\')">';
                     html += '<span class="nav-icon nav-icon-resource">&#8226;</span> ' + escapeHtml(resName);
                     html += '</a>';
                 });
@@ -2785,6 +2823,18 @@ function renderModuleTabNavItem(code, tabId, label, badge) {
     '</a>';
 }
 
+function scrollToMockup(moduleCode, sectionCode) {
+    setTimeout(function() {
+        var el = document.getElementById('screen-' + moduleCode + '-' + sectionCode);
+        if (el) {
+            el.scrollIntoView({ behavior: 'smooth', block: 'start' });
+            el.style.outline = '2px solid var(--accent)';
+            el.style.borderRadius = '10px';
+            setTimeout(function() { el.style.outline = ''; el.style.borderRadius = ''; }, 2000);
+        }
+    }, 150);
+}
+
 /* ---------- Collapse/Expand ---------- */
 
 function toggleNavGroup(groupId) {
@@ -3916,7 +3966,16 @@ function renderModuleStructure(code) {
             '</div>';
     }
 
-    return sections.map(function(section) {
+    var legend = '<div class="struct-legend">' +
+        '<div class="struct-legend-title">&#9432; Types de sections</div>' +
+        '<div class="struct-legend-grid">' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">list</span> Page principale — grille de données avec filtres, tri et actions (créer, exporter)</div>' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">detail</span> Fiche détaillée — affichée au clic sur une ligne, avec onglets (infos, relations, historique)</div>' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">dashboard</span> Tableau de bord — KPIs, graphiques et métriques du module</div>' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">approve</span> Workflow — file de validation avec actions (approuver, rejeter, mettre en attente)</div>' +
+        '</div></div>';
+
+    return legend + sections.map(function(section) {
         var resources = section.resources || [];
         var sectionUCs = section.useCases || [];
         var sectionBRs = section.businessRules || [];
@@ -4295,7 +4354,7 @@ function renderScreenMockups(code) {
 
     return screens.map(function(screen, si) {
         var resources = screen.resources || [];
-        return '<div class="screen-section" style="margin-bottom:2rem;">' +
+        return '<div class="screen-section" id="screen-' + code + '-' + screen.sectionCode + '" style="margin-bottom:2rem;">' +
             '<h3 style="color:var(--text-bright);font-size:1rem;margin-bottom:1rem;">' +
             '<span style="color:var(--accent);">&#9656;</span> ' + escapeHtml(screen.sectionLabel || screen.sectionCode) +
             '</h3>' +

package/templates/skills/business-analyse-html/html/src/scripts/02-navigation.js

@@ -182,7 +182,7 @@ function renderModuleNavItem(mod) {
                 html += '<div class="nav-children nav-resources">';
                 resources.forEach(function(res) {
                     var resName = typeof res === 'string' ? res : (res.code || res.name || '');
-                    html += '<a class="nav-item nav-resource-link">';
+                    html += '<a class="nav-item nav-resource-link" onclick="showSection(\'module-spec-' + code + '\');switchTab(\'' + code + '\',\'mock\');scrollToMockup(\'' + code + '\',\'' + section.code + '\')">';
                     html += '<span class="nav-icon nav-icon-resource">&#8226;</span> ' + escapeHtml(resName);
                     html += '</a>';
                 });
@@ -205,6 +205,18 @@ function renderModuleTabNavItem(code, tabId, label, badge) {
     '</a>';
 }
 
+function scrollToMockup(moduleCode, sectionCode) {
+    setTimeout(function() {
+        var el = document.getElementById('screen-' + moduleCode + '-' + sectionCode);
+        if (el) {
+            el.scrollIntoView({ behavior: 'smooth', block: 'start' });
+            el.style.outline = '2px solid var(--accent)';
+            el.style.borderRadius = '10px';
+            setTimeout(function() { el.style.outline = ''; el.style.borderRadius = ''; }, 2000);
+        }
+    }, 150);
+}
+
 /* ---------- Collapse/Expand ---------- */
 
 function toggleNavGroup(groupId) {

package/templates/skills/business-analyse-html/html/src/scripts/05-render-specs.js

@@ -620,7 +620,16 @@ function renderModuleStructure(code) {
             '</div>';
     }
 
-    return sections.map(function(section) {
+    var legend = '<div class="struct-legend">' +
+        '<div class="struct-legend-title">&#9432; Types de sections</div>' +
+        '<div class="struct-legend-grid">' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">list</span> Page principale — grille de données avec filtres, tri et actions (créer, exporter)</div>' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">detail</span> Fiche détaillée — affichée au clic sur une ligne, avec onglets (infos, relations, historique)</div>' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">dashboard</span> Tableau de bord — KPIs, graphiques et métriques du module</div>' +
+        '<div class="struct-legend-item"><span class="struct-legend-code">approve</span> Workflow — file de validation avec actions (approuver, rejeter, mettre en attente)</div>' +
+        '</div></div>';
+
+    return legend + sections.map(function(section) {
         var resources = section.resources || [];
         var sectionUCs = section.useCases || [];
         var sectionBRs = section.businessRules || [];

package/templates/skills/business-analyse-html/html/src/scripts/06-render-mockups.js

@@ -11,7 +11,7 @@ function renderScreenMockups(code) {
 
     return screens.map(function(screen, si) {
         var resources = screen.resources || [];
-        return '<div class="screen-section" style="margin-bottom:2rem;">' +
+        return '<div class="screen-section" id="screen-' + code + '-' + screen.sectionCode + '" style="margin-bottom:2rem;">' +
             '<h3 style="color:var(--text-bright);font-size:1rem;margin-bottom:1rem;">' +
             '<span style="color:var(--accent);">&#9656;</span> ' + escapeHtml(screen.sectionLabel || screen.sectionCode) +
             '</h3>' +

package/templates/skills/business-analyse-html/html/src/styles/03-navigation.css

@@ -110,11 +110,11 @@
 .nav-icon-section { font-size: 0.5rem; color: var(--accent); }
 .nav-icon-resource { font-size: 0.7rem; color: var(--border-light); }
 .nav-resource-link {
-    cursor: default;
+    cursor: pointer;
     font-size: 0.72rem;
     color: var(--text-muted);
     padding-top: 0.2rem;
     padding-bottom: 0.2rem;
 }
-.nav-resource-link:hover { background: transparent; color: var(--text-muted); }
+.nav-resource-link:hover { background: var(--bg-hover); color: var(--accent); }
 .nav-resources { margin-left: 0.5rem; }

package/templates/skills/business-analyse-html/html/src/styles/05-modules.css

@@ -443,6 +443,44 @@
     color: var(--text-muted);
 }
 
+/* ============================================
+   STRUCTURE LEGEND
+   ============================================ */
+.struct-legend {
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: 10px;
+    padding: 0.75rem 1rem;
+    margin-bottom: 1.25rem;
+}
+.struct-legend-title {
+    font-size: 0.8rem;
+    font-weight: 600;
+    color: var(--text-muted);
+    margin-bottom: 0.5rem;
+}
+.struct-legend-grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 0.4rem 1.5rem;
+}
+.struct-legend-item {
+    font-size: 0.78rem;
+    color: var(--text-muted);
+    line-height: 1.4;
+}
+.struct-legend-code {
+    display: inline-block;
+    font-weight: 600;
+    color: var(--accent);
+    background: rgba(6,182,212,0.1);
+    padding: 0.05rem 0.4rem;
+    border-radius: 3px;
+    font-size: 0.72rem;
+    margin-right: 0.3rem;
+    font-family: monospace;
+}
+
 /* ============================================
    SECTION GROUPS (Hierarchical Mode)
    ============================================ */

package/templates/skills/controller/references/mcp-scaffold-workflow.md

@@ -220,14 +220,18 @@ console.log(`✅ All checks passed — controller ready for step-04`);
 If MCP doesn't generate [NavRoute] attribute:
 
 ```csharp
-// Manually add if missing:
+// Manually add — REPLACE [Route] with [NavRoute], do NOT keep both (causes 404s):
 [ApiController]
-[Route("api/[controller]")]
-[NavRoute("app.module.resource")]  // <-- Add this line
+[NavRoute("app.module.resource")]
+[Microsoft.AspNetCore.Authorization.Authorize]
+[Produces("application/json")]
+[Tags("{EntityNamePlural}")]
 public class {EntityName}Controller : ControllerBase
 {
   // ...
 }
 ```
 
-But this indicates MCP failure and should not be needed in normal operation.
+**CRITICAL:** Remove `[Route("api/...")]` if present — combining `[Route]` and `[NavRoute]` causes 404 errors.
+
+This indicates MCP failure and should not be needed in normal operation.

package/templates/skills/controller/steps/step-05-validate.md

@@ -40,8 +40,8 @@ mcp__smartstack__validate_conventions:
 
 | Convention | Check | Status |
 |------------|-------|--------|
-| Route attribute | `[Route("api/{area}/[controller]")]` | ✅/❌ |
-| Authorize attribute | `[Authorize]` present | ✅/❌ |
+| NavRoute attribute | `[NavRoute("{app}.{module}")]` present (NOT `[Route]`) | ✅/❌ |
+| Authorize attribute | `[Microsoft.AspNetCore.Authorization.Authorize]` (fully qualified) | ✅/❌ |
 | RequirePermission | Uses `Permissions.*` constants | ✅/❌ |
 | ProducesResponseType | All endpoints documented | ✅/❌ |
 | Logging | All CRUD operations logged | ✅/❌ |

package/templates/skills/controller/templates.md

@@ -30,12 +30,13 @@ using SmartStack.Domain.{DomainNamespace};
 namespace SmartStack.Api.Controllers.{Area};
 
 [ApiController]
-[Route("api/{area-kebab}/{module-kebab}")]
-[Authorize]
+[NavRoute("{area}.{module}")]
+[Microsoft.AspNetCore.Authorization.Authorize]
+[Produces("application/json")]
 [Tags("{Module}")]
 public class {Module}Controller : ControllerBase
 {
-    private readonly IApplicationDbContext _context;
+    private readonly ISender _mediator;  // MediatR — NOT IApplicationDbContext
     private readonly ICurrentUserService _currentUser;
     private readonly ILogger<{Module}Controller> _logger;
 

package/templates/skills/feature-full/steps/step-01-implementation.md

@@ -58,15 +58,28 @@ services.AddScoped<I{Entity}Service, {Entity}Service>();
 ## Phase 5: API
 
 ```csharp
-[ApiController][Route("api/{area}/{module}")][Authorize]
+[ApiController]
+[NavRoute("{area}.{module}")]
+[Microsoft.AspNetCore.Authorization.Authorize]
+[Produces("application/json")]
+[Tags("{EntityPlural}")]
 public class {Entity}Controller : ControllerBase
 {
-    [HttpGet][RequirePermission(Permissions.{Area}.{Module}.View)]
-    [ProducesResponseType(typeof(PaginatedResult<{Entity}Dto>), 200)]
+    private readonly ISender _mediator;
+
+    [HttpGet]
+    [RequirePermission(Permissions.{Area}.{Module}.View)]
+    [ProducesResponseType(typeof(PaginatedResult<{Entity}Dto>), StatusCodes.Status200OK)]
+    [ProducesResponseType(StatusCodes.Status401Unauthorized)]
+    [ProducesResponseType(StatusCodes.Status403Forbidden)]
     public async Task<ActionResult<PaginatedResult<{Entity}Dto>>> GetAll(...);
 
-    [HttpPost][RequirePermission(Permissions.{Area}.{Module}.Create)]
-    [ProducesResponseType(typeof({Entity}Dto), 201)]
+    [HttpPost]
+    [RequirePermission(Permissions.{Area}.{Module}.Create)]
+    [ProducesResponseType(typeof({Entity}Dto), StatusCodes.Status201Created)]
+    [ProducesResponseType(StatusCodes.Status400BadRequest)]
+    [ProducesResponseType(StatusCodes.Status401Unauthorized)]
+    [ProducesResponseType(StatusCodes.Status403Forbidden)]
     public async Task<ActionResult<{Entity}Dto>> Create([FromBody] request, CancellationToken ct);
 }
 ```