PlayerDetail.renderPlayerGamesFull - Code Metrics - Inspection of "Full redesign from zero. (#758) (#874)" - soniCaH/KCVV-Elewijt-Gatsby - Measure and Improve Code Quality continuously with Scrutinizer

Passed

Push — master ( 7aa1e4...a37cc0 )

by Kevin Van

created 2022-09-05 08:59 UTC

PlayerDetail.renderPlayerGamesFull B

↳ Parent: PlayerDetail

Complexity

Conditions

Size

Total Lines	96
Code Lines	90

Duplication

Lines	0
Ratio	0 %

Importance

Changes

Metric	Value
eloc	90
dl	0
loc	96
rs	7.3272
c	0
b	0
f	0
cc	3

How to fix Long Method

import { StaticQuery, graphql } from "gatsby"
import { Link } from "gatsby"
import { getSrc } from "gatsby-plugin-image"
import moment from "moment"
import React, { Component, Fragment } from "react"
import Helmet from "react-helmet"
import { StringParam, useQueryParam } from "use-query-params"

import Icon from "../components/Icon"
import RelatedNews from "../components/RelatedNews"
import iconCardRed from "../images/i_card_red.png"
import iconCardYellow from "../images/i_card_yellow.png"
import iconCleansheet from "../images/i_cleansheet.png"
import iconGoal from "../images/i_goal.png"
import { mapPositionCode } from "../scripts/helper"
import Card from "./Card"
import "./player.scss"

// eslint-disable-next-line
String.prototype.replaceAll = function (search, replacement) {
  // eslint-disable-next-line @typescript-eslint/no-this-alias
  var target = this
  return target.replace(new RegExp(search, `g`), replacement)
}

/**
 */
class PlayerDetail extends Component {
  constructor(props) {
    super(props)

    this.state = {
      data: [],
      loading: true,
    }

    const {
      config: {
        site: {
          siteMetadata: { kcvvPsdApi },
        },
      },
      player: { field_vv_id: playerId },
    } = this.props

    this.kcvvPsdApi = kcvvPsdApi
    this.playerId = playerId
  }

  updateData() {
    if (this.playerId === null) {
      return
    }

    const apiUrl = `${this.kcvvPsdApi}/stats/player/${this.playerId}`

    fetch(apiUrl)
      .then((response) => response.json())
      .then((json) => this.setState({ data: json, loading: false }))
      .catch(() => this.setState({ data: {}, loading: false }))
  }

  componentDidMount() {
    this.updateData()
  }

  renderPlayerName = (player) => (
    <h1 className={`player-detail__name`}>
      <span className={`player-detail__name-first`}>{player.field_firstname}</span>
      <span className={`player-detail__name-last`}>{player.field_lastname}</span>
    </h1>
  )
  renderPlayerImage = (player) => (
    <div className={`bg-green-mask`}>
      <div
        className={`player-detail__bg-avatar`}
        style={
          player.relationships.field_image && {
            backgroundImage: `url(${getSrc(
              player.relationships.field_image.localFile.childImageSharp.gatsbyImageData
            )})`,
          }
        }
      />
      <div className={`bg-white-end`} />
    </div>
  )
  renderPlayerHeader = (player) => (
    <header className={`player-detail__header`}>
      {this.renderPlayerName(player)}
      {this.renderPlayerImage(player)}

      <div className={`player-detail__bg-shirt-number`} aria-hidden="true">
        {player.field_shirtnumber || ``}
      </div>
    </header>
  )

