<commit_before>import React from 'react';
import { connect } from 'react-redux';
import { Link } from 'react-router';
import { injectIntl } from 'react-intl';
import Isvg from 'react-inlinesvg';
import makeSelectWhatsHappening from './selectors';
import BellIcon from 'assets/images/icons/bell.svg';
import { createStructuredSelector } from 'reselect';
import styled from 'styled-components';

const CounterArea = styled.div`
  color: white;
  text-align: center;
  width: 20px;
  font-size: 12px;
  position: relative;

  span {
    z-index: 100;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-weight: 800;
  }

  &::after {
    content: ' ';
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 50;
    width: 100%;
    padding-bottom: 100%;
    background: black;
    border-radius: 50%;
    transform: translate(-50%, -50%);
  }

`;

class Counter extends React.PureComponent {

  constructor(props) {
    super();
  }

  render() {


    const { data, lastViewed } = this.props.WhatsHappening;
    const { locale } = this.props.intl;
    if (!data || data === undefined) return null;

    const unseenCount = data.filter(item=> {
          const dateTime = new Date(item.date);
          return dateTime > lastViewed;
      });


    // if (unseenCount.length == 0) return null;

    return (
      <CounterArea><span>{unseenCount.length}</span></CounterArea>
    )
  }
}

const mapStateToProps = createStructuredSelector({
  WhatsHappening: makeSelectWhatsHappening(),
});
<commit_msg>Revert back the counter<commit_after>import React from 'react';
import { connect } from 'react-redux';
import { Link } from 'react-router';
import { injectIntl } from 'react-intl';
import Isvg from 'react-inlinesvg';
import makeSelectWhatsHappening from './selectors';
import BellIcon from 'assets/images/icons/bell.svg';
import { createStructuredSelector } from 'reselect';
import styled from 'styled-components';

const CounterArea = styled.div`
  color: white;
  text-align: center;
  width: 20px;
  font-size: 12px;
  position: relative;

  span {
    z-index: 100;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-weight: 800;
  }

  &::after {
    content: ' ';
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 50;
    width: 100%;
    padding-bottom: 100%;
    background: black;
    border-radius: 50%;
    transform: translate(-50%, -50%);
  }

`;

class Counter extends React.PureComponent {

  constructor(props) {
    super();
  }

  render() {


    const { data, lastViewed } = this.props.WhatsHappening;
    const { locale } = this.props.intl;
    if (!data || data === undefined) return null;

    const unseenCount = data.filter(item=> {
          const dateTime = new Date(item.date);
          return dateTime > lastViewed;
      });


    if (unseenCount.length == 0) return null;

    return (
      <CounterArea><span>{unseenCount.length}</span></CounterArea>
    )
  }
}

const mapStateToProps = createStructuredSelector({
  WhatsHappening: makeSelectWhatsHappening(),
});

{'fraction_non_alphanumeric': 0.13914716255210002, 'fraction_numerical': 0.023725553061878808, 'mean_word_length': 3.1879194630872485, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 15, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '918738', 'n_tokens_mistral': 1095, 'n_tokens_neox': 994, 'n_words': 253}