fix: problem with + in phone numbers

src/components/Layout/Header.tsx

@@ -2,6 +2,7 @@ import { Box, IconButton, Typography } from '@mui/material';
 import { Icon } from '@rkheftan/harmony-ui';
 import { More } from 'iconsax-react';
 import type { UserInfo } from '@/contexts/AuthContext';
+import { LTRBox } from '../common/LTRBox';
 
 interface HeaderProps {
   user: UserInfo;
@@ -20,8 +21,8 @@ export const Header: React.FC<HeaderProps> = ({ user }) => {
     >
       <Box>
         <Typography variant="body1">{user.fullName}</Typography>
-        <Typography variant="body2" color="textSecondary">
-          {user.phoneNumber ?? user.email}
+        <Typography variant="body2" component="span" color="textSecondary">
+          <LTRBox>{user.phoneNumber ?? user.email}</LTRBox>
         </Typography>
       </Box>
 

src/components/common/LTRBox.tsx

@@ -0,0 +1,6 @@
+import { styled } from '@mui/material';
+
+export const LTRBox = styled('span')`
+  /* @noflip */
+  direction: ltr;
+`;