  renderPlayerStatsFull = (player) => {
    if (this.state.loading === false && this.state.data) {
      const { playerStatistics = [] } = this.state.data

      return (
        <Card title="Statistieken" className={`player-detail__stats`} hasTable={true}>
          <table className={`player-detail__stats__table`}>
            <thead>
              <tr>
                <th className={`player-detail__column player-detail__column--string`}>Team</th>
                <th className={`player-detail__column player-detail__column--number show-for-medium`}>
                  <span title="Wedstrijden gespeeld">P</span>
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <span title="Wedstrijden gewonnen">W</span>
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <span title="Wedstrijden gelijkgespeeld">D</span>
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <span title="Wedstrijden verloren">L</span>
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <img
                    src={iconCardYellow}
                    title="Gele kaart"
                    alt="Gele kaart"
                    className="player-detail__stats--header_icon"
                  />
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <img
                    src={iconCardRed}
                    title="Rode kaart"
                    alt="Rode kaart"
                    className="player-detail__stats--header_icon"
                  />
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <img
                    src={iconGoal}
                    title="Doelpunt(en) gescoord"
                    alt="Doelpunt(en) gescoord"
                    className="player-detail__stats--header_icon"
                  />
                </th>
                <th className={`player-detail__column player-detail__column--number  show-for-medium`}>
                  <img
                    src={iconCleansheet}
                    title="Cleansheets"
                    alt="Cleansheets"
                    className="player-detail__stats--header_icon"
                  />
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <span title="Minuten gespeeld">
                    <Icon icon="fa-clock-o" />
                  </span>
                </th>
              </tr>
            </thead>
            <tbody>
              {playerStatistics.map(function (stats) {
                return (
                  <tr>
                    <td className={`player-detail__column player-detail__column--string`}>
                      {stats.team.replace(`Voetbal : `, ``)}
                    </td>
                    <td className={`player-detail__column player-detail__column--number show-for-medium`}>
                      {stats.gamesPlayed}
                    </td>
                    <td className={`player-detail__column player-detail__column--number`}>{stats.gamesWon}</td>
                    <td className={`player-detail__column player-detail__column--number`}>{stats.gamesEqual}</td>
                    <td className={`player-detail__column player-detail__column--number`}>{stats.gamesLost}</td>
                    <td className={`player-detail__column player-detail__column--number`}>{stats.yellowCards}</td>
                    <td className={`player-detail__column player-detail__column--number`}>{stats.redCards}</td>
                    <td className={`player-detail__column player-detail__column--number`}>{stats.goals}</td>
                    <td className={`player-detail__column player-detail__column--number show-for-medium`}>
                      {stats.cleanSheets}
                    </td>
                    <td className={`player-detail__column player-detail__column--number`}>{stats.minutes}'</td>
                  </tr>
                )
              })}
            </tbody>
          </table>
        </Card>
      )
    }
  }
  renderPlayerGamesFull = () => {
    if (this.state.loading === false && this.state.data) {
      const { gameReports = [] } = this.state.data

      return (
        <Card className={`player-detail__games`} title="Wedstrijden" hasTable={true}>
          <table className={`player-detail__games__table responsive-card-table`}>
            <thead>
              <tr>
                <th className={`player-detail__column player-detail__column--string`}>Team</th>
                <th className={`player-detail__column player-detail__column--string`}>Type</th>
                <th className={`player-detail__column player-detail__column--string`}>Datum</th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <span title="Thuis/uit">H/A</span>
                </th>
                <th className={`player-detail__column player-detail__column--score`}>Score</th>
                <th className={`player-detail__column player-detail__column--string`}>Tegenstander</th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <img
                    src={iconCardYellow}
                    title="Gele kaart"
                    alt="Gele kaart"
                    className="player-detail__stats--header_icon"
                  />
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <img
                    src={iconCardRed}
                    title="Rode kaart"
                    alt="Rode kaart"
                    className="player-detail__stats--header_icon"
                  />
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <img
                    src={iconGoal}
                    title="Doelpunten gescoord"
                    alt="Rode kaart"
                    className="player-detail__stats--header_icon"
                  />
                </th>
                <th className={`player-detail__column player-detail__column--number`}>
                  <span title="Minuten gespeeld">
                    <Icon icon="fa-clock-o" />
                  </span>
                </th>
              </tr>
            </thead>
            <tbody>
              {gameReports.map(function (game) {
                return (
                  <tr>
                    <td data-label="Team" className={`player-detail__column player-detail__column--string`}>
                      {game.team.replace(`Voetbal : `, ``)}
                    </td>
                    <td data-label="Type" className={`player-detail__column player-detail__column--string`}>
                      {game.competition}
                    </td>
                    <td data-label="Datum" className={`player-detail__column player-detail__column--string`}>
                      {moment(game.date).format(`DD/MM/YYYY`)}
                    </td>
                    <td data-label="Thuis/uit" className={`player-detail__column player-detail__column--number`}>
                      {game.home ? (
                        <span className={`player-detail__games__home`} title="Thuiswedstrijd">
                          <Icon icon="fa-home" alt="Thuiswedstrijd" />
                        </span>
                      ) : (
                        <span className={`player-detail__games__away`} title="Uitwedstrijd">
                          <Icon icon="fa-bus" alt="Uitwedstrijd" />
                        </span>
                      )}
                    </td>
                    <td data-label="Score" className={`player-detail__column player-detail__column--score`}>
                      {game.goalsHomeTeam}&nbsp;-&nbsp;{game.goalsAwayTeam}
                    </td>
                    <td data-label="Tegenstander" className={`player-detail__column player-detail__column--string`}>
                      {game.opponent}
                    </td>
                    <td data-label="Gele kaart(en)" className={`player-detail__column player-detail__column--number`}>
                      {game.yellowCards}
                    </td>
                    <td data-label="Rode kaart(en)" className={`player-detail__column player-detail__column--number`}>
                      {game.redCards}
                    </td>
                    <td data-label="Doelpunten" className={`player-detail__column player-detail__column--number`}>
                      {game.goals}
                    </td>
                    <td data-label="Speeltijd" className={`player-detail__column player-detail__column--number`}>
                      {game.minutesPlayed}'
                    </td>
                  </tr>
                )
              })}
            </tbody>
          </table>
        </Card>
      )
    }
  }

