{"size": 997, "ext": "js", "max_stars_repo_path": "src/components/sky/sky.js", "max_stars_repo_name": "beefyfinance/beefy-christmas", "max_stars_repo_stars_event_min_datetime": "2021-03-15T22:04:30.000Z", "max_stars_repo_stars_event_max_datetime": "2021-03-15T22:04:30.000Z", "max_issues_repo_path": "src/components/sky/sky.js", "max_issues_repo_name": "beefyfinance/beefy-christmas", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/sky/sky.js", "max_forks_repo_name": "beefyfinance/beefy-christmas", "max_forks_repo_forks_event_min_datetime": "2021-04-18T21:05:59.000Z", "max_forks_repo_forks_event_max_datetime": "2021-07-20T13:02:52.000Z"}
{"max_stars_count": 1, "max_issues_count": null, "max_forks_count": 2, "avg_line_length": 31.15625, "max_line_length": 104, "alphanum_fraction": 0.5466399198}
import React, { useEffect, useState } from 'react';

import Star from '../star';
import { GoldenCookie, GoldenBoot, GoldenCandy, Santa, Cow1, Cow2, Gift1, Gift2, Gift3 } from './style';

const Sky = () => {
  const [stars, setStars] = useState([]);

  useEffect(() => {
    let n = Math.ceil(Math.random() * 50) + 30;
    setStars(new Array(n).fill(0));
  }, []);

  return (
    <>
      <GoldenCandy src={require('../../assets/candy.svg')} />
      <GoldenBoot src={require('../../assets/boot.svg')} />
      <GoldenCookie src={require('../../assets/cookie.svg')} />
      <Santa src={require('../../assets/santa.svg')} />
      <Cow1 src={require('../../assets/cow.svg')} />
      <Cow2 src={require('../../assets/cow.svg')} />
      <Gift1 src={require('../../assets/gift.svg')} />
      <Gift2 src={require('../../assets/gift.svg')} />
      <Gift3 src={require('../../assets/gift.svg')} />

      {stars && stars.map((_, index) => <Star key={index} />)}
    </>
  );
};

export default Sky;
