<commit_before>import connect from 'fluxx/lib/ReactConnector'
import classNames from 'classnames'
import _ from 'space-lift'
import h from 'react-hyperscript'

import { mainStore } from '../store'
import { setFilter } from '../data'

import TextBlock from 'layouts/textBlock'
import IconHeader from 'reusableComponents/iconHeader'
import { History } from 'svg'
import CardList from '../components/cardlist'
import * as Cards from '../collections/CardCollection'
import settings from 'settings'

import styles from './whatIveDone.css'

const { grey } = settings
const CardCollection = _(Cards).values().value()

const WhatIveDone = props => {
  const renderFilterBtn = (text, dataAttr) => {
    const { filters } = props

    return h('button.btn-filter',
      {
        onClick: () => setFilter(dataAttr, !filters[dataAttr]),
        'data-props': dataAttr,
        className: classNames(filters[dataAttr] && 'active'),
        tabIndex: '0'
      },
      text
    )
  }

  return h('div', [
    h(IconHeader, { icon: History, size: 20, color: grey, text: 'My work' }),
    h(TextBlock, [h('p', `Here is what I've done so far :`)]),
    h('div', { className: styles.filters }, [
      h('span', 'show :'),
      renderFilterBtn('side projects', 'sideprojects'),
      renderFilterBtn('jobs', 'jobs')
    ]),
    h(CardList, {
      sortBy: 'title',
      collectionToRender: CardCollection,
      filters: props.filters
    })
  ])
}

export default connect(WhatIveDone, mainStore, state => state)<commit_msg>turn button filter into a component<commit_after>import connect from 'fluxx/lib/ReactConnector'
import _ from 'space-lift'
import h from 'react-hyperscript'

import { mainStore } from '../store'
import { setFilter } from '../data'

import TextBlock from 'layouts/textBlock'
import BtnFilter from 'widgets/btnFilter'
import IconHeader from 'reusableComponents/iconHeader'
import { History } from 'svg'
import CardList from '../components/cardlist'
import * as Cards from '../collections/CardCollection'
import settings from 'settings'

import styles from './whatIveDone.css'

const { grey } = settings
const CardCollection = _(Cards).values().value()

const WhatIveDone = props => {
  const renderBtnFilter = (text, dataAttr) => {
    const { filters } = props

    return h(BtnFilter, {
      onClick: () => setFilter(dataAttr, !filters[dataAttr]),
      isActive: filters[dataAttr],
      dataAttr,
      text
    })
  }

  return h('div', [
    h(IconHeader, { icon: History, size: 20, color: grey, text: 'My work' }),
    h(TextBlock, [h('p', `Here is what I've done so far :`)]),
    h('div', { className: styles.filters }, [
      h('span', 'show :'),
      renderBtnFilter('side projects', 'sideprojects'),
      renderBtnFilter('jobs', 'jobs')
    ]),
    h(CardList, {
      sortBy: 'title',
      collectionToRender: CardCollection,
      filters: props.filters
    })
  ])
}

export default connect(WhatIveDone, mainStore, state => state)
{'fraction_non_alphanumeric': 0.14295370057451842, 'fraction_numerical': 0.0016897600540723217, 'mean_word_length': 3.625, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 11, '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': '2817228', 'n_tokens_mistral': 911, 'n_tokens_neox': 888, 'n_words': 250}