From c56c9421b8d25166f85b15c42bd535418f43cd25 Mon Sep 17 00:00:00 2001
From: Tomofumi Chiba <tomofumi.chiba@gmail.com>
Date: Thu, 2 Nov 2023 18:12:38 +0900
Subject: [PATCH 1/2] add preview shortcut

---
 islands/PostEdit.tsx | 22 ++++++++++++++++++++++
 islands/PostNew.tsx  | 43 ++++++++++++++++++++++++++++++++++++-------
 routes/help.tsx      |  6 +++++-
 3 files changed, 63 insertions(+), 8 deletions(-)

diff --git a/islands/PostEdit.tsx b/islands/PostEdit.tsx
index 889e884..590448a 100644
--- a/islands/PostEdit.tsx
+++ b/islands/PostEdit.tsx
@@ -21,6 +21,7 @@ export default function Edit(props: { post: Post }) {
   }
 
   async function displayPreview() {
+    text.value = textarea.current.value;
     sanitizedHtml.value = await trpc.md2html.query({
       source: text.value,
     });
@@ -31,6 +32,12 @@ export default function Edit(props: { post: Post }) {
     (hljs as any).highlightAll();
   });
 
+  useEffect(() => {
+    if (textarea.current) {
+      textarea.current.focus();
+    }
+  }, textarea.current);
+
   useEffect(() => {
     if (!preview.value) {
       Mousetrap(textarea.current).bind(
@@ -40,6 +47,21 @@ export default function Edit(props: { post: Post }) {
           save();
         },
       );
+      Mousetrap(textarea.current).bind(
+        "mod+p",
+        () => {
+          displayPreview();
+          return false;
+        },
+      );
+    } else {
+      Mousetrap.bind(
+        "mod+p",
+        () => {
+          displayEdit();
+          return false;
+        },
+      );
     }
   }, [preview.value]);
 
diff --git a/islands/PostNew.tsx b/islands/PostNew.tsx
index 2ecb305..235fecd 100644
--- a/islands/PostNew.tsx
+++ b/islands/PostNew.tsx
@@ -13,9 +13,28 @@ export default function Post() {
   const sanitizedHtml = useSignal("");
   const textarea = createRef();
 
+  function displayEdit() {
+    preview.value = false;
+  }
+
+  async function displayPreview() {
+    text.value = textarea.current.value;
+    sanitizedHtml.value = await trpc.md2html.query({
+      source: text.value,
+    });
+    preview.value = true;
+  }
+
   useEffect(() => {
     (hljs as any).highlightAll();
   });
+
+  useEffect(() => {
+    if (textarea.current) {
+      textarea.current.focus();
+    }
+  }, textarea.current);
+
   useEffect(() => {
     if (!preview.value) {
       Mousetrap(textarea.current).bind(
@@ -25,6 +44,21 @@ export default function Post() {
           post();
         },
       );
+      Mousetrap(textarea.current).bind(
+        "mod+p",
+        () => {
+          displayPreview();
+          return false;
+        },
+      );
+    } else {
+      Mousetrap.bind(
+        "mod+p",
+        () => {
+          displayEdit();
+          return false;
+        },
+      );
     }
   }, [preview.value]);
 
@@ -50,7 +84,7 @@ export default function Post() {
               <a
                 class={!preview.value ? "nav-link active" : "nav-link"}
                 style={{ cursor: "pointer" }}
-                onClick={() => preview.value = false}
+                onClick={displayEdit}
               >
                 Edit
               </a>
@@ -59,12 +93,7 @@ export default function Post() {
               <a
                 class={preview.value ? "nav-link active" : "nav-link"}
                 style={{ cursor: "pointer" }}
-                onClick={async () => {
-                  sanitizedHtml.value = await trpc.md2html.query({
-                    source: text.value,
-                  });
-                  preview.value = true;
-                }}
+                onClick={displayPreview}
               >
                 Preview
               </a>
diff --git a/routes/help.tsx b/routes/help.tsx
index cf3f2f5..e4bffe9 100644
--- a/routes/help.tsx
+++ b/routes/help.tsx
@@ -105,7 +105,11 @@ export default defineRoute(async (req, _ctx) => {
               </tr>
               <tr>
                 <td>Send/Save Post</td>
-                <td>CTRL+Enter</td>
+                <td>(CTRL|⌘)+Enter</td>
+              </tr>
+              <tr>
+                <td>Switch between Preview and Edit</td>
+                <td>(CTRL|⌘)+p</td>
               </tr>
             </tbody>
           </table>

From 0101de7571663d832408b101d6296a60aedc81b1 Mon Sep 17 00:00:00 2001
From: Tomofumi Chiba <tomofumi.chiba@gmail.com>
Date: Thu, 2 Nov 2023 18:22:58 +0900
Subject: [PATCH 2/2] fix

---
 islands/PostEdit.tsx | 18 +++++++++---------
 islands/PostNew.tsx  | 18 +++++++++---------
 2 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/islands/PostEdit.tsx b/islands/PostEdit.tsx
index 590448a..553891f 100644
--- a/islands/PostEdit.tsx
+++ b/islands/PostEdit.tsx
@@ -39,7 +39,15 @@ export default function Edit(props: { post: Post }) {
   }, textarea.current);
 
   useEffect(() => {
-    if (!preview.value) {
+    if (preview.value) {
+      Mousetrap.bind(
+        "mod+p",
+        () => {
+          displayEdit();
+          return false;
+        },
+      );
+    } else {
       Mousetrap(textarea.current).bind(
         "mod+enter",
         () => {
@@ -54,14 +62,6 @@ export default function Edit(props: { post: Post }) {
           return false;
         },
       );
-    } else {
-      Mousetrap.bind(
-        "mod+p",
-        () => {
-          displayEdit();
-          return false;
-        },
-      );
     }
   }, [preview.value]);
 
diff --git a/islands/PostNew.tsx b/islands/PostNew.tsx
index 235fecd..2d0762f 100644
--- a/islands/PostNew.tsx
+++ b/islands/PostNew.tsx
@@ -36,7 +36,15 @@ export default function Post() {
   }, textarea.current);
 
   useEffect(() => {
-    if (!preview.value) {
+    if (preview.value) {
+      Mousetrap.bind(
+        "mod+p",
+        () => {
+          displayEdit();
+          return false;
+        },
+      );
+    } else {
       Mousetrap(textarea.current).bind(
         "mod+enter",
         () => {
@@ -51,14 +59,6 @@ export default function Post() {
           return false;
         },
       );
-    } else {
-      Mousetrap.bind(
-        "mod+p",
-        () => {
-          displayEdit();
-          return false;
-        },
-      );
     }
   }, [preview.value]);