From f615f8ac0c6406a1ba39a79b7199196ac32a78c9 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com>
Date: Wed, 22 Mar 2023 19:08:04 +0530
Subject: [PATCH] fix: sidebar and shortcut modal (#493)

* fix: shortcut modal cmd and ctrl fix

* fix: sidebar collapse state ordering
---
 .../command-palette/shortcuts-modal.tsx       | 29 ++++++++++++++-----
 .../app/components/workspace/help-section.tsx |  2 +-
 2 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/apps/app/components/command-palette/shortcuts-modal.tsx b/apps/app/components/command-palette/shortcuts-modal.tsx
index 0cdb051f6..d5b1aa0fc 100644
--- a/apps/app/components/command-palette/shortcuts-modal.tsx
+++ b/apps/app/components/command-palette/shortcuts-modal.tsx
@@ -52,6 +52,7 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
       ? true
       : false
   );
+  const { platform } = (window.navigator as any).userAgentData;
 
   useEffect(() => {
     if (!isOpen) setQuery("");
@@ -126,12 +127,18 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
                                       {shortcut.keys.split(",").map((key, index) => (
                                         <span key={index} className="flex items-center gap-1">
                                           {key === "Ctrl" ? (
-                                            <span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2">
-                                              <MacCommandIcon />
-                                            </span>
+                                            platform === "Windows" ? (
+                                              <kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
+                                                {key}
+                                              </kbd>
+                                            ) : (
+                                              <span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2">
+                                                <MacCommandIcon />
+                                              </span>
+                                            )
                                           ) : (
                                             <kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
-                                              {key === "Ctrl" ? <MacCommandIcon /> : key}
+                                              {key}
                                             </kbd>
                                           )}
                                         </span>
@@ -165,12 +172,18 @@ export const ShortcutsModal: React.FC<Props> = ({ isOpen, setIsOpen }) => {
                                       {keys.split(",").map((key, index) => (
                                         <span key={index} className="flex items-center gap-1">
                                           {key === "Ctrl" ? (
-                                            <span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2">
-                                              <MacCommandIcon />
-                                            </span>
+                                            platform === "Windows" ? (
+                                              <kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
+                                                {key}
+                                              </kbd>
+                                            ) : (
+                                              <span className="flex h-full items-center rounded-sm border border-gray-200 bg-gray-100 p-2">
+                                                <MacCommandIcon />
+                                              </span>
+                                            )
                                           ) : (
                                             <kbd className="rounded-sm border border-gray-200 bg-gray-100 px-2 py-1 text-sm font-medium text-gray-800">
-                                              {key === "Ctrl" ? <MacCommandIcon /> : key}
+                                              {key}
                                             </kbd>
                                           )}
                                         </span>
diff --git a/apps/app/components/workspace/help-section.tsx b/apps/app/components/workspace/help-section.tsx
index 53cc1e461..9475c3adf 100644
--- 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 justify-between self-baseline border-t bg-white px-6 py-2 ${
-        sidebarCollapse ? "flex-col-reverse" : ""
+        sidebarCollapse ? "flex-col" : ""
       }`}
     >
       <button