feat: add icons for user menu

src/app/AppLayout/AppLayout.tsx

@@ -68,19 +68,23 @@ import {
   Dropdown,
 } from '@patternfly/react-core';
 import {
+  ArrowRightIcon,
   BarsIcon,
   BellIcon,
   CogIcon,
   ExternalLinkAltIcon,
+  LanguageIcon,
   PlusCircleIcon,
   QuestionCircleIcon,
   UserIcon,
 } from '@patternfly/react-icons';
+import { css } from '@patternfly/react-styles';
 import _ from 'lodash';
 import * as React from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { Link, matchPath, NavLink, useLocation, useNavigate } from 'react-router-dom';
 import { map } from 'rxjs/operators';
+import { LogoutIcon } from './LogoutIcon';
 import { ThemeToggle } from './ThemeToggle';
 
 export interface AppLayoutProps {
@@ -282,11 +286,11 @@ export const AppLayout: React.FC<AppLayoutProps> = ({ children }) => {
   const userInfoItems = React.useMemo(
     () => [
       <FeatureFlag level={FeatureLevel.BETA} key={'language-preferences-feature-flag'}>
-        <DropdownItem key={'language-preferences'} onClick={handleLanguagePref}>
+        <DropdownItem key={'language-preferences'} onClick={handleLanguagePref} icon={<LanguageIcon />}>
           <Trans t={t} i18nKey="AppLayout.USER_MENU.LANGUAGE_PREFERENCE" />
         </DropdownItem>
       </FeatureFlag>,
-      <DropdownItem key={'log-out'} onClick={handleLogout}>
+      <DropdownItem key={'log-out'} onClick={handleLogout} icon={<LogoutIcon></LogoutIcon>}>
         {t('AppLayout.USER_MENU.LOGOUT')}
       </DropdownItem>,
     ],

src/app/AppLayout/LogoutIcon.tsx

@@ -0,0 +1,31 @@
+/*
+ * Copyright The Cryostat Authors.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as React from 'react';
+
+export const LogoutIcon: React.FC<React.HTMLProps<SVGElement>> = ({ style }) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      height="1em"
+      width="1em"
+      viewBox="0 0 512 512"
+      fill="currentColor"
+      style={{ verticalAlign: '-0.125em', ...style }}
+    >
+      <path d="M502.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 224 192 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l210.7 0-73.4 73.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l128-128zM160 96c17.7 0 32-14.3 32-32s-14.3-32-32-32L96 32C43 32 0 75 0 128L0 384c0 53 43 96 96 96l64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0c-17.7 0-32-14.3-32-32l0-256c0-17.7 14.3-32 32-32l64 0z" />
+    </svg>
+  );
+};