{"size": 1228, "ext": "js", "max_stars_repo_path": "src/components/JoinUs.js", "max_stars_repo_name": "vientang/meetup-softball", "max_stars_repo_stars_event_min_datetime": "2019-04-30T11:07:01.000Z", "max_stars_repo_stars_event_max_datetime": "2020-02-09T03:20:11.000Z", "max_issues_repo_path": "src/components/JoinUs.js", "max_issues_repo_name": "vientang/meetup-softball", "max_issues_repo_issues_event_min_datetime": "2018-12-16T20:52:10.000Z", "max_issues_repo_issues_event_max_datetime": "2019-08-18T21:51:49.000Z", "max_forks_repo_path": "src/components/JoinUs.js", "max_forks_repo_name": "vientang/meetup-softball", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": 103, "max_forks_count": null, "avg_line_length": 28.5581395349, "max_line_length": 81, "alphanum_fraction": 0.5048859935}
import React from 'react';
import get from 'lodash/get';
import { useFetchNextMeetupGames } from '../utils/hooks';
import componentStyles from './components.module.css';

const isCoronaVirus = true;

const JoinUs = () => {
    const nextGames = useFetchNextMeetupGames();

    if (!nextGames.length) {
        return null;
    }

    const nextGame = nextGames[0];
    const field = get(nextGame, 'venue.name', '');
    const openSpots = nextGame.rsvp_limit - nextGame.yes_rsvp_count;

    return (
        <div className={componentStyles.joinUs}>
            <a
                href={nextGame.link}
                target="_blank"
                rel="noopener noreferrer"
                className={componentStyles.joinUsTitle}
            >
                {isCoronaVirus ? (
                    <strong>Stay safe out there</strong>
                ) : (
                    <>
                        <small>{`Next game at ${field}!`}</small>
                        <strong className={componentStyles.joinUsRemainingCount}>
                            {`${openSpots} spots left`}
                        </strong>
                    </>
                )}
            </a>
        </div>
    );
};

export default JoinUs;
