diff --git a/README.md b/README.md index c8c0435..99c93bc 100644 --- a/README.md +++ b/README.md @@ -8,9 +8,10 @@ Nome dos integrantes: Link do Surge: www.link.com.br O que funciona: -- As rotas funcionam -- Item 2 - +- Funciona os routers das páginas, sendo possível navegar entre elas. +- É possível ver os detalhes de um pokemon +- A lista dos 20 primeiros pokemons estão sendo renderizadas na página home +- A lista dos pokemons na pokedex estão sendo renderizadas na página pokedex +- O conteudo se adapta a qualqer tamanho de tela O que não funciona: -- O botao adicionar não funciona -- O botao remover não funciona + diff --git a/pokedex/.eslintcache b/pokedex/.eslintcache index aac71ba..f95b9b2 100644 --- a/pokedex/.eslintcache +++ b/pokedex/.eslintcache @@ -1 +1 @@ -[{"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/reportWebVitals.js":"1","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/Global/GlobalStateContext.js":"2","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/screens/HomePage/index.js":"3","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/assets/img/PokeLogo.js":"4","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/components/DetailsCard/index.js":"5","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/Global/GlobalState.js.js":"6","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/router/Router.js":"7","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/constants/urls/index.js":"8","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/router/Coordinator.js":"9","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/components/PokeCard/PokeCard.js":"10","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/screens/PokeDexPage/index.js":"11","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/styles/styles.js":"12","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/App.js":"13","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/screens/DetailsPage/index.js":"14"},{"size":362,"mtime":1606440818921,"results":"15","hashOfConfig":"16"},{"size":113,"mtime":1606477072422,"results":"17","hashOfConfig":"16"},{"size":2019,"mtime":1606480293434,"results":"18","hashOfConfig":"16"},{"size":128,"mtime":1606477072422,"results":"19","hashOfConfig":"16"},{"size":2445,"mtime":1606484787498,"results":"20","hashOfConfig":"16"},{"size":854,"mtime":1606477072422,"results":"21","hashOfConfig":"16"},{"size":684,"mtime":1606481348685,"results":"22","hashOfConfig":"16"},{"size":59,"mtime":1606477072426,"results":"23","hashOfConfig":"16"},{"size":310,"mtime":1606481364273,"results":"24","hashOfConfig":"16"},{"size":1269,"mtime":1606480788508,"results":"25","hashOfConfig":"16"},{"size":819,"mtime":1606477072426,"results":"26","hashOfConfig":"16"},{"size":3429,"mtime":1606477072426,"results":"27","hashOfConfig":"16"},{"size":277,"mtime":1606477072422,"results":"28","hashOfConfig":"16"},{"size":1407,"mtime":1606481552824,"results":"29","hashOfConfig":"16"},{"filePath":"30","messages":"31","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},"6ny1o2",{"filePath":"33","messages":"34","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"35","messages":"36","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"37","messages":"38","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"39"},{"filePath":"40","messages":"41","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"42","messages":"43","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"44"},{"filePath":"45","messages":"46","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},{"filePath":"48","messages":"49","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},{"filePath":"50","messages":"51","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"44"},{"filePath":"52","messages":"53","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"54","usedDeprecatedRules":"47"},{"filePath":"55","messages":"56","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"57","usedDeprecatedRules":"44"},{"filePath":"58","messages":"59","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"60","messages":"61","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"47"},{"filePath":"62","messages":"63","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/reportWebVitals.js",[],["64","65"],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/Global/GlobalStateContext.js",[],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/screens/HomePage/index.js",["66","67"],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/assets/img/PokeLogo.js",[],["68","69"],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/components/DetailsCard/index.js",["70"],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/Global/GlobalState.js.js",[],["71","72"],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/router/Router.js",[],["73","74"],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/constants/urls/index.js",[],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/router/Coordinator.js",[],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/components/PokeCard/PokeCard.js",["75"],"import React, { useEffect, useState } from 'react'\nimport { DetailsBtnContainer,PokeCardContainer} from '../../styles/styles'\nimport {Button} from '@material-ui/core'\nimport { useHistory } from \"react-router-dom\";\nimport {goToDetailsPage} from '../../router/Coordinator'\nimport axios from 'axios'\n\nexport default function PokeCard (props) {\n const history = useHistory();\n\n const [photo, setPhoto] = useState ([])\n\n const pokemonPhoto = () => {\n axios.get(props.pokemon.url).then((response) => {\n setPhoto(response.data.sprites.front_default)\n }).catch((error) => {\n console.log(error.message)\n })\n }\n\n useEffect(() => {\n pokemonPhoto()\n }, [])\n\n return(\n
\n \n {props.pokemon.name}/\n

{props.pokemon.name}

\n \n \n \n\n \n \n \n \n \n )\n} \n","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/screens/PokeDexPage/index.js",["76"],"import React from 'react'\nimport {Header} from '../../styles/styles'\nimport { useHistory } from \"react-router-dom\";\nimport {Button} from '@material-ui/core'\nimport {ButtonContainer, HomeFlexBox} from '../../styles/styles'\nimport {goToHomePage } from '../../router/Coordinator'\nimport {PokeLogo} from '../../assets/img/PokeLogo'\n\nconst PokeDexPage = () => {\n const history = useHistory();\n\n return(\n
\n
\n \n \n \n\n

