safe-global / safe-react / 2535272814

coverage: 37.264%. Remained the same
2535272814

Pull #3987

github

GitHub 
Merge 104803e44 into 730abb9fc
Pull Request #3987: fix: adjust notification centre styles

1460 of 4894 branches covered (29.83%)

Branch coverage included in aggregate %.

4 of 18 new or added lines in 3 files covered. (22.22%)

4 existing lines in 2 files now uncovered.

4020 of 9812 relevant lines covered (40.97%)

37.99 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

71.43
/src/components/AppLayout/Header/components/Notifications/NotificationItem.tsx
1 
import { ReactElement } from 'react'
2 
import styled from 'styled-components'
3 
import { OptionsObject } from 'notistack'
4 









5



import { NotificationsState } from 'src/logic/notifications/store/notifications'










6



import { black500 } from 'src/theme/variables'










7



import { formatTime } from 'src/utils/date'










8



import AlertIcon from 'src/assets/icons/alert.svg'










9



import CheckIcon from 'src/assets/icons/check.svg'










10



import ErrorIcon from 'src/assets/icons/error.svg'










11



import InfoIcon from 'src/assets/icons/info.svg'










12



import { UnreadNotificationBadge, NotificationSubtitle } from 'src/components/AppLayout/Header/components/Notifications'










13












14



const notificationIcon = {




1✔





15



  error: ErrorIcon,










16



  info: InfoIcon,










17



  success: CheckIcon,










18



  warning: AlertIcon,










19



}










20












21



const getNotificationIcon = (variant: OptionsObject['variant'] = 'info'): string => notificationIcon[variant]





1!





22












23



const NoficationItem = ({ read, options, message, timestamp }: NotificationsState[number]): ReactElement => (




1✔






UNCOV

24



  <Notification>




×







25



    <UnreadNotificationBadge










26



      variant="dot"










27



      overlap="circle"










28



      invisible={read}










29



      anchorOrigin={{










30



        vertical: 'top',










31



        horizontal: 'left',










32



      }}










33



    >










34



      <img src={getNotificationIcon(options?.variant)} />










35



    </UnreadNotificationBadge>










36



    <div>










37



      <NotificationMessage>{message}</NotificationMessage>










38



      <br />










39



      <NotificationSubtitle>{formatTime(timestamp)}</NotificationSubtitle>










40



    </div>










41



  </Notification>










42



)










43












44



const Notification = styled.div`




1✔





45



  box-sizing: border-box;










46



  display: flex;










47



  align-items: center;










48



  > * {










49



    padding: 8px;










50



  }










51



`










52













53



const NotificationMessage = styled.p`




1✔





54



  all: unset;










55



  font-weight: 400;










56



  font-size: 16px;










57



  line-height: 24px;










58



  color: ${black500};










59



`










60












61



export default NoficationItem
























    

  • 

    •