feat: add support for platform based shortcut combos

Author: Elessar1802

src/Common/Tooltip/ShortcutKeyComboTooltipContent.tsx

@@ -1,12 +1,12 @@
-import { TooltipProps } from './types'
+import { KEYBOARD_KEYS_MAP, TooltipProps } from './types'
 
 const ShortcutKeyComboTooltipContent = ({ text, combo }: TooltipProps['shortcutKeyCombo']) => (
     <div className="flexbox dc__gap-8 px-8 py-4 flex-wrap">
         <span className="lh-18 fs-12 fw-4 cn-0">{text}</span>
         <div className="flexbox dc__gap-4 dc__align-items-center flex-wrap">
             {combo.map((key) => (
                 <span key={key} className="shortcut-keys__chip dc__capitalize lh-16 fs-11 fw-5 flex">
-                    {key}
+                    {KEYBOARD_KEYS_MAP[key]}
                 </span>
             ))}
         </div>

src/Common/Tooltip/index.ts

@@ -1 +1,2 @@
 export { default as Tooltip } from './Tooltip'
+export type { SupportedKeyboardKeysType } from './types'

src/Common/Tooltip/types.ts

@@ -1,5 +1,15 @@
 import { TippyProps } from '@tippyjs/react'
 
+const isMacOS = navigator.userAgent.toUpperCase().includes('MAC')
+
+export const KEYBOARD_KEYS_MAP = {
+    Control: isMacOS ? '⌘' : 'Ctrl',
+    Shift: '⇧',
+    F: 'F',
+} as const
+
+export type SupportedKeyboardKeysType = keyof typeof KEYBOARD_KEYS_MAP
+
 type BaseTooltipProps =
     | {
           /**
@@ -52,7 +62,7 @@ type BaseTooltipProps =
            */
           shortcutKeyCombo?: {
               text: string
-              combo: string[]
+              combo: SupportedKeyboardKeysType[]
           }
       }
 

src/Shared/Components/CICDHistory/LogsRenderer.tsx

@@ -445,7 +445,7 @@ export const LogsRenderer = ({
                             <Tooltip
                                 shortcutKeyCombo={{
                                     text: areAllStagesExpanded ? 'Collapse all stages' : 'Expand all stages',
-                                    combo: ['Ctrl / ⌘', '⇧', 'F'],
+                                    combo: ['Control', 'Shift', 'F'] as const,
                                 }}
                                 className="dc__mxw-500"
                                 placement="left"