wav-game/frontend/src/components/GameCards/GameCards.tsx at 035a91a899fd274645c0b7218a80f740450c1458 · liquality/wav-game · GitHub

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
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
import { getPublicKey } from "../../utils";
import "./game-cards.css";
import { Level1 } from "./Level1";
import { Level2 } from "./Level2";
import { Level3 } from "./Level3";
import { Level4 } from "./Level4";
import { Level5 } from "./Level5";
import { Level6 } from "./Level6";
import { useState, useEffect, useContext } from "react";
import UserService from "../../services/UserService";
import { DataContext } from "../../DataContext";
interface GameCardsProps {
  /**
    The current game
   */
  currentGame?: any;
  selectedLevel: number;
  currentLevel: number;
  nftCount: any;
  userIsFullSetHolder: boolean;
  ended: boolean;

  /**
   * Click handler for each level
   */
  onTradeClick: (level: number) => void;
  onGetMoreClick: (level: number) => void;
  onLevelSelected: (level: number) => void;
}

/**
 * The collection or Card Levels with animation
 */
export const GameCards = (props: GameCardsProps) => {
  const {
    currentGame,
    currentLevel,
    selectedLevel,
    onTradeClick,
    onGetMoreClick,
    onLevelSelected,
    nftCount,
    userIsFullSetHolder,
    ended,
  } = props;
  console.log(ended, "ended props gamecards");

  const [burnStatus, setBurnStatus] = useState({});

  const { levelSettings } = useContext(DataContext);

  async function onSetLevel(levelId?: number) {
    onLevelSelected(levelId || currentLevel || 1);
  }

  useEffect(() => {
    async function getBurnStatus() {
      const _burnStatus = await [1, 2, 3, 4, 5, 6].reduce(
        async (prev, level) => {
          const accum = await prev;
          const status = await UserService.getLevelBurnStatus(
            currentGame.game_symbol_id,
            level,
            getPublicKey()
          );
          accum[level] = status;
          return accum;
        },
        Promise.resolve({})
      );

      setBurnStatus(_burnStatus);
    }

    getBurnStatus();
  }, [currentGame]);

  return (
    <div className="mt-5 game-cards">
      <Level1
        selectedLevel={selectedLevel}
        onSetLevel={onSetLevel}
        onTradeClick={onTradeClick}
        onGetMoreClick={onGetMoreClick}
        nftCount={nftCount}
        burnStatus={burnStatus[1]}
        currentLevel={currentLevel}
        levelSettings={levelSettings}
        ended={ended}
      />
      <Level2
        selectedLevel={selectedLevel}
        onSetLevel={onSetLevel}
        onTradeClick={onTradeClick}
        onGetMoreClick={onGetMoreClick}
        nftCount={nftCount}
        burnStatus={burnStatus[2]}
        currentLevel={currentLevel}
        levelSettings={levelSettings}
        ended={ended}
      />
      <Level3
        selectedLevel={selectedLevel}
        onSetLevel={onSetLevel}
        onTradeClick={onTradeClick}
        onGetMoreClick={onGetMoreClick}
        nftCount={nftCount}
        burnStatus={burnStatus[3]}
        currentLevel={currentLevel}
        levelSettings={levelSettings}
        ended={ended}
      />
      <Level4
        selectedLevel={selectedLevel}
        onSetLevel={onSetLevel}
        onTradeClick={onTradeClick}
        onGetMoreClick={onGetMoreClick}
        nftCount={nftCount}
        burnStatus={burnStatus[4]}
        currentLevel={currentLevel}
        levelSettings={levelSettings}
        currentGame={currentGame}
        ended={ended}
      />
      <Level5
        selectedLevel={selectedLevel}
        onSetLevel={onSetLevel}
        onTradeClick={onTradeClick}
        onGetMoreClick={onGetMoreClick}
        nftCount={nftCount}
        burnStatus={burnStatus[5]}
        currentLevel={currentLevel}
        levelSettings={levelSettings}
        currentGame={currentGame}
        ended={ended}
      />
      <Level6
        selectedLevel={selectedLevel}
        onSetLevel={onSetLevel}
        onTradeClick={onTradeClick}
        onGetMoreClick={onGetMoreClick}
        nftCount={nftCount}
        burnStatus={burnStatus[6]}
        currentLevel={currentLevel}
        levelSettings={levelSettings}
        currentGame={currentGame}
        userIsFullSetHolder={userIsFullSetHolder}
        ended={ended}
      />
    </div>
  );
};