ui-soxo-bootstrap-core 2.6.1-dev.25 → 2.6.1-dev.27

package/core/lib/components/global-header/global-header.js

@@ -13,7 +13,7 @@ import { GlobalContext } from './../../Store';
 
 import { Link, useLocation } from 'react-router-dom';
 
-import { Typography, Avatar, Input } from 'antd';
+import { Typography, Avatar, Input, Tooltip } from "antd";
 
 import ProgressBar from '../progress-bar/progress-bar'; // Adjust the path as needed
 
@@ -21,7 +21,7 @@ import { Button } from '../../elements';
 
 import GenericHeader from '../header/generic-header';
 
-import { MenuOutlined, UserOutlined, SettingOutlined } from '@ant-design/icons';
+import { MenuOutlined, UserOutlined, SettingOutlined, QuestionCircleOutlined } from '@ant-design/icons';
 
 import { Drawer } from 'antd';
 
@@ -70,10 +70,12 @@ export default function GlobalHeader({
 
   // const [searchModalVisible, setSearchModalVisible] = useState(false);
 
-  const { globalCustomerHeader = () => {} } = appSettings;
+  const { globalCustomerHeader = () => { } } = appSettings;
 
   const { t, i18n } = useTranslation();
 
+  const helpDeskUrl = process.env.REACT_APP_HELP_DESK_URL
+
   const spotlightRef = useRef();
 
   useEffect(() => {
@@ -133,7 +135,7 @@ export default function GlobalHeader({
     animate();
   }, []);
 
-  useEffect(() => {}, [state.theme]);
+  useEffect(() => { }, [state.theme]);
 
   return (
     <>
@@ -152,7 +154,7 @@ export default function GlobalHeader({
             //whileHover="hover"
             //whileTap="tap"
             className={`left-bar ${!isConnected && !isMobile ? '' : 'hide'}${!collapsed ? 'open' : 'close'}${kiosk && !isConnected ? 'kioskon' : ''}`}
-            // style={{ background: state.theme.colors.leftSectionBackground }}
+          // style={{ background: state.theme.colors.leftSectionBackground }}
           >
             {!isMobile && !isConnected ? (
               <motion.div
@@ -199,7 +201,7 @@ export default function GlobalHeader({
             {!isConnected && !kiosk ? (
               <div
                 className={`page-wrapper ${!collapsed ? 'open' : 'close'}`}
-                // style={{ background: state.theme.colors.headerBg }}
+              // style={{ background: state.theme.colors.headerBg }}
               >
                 {/*  */}
                 <div className="page-header-name">
@@ -280,6 +282,18 @@ export default function GlobalHeader({
 
                     {/* Reload Button Ends */}
 
+                    {/* Help-desk-btn */}
+                    {helpDeskUrl ? <Tooltip title="Application support">
+                      <span>
+                        <Button
+                          onClick={() => window.open(helpDeskUrl, '_blank')}
+                          icon={<QuestionCircleOutlined />}
+                          type="default"
+                          size="small"
+                        />
+                      </span>
+                    </Tooltip> : null}
+
                     {/** Switch Languages starts */}
                     {process.env.REACT_APP_ENABLE_LANGUAGE_SWITCHER ? <LanguageSwitcher /> : null}
                     {/** Switch Languages ends */}
@@ -328,7 +342,7 @@ export default function GlobalHeader({
 function ProfileAvatar() {
   const { user = { locations: [] } } = useContext(GlobalContext);
 
-  useEffect(() => {}, []);
+  useEffect(() => { }, []);
 
   return (
     <Link className="profile-avatar" to="/profile">