frontend/src/pages/Games.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47

import React from "react";
import { Helmet } from "react-helmet";

import GameEntry from "@components/GameEntry";
import { Game } from "@customTypes/Game";
import "@css/Maps.css";

interface GamesProps {
  games: Game[];
}

const Games: React.FC<GamesProps> = ({ games }) => {
  const _page_load = () => {
    const loaders = document.querySelectorAll(".loader");
    loaders.forEach(loader => {
      (loader as HTMLElement).style.display = "none";
    });
  };

  React.useEffect(() => {
    document
      .querySelectorAll(".games-page-item-body")
      .forEach((game, index) => {
        game.innerHTML = "";
      });
    _page_load();
  }, []);

  return (
    <div className="games-page">
      <Helmet>
        <title>LPHUB | Games</title>
      </Helmet>
      <section>
        <div className="games-page-content">
          <div className="games-page-item-content">
            {games.map((game, index) => (
              <GameEntry game={game} key={index} />
            ))}
          </div>
        </div>
      </section>
    </div>
  );
};

export default Games;