{"size": 985, "ext": "js", "max_stars_repo_path": "src/screens/Home/index.js", "max_stars_repo_name": "riedlav/kinvo-mobile-test", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/screens/Home/index.js", "max_issues_repo_name": "riedlav/kinvo-mobile-test", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/screens/Home/index.js", "max_forks_repo_name": "riedlav/kinvo-mobile-test", "max_forks_repo_forks_event_min_datetime": "2021-03-03T23:30:35.000Z", "max_forks_repo_forks_event_max_datetime": "2021-03-03T23:43:39.000Z"}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": 2, "avg_line_length": 20.1020408163, "max_line_length": 69, "alphanum_fraction": 0.5868020305}
import React, { useCallback } from 'react';

// Components
import Card from '~/components/Card';

// Styles
import { Container } from './styles';

// Icons
import acoesIcon from '~/assets/images/acoes-icon.png';
import fundosIcon from '~/assets/images/fundos-icon.png';
import previdenciasIcon from '~/assets/images/previdencias-icon.png';

const Home = () => {
  const cards = [
    {
      id: 1,
      icon: acoesIcon,
      title: 'Ações',
      subtitle: 'Nacionais',
      route: 'Acoes',
    },
    {
      id: 2,
      icon: fundosIcon,
      title: 'Fundos',
      subtitle: 'De investimento',
      isNew: true,
      route: 'Fundos',
    },
    {
      id: 3,
      icon: previdenciasIcon,
      title: 'Previdencias',
      subtitle: 'Privadas',
      route: 'Previdencias',
    },
  ];

  const renderCard = useCallback(
    (data, idx) => <Card key={data.id} data={data} />,
    [],
  );

  return <Container>{cards.map(renderCard)}</Container>;
};

export default Home;
