prevent layout keyboard shortcuts on ticket create

Peppermint-Lab · Dec 10, 2023 · 4090144 · 4090144
1 parent 88891e5
commit 4090144
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 10 deletions.
diff --git a/apps/client/layouts/newLayout.tsx b/apps/client/layouts/newLayout.tsx
@@ -11,7 +11,7 @@ import {
 import { deleteCookie, getCookie } from "cookies-next";
 import Link from "next/link";
 import { useRouter } from "next/router";
-import { Fragment, useCallback, useEffect, useState } from "react";
+import { Fragment, useEffect, useState } from "react";
 
 import { ContextMenu } from "@radix-ui/themes";
 import useTranslation from "next-translate/useTranslation";
@@ -33,6 +33,7 @@ export default function NewLayout({ children }: any) {
 
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const [tab, setTab] = useState("unread");
+  const [currentPath, setCurrentPath] = useState();
 
   if (!user) {
     location.push("/auth/login");
@@ -120,12 +121,49 @@ export default function NewLayout({ children }: any) {
   // location.push(`${locale}/${location.pathname}`);
   // }, [user, location]);
 
-  const handleKeyPress = useCallback((event: any) => {
+  // const handleKeyPress = useCallback((event: any, location: any) => {
+  //   console.log(location);
+  //   if (
+  //     document.activeElement!.tagName !== "INPUT" &&
+  //     document.activeElement!.tagName !== "TEXTAREA" &&
+  //     !document.activeElement!.className.includes("ProseMirror")
+  //   ) {
+  //     switch (event.key) {
+  //       case "c":
+  //         location.push("/new");
+  //         break;
+  //       case "h":
+  //         location.push("/");
+  //         break;
+  //       case "n":
+  //         location.push("/notebook");
+  //         break;
+  //       case "t":
+  //         location.push("/tickets");
+  //         break;
+  //       case "a":
+  //         location.push("/admin");
+  //         break;
+  //       case "o":
+  //         location.push("/tickets/open");
+  //         break;
+  //       case "f":
+  //         location.push("/tickets/closed");
+  //         break;
+  //       default:
+  //         break;
+  //     }
+  //   }
+  // }, []);
+
+  function handleKeyPress(event: any) {
+    const pathname = location.pathname;
+    console.log(pathname);
     if (
       document.activeElement!.tagName !== "INPUT" &&
       document.activeElement!.tagName !== "TEXTAREA" &&
       !document.activeElement!.className.includes("ProseMirror") &&
-      location.pathname !== "/new"
+      !pathname.includes("/new")
     ) {
       switch (event.key) {
         case "c":
@@ -149,12 +187,11 @@ export default function NewLayout({ children }: any) {
         case "f":
           location.push("/tickets/closed");
           break;
+        default:
+          break;
       }
-    } else {
-      console;
-      return null;
     }
-  }, []);
+  }
 
   useEffect(() => {
     // attach the event listener
@@ -164,7 +201,7 @@ export default function NewLayout({ children }: any) {
     return () => {
       document.removeEventListener("keydown", handleKeyPress);
     };
-  }, [handleKeyPress]);
+  }, [handleKeyPress, location]);
 
   return (
     !loading && (

diff --git a/apps/client/pages/tickets/closed.tsx b/apps/client/pages/tickets/closed.tsx
@@ -71,7 +71,7 @@ export default function Tickets() {
 
                 return (
                   <Link href={`/ticket/${ticket.id}`}>
-                    <div className="flex flex-row w-full bg-white border-b-[1px] p-3 justify-between px-6 hover:bg-gray-100">
+                    <div className="flex flex-row w-full bg-white border-b-[1px] p-2 justify-between px-6 hover:bg-gray-100">
                       <div>
                         <span className="text-xs font-semibold">
                           {ticket.title}

diff --git a/apps/client/pages/tickets/open.tsx b/apps/client/pages/tickets/open.tsx
@@ -70,7 +70,7 @@ export default function Tickets() {
 
                 return (
                   <Link href={`/ticket/${ticket.id}`}>
-                    <div className="flex flex-row w-full bg-white border-b-[1px] p-3 justify-between px-6 hover:bg-gray-100">
+                    <div className="flex flex-row w-full bg-white border-b-[1px] p-2 justify-between px-6 hover:bg-gray-100">
                       <div>
                         <span className="text-xs font-semibold">
                           {ticket.title}