lodash#delay TypeScript Examples

The following examples show how to use lodash#delay. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.

Example #1

Source File: NftGiveawayModal.tsx From glide-frontend with GNU General Public License v3.0

6 votes

NftGiveawayModal: React.FC<InjectedModalProps> = ({ onDismiss }) => {
  const { t } = useTranslation()
  const { profile } = useProfile()
  const nft = getClaimableNft(profile)

  // This is required because the modal exists outside the Router
  const handleClick = () => {
    onDismiss()
    history.push('/collectibles')
  }

  useEffect(() => {
    delay(showConfetti, 100)
  }, [])

  return (
    <Modal title={t('Congratulations!')} onDismiss={onDismiss}>
      <Flex flexDirection="column" alignItems="center" justifyContent="center">
        {nft && <NftImage src={`/images/nfts/${nft.images.md}`} />}
        <Text bold color="secondary" fontSize="24px" mb="24px">
          {t('You won a collectible!')}
        </Text>
        <Button onClick={handleClick}>{t('Claim now')}</Button>
      </Flex>
    </Modal>
  )
}

Example #2

Source File: index.tsx From glide-frontend with GNU General Public License v3.0

6 votes

ClaimPrizesModal: React.FC<ClaimPrizesModalModalProps> = ({ onDismiss, roundsToClaim }) => {
  const { t } = useTranslation()
  const { account } = useWeb3React()
  const { currentLotteryId } = useLottery()
  const dispatch = useAppDispatch()

  useEffect(() => {
    delay(showConfetti, 100)
  }, [])

  return (
    <StyledModal minWidth="280px">
      <BunnyDecoration>
        <img src="/images/decorations/prize-bunny.png" alt="bunny decoration" height="124px" width="168px" />
      </BunnyDecoration>
      <StyledModalHeader>
        <ModalTitle>
          <Heading>{t('Collect Winnings')}</Heading>
        </ModalTitle>
        <ModalCloseButton onDismiss={onDismiss} />
      </StyledModalHeader>
      <ModalBody p="24px">
        <ClaimPrizesInner
          onSuccess={() => {
            dispatch(fetchUserLotteries({ account, currentLotteryId }))
            onDismiss()
          }}
          roundsToClaim={roundsToClaim}
        />
      </ModalBody>
    </StyledModal>
  )
}

Example #3

Source File: NftGiveawayModal.tsx From vvs-ui with GNU General Public License v3.0

6 votes

NftGiveawayModal: React.FC<NftGiveawayModalProps> = ({ onDismiss, nfts }) => {
  const { t } = useTranslation()

  // This is required because the modal exists outside the Router
  const handleClick = () => {
    onDismiss()
    history.push('/collectibles')
  }

  useEffect(() => {
    delay(showConfetti, 100)
  }, [])

  const getImages = () => {
    return nfts.map((nft) => <NftImage key={nft.id} src={`/images/nfts/${nft.images.md}`} />)
  }

  return (
    <Modal title={t('Congratulations!')} onDismiss={onDismiss}>
      <Flex flexDirection="column" alignItems="center" justifyContent="center">
        <Flex flexWrap="wrap" alignItems="center" justifyContent="center">
          {getImages()}
        </Flex>
        <Text textAlign="center" bold color="secondary" fontSize="24px" mb="24px">
          {nfts.length > 1 ? t('You won multiple collectibles!') : t('You won a collectible!')}
        </Text>
        <Button onClick={handleClick}>{t('Claim now')}</Button>
      </Flex>
    </Modal>
  )
}

Example #4

Source File: index.tsx From vvs-ui with GNU General Public License v3.0

6 votes

ClaimPrizesModal: React.FC<ClaimPrizesModalModalProps> = ({ onDismiss, roundsToClaim }) => {
  const { t } = useTranslation()
  const { account } = useWeb3React()
  const { currentLotteryId } = useLottery()
  const dispatch = useAppDispatch()

  useEffect(() => {
    delay(showConfetti, 100)
  }, [])

  return (
    <StyledModal minWidth="280px">
      <BunnyDecoration>
        <img src="/images/decorations/prize-bunny.png" alt="bunny decoration" height="124px" width="168px" />
      </BunnyDecoration>
      <StyledModalHeader>
        <ModalTitle>
          <Heading>{t('Collect Winnings')}</Heading>
        </ModalTitle>
        <ModalCloseButton onDismiss={onDismiss} />
      </StyledModalHeader>
      <ModalBody p="24px">
        <ClaimPrizesInner
          onSuccess={() => {
            dispatch(fetchUserLotteries({ account, currentLotteryId }))
            onDismiss()
          }}
          roundsToClaim={roundsToClaim}
        />
      </ModalBody>
    </StyledModal>
  )
}