  renderPlayerBirthdate = (player) => (
    <div className={`player-detail__data-item player-detail__data-item--birthdate`}>
      <span className={`player-detail__data-item__label`}>Geboortedatum</span>
      <span className={`player-detail__data-item__data`}>{player.field_birth_date || `Onbekend`}</span>
    </div>
  )
  renderPlayerPosition = (player) => (
    <div className={`player-detail__data-item player-detail__data-item--position`}>
      <span className={`player-detail__date-item__data`}>
        {player.field_position && mapPositionCode(player.field_position)}
      </span>
      <span className={`player-detail__data-item__label`}>
        {player.relationships.node__team && (
          <Link to={player.relationships.node__team[0].path.alias}>{player.relationships.node__team[0].title}</Link>
        )}
      </span>
    </div>
  )
  renderPlayerJoinDate = (player) => {
    const currentlyPlaying = !player.field_date_leave
    return (
      <div className={`player-detail__data-item player-detail__data-item--joindate`}>
        <span className={`player-detail__data-item__label`}>
          {currentlyPlaying && `Speler bij KCVV sinds`}
          {!currentlyPlaying && `Speler tussen`}
        </span>
        <span className={`player-detail__data-item__data`}>
          {player.field_join_date || `Onbekend`}
          {!currentlyPlaying && (
            <Fragment>
              <span className={`text--regular`}> en </span> {player.field_date_leave}
            </Fragment>
          )}
        </span>
      </div>
    )
  }

  render() {
    const { player } = this.props

    const team = player.relationships.node__team || []
    const articles = player.relationships.node__article || []

    return (
      <Fragment>
        <article className={`player-detail`}>
          {this.renderPlayerData(player)}
          {this.renderPlayerBody(player)}
          {this.renderPlayerStatsFull(player)}
          {this.renderPlayerGamesFull(player)}
        </article>

        {(team || articles) && <RelatedNews items={team.concat(articles)} limit={6} />}
      </Fragment>
    )
  }
}

// Retrieve endpoint of the logo's api from the site metadata (gatsby-config.js).
const query = graphql`
  query {
    site {
      siteMetadata {
        kcvvPsdApi
      }
    }
  }
`

export default ({ player }) => (
  <StaticQuery
    query={query}
    render={(data) => (
      <PlayerDetail
        // Data is the result of our query.
        config={data}
        player={player}
      />
    )}
  />
)


