<commit_before>import h from 'react-hyperscript'
import { isNil, map } from 'ramda'
import { compose } from 'recompose'
import { connect as connectFela, withTheme } from 'react-fela'
import { FormattedMessage } from 'dogstack/intl'
import { Step, StepButton, StepLabel, StepContent } from 'material-ui/Stepper'
import RaisedButton from 'material-ui/RaisedButton'

import Hint from '../../app/components/Hint'
import styles from '../styles/OrderStep'

function OrderStep (props) {
  const { styles, theme, step, stepIndex, setStepIndex, isStatic = false, onNavigate } = props
  const { index, name, description, Icon, taskPlan, completed, ready, hint, nameIntlId } = step

  const hasTaskPlan = !isNil(taskPlan)

  const statusColor = (
    ready
      ? theme.colors.primary2
      : completed
        ? theme.colors.text
        : theme.colors.greys[3]
  )

  return (
    h(Step, {
      className: styles.container,
      completed,
      active: stepIndex === index
    }, [
      h(isStatic ? StepLabel : StepButton, {
        className: styles.header,
        icon: (
          h(Icon, {
            color: statusColor
          })
        ),
        onClick: isStatic ? null : () => {
          setStepIndex(index)
        }
      }, [
        h('h3', {
          className: styles.name,
          style: {
            color: statusColor
          }
        }, [
          h(FormattedMessage, {
            id: nameIntlId,
            className: styles.labelText
          }),
        ])
      ]),
      h(StepContent, {
      }, [
        h('p', {
          className: styles.description
        }, [
          h(FormattedMessage, {
            id: description,
            className: styles.descriptionText
          }),
          h(Hint, {
            messageId: hint,
            position: 'top-right',
            iconSize: '24px'
          })
        ]),
        hasTaskPlan && (
          h(RaisedButton, {
            onClick: () => {
              const route = `/tasks/${taskPlan.id}`
              onNavigate(route)
            },
            primary: true,
            className: styles.button
          }, [
            h(FormattedMessage, {
              id: `tasks.recipes.${taskPlan.taskRecipeId}`,<commit_msg>chore(style): change tooltip position so that they can be read<commit_after>import h from 'react-hyperscript'
import { isNil, map } from 'ramda'
import { compose } from 'recompose'
import { connect as connectFela, withTheme } from 'react-fela'
import { FormattedMessage } from 'dogstack/intl'
import { Step, StepButton, StepLabel, StepContent } from 'material-ui/Stepper'
import RaisedButton from 'material-ui/RaisedButton'

import Hint from '../../app/components/Hint'
import styles from '../styles/OrderStep'

function OrderStep (props) {
  const { styles, theme, step, stepIndex, setStepIndex, isStatic = false, onNavigate } = props
  const { index, name, description, Icon, taskPlan, completed, ready, hint, nameIntlId } = step

  const hasTaskPlan = !isNil(taskPlan)

  const statusColor = (
    ready
      ? theme.colors.primary2
      : completed
        ? theme.colors.text
        : theme.colors.greys[3]
  )

  return (
    h(Step, {
      className: styles.container,
      completed,
      active: stepIndex === index
    }, [
      h(isStatic ? StepLabel : StepButton, {
        className: styles.header,
        icon: (
          h(Icon, {
            color: statusColor
          })
        ),
        onClick: isStatic ? null : () => {
          setStepIndex(index)
        }
      }, [
        h('h3', {
          className: styles.name,
          style: {
            color: statusColor
          }
        }, [
          h(FormattedMessage, {
            id: nameIntlId,
            className: styles.labelText
          }),
        ])
      ]),
      h(StepContent, {
      }, [
        h('p', {
          className: styles.description
        }, [
          h(FormattedMessage, {
            id: description,
            className: styles.descriptionText
          }),
          h(Hint, {
            messageId: hint,
            position: 'bottom-right',
            iconSize: '24px'
          })
        ]),
        hasTaskPlan && (
          h(RaisedButton, {
            onClick: () => {
              const route = `/tasks/${taskPlan.id}`
              onNavigate(route)
            },
            primary: true,
            className: styles.button
          }, [
            h(FormattedMessage, {
              id: `tasks.recipes.${taskPlan.taskRecipeId}`,
{'fraction_non_alphanumeric': 0.11752988047808766, 'fraction_numerical': 0.002213368747233289, 'mean_word_length': 1.7554878048780487, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 7, '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': '3930068', 'n_tokens_mistral': 1291, 'n_tokens_neox': 1278, 'n_words': 286}