Vanila CSS

.list-group {
	list-style: none
}

In programming, we have a concept called cohesion, which means things that are related should be next to each other. Things that are unrelated, should be separate.
Our CSS file and our TSX or component file are highly related. Our component file is going to be dependent on the CSS file.
Now if you separate these two files, and put the CSS file in a separate folder, like styles, tomorrow, if you want to take this component and use it in a different project, we have to go to two different folders and cherry pick different files, not the best way.
With this structure. If you want to reuse this component in another project, we can simply come and grab these two files and take them somewhere else.
We can also add a new folder called list group and, in this folder, we'll have all the materials or all the building blocks of the component. So we have a CSS and a TypeScript file.

ListGroup

import ListGroup from './ListGroup.tsx'
export default ListGroup

import ListGroup from './components/ListGroup';

If we don't supply a file, and referencing a folder, the compiler will look for a file called index

React 18