wca-designsystem 0.0.6 → 0.0.7

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.6",
+  "version": "0.0.7",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/modules/ConchaAplicacao/ConchaAplicacao.stories.tsx

@@ -15,7 +15,7 @@ export const Primary: Story = {
   args: {
     links: LinksDinamicosMock,
     isNavHover: true,
-    setIsNavHover: (state) => console.log(state),
+    modulo: 'exemplo',
     notificacoes: {
       abre: true,
       notificacao: {

package/src/components/modules/ConchaAplicacao/ConchaAplicacao.test.tsx

@@ -25,6 +25,8 @@ describe('AppShelCollapsed rendering', () => {
 
     const { getByTestId } = render(
       <ConchaAplicacao
+        isNavHover={true}
+        modulo="exemplo"
         notificacoes={mockNotifications}
         links={LinksDinamicosMock}
       >

package/src/components/modules/ConchaAplicacao/index.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef } from 'react';
+import React from 'react';
 import { Container } from '@mantine/core';
 import * as S from './styles';
 import Navbar from '../Navbar';
@@ -11,45 +11,21 @@ type ConchaAplicacaolType = {
   children: React.ReactNode;
   notificacoes: NotificationsProps;
   links?: LinksProps[];
+  modulo: string;
   isNavHover: boolean;
-  setIsNavHover: React.Dispatch<React.SetStateAction<boolean>>;
+  navbarRef?: React.RefObject<HTMLDivElement>;
 };
 export function ConchaAplicacao({
   children,
+  modulo,
   isNavHover,
-  setIsNavHover,
   notificacoes,
   links,
+  navbarRef,
 }: ConchaAplicacaolType) {
-  const NavbarRef = useRef<HTMLDivElement>(null);
   const rotaAcessada = useLocation();
   const paginaAtual = rotaAcessada.pathname.replace('/', '');
 
-  useEffect(() => {
-    const handleMouseEnter = () => {
-      setIsNavHover(true);
-    };
-
-    const handleMouseLeave = () => {
-      setIsNavHover(false);
-    };
-
-    // Adiciona os listeners de evento quando o componente é montado
-    const navbarRef = NavbarRef.current;
-    if (navbarRef) {
-      navbarRef.addEventListener('mouseenter', handleMouseEnter);
-      navbarRef.addEventListener('mouseleave', handleMouseLeave);
-    }
-
-    // Remove os listeners de evento quando o componente é desmontado
-    return () => {
-      if (navbarRef) {
-        navbarRef.removeEventListener('mouseenter', handleMouseEnter);
-        navbarRef.removeEventListener('mouseleave', handleMouseLeave);
-      }
-    };
-  }, []);
-
   return (
     <S.ConchaAplicacaoWrapper
       data-testid="app-shell-wrapper"
@@ -61,8 +37,8 @@ export function ConchaAplicacao({
       transitionTimingFunction="ease-in"
       transitionDuration={3}
     >
-      <S.ConchaAplicacaoNavbarWrapper ref={NavbarRef} data-active={isNavHover}>
-        <Navbar isHover={isNavHover} links={links} />
+      <S.ConchaAplicacaoNavbarWrapper ref={navbarRef} data-active={isNavHover}>
+        <Navbar modulo={modulo} isHover={isNavHover} links={links} />
       </S.ConchaAplicacaoNavbarWrapper>
       <S.ConchaAplicacaoMainWrapper>
         <Container fluid>

package/src/components/modules/Navbar/Navbar.stories.tsx

@@ -11,6 +11,7 @@ export default {
 const props = {
   isHover: true,
   links: LinksDinamicosMock,
+  module: 'Exemplo',
 };
 
 const Template: any = (args: NavbarType) => (

package/src/components/modules/Navbar/Navbar.test.tsx

@@ -7,14 +7,14 @@ import { LinksDinamicosMock } from './mocks';
 describe('Navbar está renderizando corretamente', () => {
   test('Renderizando todos componentes internos', () => {
     const { getByTestId } = render(
-      <Navbar isHover={false} links={LinksDinamicosMock} />
+      <Navbar modulo="exemplo" isHover={false} links={LinksDinamicosMock} />
     );
     expect(getByTestId('navbar')).toBeDefined();
   });
 
   test('Abre o navbar com hover', () => {
     const { getByTestId, queryByText } = render(
-      <Navbar isHover={true} links={LinksDinamicosMock} />
+      <Navbar modulo="exemplo" isHover={true} links={LinksDinamicosMock} />
     );
 
     const FooterNavbar = queryByText('Precisa de ajuda');

package/src/components/modules/Navbar/index.tsx

@@ -11,15 +11,15 @@ import CiclosEncerrados from '../../../assets/imagens/icons/CiclosEncerrados.svg
 import Logo from '../../../assets/imagens/novos-icones/STI_nomeCor.svg';
 import LogoInitial from '../../../assets/imagens/novos-icones/STI_iconeBranco.svg';
 import { useMemo } from 'react';
-// import { LinksDinamicosMock } from './mocks';
 import { FadingComponent } from '../../atomos/FadeAnimacao';
 import AjudaIcone from '../../atomos/AjudaIcone';
 
 export type NavbarType = {
   isHover: boolean;
+  modulo: string;
   links?: LinksProps[];
 };
-const Navbar = ({ isHover, links }: NavbarType) => {
+const Navbar = ({ isHover, links, modulo }: NavbarType) => {
   const LogoHeader = useMemo(() => (isHover ? Logo : LogoInitial), [isHover]);
 
   return (
@@ -57,7 +57,7 @@ const Navbar = ({ isHover, links }: NavbarType) => {
         <S.NabarBody>
           <NavbarTituloHeader
             isNavHover={isHover}
-            modulo="Previsão de Vendas"
+            modulo={modulo}
             icon={CiclosEncerrados}
           />
           <GrupoDeLinks links={links} isNavHover={isHover} />

package/src/components/molecules/CardInicial/styles.ts

@@ -1,9 +1,9 @@
-import styled, { css } from "styled-components";
+import styled, { css } from 'styled-components';
 
 export const CardInicialWrapper = styled.div`
   ${() => css`
     width: 320px;
-    height: 332px;
+    height: 325px;
     border-radius: 8px;
     box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
   `}

package/src/test/render.tsx

@@ -26,14 +26,6 @@ const customRender = (
     },
   });
 
-  // Criar um mock para o Zustand
-  jest.mock('zustand', () => {
-    return {
-      create: jest.fn(() => () => {}),
-      useStore: jest.fn(() => ({})), // Adicionando o useStore mock
-    };
-  });
-
   const Wrapper: React.FC = ({ children }: any) => (
     <QueryClientProvider client={queryClient}>
       <MantineProvider>