burger-online

1
import React from 'react'
2
import {useSelector} from 'react-redux'
3
import {Link} from 'react-router-dom'
4
import {feedOrderStore} from '../../redux/feed-orders/reducer'
5
import styles from './order-number-list.module.css'
6
import {TOrderNumberListProps} from './types'
7

8
const OrderNumberList: React.FC<TOrderNumberListProps> = ({status, title}) => {
9
  const {orders} = useSelector(feedOrderStore)
10

11
  return (
12
    <div>
13
      <h3 className={`text text_type_main-medium ${styles.titleProgress}`}>{title}:</h3>
14
      <ul className={`custom-scroll ${styles.progress}`}>
15
        {orders.map(
16
          order =>
17
            order.ingredients.length > 1 &&
18
            order.status === status && (
19
              <Link key={order.number} to={`/feed/${order.number}`}>
20
                <li
21
                  className={`text_type_digits-default ${status === 'done' ? 'text_color_success' : ''}`}
22
                >
23
                  {order.number}
24
                </li>
25
              </Link>
26
            )
27
        )}
28
      </ul>
29
    </div>
30
  )
31
}
32

33
export default OrderNumberList
34