PokeDex

\n \n
\n \n \n
\n )\n}\nexport default PokeDexPage;","/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/styles/styles.js",[],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/App.js",[],"/home/alvarojr/Labenu/dumont-pokedex7/pokedex/src/screens/DetailsPage/index.js",[],{"ruleId":"77","replacedBy":"78"},{"ruleId":"79","replacedBy":"80"},{"ruleId":"81","severity":1,"message":"82","line":17,"column":8,"nodeType":"83","endLine":17,"endColumn":10,"suggestions":"84"},{"ruleId":"85","severity":1,"message":"86","line":42,"column":19,"nodeType":"87","endLine":42,"endColumn":41},{"ruleId":"77","replacedBy":"88"},{"ruleId":"79","replacedBy":"89"},{"ruleId":"81","severity":1,"message":"90","line":19,"column":6,"nodeType":"83","endLine":19,"endColumn":8,"suggestions":"91"},{"ruleId":"77","replacedBy":"92"},{"ruleId":"79","replacedBy":"93"},{"ruleId":"77","replacedBy":"94"},{"ruleId":"79","replacedBy":"95"},{"ruleId":"81","severity":1,"message":"96","line":23,"column":6,"nodeType":"83","endLine":23,"endColumn":8,"suggestions":"97"},{"ruleId":"85","severity":1,"message":"86","line":23,"column":11,"nodeType":"87","endLine":23,"endColumn":33},"no-native-reassign",["98"],"no-negated-in-lhs",["99"],"react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'requests'. Either include it or remove the dependency array.","ArrayExpression",["100"],"jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","JSXOpeningElement",["98"],["99"],"React Hook useEffect has a missing dependency: 'getPokeDetails'. Either include it or remove the dependency array.",["101"],["98"],["99"],["98"],["99"],"React Hook useEffect has a missing dependency: 'pokemonPhoto'. Either include it or remove the dependency array.",["102"],"no-global-assign","no-unsafe-negation",{"desc":"103","fix":"104"},{"desc":"105","fix":"106"},{"desc":"107","fix":"108"},"Update the dependencies array to be: [requests]",{"range":"109","text":"110"},"Update the dependencies array to be: [getPokeDetails]",{"range":"111","text":"112"},"Update the dependencies array to be: [pokemonPhoto]",{"range":"113","text":"114"},[632,634],"[requests]",[592,594],"[getPokeDetails]",[671,673],"[pokemonPhoto]"] \ No newline at end of file +[{"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/reportWebVitals.js":"1","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/global/GlobalStateContext.js":"2","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/constants/urls/index.js":"3","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/screens/PokeDexPage/index.js":"4","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/router/Coordinator.js":"5","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/assets/img/PokeLogo.js":"6","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/components/PokeCard/PokeCard.js":"7","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/screens/DetailsPage/index.js":"8","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/styles/styles.js":"9","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/components/DetailsCard/index.js":"10","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/index.js":"11","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/screens/HomePage/index.js":"12"},{"size":362,"mtime":1606451386157,"results":"13","hashOfConfig":"14"},{"size":113,"mtime":1606697181858,"results":"15","hashOfConfig":"14"},{"size":115,"mtime":1606704166531,"results":"16","hashOfConfig":"14"},{"size":1385,"mtime":1606703644491,"results":"17","hashOfConfig":"14"},{"size":310,"mtime":1606485742505,"results":"18","hashOfConfig":"14"},{"size":128,"mtime":1606485742477,"results":"19","hashOfConfig":"14"},{"size":2842,"mtime":1606697507033,"results":"20","hashOfConfig":"14"},{"size":1169,"mtime":1606697933837,"results":"21","hashOfConfig":"14"},{"size":4129,"mtime":1606704674429,"results":"22","hashOfConfig":"14"},{"size":3147,"mtime":1606704161639,"results":"23","hashOfConfig":"14"},{"size":500,"mtime":1606451386157,"results":"24","hashOfConfig":"14"},{"size":1667,"mtime":1606703610124,"results":"25","hashOfConfig":"14"},{"filePath":"26","messages":"27","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"xq4l04",{"filePath":"28","messages":"29","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"30","messages":"31","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"32","messages":"33","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"34","messages":"35","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"38"},{"filePath":"39","messages":"40","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"41","messages":"42","errorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":"43"},{"filePath":"44","messages":"45","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"46","messages":"47","errorCount":0,"warningCount":6,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"48","messages":"49","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"50","messages":"51","errorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/reportWebVitals.js",[],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/global/GlobalStateContext.js",[],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/constants/urls/index.js",[],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/screens/PokeDexPage/index.js",["52","53","54"],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/router/Coordinator.js",[],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/assets/img/PokeLogo.js",[],["55","56"],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/components/PokeCard/PokeCard.js",["57","58"],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/screens/DetailsPage/index.js",["59","60","61","62"],"import React from 'react'\nimport {Header, BtnContainer,ButtonContainer, DetailsBtnContainer} from '../../styles/styles'\nimport DetailsCard from '../../components/DetailsCard/index'\nimport { useHistory, useParams } from \"react-router-dom\";\nimport {goBack} from '../../router/Coordinator'\nimport {Button} from '@material-ui/core'\nimport {PokeLogo} from '../../assets/img/PokeLogo'\n\nconst DetailsPage = () => {\n const history = useHistory();\n const pathParams = useParams();\n\n return(\n \n < Header role=\"header\">\n {/** Botao para voltar pra homepage*/}\n \n \n \n

Detalhes do pokemon

\n\n \n \n \n \n \n \n \n )\n}\nexport default DetailsPage;","/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/styles/styles.js",[],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/components/DetailsCard/index.js",["63","64","65","66","67","68"],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/index.js",[],"/home/diego/Documents/Labenu/Week-Projects/Diego-Rosa/semana11/dumont-pokedex7/pokedex/src/screens/HomePage/index.js",["69","70","71","72"],{"ruleId":"73","severity":1,"message":"74","line":27,"column":19,"nodeType":"75","endLine":27,"endColumn":28},{"ruleId":"76","severity":1,"message":"77","line":28,"column":15,"nodeType":"78","endLine":28,"endColumn":48},{"ruleId":"79","severity":1,"message":"80","line":28,"column":15,"nodeType":"78","endLine":28,"endColumn":48},{"ruleId":"81","replacedBy":"82"},{"ruleId":"83","replacedBy":"84"},{"ruleId":"85","severity":1,"message":"86","line":13,"column":29,"nodeType":"87","messageId":"88","endLine":13,"endColumn":37},{"ruleId":"89","severity":1,"message":"90","line":25,"column":8,"nodeType":"91","endLine":25,"endColumn":10,"suggestions":"92"},{"ruleId":"85","severity":1,"message":"93","line":2,"column":17,"nodeType":"87","messageId":"88","endLine":2,"endColumn":29},{"ruleId":"85","severity":1,"message":"94","line":2,"column":47,"nodeType":"87","messageId":"88","endLine":2,"endColumn":66},{"ruleId":"76","severity":1,"message":"77","line":26,"column":15,"nodeType":"78","endLine":26,"endColumn":48},{"ruleId":"79","severity":1,"message":"80","line":26,"column":15,"nodeType":"78","endLine":26,"endColumn":48},{"ruleId":"89","severity":1,"message":"95","line":21,"column":6,"nodeType":"91","endLine":21,"endColumn":8,"suggestions":"96"},{"ruleId":"89","severity":1,"message":"97","line":35,"column":6,"nodeType":"91","endLine":35,"endColumn":12,"suggestions":"98"},{"ruleId":"73","severity":1,"message":"74","line":58,"column":31,"nodeType":"75","endLine":58,"endColumn":40},{"ruleId":"73","severity":1,"message":"74","line":66,"column":29,"nodeType":"75","endLine":66,"endColumn":38},{"ruleId":"73","severity":1,"message":"74","line":74,"column":31,"nodeType":"75","endLine":74,"endColumn":40},{"ruleId":"73","severity":1,"message":"74","line":77,"column":43,"nodeType":"75","endLine":77,"endColumn":51},{"ruleId":"85","severity":1,"message":"99","line":1,"column":29,"nodeType":"87","messageId":"88","endLine":1,"endColumn":38},{"ruleId":"73","severity":1,"message":"74","line":24,"column":31,"nodeType":"75","endLine":24,"endColumn":40},{"ruleId":"76","severity":1,"message":"77","line":25,"column":27,"nodeType":"78","endLine":25,"endColumn":60},{"ruleId":"79","severity":1,"message":"80","line":25,"column":27,"nodeType":"78","endLine":25,"endColumn":60},"jsx-a11y/aria-role","Elements with ARIA roles must use a valid, non-abstract ARIA role.","JSXAttribute","jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","JSXOpeningElement","jsx-a11y/no-redundant-roles","The element img has an implicit role of img. Defining this explicitly is redundant and should be avoided.","no-native-reassign",["100"],"no-negated-in-lhs",["101"],"no-unused-vars","'requests' is assigned a value but never used.","Identifier","unusedVar","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'pokemonPhoto'. Either include it or remove the dependency array.","ArrayExpression",["102"],"'BtnContainer' is defined but never used.","'DetailsBtnContainer' is defined but never used.","React Hook useEffect has a missing dependency: 'getPokeDetails'. Either include it or remove the dependency array.",["103"],"React Hook useEffect has a missing dependency: 'renderMoves'. Either include it or remove the dependency array.",["104"],"'useEffect' is defined but never used.","no-global-assign","no-unsafe-negation",{"desc":"105","fix":"106"},{"desc":"107","fix":"108"},{"desc":"109","fix":"110"},"Update the dependencies array to be: [pokemonPhoto]",{"range":"111","text":"112"},"Update the dependencies array to be: [getPokeDetails]",{"range":"113","text":"114"},"Update the dependencies array to be: [data, renderMoves]",{"range":"115","text":"116"},[832,834],"[pokemonPhoto]",[638,640],"[getPokeDetails]",[913,919],"[data, renderMoves]"] \ No newline at end of file diff --git a/pokedex/package-lock.json b/pokedex/package-lock.json index b6dc1e9..f0b0438 100644 --- a/pokedex/package-lock.json +++ b/pokedex/package-lock.json @@ -5234,9 +5234,9 @@ "integrity": "sha512-7vmuyh5+kuUyJKePhQfRQBhXV5Ce+RnaeeQArKu1EAMpL3WbgMt5WG6uQZpEVvYSSsxMXRKOewtDk9RaTKXRlA==" }, "electron-to-chromium": { - "version": "1.3.609", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.609.tgz", - "integrity": "sha512-kcmRWmlHsUKKLfsSKSf7VqeTX4takM5ndjVTM3et3qpDCceITYI1DixvIfSDIngALoaTnpoMXD3SXSMpzHkYKA==" + "version": "1.3.610", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.610.tgz", + "integrity": "sha512-eFDC+yVQpEhtlapk4CYDPfV9ajF9cEof5TBcO49L1ETO+aYogrKWDmYpZyxBScMNe8Bo/gJamH4amQ4yyvXg4g==" }, "elliptic": { "version": "6.5.3", @@ -13741,9 +13741,9 @@ } }, "spdx-license-ids": { - "version": "3.0.6", - "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.6.tgz", - "integrity": "sha512-+orQK83kyMva3WyPf59k1+Y525csj5JejicWut55zeTWANuN17qSiSLUXWtzHeNWORSvT7GLDJ/E/XiIWoXBTw==" + "version": "3.0.7", + "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.7.tgz", + "integrity": "sha512-U+MTEOO0AiDzxwFvoa4JVnMV6mZlJKk2sBLt90s7G0Gd0Mlknc7kxEn3nuDPNZRta7O2uy8oLcZLVT+4sqNZHQ==" }, "spdy": { "version": "4.0.2", @@ -14490,9 +14490,9 @@ "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" }, "terser": { - "version": "5.5.0", - "resolved": "https://registry.npmjs.org/terser/-/terser-5.5.0.tgz", - "integrity": "sha512-eopt1Gf7/AQyPhpygdKePTzaet31TvQxXvrf7xYUvD/d8qkCJm4SKPDzu+GHK5ZaYTn8rvttfqaZc3swK21e5g==", + "version": "5.5.1", + "resolved": "https://registry.npmjs.org/terser/-/terser-5.5.1.tgz", + "integrity": "sha512-6VGWZNVP2KTUcltUQJ25TtNjx/XgdDsBDKGt8nN0MpydU36LmbPPcMBd2kmtZNNGVVDLg44k7GKeHHj+4zPIBQ==", "requires": { "commander": "^2.20.0", "source-map": "~0.7.2", diff --git a/pokedex/public/index.html b/pokedex/public/index.html index aa069f2..6f358ce 100644 --- a/pokedex/public/index.html +++ b/pokedex/public/index.html @@ -2,13 +2,18 @@ - + + + + + + - React App + PokeDex diff --git a/pokedex/public/logo-pokebola.jpg b/pokedex/public/logo-pokebola.jpg new file mode 100644 index 0000000..312e26c Binary files /dev/null and b/pokedex/public/logo-pokebola.jpg differ diff --git a/pokedex/src/App.js b/pokedex/src/App.js index 6f0464d..3da9dfc 100644 --- a/pokedex/src/App.js +++ b/pokedex/src/App.js @@ -1,14 +1,14 @@ import React from 'react' import Router from './router/Router' -import GlobalState from './Global/GlobalState.js' +import GlobalState from './global/GlobalState.js.js' const App = () => { return ( -
+ - -
+ + ); } diff --git a/pokedex/src/Global/GlobalState.js.js b/pokedex/src/Global/GlobalState.js.js deleted file mode 100644 index e788ed8..0000000 --- a/pokedex/src/Global/GlobalState.js.js +++ /dev/null @@ -1,31 +0,0 @@ - -import React, { useState } from 'react' -import axios from 'axios' -import GlobalStateContext from './GlobalStateContext' -import {baseURL} from '../constants/urls/index' - -const GlobalState = (props) => { - const [pokemonList, setPokemonList] = useState([]) - const [pokedex, setPokedex] = useState([]) - //pega a lista de pokemons da pokeAPI - const getPokemonList = () =>{ - - axios.get(baseURL).then(response => { - setPokemonList(response.data.results) - }) - .catch(error =>{console.log(error)}) -} -const states = {pokemonList, pokedex} -const setters = {setPokemonList, setPokedex} -const requests = {getPokemonList} - -//dados pra passar para os componentes -const data = {states, setters, requests} - -return ( - - {props.children} - - ) -} -export default GlobalState; \ No newline at end of file diff --git a/pokedex/src/components/DetailsCard/index.js b/pokedex/src/components/DetailsCard/index.js index c905bc1..b04f3f7 100644 --- a/pokedex/src/components/DetailsCard/index.js +++ b/pokedex/src/components/DetailsCard/index.js @@ -5,8 +5,10 @@ import { baseURL } from '../../constants/urls' const DetailsCard = (props) => { const [data, setData] = useState({}) + const [moves, setMoves] = useState([]) const getPokeDetails = () => { + axios.get(`${baseURL}/${props.pokemon.pokemon}`).then((res)=>{ setData(res.data) }).catch((err)=>{ @@ -18,54 +20,71 @@ const DetailsCard = (props) => { getPokeDetails() }, []) - return( -
- + const renderMoves = () => { + const newMoves = [] + if (data.moves) { + for (let i=0; (i < 7 && i < data.moves.length); i++){ + newMoves.push(data.moves[i].move.name) + } + setMoves(newMoves) + } + } + + useEffect(() => { + renderMoves() + }, [data]) + - - - {/*Front img pokemon */} - {data.sprites && } - - - {/*Back img pokemon */} - {data.sprites && } - - - - -

Stats

-
- {data.stats && data.stats.map((stat) => { - return

{stat.stat.name}: {stat.base_stat}

- })} -
- - - - -

Type:

- {data.types && data.types.map((type) => { - return

{type.type.name}

- })} - - -

Moves

- {data.moves &&
-

{data.moves[0].move.name}

-

{data.moves[1].move.name}

-

{data.moves[2].move.name}

-

{data.moves[3].move.name}

-

{data.moves[4].move.name}

-

{data.moves[5].move.name}

-

{data.moves[6].move.name}

-

{data.moves[7].move.name}

-
} - - - -
+ + return( + + + + + {/*Get front img pokemon */} + {data.sprites && } + + + {/*Get back img pokemon */} + {data.sprites && } + + + + +

Type:

+ {data.types && data.types.map((type) => { + return

+ {type.type.name} +

+ })} + + +

Moves

+ {moves && moves.map((moves) => { + return

{moves}

+ })} + + + + +

Stats

+ + {data.stats && data.stats.map((stat) => { + return

+ {stat.stat.name}: + {stat.base_stat} +

+ })} + + + + + ) } - export default DetailsCard; \ No newline at end of file diff --git a/pokedex/src/components/PokeCard/PokeCard.js b/pokedex/src/components/PokeCard/PokeCard.js index 819a3ec..4d962c8 100644 --- a/pokedex/src/components/PokeCard/PokeCard.js +++ b/pokedex/src/components/PokeCard/PokeCard.js @@ -1,47 +1,79 @@ -import React, { useEffect, useState } from 'react' +import React, { useContext, useEffect, useState } from 'react' import { DetailsBtnContainer,PokeCardContainer} from '../../styles/styles' import {Button} from '@material-ui/core' import { useHistory } from "react-router-dom"; import {goToDetailsPage} from '../../router/Coordinator' import axios from 'axios' +import GlobalStateContext from '../../global/GlobalStateContext'; -export default function PokeCard (props) { - const history = useHistory(); - - const [photo, setPhoto] = useState ([]) - - const pokemonPhoto = () => { - axios.get(props.pokemon.url).then((response) => { - setPhoto(response.data.sprites.front_default) - }).catch((error) => { - console.log(error.message) - }) - } - - useEffect(() => { - pokemonPhoto() - }, []) - - return( -
- - {props.pokemon.name}/ -

{props.pokemon.name}

- - - - - - - - - - ) + const PokeCard = (props) => { + const history = useHistory(); + + const [photo, setPhoto] = useState ([]) + const {states, setters, requests} = useContext(GlobalStateContext) + + const pokemonPhoto = () => { + axios.get(props.pokemon.url).then((response) => { + setPhoto(response.data.sprites.front_default) + }).catch((error) => { + console.log(error.message) + }) + } + + useEffect(() => { + pokemonPhoto() + }, []) + + const addToPokedex = () => { + const pokeIndex = states.pokemonList.findIndex((item) => item.name === props.pokemon.name) + const newPokemonList = [...states.pokemonList] + newPokemonList.splice(pokeIndex, 1) + + const newPokedexList = [...states.pokedex, props.pokemon] + const orderedList = newPokedexList.sort((a, b) => { + return Number(a.url.slice(34,a.url.length-1)) - Number(b.url.slice(34,b.url.length-1)) + }) + + setters.setPokedex(orderedList) + setters.setPokemonList(newPokemonList) + } + + const removeFromPokedex = () => { + const pokeIndex = states.pokedex.findIndex((item) => item.name === props.pokemon.name) + const newPokedexList = [...states.pokedex] + newPokedexList.splice(pokeIndex, 1) + + const newPokemonList = [...states.pokemonList, props.pokemon] + const orderedList = newPokemonList.sort((a, b) => { + return Number(a.url.slice(34,a.url.length-1)) - Number(b.url.slice(34,b.url.length-1)) + }) + + setters.setPokedex(newPokedexList) + setters.setPokemonList(orderedList) + } + + return( + + + {props.pokemon.name}/ +

{props.pokemon.name}

+ + + + + + + + + + ) } +export default PokeCard; \ No newline at end of file diff --git a/pokedex/src/constants/urls/index.js b/pokedex/src/constants/urls/index.js index 90e90df..b0a621b 100644 --- a/pokedex/src/constants/urls/index.js +++ b/pokedex/src/constants/urls/index.js @@ -1 +1,2 @@ +//URL base da poke api que contem os dados dos pokemons export const baseURL = "https://pokeapi.co/api/v2/pokemon" \ No newline at end of file diff --git a/pokedex/src/global/GlobalState.js.js b/pokedex/src/global/GlobalState.js.js new file mode 100644 index 0000000..f8543bd --- /dev/null +++ b/pokedex/src/global/GlobalState.js.js @@ -0,0 +1,39 @@ +import React, { useEffect, useState } from 'react' +import axios from 'axios' +import GlobalStateContext from '../global/GlobalStateContext' +import {baseURL} from '../constants/urls/index' + +const GlobalState = (props) => { + const [pokemonList, setPokemonList] = useState([]) + + const [pokedex, setPokedex] = useState([]) + + //pega a lista de pokemons da pokeAPI + const getPokemonList = () =>{ + + axios.get(baseURL).then(response => { + setPokemonList(response.data.results) + }) + .catch(error =>{console.log(error)}) + } + + useEffect(()=>{ + getPokemonList() + }, []) + + const states = {pokemonList, pokedex} + const setters = {setPokemonList, setPokedex} + const requests = {getPokemonList} + + //dados pra passar para os componentes + const data = {states, setters, requests} + {/**teste */} + return ( + + {props.children} + + ) +} + +export default GlobalState; \ No newline at end of file diff --git a/pokedex/src/Global/GlobalStateContext.js b/pokedex/src/global/GlobalStateContext.js similarity index 100% rename from pokedex/src/Global/GlobalStateContext.js rename to pokedex/src/global/GlobalStateContext.js diff --git a/pokedex/src/Hooks/index.js b/pokedex/src/hooks/index.js similarity index 78% rename from pokedex/src/Hooks/index.js rename to pokedex/src/hooks/index.js index d473905..cd225d0 100644 --- a/pokedex/src/Hooks/index.js +++ b/pokedex/src/hooks/index.js @@ -1,9 +1,12 @@ -import React, { useEffect, useState } from 'react' +import { useEffect, useState } from 'react' import axios from 'axios' -//teste + const GetHooks = () => { + const [dados,setDados] = useState([]) - const getDados = () =>{ + + const getDados = () =>{ + //Pega os dados dos pokemons na poke API axios.get('https://pokeapi.co/api/v2/pokemon').then(resposta => { setDados(resposta.data.results) console.log(resposta.data.results) @@ -16,7 +19,5 @@ const GetHooks = () => { }, []) return(dados.map) - } - export default GetHooks; \ No newline at end of file diff --git a/pokedex/src/screens/DetailsPage/index.js b/pokedex/src/screens/DetailsPage/index.js index 55c81a9..07ae7cc 100644 --- a/pokedex/src/screens/DetailsPage/index.js +++ b/pokedex/src/screens/DetailsPage/index.js @@ -4,38 +4,31 @@ import DetailsCard from '../../components/DetailsCard/index' import { useHistory, useParams } from "react-router-dom"; import {goBack} from '../../router/Coordinator' import {Button} from '@material-ui/core' +import {PokeLogo} from '../../assets/img/PokeLogo' const DetailsPage = () => { const history = useHistory(); const pathParams = useParams(); return( -
- < Header> + + < Header role="header"> {/** Botao para voltar pra homepage*/} - - -

Nome do Pokemon

+

Detalhes do pokemon

- {/*Botoes add e remover pokemon*/ } - - - - - - - - - + + -
- -
-
+ + + + ) } export default DetailsPage; \ No newline at end of file diff --git a/pokedex/src/screens/HomePage/index.js b/pokedex/src/screens/HomePage/index.js index 187bdf5..467f569 100644 --- a/pokedex/src/screens/HomePage/index.js +++ b/pokedex/src/screens/HomePage/index.js @@ -4,51 +4,38 @@ import { useHistory } from "react-router-dom"; import {goToPokeDexPage} from '../../router/Coordinator' import {Button} from '@material-ui/core' import PokeCard from '../../components/PokeCard/PokeCard'; -import GlobalStateContext from '../../Global/GlobalStateContext'; +import GlobalStateContext from '../../global/GlobalStateContext'; import {PokeLogo} from '../../assets/img/PokeLogo' const HomePage = () => { const history = useHistory(); -const {states, setters, requests} = useContext(GlobalStateContext) - - useEffect(()=>{ - requests.getPokemonList() - }, []) - const addToPokedex = (newPokemon) => { - const pokemonInPokedex = states.pokedex.find((pokemon) => newPokemon.name === pokemon.name) - if (!pokemonInPokedex) { - const pokemonToAdd = states.pokemonList.find((pokemon) => newPokemon.name === pokemon.name) - const newPokedex = [...states.pokedex, pokemonToAdd] - setters.setPokedex(newPokedex) - } - } - // const renderedPokemons = () => { - // pokemonList.map((pokemon) => { - // return () - // }) - // } + const {states} = useContext(GlobalStateContext) + return( -
-
- - - -

Lista de Pokemons

- -
- - - {states.pokemonList && - states.pokemonList.map((pokemon) => { - return ( addToPokedex(pokemon)}/>) - }) - } - - -
+ +
+ + + +

