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

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;