1			import { StaticQuery, graphql } from "gatsby"
2			import { Link } from "gatsby"
3			import { getSrc } from "gatsby-plugin-image"
4			import moment from "moment"
5			import React, { Component, Fragment } from "react"
6			import Helmet from "react-helmet"
7			import { StringParam, useQueryParam } from "use-query-params"
8
9			import Icon from "../components/Icon"
10			import RelatedNews from "../components/RelatedNews"
11			import iconCardRed from "../images/i_card_red.png"
12			import iconCardYellow from "../images/i_card_yellow.png"
13			import iconCleansheet from "../images/i_cleansheet.png"
14			import iconGoal from "../images/i_goal.png"
15			import { mapPositionCode } from "../scripts/helper"
16			import Card from "./Card"
17			import "./player.scss"
18
19			// eslint-disable-next-line
20			String.prototype.replaceAll = function (search, replacement) {
21			// eslint-disable-next-line @typescript-eslint/no-this-alias
22			var target = this
23			return target.replace(new RegExp(search, `g`), replacement)
24			}
25
26			/**
27			*/
28			class PlayerDetail extends Component {
29			constructor(props) {
30			super(props)
31
32			this.state = {
33			data: [],
34			loading: true,
35			}
36
37			const {
38			config: {
39			site: {
40			siteMetadata: { kcvvPsdApi },
41			},
42			},
43			player: { field_vv_id: playerId },
44			} = this.props
45
46			this.kcvvPsdApi = kcvvPsdApi
47			this.playerId = playerId
48			}
49
50			updateData() {
51			if (this.playerId === null) {
52			return
53			}
54
55			const apiUrl = `${this.kcvvPsdApi}/stats/player/${this.playerId}`
56
57			fetch(apiUrl)
58			.then((response) => response.json())
59			.then((json) => this.setState({ data: json, loading: false }))
60			.catch(() => this.setState({ data: {}, loading: false }))
61			}
62
63			componentDidMount() {
64			this.updateData()
65			}
66
67			renderPlayerName = (player) => (
68			<h1 className={`player-detail__name`}>
69			<span className={`player-detail__name-first`}>{player.field_firstname}</span>
70			<span className={`player-detail__name-last`}>{player.field_lastname}</span>
71			</h1>
72			)
73			renderPlayerImage = (player) => (
74			<div className={`bg-green-mask`}>
75			<div
76			className={`player-detail__bg-avatar`}
77			style={
78			player.relationships.field_image && {
79			backgroundImage: `url(${getSrc(
80			player.relationships.field_image.localFile.childImageSharp.gatsbyImageData
81			)})`,
82			}
83			}
84			/>
85			<div className={`bg-white-end`} />
86			</div>
87			)
88			renderPlayerHeader = (player) => (
89			<header className={`player-detail__header`}>
90			{this.renderPlayerName(player)}
91			{this.renderPlayerImage(player)}
92
93			<div className={`player-detail__bg-shirt-number`} aria-hidden="true">
94			{player.field_shirtnumber \|\| ``}
95			</div>
96			</header>
97			)
98
99			renderPlayerStatsFull = (player) => {
100			if (this.state.loading === false && this.state.data) {
101			const { playerStatistics = [] } = this.state.data
102
103			return (
104			<Card title="Statistieken" className={`player-detail__stats`} hasTable={true}>
105			<table className={`player-detail__stats__table`}>
106			<thead>
107			<tr>
108			<th className={`player-detail__column player-detail__column--string`}>Team</th>
109			<th className={`player-detail__column player-detail__column--number show-for-medium`}>
110			<span title="Wedstrijden gespeeld">P</span>
111			</th>
112			<th className={`player-detail__column player-detail__column--number`}>
113			<span title="Wedstrijden gewonnen">W</span>
114			</th>
115			<th className={`player-detail__column player-detail__column--number`}>
116			<span title="Wedstrijden gelijkgespeeld">D</span>
117			</th>
118			<th className={`player-detail__column player-detail__column--number`}>
119			<span title="Wedstrijden verloren">L</span>
120			</th>
121			<th className={`player-detail__column player-detail__column--number`}>
122			<img
123			src={iconCardYellow}
124			title="Gele kaart"
125			alt="Gele kaart"
126			className="player-detail__stats--header_icon"
127			/>
128			</th>
129			<th className={`player-detail__column player-detail__column--number`}>
130			<img
131			src={iconCardRed}
132			title="Rode kaart"
133			alt="Rode kaart"
134			className="player-detail__stats--header_icon"
135			/>
136			</th>
137			<th className={`player-detail__column player-detail__column--number`}>
138			<img
139			src={iconGoal}
140			title="Doelpunt(en) gescoord"
141			alt="Doelpunt(en) gescoord"
142			className="player-detail__stats--header_icon"
143			/>
144			</th>
145			<th className={`player-detail__column player-detail__column--number show-for-medium`}>
146			<img
147			src={iconCleansheet}
148			title="Cleansheets"
149			alt="Cleansheets"
150			className="player-detail__stats--header_icon"
151			/>
152			</th>
153			<th className={`player-detail__column player-detail__column--number`}>
154			<span title="Minuten gespeeld">
155			<Icon icon="fa-clock-o" />
156			</span>
157			</th>
158			</tr>
159			</thead>
160			<tbody>
161			{playerStatistics.map(function (stats) {
162			return (
163			<tr>
164			<td className={`player-detail__column player-detail__column--string`}>
165			{stats.team.replace(`Voetbal : `, ``)}
166			</td>
167			<td className={`player-detail__column player-detail__column--number show-for-medium`}>
168			{stats.gamesPlayed}
169			</td>
170			<td className={`player-detail__column player-detail__column--number`}>{stats.gamesWon}</td>
171			<td className={`player-detail__column player-detail__column--number`}>{stats.gamesEqual}</td>
172			<td className={`player-detail__column player-detail__column--number`}>{stats.gamesLost}</td>
173			<td className={`player-detail__column player-detail__column--number`}>{stats.yellowCards}</td>
174			<td className={`player-detail__column player-detail__column--number`}>{stats.redCards}</td>
175			<td className={`player-detail__column player-detail__column--number`}>{stats.goals}</td>
176			<td className={`player-detail__column player-detail__column--number show-for-medium`}>
177			{stats.cleanSheets}
178			</td>
179			<td className={`player-detail__column player-detail__column--number`}>{stats.minutes}'</td>
180			</tr>
181			)
182			})}
183			</tbody>
184			</table>
185			</Card>
186			)
187			}
188			}
189			renderPlayerGamesFull = () => {
190			if (this.state.loading === false && this.state.data) {
191			const { gameReports = [] } = this.state.data
192
193			return (
194			<Card className={`player-detail__games`} title="Wedstrijden" hasTable={true}>
195			<table className={`player-detail__games__table responsive-card-table`}>
196			<thead>
197			<tr>
198			<th className={`player-detail__column player-detail__column--string`}>Team</th>
199			<th className={`player-detail__column player-detail__column--string`}>Type</th>
200			<th className={`player-detail__column player-detail__column--string`}>Datum</th>
201			<th className={`player-detail__column player-detail__column--number`}>
202			<span title="Thuis/uit">H/A</span>
203			</th>
204			<th className={`player-detail__column player-detail__column--score`}>Score</th>
205			<th className={`player-detail__column player-detail__column--string`}>Tegenstander</th>
206			<th className={`player-detail__column player-detail__column--number`}>
207			<img
208			src={iconCardYellow}
209			title="Gele kaart"
210			alt="Gele kaart"
211			className="player-detail__stats--header_icon"
212			/>
213			</th>
214			<th className={`player-detail__column player-detail__column--number`}>
215			<img
216			src={iconCardRed}
217			title="Rode kaart"
218			alt="Rode kaart"
219			className="player-detail__stats--header_icon"
220			/>
221			</th>
222			<th className={`player-detail__column player-detail__column--number`}>
223			<img
224			src={iconGoal}
225			title="Doelpunten gescoord"
226			alt="Rode kaart"
227			className="player-detail__stats--header_icon"
228			/>
229			</th>
230			<th className={`player-detail__column player-detail__column--number`}>
231			<span title="Minuten gespeeld">
232			<Icon icon="fa-clock-o" />
233			</span>
234			</th>
235			</tr>
236			</thead>
237			<tbody>
238			{gameReports.map(function (game) {
239			return (
240			<tr>
241			<td data-label="Team" className={`player-detail__column player-detail__column--string`}>
242			{game.team.replace(`Voetbal : `, ``)}
243			</td>
244			<td data-label="Type" className={`player-detail__column player-detail__column--string`}>
245			{game.competition}
246			</td>
247			<td data-label="Datum" className={`player-detail__column player-detail__column--string`}>
248			{moment(game.date).format(`DD/MM/YYYY`)}
249			</td>
250			<td data-label="Thuis/uit" className={`player-detail__column player-detail__column--number`}>
251			{game.home ? (
252			<span className={`player-detail__games__home`} title="Thuiswedstrijd">
253			<Icon icon="fa-home" alt="Thuiswedstrijd" />
254			</span>
255			) : (
256			<span className={`player-detail__games__away`} title="Uitwedstrijd">
257			<Icon icon="fa-bus" alt="Uitwedstrijd" />
258			</span>
259			)}
260			</td>
261			<td data-label="Score" className={`player-detail__column player-detail__column--score`}>
262			{game.goalsHomeTeam} - {game.goalsAwayTeam}
263			</td>
264			<td data-label="Tegenstander" className={`player-detail__column player-detail__column--string`}>
265			{game.opponent}
266			</td>
267			<td data-label="Gele kaart(en)" className={`player-detail__column player-detail__column--number`}>
268			{game.yellowCards}
269			</td>
270			<td data-label="Rode kaart(en)" className={`player-detail__column player-detail__column--number`}>
271			{game.redCards}
272			</td>
273			<td data-label="Doelpunten" className={`player-detail__column player-detail__column--number`}>
274			{game.goals}
275			</td>
276			<td data-label="Speeltijd" className={`player-detail__column player-detail__column--number`}>
277			{game.minutesPlayed}'
278			</td>
279			</tr>
280			)
281			})}
282			</tbody>
283			</table>
284			</Card>
285			)
286			}
287			}
288
289			renderPlayerBirthdate = (player) => (
290			<div className={`player-detail__data-item player-detail__data-item--birthdate`}>
291			<span className={`player-detail__data-item__label`}>Geboortedatum</span>
292			<span className={`player-detail__data-item__data`}>{player.field_birth_date \|\| `Onbekend`}</span>
293			</div>
294			)
295			renderPlayerPosition = (player) => (
296			<div className={`player-detail__data-item player-detail__data-item--position`}>
297			<span className={`player-detail__date-item__data`}>
298			{player.field_position && mapPositionCode(player.field_position)}
299			</span>
300			<span className={`player-detail__data-item__label`}>
301			{player.relationships.node__team && (
302			<Link to={player.relationships.node__team[0].path.alias}>{player.relationships.node__team[0].title}</Link>
303			)}
304			</span>
305			</div>
306			)
307			renderPlayerJoinDate = (player) => {
308			const currentlyPlaying = !player.field_date_leave
309			return (
310			<div className={`player-detail__data-item player-detail__data-item--joindate`}>
311			<span className={`player-detail__data-item__label`}>
312			{currentlyPlaying && `Speler bij KCVV sinds`}
313			{!currentlyPlaying && `Speler tussen`}
314			</span>
315			<span className={`player-detail__data-item__data`}>
316			{player.field_join_date \|\| `Onbekend`}
317			{!currentlyPlaying && (
318			<Fragment>
319			<span className={`text--regular`}> en </span> {player.field_date_leave}
320			</Fragment>
321			)}
322			</span>
323			</div>
324			)
325			}
326
327			render() {
328			const { player } = this.props
329
330			const team = player.relationships.node__team \|\| []
331			const articles = player.relationships.node__article \|\| []
332
333			return (
334			<Fragment>
335			<article className={`player-detail`}>
336			{this.renderPlayerData(player)}
337			{this.renderPlayerBody(player)}
338			{this.renderPlayerStatsFull(player)}
339			{this.renderPlayerGamesFull(player)}
340			</article>
341
342			{(team \|\| articles) && <RelatedNews items={team.concat(articles)} limit={6} />}
343			</Fragment>
344			)
345			}
346			}
347
348			// Retrieve endpoint of the logo's api from the site metadata (gatsby-config.js).
349			const query = graphql`
350			query {
351			site {
352			siteMetadata {
353			kcvvPsdApi
354			}
355			}
356			}
357			`
358
359			export default ({ player }) => (
360			<StaticQuery
361			query={query}
362			render={(data) => (
363			<PlayerDetail
364			// Data is the result of our query.
365			config={data}
366			player={player}
367			/>
368			)}
369			/>
370			)
371

soniCaH / KCVV-Elewijt-Gatsby

Push — master ( 7aa1e4...a37cc0 )

PlayerDetail.renderPlayerGamesFull B

Complexity

Size

Duplication

Importance

How to fix Long Method

Long Method

Duplication Side-by-Side

Filter issues like