Skip to content

Commit 5df2597

Browse files
committed
so far so good, tested up to xyz
1 parent 2f53c4a commit 5df2597

File tree

12 files changed

+178
-32
lines changed

12 files changed

+178
-32
lines changed

gatsby/README.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -112,4 +112,6 @@ This project wolud not exist whitout these guys.
112112

113113
[Cloudinary](https://cloudinary.com) - Great free tier and fast CDN for images.
114114

115-
[Netlify](https://www.netlify.com) - Incredible static hosting.
115+
[Zeit's Now](https://zeit.co/now) - Amazing static hosting.
116+
117+
[Zeit's Design](https://zeit.co/design) - Beautiful components, I'm using a couple of their styles.

gatsby/gatsby-config.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,8 @@ module.exports = {
4545
name: "super-pokedex",
4646
short_name: "pokedex",
4747
start_url: "/",
48-
background_color: "#663399",
49-
theme_color: "#663399",
48+
background_color: "navy",
49+
theme_color: "navy",
5050
display: "minimal-ui",
5151
icon: "src/images/gatsby-icon.png", // This path is relative to the root of the site.
5252
},

gatsby/gatsby-node.js

Lines changed: 123 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -118,12 +118,11 @@ exports.createPages = async function createPages({ graphql, actions }) {
118118
})
119119

120120
allPokemon.forEach(async ({ node }) => {
121-
const pokemonName = node.name.includes("deoxys-normal")
122-
? "deoxys"
123-
: node.name
121+
const pokemonName = node.name
122+
const pokemonSpeciesName = patchPokemonSpeciesName(pokemonName)
124123
const pokemonSpeciesResult = await graphql(`
125124
{
126-
pokeapiPokemonSpecies(name: { eq: "${pokemonName}" }) {
125+
pokeapiPokemonSpecies(name: { eq: "${pokemonSpeciesName}" }) {
127126
evolution_chain {
128127
url
129128
}
@@ -193,9 +192,9 @@ exports.createPages = async function createPages({ graphql, actions }) {
193192
path: `/pokemon/${pokemonName}`,
194193
component: require.resolve(`./src/templates/pokemon.js`),
195194
context: {
196-
// Data passed to context is available
197-
// in page queries as GraphQL variables.
195+
// Data passed to context is available in page queries as GraphQL variables.
198196
name: pokemonName,
197+
speciesName: pokemonSpeciesName,
199198
evolutionChainId,
200199
evolutionChainSpriteIds,
201200
varietySpriteIds,
@@ -210,6 +209,124 @@ exports.createPages = async function createPages({ graphql, actions }) {
210209
})
211210
}
212211

212+
/**
213+
*
214+
* @param {string} pokemonName
215+
* @description
216+
* Some Pokémon have different name and species name,
217+
* so we have to "patch" them to avoid errors
218+
* @example replaces "deoxys-attack" with "deoxys"
219+
* @returns {string}
220+
*/
221+
function patchPokemonSpeciesName(pokemonName = "") {
222+
// Generation III
223+
if (pokemonName.includes("deoxys")) {
224+
return "deoxys"
225+
}
226+
227+
// Generation IV
228+
else if (pokemonName.includes("wormadam")) {
229+
return "wormadam"
230+
} else if (pokemonName.includes("giratina")) {
231+
return "giratina"
232+
} else if (pokemonName.includes("shaymin")) {
233+
return "shaymin"
234+
}
235+
236+
// Generation V
237+
else if (pokemonName.includes("basculin")) {
238+
return "basculin"
239+
} else if (pokemonName.includes("-ordinary")) {
240+
return pokemonName.replace("-ordinary", "")
241+
} else if (pokemonName.includes("-incarnate")) {
242+
return pokemonName.replace("-incarnate", "")
243+
} else if (pokemonName.includes("-standard")) {
244+
return pokemonName.replace("-standard", "")
245+
} else if (pokemonName.includes("meloetta")) {
246+
return "meloetta"
247+
}
248+
249+
// Generation VI
250+
else if (pokemonName.includes("aegislash")) {
251+
return "aegislash"
252+
} else if (pokemonName.includes("-male")) {
253+
return pokemonName.replace("-male", "")
254+
} else if (pokemonName.includes("-average")) {
255+
return pokemonName.replace("-average", "")
256+
}
257+
258+
// Generation VII
259+
else if (pokemonName.includes("wishiwashi")) {
260+
return "wishiwashi"
261+
} else if (pokemonName.includes("lycanroc")) {
262+
return "lycanroc"
263+
} else if (pokemonName.includes("oricorio")) {
264+
return "oricorio"
265+
} else if (pokemonName.includes("mimikyu")) {
266+
return "mimikyu"
267+
} else if (pokemonName.includes("minior")) {
268+
return "minior"
269+
}
270+
271+
// Alola, mega evolutions and other pokémon varieties
272+
else if (pokemonName.includes("pikachu")) {
273+
return "pikachu"
274+
} else if (pokemonName.includes("-totem-alola")) {
275+
return pokemonName.replace("-totem-alola", "")
276+
} else if (pokemonName.includes("-alola")) {
277+
return pokemonName.replace("-alola", "")
278+
} else if (pokemonName.includes("-totem")) {
279+
return pokemonName.replace("-totem", "")
280+
} else if (pokemonName.includes("-mega")) {
281+
if (pokemonName.includes("-mega-y")) {
282+
return pokemonName.replace("-mega-y", "")
283+
} else if (pokemonName.includes("-mega-x")) {
284+
return pokemonName.replace("-mega-x", "")
285+
}
286+
return pokemonName.replace("-mega", "")
287+
} else if (pokemonName.includes("zygarde")) {
288+
return "zygarde"
289+
} else if (pokemonName.includes("-primal")) {
290+
return pokemonName.replace("-primal", "")
291+
} else if (pokemonName.includes("-average")) {
292+
return pokemonName.replace("-average", "")
293+
} else if (pokemonName.includes("-small")) {
294+
return pokemonName.replace("-small", "")
295+
} else if (pokemonName.includes("-large")) {
296+
return pokemonName.replace("-large", "")
297+
} else if (pokemonName.includes("-super")) {
298+
return pokemonName.replace("-super", "")
299+
} else if (pokemonName.includes("-female")) {
300+
return pokemonName.replace("-female", "")
301+
} else if (pokemonName.includes("-original")) {
302+
return pokemonName.replace("-original", "")
303+
} else if (pokemonName.includes("-therian")) {
304+
return pokemonName.replace("-therian", "")
305+
} else if (pokemonName.includes("-ethernal")) {
306+
return pokemonName.replace("-ethernal", "")
307+
} else if (pokemonName.includes("-white")) {
308+
return pokemonName.replace("-white", "")
309+
} else if (pokemonName.includes("-black")) {
310+
return pokemonName.replace("-black", "")
311+
} else if (pokemonName.includes("-resolute")) {
312+
return pokemonName.replace("-resolute", "")
313+
} else if (pokemonName.includes("-zen")) {
314+
return pokemonName.replace("-zen", "")
315+
} else if (pokemonName.includes("-eternal")) {
316+
return pokemonName.replace("-eternal", "")
317+
} else if (pokemonName.includes("greninja")) {
318+
return "greninja"
319+
} else if (pokemonName.includes("hoopa")) {
320+
return "hoopa"
321+
} else if (pokemonName.includes("rotom")) {
322+
return "rotom"
323+
} else if (pokemonName.includes("castform")) {
324+
return "castform"
325+
}
326+
327+
return pokemonName
328+
}
329+
213330
function getEvolutionChainNames(evolutionChain) {
214331
try {
215332
const { species, evolves_to } = evolutionChain.chain

gatsby/scripts/seed.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ if (isProduction) {
3434
} else {
3535
// When using local environment we just want to copy certain files to
3636
// avoid memory problems.
37-
const LIMIT = argv.limit || 151
37+
const LIMIT = argv.limit || 1500
3838
if (!argv.limit) {
3939
spinner.warn(`No --limit arg provided, using default value: ${LIMIT}`)
4040
}

gatsby/src/components/layout.js

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,18 @@ const Layout = ({ children }) => (
2323
meta={[
2424
{
2525
name: "description",
26-
content: "Pokemon static site powered by Pokeapi and Gatsby",
26+
content: "Pokémon static site powered by Pokeapi and Gatsby",
2727
},
2828
{
2929
name: "keywords",
30-
content: "pokeapi, pokemon, pokedex, gatsby, static-site",
30+
content: [
31+
"pokeapi",
32+
"pokemon",
33+
"pokémon",
34+
"pokedex",
35+
"gatsby",
36+
"static-site",
37+
].join(","),
3138
},
3239
]}
3340
>

gatsby/src/components/pokemon-details.tsx

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export interface IPokemonDetailsProps {
1414
genderRate: number
1515
generation: INamedAPIResource
1616
growthRate: INamedAPIResource
17-
habitat: INamedAPIResource
17+
habitat?: INamedAPIResource
1818
hasGenderDifferences: boolean
1919
hatchCounter: number
2020
isBaby: boolean
@@ -43,6 +43,11 @@ export default function PokemonDetails({
4343
shape,
4444
stats = [],
4545
}: IPokemonDetailsProps) {
46+
console.log("eggGroups", eggGroups)
47+
console.log("stats", stats)
48+
console.log("generation", generation)
49+
console.log("growthRate", growthRate)
50+
console.log("habitat", habitat)
4651
return (
4752
<FlexContainer>
4853
<UnstyledList>
@@ -91,9 +96,11 @@ export default function PokemonDetails({
9196
<li>
9297
Growth Rate: <strong>{startCase(growthRate.name)}</strong>
9398
</li>
94-
<li>
95-
Habitat: <strong>{startCase(habitat.name)}</strong>
96-
</li>
99+
{habitat ? (
100+
<li>
101+
Habitat: <strong>{startCase(habitat.name)}</strong>
102+
</li>
103+
) : null}
97104
<li>
98105
Has gender differences?{" "}
99106
<strong>{hasGenderDifferences ? "Yes" : "No"}</strong>

gatsby/src/components/pokemon-sprites.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,10 @@ const FlexContainer = styled("div")({
1414
justifyContent: "space-around",
1515
})
1616

17-
export default function PokemonSprites({ sprites }: IPokemonSpritesProps) {
17+
export default function PokemonSprites({
18+
name,
19+
sprites,
20+
}: IPokemonSpritesProps) {
1821
const {
1922
back_default,
2023
back_female,

gatsby/src/components/pokemon-types/index.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ export const PokemonTypeListItem = styled("li")`
2424
display: inline-block;
2525
margin: 0.5rem;
2626
padding: 0.2rem 0.5rem;
27-
fontweight: 400;
2827
border-radius: 5px;
2928
background: ${({ type }: IPokemonTypePillProps) =>
3029
getPokemonTypeBackgroundColor(type)};

gatsby/src/components/search-bar/index.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export interface ISearchBarProps {
99
const classNames = {
1010
root: css({
1111
width: "100%",
12-
position: "relative"
12+
position: "relative",
1313
}),
1414
input: css({
1515
width: "100%",
@@ -58,7 +58,8 @@ export default function SearchBar({
5858
type="text"
5959
name={"pokemon-search"}
6060
value={searchTerm}
61-
placeholder={"Search pokemons..."}
61+
placeholder={"Search pokémon"}
62+
aria-label="Search pokémon"
6263
className={classNames.input}
6364
onChange={onChange}
6465
/>
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import styled from "react-emotion"
22

33
const Divider = styled("div")`
4-
margin: 2rem 0;
54
height: 1px;
6-
border-bottom: 1px solid lightgray;
5+
margin: 2rem 0;
6+
background: rgb(234, 234, 234);
77
`
88
export default Divider

0 commit comments

Comments
 (0)