Merge branch 'master' into RHCLOUD-46751

Author: radekkaluzik

src/components/HelpPanel/HelpPanelCustomTabs.tsx

@@ -11,15 +11,15 @@ import React, {
 } from 'react';
 import classNames from 'classnames';
 
-import './HelpPanelCustomTabs.scss';
 import HelpPanelTabContainer from './HelpPanelTabs/HelpPanelTabContainer';
 import QuickStartsPanel from './HelpPanelTabs/QuickStartsPanel';
 import { TabType } from './HelpPanelTabs/helpPanelTabsMapper';
 import { getOpenQuickstartInHelpPanelStore } from '../../store/openQuickstartInHelpPanelStore';
 import { useGetState } from '@scalprum/react-core';
 import { useFlag, useFlags } from '@unleash/proxy-client-react';
 import { useIntl } from 'react-intl';
-import { OutlinedCommentsIcon, SearchIcon } from '@patternfly/react-icons';
+import { SearchIcon } from '@patternfly/react-icons';
+import { AiChatbotIcon } from '../common/AiChatbotIcon';
 import {
   QuickStartCloseModal,
   QuickStartStatus,
@@ -60,7 +60,7 @@ const createBaseTabs = (showVA: boolean): TabDefinition[] => {
   if (showVA) {
     tabs.push({
       id: 'virtual-assistant',
-      title: <OutlinedCommentsIcon />,
+      title: <AiChatbotIcon />,
       closeable: false,
       tabType: TabType.va,
     });

src/components/HelpPanel/HelpPanelTabs/Feedback/FeedbackPanel.tsx

@@ -130,7 +130,11 @@ const FeedbackPanel: React.FC<SubTabProps> = ({ setNewActionTitle }) => {
           <Stack hasGutter>
             <StackItem>
               <Content>
-                <Content component={ContentVariants.h1}>
+                <Content
+                  component={ContentVariants.h1}
+                  ouiaId="feedback-home-title"
+                  ouiaSafe
+                >
                   {intl.formatMessage(messages.tellAboutExperience)}
                 </Content>
                 <Content component="p">

src/components/common/AiChatbotIcon.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+
+interface AiChatbotIconProps {
+  className?: string;
+  width?: number;
+  height?: number;
+}
+
+export const AiChatbotIcon = ({
+  className,
+  width = 20,
+  height = 20,
+}: AiChatbotIconProps) => {
+  const iconPath =
+    '/apps/frontend-assets/technology-icons/rh-ui-icon-ai-chatbot.svg';
+  return (
+    <svg width={width} height={height} className={className}>
+      <image xlinkHref={iconPath} width={width} height={height} />
+    </svg>
+  );
+};