# React 18 error in the first part of the course

**URL:** <https://forum.codewithmosh.com/t/react-18-error-in-the-first-part-of-the-course/21942>\
**Category:** React\
**Created:** [August 8, 2023, 9:01pm UTC](https://forum.codewithmosh.com/t/react-18-error-in-the-first-part-of-the-course/21942 "2023-08-08T21:01:31Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Akshayvg](https://avatars.discourse-cdn.com/v4/letter/a/858c86/32.png) [@Akshayvg](https://forum.codewithmosh.com/u/Akshayvg)\
**Post date:** [August 8, 2023, 9:01pm UTC](https://forum.codewithmosh.com/t/react-18-error-in-the-first-part-of-the-course/21942/1 "2023-08-08T21:01:31Z")

</div>

Hello All,  
In the below code when i include the error condition my gameGird is gone

 ![image](https://us1.discourse-cdn.com/flex020/uploads/codewithmosh/original/2X/0/0ce4c1089752f1d0bc6fba77edda5d4d91629265.jpeg)  
Can some one let me know what is the error here. And please help me with the undefined games part

import { SimpleGrid, Text } from “@chakra-ui/react”;  
import useGames from “…/hooks/useGames”;  
import GameCard from “./GameCard”;  
import GameCardSkeleton from “./GameCardSkeleton”;  
import GameCardContainer from “./GameCardContainer”;  
import { GameQuery } from “…/App”;

interface Props {  
gameQuery: GameQuery;  
}  
const GameGrid = ({ gameQuery }: Props) =\> {  
const { data, error, isLoading } = useGames(gameQuery);  
const skeletons = [1, 2, 3, 4, 5, 6];

if (error) return {error};

return (  
\<SimpleGrid  
columns={{ sm: 1, md: 2, lg: 3, xl: 4 }}  
padding=“10px”  
spacing={6}  
\>  
{isLoading &&  
skeletons.map((skeleton) =\> (  
  
  
  
))}  
{data?.map((game) =\> (  
  
  
  
))}  
  
);  
};

export default GameGrid;