diff --git a/packages/ui/src/layout/MainLayout/ViewHeader.jsx b/packages/ui/src/layout/MainLayout/ViewHeader.jsx index 47120d66..91d4a8ff 100644 --- a/packages/ui/src/layout/MainLayout/ViewHeader.jsx +++ b/packages/ui/src/layout/MainLayout/ViewHeader.jsx @@ -10,6 +10,12 @@ import { StyledFab } from '@/ui-component/button/StyledFab' import { IconSearch, IconArrowLeft, IconEdit } from '@tabler/icons-react' import useSearchShorcut from '@/hooks/useSearchShortcut' +import { getOS } from '@/utils/genericHelper' + +const os = getOS() +const isMac = os === 'macos' +const isDesktop = isMac || os === 'windows' || os === 'linux' +const keyboardShortcut = isMac ? '[ ⌘ + F ]' : '[ Ctrl + F ]' const ViewHeader = ({ children, @@ -93,7 +99,7 @@ const ViewHeader = ({ inputRef={searchInputRef} size='small' sx={{ - width: '280px', + width: '325px', height: '100%', display: { xs: 'none', sm: 'flex' }, borderRadius: 2, @@ -103,7 +109,7 @@ const ViewHeader = ({ } }} variant='outlined' - placeholder={searchPlaceholder} + placeholder={`${searchPlaceholder} ${isDesktop ? keyboardShortcut : ''}`} onChange={onSearchChange} startAdornment={