From 891479ec9e814f7ca1ed0a104104ee4d4051a05c Mon Sep 17 00:00:00 2001 From: Elias da Rosa Date: Sun, 26 Nov 2023 15:58:19 -0300 Subject: [PATCH] fix: duplicate tooltip --- cypress/e2e/toast.spec.cy.ts | 14 ++++++++++++++ src/actions/tickersActions.ts | 4 ---- src/app/layout.tsx | 17 ++--------------- src/config.ts | 17 ++++++++++++++--- src/hooks/useTickers.ts | 15 +++++++++++++++ 5 files changed, 45 insertions(+), 22 deletions(-) create mode 100644 cypress/e2e/toast.spec.cy.ts diff --git a/cypress/e2e/toast.spec.cy.ts b/cypress/e2e/toast.spec.cy.ts new file mode 100644 index 0000000..d43570a --- /dev/null +++ b/cypress/e2e/toast.spec.cy.ts @@ -0,0 +1,14 @@ +describe('toast', () => { + it('show toast when add ticker', () => { + cy.visit('/') + cy.acceptTermsOfUse() + + cy.addTicker('XPLG11') + + const toast = + '.Toastify .Toastify__toast-container > .Toastify__toast--success' + + cy.get(toast).should('be.visible') + cy.get(toast).should('not.be.visible') + }) +}) diff --git a/src/actions/tickersActions.ts b/src/actions/tickersActions.ts index 3dec840..3f48cbd 100644 --- a/src/actions/tickersActions.ts +++ b/src/actions/tickersActions.ts @@ -1,14 +1,12 @@ import { Ticker } from '@/@types/TickersTypes' import { uniqWith } from 'lodash' import { config } from '@/config' -import { toast } from 'react-toastify' export const tickersActions = { insert: (state: Ticker[], { tickersList, portfoliosList }: any): Ticker[] => { const newTickers: Ticker[] = [] portfoliosList.forEach((portfolioId: string) => { tickersList.forEach((ticker: string) => { - toast(`${ticker} adicionado com sucesso!`, { type: 'success' }) newTickers.push({ ...config.defaults.ticker, ticker, portfolioId }) }) }) @@ -21,8 +19,6 @@ export const tickersActions = { }, remove: (state: Ticker[], { ticker, portfolioId }: any): Ticker[] => { - toast(`${ticker} removido com sucesso!`, { type: 'success' }) - const tickers = state.filter( (i) => i.ticker !== ticker || i.portfolioId !== portfolioId, ) diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 5b5158b..9dffdcb 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,6 +1,6 @@ import { ReactNode, Suspense } from 'react' import { Inter } from 'next/font/google' -import { ToastContainer, ToastContainerProps } from 'react-toastify' +import { ToastContainer } from 'react-toastify' import 'react-toastify/dist/ReactToastify.css' @@ -23,19 +23,6 @@ const inter = Inter({ export const metadata = config.app.metadata -const toastConfig: ToastContainerProps = { - position: 'bottom-right', - autoClose: 3000, - hideProgressBar: false, - newestOnTop: false, - rtl: false, - pauseOnFocusLoss: true, - draggable: true, - closeOnClick: true, - pauseOnHover: true, - theme: 'light', -} - export default function RootLayout({ children }: { children: ReactNode }) { return ( }>{children} - + diff --git a/src/config.ts b/src/config.ts index 979f4f3..e5b556b 100644 --- a/src/config.ts +++ b/src/config.ts @@ -1,3 +1,5 @@ +import { ToastContainerProps } from 'react-toastify' + export const getConfigAPI = () => { if (!process.env.NEXT_PUBLIC_API_KEY) { throw new Error('NEXT_PUBLIC_API_KEY not found') @@ -38,7 +40,16 @@ export const config = { limit: 5, }, - charts: { - colors: ['blue', 'green', 'red', 'yellow'], - }, + toast: { + position: 'bottom-right', + autoClose: 3000, + hideProgressBar: false, + newestOnTop: false, + rtl: false, + pauseOnFocusLoss: true, + draggable: true, + closeOnClick: true, + pauseOnHover: true, + theme: 'light', + } as ToastContainerProps, } diff --git a/src/hooks/useTickers.ts b/src/hooks/useTickers.ts index 3e338ea..66fc530 100644 --- a/src/hooks/useTickers.ts +++ b/src/hooks/useTickers.ts @@ -1,11 +1,25 @@ import { Ticker } from '@/@types/TickersTypes' import { useData } from './useData' +import { toast } from 'react-toastify' export const useTickers = () => { const { tickers, dispatchTickers } = useData() return { addTickers: (tickersList: string[], portfoliosList: string[]) => { + if (!tickersList.length) { + toast(`Nenhum ativo selecionado!`, { type: 'error' }) + return + } + + if (tickersList.length === 1) { + toast(`${tickersList[0]} adicionado com sucesso!`, { type: 'success' }) + } else { + toast(`${tickersList.length} ativos adicionados com sucesso!`, { + type: 'success', + }) + } + dispatchTickers({ type: 'INSERT', payload: { tickersList, portfoliosList }, @@ -13,6 +27,7 @@ export const useTickers = () => { }, removeTicker: (ticker: Ticker) => { + toast(`${ticker.ticker} removido com sucesso!`, { type: 'success' }) dispatchTickers({ type: 'REMOVE', payload: ticker }) },