@omniumretail/component-library 1.2.51 → 1.2.53

package/dist/types/components/Header/Header.types.d.ts

@@ -23,4 +23,5 @@ export interface HeaderProps {
     onNotificationClick?: (id: string, url: string) => void;
     handleMarkAllAsRead?: () => void;
     notifications?: BellNotification[];
+    shouldConfirmNavigation?: boolean;
 }

package/dist/types/components/Header/index.d.ts

@@ -3,5 +3,5 @@ import { HeaderProps } from './Header.types';
  * Header component to display navigation bar with dropdown menus and action button.
  * @param {HeaderProps} props - Properties passed to the component.
  */
-export declare const Header: ({ menuList, actionButton, logout, homeUrl, profileUrl, onLeavingPage, userName, pageTitle, onFilterChange, notifications, onNotificationClick, handleMarkAllAsRead }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Header: ({ menuList, actionButton, logout, homeUrl, profileUrl, onLeavingPage, userName, pageTitle, onFilterChange, notifications, onNotificationClick, handleMarkAllAsRead, shouldConfirmNavigation }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
 export default Header;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omniumretail/component-library",
-  "version": "1.2.51",
+  "version": "1.2.53",
   "private": false,
   "main": "dist/bundle.js",
   "typings": "./dist/types/index",

package/src/components/Footer2/index.tsx

@@ -9,10 +9,10 @@ import {
     ExportOutlined,
     PrinterOutlined
 } from '@ant-design/icons';
-import { t } from 'i18next';
 import moment from 'moment';
 import React, { useEffect, useRef, useState } from 'react';
 import omniumLogo from '../../assets/images/omnium-retail-logo-white.png';
+import { useTranslation } from 'react-i18next';
 
 interface Action {
     key: string;
@@ -68,16 +68,6 @@ export interface Footer2Props {
     disableNotifications?: boolean;
 }
 
-// Mapeamento de tipos de ações para seus ícones e labels padrão
-const defaultActionProps: Record<string, { icon: React.ReactNode; label: string }> = {
-    [ActionType.DELETE]: { icon: <DeleteOutlined />, label: t('navigation.delete') },
-    [ActionType.UPDATE]: { icon: <ReloadOutlined />, label: t('navigation.update') },
-    [ActionType.CREATE]: { icon: <PlusOutlined />, label: t('navigation.create') },
-    [ActionType.EDIT]: { icon: <EditOutlined />, label: t('navigation.edit') },
-    [ActionType.EXPORT]: { icon: <ExportOutlined />, label: t('navigation.export') },
-    [ActionType.PRINT]: { icon: <PrinterOutlined />, label: t('navigation.print') },
-};
-
 export const Footer2 = (props: Footer2Props) => {
     const {
         onBackClick,
@@ -96,6 +86,17 @@ export const Footer2 = (props: Footer2Props) => {
     const [isMenuOpen, setIsMenuOpen] = useState(false);
     const menuRef = useRef<HTMLDivElement>(null);
     const [isMobile, setIsMobile] = useState(window.innerWidth < 768);
+    const { t } = useTranslation();
+
+    // Mapeamento de tipos de ações para seus ícones e labels padrão
+    const defaultActionProps: Record<string, { icon: React.ReactNode; label: string }> = {
+        [ActionType.DELETE]: { icon: <DeleteOutlined />, label: t('navigation.delete') },
+        [ActionType.UPDATE]: { icon: <ReloadOutlined />, label: t('navigation.update') },
+        [ActionType.CREATE]: { icon: <PlusOutlined />, label: t('navigation.create') },
+        [ActionType.EDIT]: { icon: <EditOutlined />, label: t('navigation.edit') },
+        [ActionType.EXPORT]: { icon: <ExportOutlined />, label: t('navigation.export') },
+        [ActionType.PRINT]: { icon: <PrinterOutlined />, label: t('navigation.print') },
+    };
 
     useEffect(() => {
         const time = (function updateDate() {
@@ -124,11 +125,11 @@ export const Footer2 = (props: Footer2Props) => {
         // Converter ActionConfig para Action
         const standardActions = actions.map(actionConfig => {
             const actionType = actionConfig.type;
-            const defaultProps = defaultActionProps[actionType] || { 
+            const defaultProps = defaultActionProps[actionType] || {
                 label: String(actionType),
                 icon: <PlusOutlined />
             };
-            
+
             return {
                 key: actionType,
                 label: defaultProps.label,
@@ -140,7 +141,7 @@ export const Footer2 = (props: Footer2Props) => {
 
         // Combinar com ações personalizadas
         const combinedActions = [...standardActions, ...customActions];
-        
+
         // Ordenar por label
         return combinedActions.sort((a, b) => a.label.localeCompare(b.label));
     };
@@ -185,8 +186,8 @@ export const Footer2 = (props: Footer2Props) => {
 
             <div className={styles.navigation}>
                 {onBackClick && (
-                    <div 
-                        className={`${styles.navItem} ${disableBackButton ? styles.disabled : ''}`} 
+                    <div
+                        className={`${styles.navItem} ${disableBackButton ? styles.disabled : ''}`}
                         onClick={disableBackButton ? undefined : onBackClick}
                     >
                         <ArrowLeftOutlined className={styles.navIcon} />

package/src/components/Header/Header.types.ts

@@ -26,4 +26,5 @@ export interface HeaderProps {
     onNotificationClick?: (id: string, url: string) => void;
     handleMarkAllAsRead?: () => void;
     notifications?: BellNotification[];
+    shouldConfirmNavigation?: boolean;
 }

package/src/components/Header/index.tsx

@@ -24,7 +24,8 @@ export const Header = ({
     onFilterChange,
     notifications,
     onNotificationClick,
-    handleMarkAllAsRead
+    handleMarkAllAsRead,
+    shouldConfirmNavigation
 }: HeaderProps) => {
 
     const [isMenuOpen, setIsMenuOpen] = useState(false);
@@ -36,7 +37,9 @@ export const Header = ({
      * Handle the logout action. If no logout function is provided, redirect to home as discussed in a meet
      */
     const onLogout = () => {
-        if (logout) {
+        if (shouldConfirmNavigation) {
+            onLeavingPage!('/logout');
+        } else if (logout) {
             logout();
         } else {
             onHome();
@@ -47,14 +50,22 @@ export const Header = ({
      * Navigate to the profile URL.
      */
     const onProfile = () => {
-        window.location.href = profileUrl;
+        if (shouldConfirmNavigation) {
+            onLeavingPage!('/profile');
+        } else {
+            window.location.href = profileUrl;
+        }
     };
 
     /**
      * Navigate to the home URL.
      */
     const onHome = () => {
-        window.location.href = homeUrl;
+        if (shouldConfirmNavigation) {
+            onLeavingPage!('/home');
+        } else {
+            window.location.href = homeUrl;
+        }
     };
 
     const menuTopList = getMenuTopList(