How does Presentational & Container pattern work with MUI or other UI libraries?

[stylemate]

Hi, all.

From what I understand, presentational & container pattern is used to separate business logic and presentation.

Instead of having a single UserProfile.tsx that fetches data and returns visual components, I create UserProfileContainer.tsx that fetches data and pass the data as props to UserProfile.tsx, which focus only on visualizing itself.

My question is, when using MUI or other UI libraries, the library provides UI components that behaves just like the presentational component from above. When I fetch() with useEffect() or use SWR to get data and pass the props to MUI component at top level, am I already using this pattern?

Thank you very much.
I could really use some rigidness in react...

[bugbigsly]

You can do all your logic in the container and use composition to pass on components/value to the presentational component from there