From dd3480507150b6eb35544bf7ec16a553c0b6ca0b Mon Sep 17 00:00:00 2001
From: Zef Hemel <zef@zef.me>
Date: Thu, 24 Nov 2022 17:09:05 +0100
Subject: [PATCH] Revert page name when page name element blurs

---
 web/components/top_bar.tsx | 12 +++++++++---
 web/editor.tsx             |  3 +++
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/web/components/top_bar.tsx b/web/components/top_bar.tsx
index 7bd14fb0..0ae9b062 100644
--- a/web/components/top_bar.tsx
+++ b/web/components/top_bar.tsx
@@ -38,14 +38,14 @@ export function TopBar({
   unsavedChanges: boolean;
   isLoading: boolean;
   notifications: Notification[];
-  onRename: (newName: string) => void;
+  onRename: (newName?: string) => void;
   actionButtons: ActionButton[];
   lhs?: ComponentChildren;
   rhs?: ComponentChildren;
 }) {
-  const [theme, setTheme] = useState<string>(localStorage.theme ?? "light");
+  // const [theme, setTheme] = useState<string>(localStorage.theme ?? "light");
   const inputRef = useRef<HTMLInputElement>(null);
-  const isMac = isMacLike();
+  // const isMac = isMacLike();
 
   return (
     <div id="sb-top">
@@ -66,6 +66,9 @@ export function TopBar({
               ref={inputRef}
               value={pageName}
               className="sb-edit-page-name"
+              onBlur={(e) => {
+                (e.target as any).value = pageName;
+              }}
               onKeyDown={(e) => {
                 e.stopPropagation();
                 if (e.key === "Enter") {
@@ -73,6 +76,9 @@ export function TopBar({
                   const newName = (e.target as any).value;
                   onRename(newName);
                 }
+                if (e.key === "Escape") {
+                  onRename();
+                }
               }}
             />
           </span>
diff --git a/web/editor.tsx b/web/editor.tsx
index 6314d310..a04805cc 100644
--- a/web/editor.tsx
+++ b/web/editor.tsx
@@ -838,6 +838,9 @@ export class Editor {
           unsavedChanges={viewState.unsavedChanges}
           isLoading={viewState.isLoading}
           onRename={(newName) => {
+            if (!newName) {
+              return editor.focus();
+            }
             console.log("Now renaming page to...", newName);
             editor.system.loadedPlugs.get("core")!.invoke(
               "renamePage",