import { observer } from "mobx-react-lite"; import { ListGroup } from "reactstrap"; import WwwLevelItem from "src/avatar/WwwLevelItem"; import { useAvatarStore } from "src/Stores"; import { AvatarWwwLevelLoading } from "src/Loading"; export default observer(() => { const { wwwLevels, isWwwLevelLoading } = useAvatarStore(); return ( <ListGroup> {isWwwLevelLoading ? ( <AvatarWwwLevelLoading loadingCount={1} /> ) : ( wwwLevels.map(({ levelID, title, levelText, level, date }) => ( <WwwLevelItem key={levelID} levelID={levelID} title={title} levelText={levelText} level={level} date={date} /> )) )} </ListGroup> ); });