Lista de Pokemons

+ +
+ + {states.pokemonList && + states.pokemonList.map((pokemon) => { + return ( + ) + }) + } + + ) } export default HomePage; diff --git a/pokedex/src/screens/PokeDexPage/index.js b/pokedex/src/screens/PokeDexPage/index.js index a1e1498..db30f86 100644 --- a/pokedex/src/screens/PokeDexPage/index.js +++ b/pokedex/src/screens/PokeDexPage/index.js @@ -1,30 +1,44 @@ -import React from 'react' +import React, { useContext } from 'react' import {Header} from '../../styles/styles' import { useHistory } from "react-router-dom"; import {Button} from '@material-ui/core' import {ButtonContainer, HomeFlexBox} from '../../styles/styles' import {goToHomePage } from '../../router/Coordinator' import {PokeLogo} from '../../assets/img/PokeLogo' +import GlobalStateContext from '../../global/GlobalStateContext'; +import PokeCard from '../../components/PokeCard/PokeCard'; const PokeDexPage = () => { + const history = useHistory(); + const {states} = useContext(GlobalStateContext) + return( -
-
- - - + +
+ + + -

PokeDex

- -
- - -
+

PokeDex

+ + + + {states.pokedex && + states.pokedex.map((pokemon) => { + return ( + ) + }) + } + + ) } export default PokeDexPage; \ No newline at end of file diff --git a/pokedex/src/styles/styles.js b/pokedex/src/styles/styles.js index 25ffd47..944e8f5 100644 --- a/pokedex/src/styles/styles.js +++ b/pokedex/src/styles/styles.js @@ -6,7 +6,7 @@ import styled from 'styled-components' export const Header = styled.header ` background-color:#ff6666; color:#fff; - height: 50px; + height: 80px; padding:20px 20px; display:flex; justify-content:space-between; @@ -22,13 +22,38 @@ export const Header = styled.header ` h1{ color: #ffff33; } + + @media only screen and (max-width: 600px) { + header{ + height:40px; + width:100vw; + + } + + img{ + height:30px; + width:100px + } + + h1{ + font-size:15px; + } + + button{ + height:50px; + width:30px; + font-size:10px; + } + + } + ` //FLEXBOX PARA HOME E DETALHES--- export const HomeFlexBox = styled.main ` height:100vh; display:flex; justify-content:center; - justify-content:space-evenly; + justify-content:space-around; flex-wrap: wrap; padding-top:50px; ` @@ -37,6 +62,7 @@ export const HomeFlexBox = styled.main ` export const PokeCardContainer = styled.div ` background-color: #f2f2f2; display:flex; + border-radius:20px; flex-direction:column; justify-content:space-evenly; justify-content:center; @@ -58,6 +84,8 @@ export const DetailsFlexBox = styled.main ` justify-content:center; flex-wrap: wrap; padding-top: 8%; + + ` //ESTILOS PARA O DETAILS CARD export const ImgFlexBox = styled.div ` @@ -70,6 +98,7 @@ export const ImgFlexBox = styled.div ` ` export const PokeImgContainer = styled.div ` background-color:#f2f2f2f2; + border-radius:20px; height:250px; width:250px; margin: 20px; @@ -79,43 +108,44 @@ export const PokeImgContainer = styled.div ` text-align:center; align-items:center; ` - -export const StatsFlexBox = styled.div ` - display:flex; - justify-content:column; - text-align:Center; -` -export const PokeStatsContainer = styled.div ` - background-color:#f2f2f2f2; - height:543px; - width:300px; - margin: 20px; - box-shadow: 3px 3px 3px 3px #d9d9d9; - display:flex; - flex-direction:column; - justify-content:center; - text-align:center; - align-items:center; -` export const TypeMovesFlexBox = styled.div ` display:flex; flex-direction:column; ` export const PokeTypeContainer = styled.div ` background-color:#f2f2f2f2; + border-radius:20px; height:60px; - width:400px; + width:350px; margin: 20px; box-shadow: 3px 3px 3px 3px #d9d9d9; display:flex; flex-direction:row; justify-content: space-evenly; ` - -export const PokeMovesContainer = styled.div` + export const PokeMovesContainer = styled.div` + background-color:#f2f2f2f2; + border-radius:20px; + height:439px; + width:350px; + margin: 20px; + box-shadow: 3px 3px 3px 3px #d9d9d9; + display:flex; + flex-direction:column; + justify-content:center; + text-align:center; + align-items:center; + ` +export const StatsFlexBox = styled.div ` + display:flex; + justify-content:column; + text-align:Center; +` +export const PokeStatsContainer = styled.div ` background-color:#f2f2f2f2; - height:439px; - width:400px; + border-radius:20px; + height:543px; + width:350px; margin: 20px; box-shadow: 3px 3px 3px 3px #d9d9d9; display:flex; @@ -125,6 +155,8 @@ export const PokeMovesContainer = styled.div` align-items:center; ` + + //BOTOES ------------------------------------- export const BtnContainer = styled.div` display: flex; @@ -150,4 +182,6 @@ export const DetailsBtnContainer = styled.div ` list-style:none; } - ` \ No newline at end of file + ` + + \ No newline at end of file