Question: So, i know the difference between the two but after hooks i'm kinda confused about when i should use stateless and when use statefull.

When i was learning the basics of React i was told that stateless is the "dumb" function and statefull is "smart". And that i should use stateless in simple things, because props are imutable and also use more than statefull. I dont really know the difference with Hooks changes in 16.8.

I know that we can use setState now but i dont understand it totally.

Answer: 
This is a great question, and one that I think people will have trouble with for a while. The way I see it, the **term** "stateless" has been dropped from regular component verbiage and they are just called "functional components". 

The **concept** of "stateless" is still very important though, because it involves no inner state that does not mimic its props. As you said, they are *dumb*. Generally, if a component can be stateless, it will be more performant. Components that are rendered in loops with a high count do much better with this type of structure. On the other hand, don't stress too much about performance until you're hitting bottlenecks, which shouldn't happen until you've got thousands (or more) of components rendering at once.

To address hooks- they allow you to "hook" into the state and lifecycle of a component. As you will see in the docs, they do not offer *more* functionality, but a simpler API. This leads to cleaner code and more reusable custom hooks. 

If you are dabbling with hooks, maybe try it on some new components you need to build. I've found it to be fun and simplifies my code considerably. 

As a final answer, I would say that the concepts of "stateful" and "stateless" components is the same. Only the API that allows you to utilize state has been changed.
Hooks are just another means to use state (and other functionality) in a so-called "smart", functional, component. That said, their existence doesn't change the answer to this question (of which, there are many). 

One example of an appropriate use of state is when you have a component that will render different output based on some sort of *change* to the component after the initial render. More specifically, if you have a component that needs to make a network call to fetch some data for display, you could use state to keep track of the initial non-existence of that data and update it when the network call returns using `setState`.

In my experience, as a general pattern, you should use state for things that change and props for things that don't.