import React from 'react';
import ReactDOM from 'react-dom';
import CommentDetail from './CommentDetails';
import faker from 'faker';
import ApprovalCard from './ApprovalCard';

const App = () => {
    return (
        <div className="ui container comments">
            <ApprovalCard >
                <CommentDetail author="Sam" timeAgo="Today at 5pm" avatar={faker.image.avatar()} content={faker.hacker.phrase()} />
            </ ApprovalCard>
            <ApprovalCard >
                <CommentDetail author="Alex" timeAgo="Today at 6pm" avatar={faker.image.avatar()} content={faker.hacker.phrase()} />
            </ ApprovalCard>
            <ApprovalCard >
                <CommentDetail author="Bob" timeAgo="Today at 7pm" avatar={faker.image.avatar()} content={faker.hacker.phrase()} />
            </ ApprovalCard>
        </div>
    )
};

ReactDOM.render(<App />, document.querySelector('#root'));
