stevenhansel/react-pokedex

A pokedex made with CRA & Typescript and also PokeAPI

react-pokedex's Issues

pages/pokemons-generation

Add a modal to filter pokemons based it's generations (Gen 1 - Gen 8)

bug/evolution-tree

Someone noticed that the evolution tree of the pokemon doesn't have any branches. We need to make a tree data structure to ensure the evolution lines are displayed correctly.

pages/pokemons

Pokemons page for react-pokedex, able to search & paginate for pokemons based on filters (pokemon type & generation)

test/pokemon-details-page

Refactor Typescript React.FC

Instead of using React.FC as the returning type of a React Component, Hook, or whatever, just use:

type Props = {
children: React.ReactNode;
};

const Component = ({ children }: Props) => {
  return children;
};

bug/infinite-scroll-rendering

If the pokemons are still fetching, isLoading, and then you scroll down and stay there until the loading is done, you have to scroll up first and then scroll down again to activate the waypoint onEnter, this is related to the <InfiniteScroll.Waypoint /> component.

feature/scroll-down

It's a pain when there's a ton of pokemon and then you scroll up and then you have to scroll down manually, maybe like set fixed button that allows you to scroll to the bottom of page immediately?

bugfix/cancel-async-request

Right now, you can't search when it's fetching, actually you can, but the old dispatched action can't be cancelled so there will be 2 async request dispatched, and if you keep searching there will be n async request dispatched.
This is really bad, we need a find a way to be able to cancel those async requests.
right now the implementation is at getPokemons in pokemonSlice

test/pokemons-page

bugfix/fix-tailwind-concats

There are some specific places where the style is determined by a state of a component, instead of concatenating them, use clsx to help managing string concatenation.

https://www.npmjs.com/package/clsx

Scrolling not working. New Pokemons do not load on Chrome

Browser size 2560x1896

pages/pokemon-details

Pokemon Details Page for react-pokedex. Able to see the complete detail of a Pokemon.