From e5edc372fe1d994d4d66d1e2acdac4a70203222c Mon Sep 17 00:00:00 2001
From: Michal Vrba <m.vrba@retailsoft.sk>
Date: Fri, 30 Jan 2026 18:38:21 +0100
Subject: [PATCH] Add "New Document" button and Ctrl+N shortcut

Added a "New Document" button to the editor's top bar with distinct styling. Implemented Ctrl+N/Cmd+N keyboard shortcut to create a new document. Prompt user for confirmation if there are unsaved changes. Updated CSS to style the new button and integrated it into button style rules.
---
 Notemark/Components/Pages/Editor.razor     | 40 ++++++++++++++++++++++
 Notemark/Components/Pages/Editor.razor.css | 16 ++++++++-
 2 files changed, 55 insertions(+), 1 deletion(-)

diff --git a/Notemark/Components/Pages/Editor.razor b/Notemark/Components/Pages/Editor.razor
index 77f0105..977ef96 100644
--- a/Notemark/Components/Pages/Editor.razor
+++ b/Notemark/Components/Pages/Editor.razor
@@ -13,6 +13,9 @@
     <!-- Top Bar -->
     <div class="top-bar">
         <div class="top-bar-left">
+            <button class="btn-new" @onclick="NewDocument" title="Create new document (Ctrl+N)">
+                📄 New
+            </button>
             <button class="btn-toggle @(showPreview ? "active" : "")" 
                     @onclick="TogglePreview">
                 👁️ @(showPreview ? "Hide Preview" : "Show Preview")
@@ -233,6 +236,11 @@
         {
             await ManualSave();
         }
+        // Ctrl+N or Cmd+N for new document
+        else if ((e.CtrlKey || e.MetaKey) && e.Key == "n")
+        {
+            await NewDocument();
+        }
     }
 
     private async Task ManualSave()
@@ -240,6 +248,38 @@
         await SaveContent();
     }
 
+    private async Task NewDocument()
+    {
+        // Ask for confirmation if there are unsaved changes
+        if (hasUnsavedChanges)
+        {
+            bool confirmed = await JSRuntime.InvokeAsync<bool>("confirm", 
+                "You have unsaved changes. Are you sure you want to create a new document?");
+            if (!confirmed)
+                return;
+        }
+
+        // Simple approach: Clear current session content
+        markdownContent = "";
+        renderedHtml = "";
+        hasUnsavedChanges = false;
+        saveStatus = "New Document";
+        
+        // Save empty content to current session
+        if (!string.IsNullOrEmpty(sessionId))
+        {
+            await SessionService.SaveSessionContentAsync(sessionId, "");
+        }
+        
+        // Update UI
+        await InvokeAsync(StateHasChanged);
+        
+        // Reset save status after a moment
+        await Task.Delay(1500);
+        saveStatus = "Saved";
+        await InvokeAsync(StateHasChanged);
+    }
+
     private async Task ToggleShareDropdown()
     {
         if (!showShareDropdown)
diff --git a/Notemark/Components/Pages/Editor.razor.css b/Notemark/Components/Pages/Editor.razor.css
index e7b1ff5..6c8aa65 100644
--- a/Notemark/Components/Pages/Editor.razor.css
+++ b/Notemark/Components/Pages/Editor.razor.css
@@ -36,6 +36,7 @@
 .btn-toggle,
 .btn-share,
 .btn-save,
+.btn-new,
 .btn-copy,
 .btn-close {
   background: none;
@@ -76,6 +77,18 @@
   transform: none;
 }
 
+.btn-new {
+  background-color: var(--success);
+  color: white;
+  border-color: var(--success);
+}
+
+.btn-new:hover {
+  background-color: var(--accent);
+  border-color: var(--accent);
+  transform: translateY(-1px);
+}
+
 .btn-toggle:hover,
 .btn-share:hover,
 .btn-copy:hover {
@@ -462,7 +475,8 @@
   
   .btn-toggle,
   .btn-share,
-  .btn-save {
+  .btn-save,
+  .btn-new {
     font-size: 0.75rem;
     padding: 0.375rem 0.75rem;
   }