Merge pull request #22548 from overleaf/ac-ds-phosphor-icons-and-splittests-bugfix

[web] Reapply  Use icons from @phosphor-icons/react for the project-list (DS nav)

GitOrigin-RevId: b87767b7c875ff4c081590e7bc0111892c0a1435

services/web/frontend/js/features/ui/components/bootstrap-5/navbar/account-menu-items.tsx

@@ -5,6 +5,8 @@ import type { NavbarSessionUser } from '@/features/ui/components/types/navbar'
 import DropdownListItem from '@/features/ui/components/bootstrap-5/dropdown-list-item'
 import NavDropdownDivider from './nav-dropdown-divider'
 import NavDropdownLinkItem from './nav-dropdown-link-item'
+import { useIsDsNav } from '@/features/project-list/components/use-is-ds-nav'
+import { SignOut } from '@phosphor-icons/react'
 
 export function AccountMenuItems({
   sessionUser,
@@ -15,7 +17,7 @@ export function AccountMenuItems({
 }) {
   const { t } = useTranslation()
   const logOutFormId = 'logOutForm'
-
+  const isDsNav = useIsDsNav()
   return (
     <>
       <Dropdown.Item as="li" disabled role="menuitem">
@@ -43,8 +45,10 @@ export function AccountMenuItems({
           type="submit"
           form={logOutFormId}
           role="menuitem"
+          className="d-flex align-items-center justify-content-between"
         >
-          {t('log_out')}
+          <span>{t('log_out')}</span>
+          {isDsNav && <SignOut size={16} />}
         </Dropdown.Item>
         <form id={logOutFormId} method="POST" action="/logout">
           <input type="hidden" name="_csrf" value={getMeta('ol-csrfToken')} />