import React from 'react'
import styles from './recentTnx.module.css'
import { BsTriangleFill } from 'react-icons/bs';
import SingleTransaction from './SingleTransaction'

export default function RecentTransactions() {
  return (
    <div className={styles.main}>
      <div className={styles.heading}>
        <div className={styles.hRecTnx}>Recent Transactions</div>
        <div className={styles.hSeeAll}>See All</div>
      </div>

      <div className={styles.options}>
        <div className={styles.optionButton}>
          <div>All transactions</div>
          <div>
            <BsTriangleFill
              size={10}
              className={styles.arrow}
              color="#676483"
            />
          </div>
        </div>
        <div className={styles.optionButton}>
          <div>All banks</div>
          <div>
            <BsTriangleFill
              size={10}
              className={styles.arrow}
              color="#676483"
            />
          </div>
        </div>
      </div>

      <div>
        <SingleTransaction />
        <SingleTransaction />
        <SingleTransaction />
        <SingleTransaction />
      </div>
    </div>
  )
}