import React from 'react';
import Link from 'next/link';
import { HomeProps } from '../../../model/components/home';
import RankingCanvas from '../ranking/RankingCanvas';
import Points from './Points';
import Rings from './Rings';

const Home: React.FC<HomeProps> = ({ rings, user }) => (
  <section className="home">
    <Points user={user} />
    <Rings rings={rings} user={user} />
    <Link href="/ranking">
      <a title="Ranking" href="/ranking">
        <RankingCanvas />
      </a>
    </Link>
  </section>
);

export default Home;