From acead212b2ec84e6f836719378d76c3bff69fe40 Mon Sep 17 00:00:00 2001
From: Joseph Doherty <dohejw01@gmail.com>
Date: Mon, 11 May 2026 12:20:40 -0400
Subject: [PATCH] fix(ui/templates): dereference string params with @ and stack
 toolbar below title
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Smoke testing revealed two issues introduced by the modal extraction commit:

1. ErrorMessage / InitialName / TemplateName parameters on the dialog
   components were passed as bare strings (e.g. ErrorMessage="_newFolderError")
   instead of dereferenced C# expressions (ErrorMessage="@_newFolderError").
   Razor treats unquoted-but-not-@-prefixed values to string parameters as
   string literals — so the error block rendered the literal field name in
   red whenever the modal opened. Non-string parameters (int/IEnumerable)
   were fine since Razor treats those as C# expressions by default.

2. The Templates header + 4-button toolbar shared one flex row, but at
   col-md-4 / col-lg-3 width the buttons overflowed into the right-column
   empty-state area. Stack title above a full-width btn-group instead.
---
 .../Components/Pages/Design/Templates.razor   | 30 +++++++++----------
 1 file changed, 14 insertions(+), 16 deletions(-)

diff --git a/src/ScadaLink.CentralUI/Components/Pages/Design/Templates.razor b/src/ScadaLink.CentralUI/Components/Pages/Design/Templates.razor
index 16d71d6..4a30f00 100644
--- a/src/ScadaLink.CentralUI/Components/Pages/Design/Templates.razor
+++ b/src/ScadaLink.CentralUI/Components/Pages/Design/Templates.razor
@@ -21,25 +21,25 @@
 
     <RenameFolderDialog @bind-IsVisible="_showRenameFolderDialog"
                         FolderId="_renameFolderId"
-                        InitialName="_renameFolderInitialName"
-                        ErrorMessage="_renameFolderError"
+                        InitialName="@_renameFolderInitialName"
+                        ErrorMessage="@_renameFolderError"
                         OnSubmit="SubmitRenameFolder" />
 
     <NewFolderDialog @bind-IsVisible="_showNewFolderDialog"
                      ParentFolderId="_newFolderParentId"
-                     ErrorMessage="_newFolderError"
+                     ErrorMessage="@_newFolderError"
                      OnSubmit="SubmitNewFolder" />
 
     <NewTemplateDialog @bind-IsVisible="_showNewTemplateDialog"
                        FolderId="_newTemplateFolderId"
-                       ErrorMessage="_newTemplateError"
+                       ErrorMessage="@_newTemplateError"
                        OnSubmit="SubmitNewTemplate" />
 
     <MoveTemplateDialog @bind-IsVisible="_showMoveTemplateDialog"
                         TemplateId="_moveTemplateId"
-                        TemplateName="_moveTemplateName"
+                        TemplateName="@_moveTemplateName"
                         FolderOptions="EnumerateFolderOptions()"
-                        ErrorMessage="_moveTemplateError"
+                        ErrorMessage="@_moveTemplateError"
                         OnSubmit="SubmitMoveTemplate" />
 
     @if (_loading)
@@ -54,16 +54,14 @@
     {
         <div class="row g-2">
             <div class="col-md-4 col-lg-3">
-                <div class="d-flex justify-content-between align-items-center mb-2">
-                    <h6 class="mb-0">Templates</h6>
-                    <div class="btn-group btn-group-sm">
-                        <button class="btn btn-outline-secondary" title="New folder at root"
-                                @onclick="() => OpenNewFolderDialog(null)">+ Folder</button>
-                        <button class="btn btn-outline-secondary" title="New template at root"
-                                @onclick="() => OpenNewTemplateDialog(null)">+ Template</button>
-                        <button class="btn btn-outline-secondary" @onclick="() => _tree.ExpandAll()">Expand</button>
-                        <button class="btn btn-outline-secondary" @onclick="() => _tree.CollapseAll()">Collapse</button>
-                    </div>
+                <h6 class="mb-2">Templates</h6>
+                <div class="btn-group btn-group-sm w-100 mb-2">
+                    <button class="btn btn-outline-secondary" title="New folder at root"
+                            @onclick="() => OpenNewFolderDialog(null)">+ Folder</button>
+                    <button class="btn btn-outline-secondary" title="New template at root"
+                            @onclick="() => OpenNewTemplateDialog(null)">+ Template</button>
+                    <button class="btn btn-outline-secondary" @onclick="() => _tree.ExpandAll()">Expand</button>
+                    <button class="btn btn-outline-secondary" @onclick="() => _tree.CollapseAll()">Collapse</button>
                 </div>
 
                 <div style="max-height: calc(100vh - 160px); overflow-y: auto;">