fix: shortcut modal fix (#227)

* fix: shortcut btn alignment * style: shortcut command to uppercase * fix: update shortcut for uppercase * fix: issue url shortcut fix --------- Co-authored-by: Anmol Singh Bhatia <[email protected]>
makeplane · Feb 1, 2023 · 848fb2b · 848fb2b · vercel · Feb 1, 2023
1 parent 155c392
commit 848fb2b
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 36 deletions.
diff --git a/apps/app/components/command-palette/index.tsx b/apps/app/components/command-palette/index.tsx
@@ -102,50 +102,54 @@ const CommandPalette: React.FC = () => {
         !(e.target instanceof HTMLInputElement) &&
         !(e.target as Element).classList?.contains("remirror-editor")
       ) {
-        if ((e.ctrlKey || e.metaKey) && e.key === "k") {
+        if ((e.ctrlKey || e.metaKey) && (e.key === "k" || e.key === "K")) {
           e.preventDefault();
           setIsPaletteOpen(true);
-        } else if (e.ctrlKey && e.key === "c") {
-          console.log("Text copied");
-        } else if (e.key === "c") {
+        } else if (e.ctrlKey && (e.key === "c" || e.key === "C")) {
+          if (e.altKey) {
+            e.preventDefault();
+            if (!router.query.issueId) return;
+
+            const url = new URL(window.location.href);
+            console.log(url);
+            copyTextToClipboard(url.href)
+              .then(() => {
+                setToastAlert({
+                  type: "success",
+                  title: "Copied to clipboard",
+                });
+              })
+              .catch(() => {
+                setToastAlert({
+                  type: "error",
+                  title: "Some error occurred",
+                });
+              });
+            console.log("URL Copied");
+          } else {
+            console.log("Text copied");
+          }
+        } else if (e.key === "c" || e.key === "C") {
           e.preventDefault();
           setIsIssueModalOpen(true);
-        } else if (e.key === "p") {
+        } else if (e.key === "p" || e.key === "P") {
           e.preventDefault();
           setIsProjectModalOpen(true);
-        } else if ((e.ctrlKey || e.metaKey) && e.key === "b") {
+        } else if ((e.ctrlKey || e.metaKey) && (e.key === "b" || e.key === "B")) {
           e.preventDefault();
           toggleCollapsed();
-        } else if (e.key === "h") {
+        } else if (e.key === "h" || e.key === "H") {
           e.preventDefault();
           setIsShortcutsModalOpen(true);
-        } else if (e.key === "q") {
+        } else if (e.key === "q" || e.key === "Q") {
           e.preventDefault();
           setIsCreateCycleModalOpen(true);
-        } else if (e.key === "m") {
+        } else if (e.key === "m" || e.key === "M") {
           e.preventDefault();
           setIsCreateModuleModalOpen(true);
         } else if (e.key === "Delete") {
           e.preventDefault();
           setIsBulkDeleteIssuesModalOpen(true);
-        } else if ((e.ctrlKey || e.metaKey) && e.altKey && e.key === "c") {
-          e.preventDefault();
-          if (!router.query.issueId) return;
-
-          const url = new URL(window.location.href);
-          copyTextToClipboard(url.href)
-            .then(() => {
-              setToastAlert({
-                type: "success",
-                title: "Copied to clipboard",
-              });
-            })
-            .catch(() => {
-              setToastAlert({
-                type: "error",
-                title: "Some error occurred",
-              });
-            });
         }
       }
     },

diff --git a/apps/app/components/command-palette/shortcuts.tsx b/apps/app/components/command-palette/shortcuts.tsx
@@ -15,7 +15,7 @@ const shortcuts = [
   {
     title: "Navigation",
     shortcuts: [
-      { keys: "ctrl,cmd,k", description: "To open navigator" },
+      { keys: "Ctrl,Cmd,K", description: "To open navigator" },
       { keys: "↑", description: "Move up" },
       { keys: "↓", description: "Move down" },
       { keys: "←", description: "Move left" },
@@ -27,14 +27,14 @@ const shortcuts = [
   {
     title: "Common",
     shortcuts: [
-      { keys: "p", description: "To create project" },
-      { keys: "c", description: "To create issue" },
-      { keys: "q", description: "To create cycle" },
-      { keys: "m", description: "To create module" },
+      { keys: "P", description: "To create project" },
+      { keys: "C", description: "To create issue" },
+      { keys: "Q", description: "To create cycle" },
+      { keys: "M", description: "To create module" },
       { keys: "Delete", description: "To bulk delete issues" },
-      { keys: "h", description: "To open shortcuts guide" },
+      { keys: "H", description: "To open shortcuts guide" },
       {
-        keys: "ctrl,cmd,alt,c",
+        keys: "Ctrl,Cmd,Alt,C",
         description: "To copy issue url when on issue detail page.",
       },
     ],

diff --git a/apps/app/components/workspace/help-section.tsx b/apps/app/components/workspace/help-section.tsx
@@ -57,7 +57,7 @@ export const WorkspaceHelpSection: FC<WorkspaceHelpSectionProps> = (props) => {
 
   return (
     <div
-      className={`flex w-full items-center self-baseline bg-primary px-2 py-2 ${
+      className={`flex w-full items-center justify-between self-baseline bg-primary px-2 py-2 ${
         sidebarCollapse ? "flex-col-reverse" : ""
       }`}
     >

diff --git a/apps/app/layouts/navbar/main-sidebar.tsx b/apps/app/layouts/navbar/main-sidebar.tsx
@@ -98,7 +98,7 @@ const Sidebar: React.FC<Props> = ({ toggleSidebar, setToggleSidebar }) => {
             <WorkspaceOptions sidebarCollapse={sidebarCollapse} />
             <ProjectsList navigation={navigation} sidebarCollapse={sidebarCollapse} />
             <div
-              className={`flex w-full items-center self-baseline bg-primary px-2 py-2 ${
+              className={`flex w-full items-center justify-between self-baseline bg-primary px-2 py-2 ${
                 sidebarCollapse ? "flex-col-reverse" : ""
               }`}
             >