diff --git a/src/components/toast/ToastContainer.tsx b/src/components/toast/ToastContainer.tsx index 0aaed348..68ffffd8 100644 --- a/src/components/toast/ToastContainer.tsx +++ b/src/components/toast/ToastContainer.tsx @@ -1,13 +1,13 @@ -import { SystemCssProperties } from '@styled-system/css' -import { motion } from 'framer-motion' +import {SystemCssProperties} from '@styled-system/css' +import {motion} from 'framer-motion' import * as React from 'react' -import { useEffect, useState } from 'react' +import {useEffect, useState} from 'react' import styled from 'styled-components' -import { LAYOUT_TRANSITION_SPRING } from '../../styles/modules/variables' -import { Box } from '../box/Box' -import { UIEvents } from './enums' -import { Emitter, ToastProps, Toast } from './index' +import {LAYOUT_TRANSITION_SPRING} from '../../styles/modules/variables' +import {Box} from '../box/Box' +import {UIEvents} from './enums' +import {Emitter, ToastProps, Toast} from './index' const ToastWrapper = styled(motion(Box)).attrs({ width: ['100%', 'auto'], @@ -28,13 +28,14 @@ const ToastContainer = () => { useEffect(() => { // We use several throughout the app // We check if a Container already exists before creating a new one that could interfere with others, preventing events from working - if (Emitter.listenerCount(UIEvents.ToastShow) === 0) { + if (Emitter.listenerCount(UIEvents.ToastShow) === 0) { Emitter.on(UIEvents.ToastShow, (newToast: ToastProps) => { setToast(newToast) }) Emitter.on(UIEvents.ToastClear, () => { setToast(null) }) + } return () => { @@ -50,7 +51,7 @@ const ToastContainer = () => { return ( { alignItems: toast?.position?.includes('left') ? 'flex-start' : toast?.position?.includes('right') - ? 'flex-end' - : 'center', + ? 'flex-end' + : 'center', flexDirection: toast?.position?.includes('bottom') ? 'column-reverse' : 'column',