import React, { useState, useEffect } from "react";
import { Grid, Row, Col, Table } from "react-bootstrap";
import UserDataCard from '../components/UserHistory/UserDataCard';
import UserHistoryCard from '../components/UserHistory/UserHistoryCard';
import SearchButton from "../components/UserHistory/SearchButton";

const UserHistory = () => {
  const [userId, setUserId] = useState(0);

  useEffect(() => {
    // componentDidMount > 쿼리 검사하기
  },[]);

  return (
    <div className="content">
      <Grid fluid>
        <Row>
          <Col md={4} mdOffset={8} sm={5} smOffset={7} style={{marginBottom:15}}>
            <SearchButton/>
          </Col>
        </Row>
        <Row>
          <Col md={12}>
            <UserDataCard userId={userId}/>
          </Col>
          <Col md={12}>
            <UserHistoryCard userId={userId}/>
          </Col>
        </Row>
      </Grid>
    </div>
  );
};

export default UserHistory;