diff --git a/src/app/(dashboard)/home/_components/game-mode.tsx b/src/app/(dashboard)/home/_components/game-mode.tsx
index 7d80228..2e2241d 100644
--- a/src/app/(dashboard)/home/_components/game-mode.tsx
+++ b/src/app/(dashboard)/home/_components/game-mode.tsx
@@ -29,13 +29,15 @@ import { useSubstrateContext } from '@/context/polkadot-contex';
 import { getNextGameID } from '@/lib/queries';
 import { submitGameAnswer } from '@/lib/extrinsic';
 import Form, { useZodForm } from '@/components/ui/form';
+import { GameData } from '@/types';
 
 interface GameProps {
+  data: GameData;
   setDisplay: Dispatch<SetStateAction<'start' | 'play' | 'success' | 'fail'>>;
   close: () => void;
 }
 
-export default function GameMode({ setDisplay, close }: GameProps) {
+export default function GameMode({ data, setDisplay, close }: GameProps) {
   // const [isPending, startTransition] = useTransition();
   const [isLoading, setIsLoading] = useState(false);
   const [gameId, setGameID] = useState<any>();
@@ -109,8 +111,9 @@ export default function GameMode({ setDisplay, close }: GameProps) {
               {Array.from({ length: 5 }).map((_, index) => (
                 <SliderMainItem key={index} className="bg-transparent">
                   <Image
-                    src={'/images/Xleafgreen_property_NFT5_apartment.webp'}
-                    alt=""
+                    src={data.cover_image}
+                    // src={'/images/Xleafgreen_property_NFT5_apartment.webp'}
+                    alt={data.type}
                     width={583}
                     height={474}
                     priority
@@ -120,15 +123,15 @@ export default function GameMode({ setDisplay, close }: GameProps) {
               ))}
             </CarouselMainContainer>
             <CarouselThumbsContainer>
-              {Array.from({ length: 5 }).map((_, index) => (
+              {data.images.map((image, index) => (
                 <SliderThumbItem
                   key={index}
                   index={index}
                   className="size-[130px] bg-transparent"
                 >
                   <Image
-                    src={'/images/Xleafgreen_property_NFT5_apartment.webp'}
-                    alt=""
+                    src={image}
+                    alt={data.type}
                     width={130}
                     height={130}
                     className="size-full"
@@ -136,13 +139,16 @@ export default function GameMode({ setDisplay, close }: GameProps) {
                   />
                 </SliderThumbItem>
               ))}
-              <Image
+              {/* {Array.from({ length: 5 }).map((_, index) => ( */}
+
+              {/* ))} */}
+              {/* <Image
                 src={'/images/Xleafgreen_property_NFT5_apartment.webp'}
                 alt=""
                 width={130}
                 height={130}
                 priority
-              />
+              /> */}
             </CarouselThumbsContainer>
           </Carousel>
         </div>
@@ -150,22 +156,19 @@ export default function GameMode({ setDisplay, close }: GameProps) {
         <div className="flex w-full max-w-[439px] flex-col gap-6 px-4">
           <div className="space-y-[18px]">
             <h1 className="text-[0.875rem] font-medium">Property 1</h1>
-            <DescriptionList title="Type" description="Apartment" />
+            <DescriptionList title="Type" description={data.type} />
             <p>One bed luxury apartment,</p>
             <div className="flex w-full items-center">
-              <DescriptionList title="Bedrooms" description="1" />
-              <DescriptionList title="Bathrooms" description="1" />
+              <DescriptionList title="Bedrooms" description={data.bedrooms} />
+              <DescriptionList title="Bathrooms" description={data.bathrooms} />
             </div>
-            <DescriptionList title="Size" description="552 sqft / 51 sqm" />
-            <DescriptionList title="Town/city" description="Hertford" />
-            <DescriptionList title="Post code" description="SG235TH" />
+            <DescriptionList title="Size" description={data.size} />
+            {/* <DescriptionList title="Town/city" description="Hertford" />
+            <DescriptionList title="Post code" description="SG235TH" /> */}
           </div>
           <div className="space-y-[18px]">
-            <h1 className="text-[0.875rem] font-medium">Key features</h1>
-            <p>
-              Private balcony. Communal roof terrace. Residents concierge service. Close
-              proximity to green spaces. 999 year lease with peppercorn ground rent
-            </p>
+            <h1 className="text-[0.875rem] font-medium">Summary</h1>
+            <p>{data.summary}</p>
           </div>
           <div className="space-y-5">
             <form onSubmit={onSubmit} className="flex w-full flex-col items-start gap-6">
@@ -196,7 +199,7 @@ export default function GameMode({ setDisplay, close }: GameProps) {
 
 interface DescriptionProps extends React.HTMLAttributes<HTMLDivElement> {
   title: string;
-  description?: string;
+  description?: any;
 }
 
 const DescriptionList = ({ className, title, description }: DescriptionProps) => {
diff --git a/src/app/(dashboard)/home/_components/live-game-container.tsx b/src/app/(dashboard)/home/_components/live-game-container.tsx
index a45855b..d60ec9c 100644
--- a/src/app/(dashboard)/home/_components/live-game-container.tsx
+++ b/src/app/(dashboard)/home/_components/live-game-container.tsx
@@ -28,7 +28,7 @@ type GameType = 0 | 1;
 export default function LiveGamePlay({ type }: { type: GameType }) {
   const [openGameSheet, setOpenGameSheet] = useState<boolean>(false);
 
-  const [propertyDisplay, setPropertyDisplay] = useState(null);
+  const [propertyDisplay, setPropertyDisplay] = useState<any>();
   const [display, setDisplay] = useState<'start' | 'play' | 'success' | 'fail'>('start');
 
   function closeGameSheet() {
@@ -44,7 +44,7 @@ export default function LiveGamePlay({ type }: { type: GameType }) {
         setPropertyDisplay={setPropertyDisplay}
       />
     ),
-    play: <GameMode setDisplay={setDisplay} close={closeGameSheet} />,
+    play: <GameMode data={propertyDisplay} setDisplay={setDisplay} close={closeGameSheet} />,
     success: <GuessPass close={closeGameSheet} />,
     fail: <GuessFail close={closeGameSheet} />
   };
@@ -91,10 +91,11 @@ function StartGame({ type, close, setDisplay, setPropertyDisplay }: GameProps) {
   async function onPlay() {
     try {
       setIsLoading(true);
-      await playGame(type, address, data => {
-        setPropertyDisplay(data);
+      await playGame(type, address, async data => {
+        setPropertyDisplay(await data);
         setDisplay('play');
       });
+
       setIsLoading(false);
     } catch (error) {
       console.log(error);
diff --git a/src/app/(dashboard)/home/_components/success-failure.tsx b/src/app/(dashboard)/home/_components/success-failure.tsx
index 95f5397..40086cc 100644
--- a/src/app/(dashboard)/home/_components/success-failure.tsx
+++ b/src/app/(dashboard)/home/_components/success-failure.tsx
@@ -13,7 +13,7 @@ export function GuessPass({ close }: GameProps) {
         <span className="text-primary-400">1500</span>
       </div>
 
-      <div className="inline-flex w-[512px] flex-col items-center justify-center gap-6 rounded-lg bg-[#172234] px-6 pb-10 pt-6 backdrop-blur-[8px]">
+      <div className="inline-flex w-[512px] flex-col items-center justify-center gap-6 rounded-lg bg-[#172234] px-6 pb-10 pt-6 backdrop-blur">
         <div className="h-[320px] w-[239px] rounded-[10px] bg-white/[0.20]">
           <Image
             src={'/images/Xpurple_property_NFT12_apartment.webp'}
@@ -44,7 +44,7 @@ export function GuessFail({ close }: GameProps) {
         <span className="text-primary-400">1500</span>
       </div>
 
-      <div className="inline-flex w-[512px] flex-col items-center justify-center gap-6 rounded-lg bg-[#172234] px-6 pb-10 pt-6 backdrop-blur-[8px]">
+      <div className="inline-flex w-[512px] flex-col items-center justify-center gap-6 rounded-lg bg-[#172234] px-6 pb-10 pt-6 backdrop-blur">
         <div className="h-[320px] w-[239px] rounded-[10px] bg-white/[0.20]"></div>
 
         <div className="flex w-full max-w-[307px] flex-col items-center justify-center gap-2 text-center">
diff --git a/src/app/(dashboard)/home/page.tsx b/src/app/(dashboard)/home/page.tsx
index ce0f8e2..1c3ad49 100644
--- a/src/app/(dashboard)/home/page.tsx
+++ b/src/app/(dashboard)/home/page.tsx
@@ -14,6 +14,7 @@ import { getLeadBoards, getUserData } from '@/lib/queries';
 import ProfileHeader from './_components/profile-header';
 import { useSubstrateContext } from '@/context/polkadot-contex';
 import { useCallback, useEffect, useState } from 'react';
+import { fetchPropertyData } from '@/app/actions';
 
 // type Player = {
 //   Player: 1;
@@ -32,6 +33,8 @@ export default function App() {
 
   async function fetchData(address: string) {
     const boardList = await getLeadBoards();
+    // const property = await fetchPropertyData(139361966)
+    // console.log(property)
     const userData = await getUserData(address);
 
     if (userData !== null && boardList !== null) {
diff --git a/src/app/(dashboard)/leaderboard/page.tsx b/src/app/(dashboard)/leaderboard/page.tsx
index 7177580..5509648 100644
--- a/src/app/(dashboard)/leaderboard/page.tsx
+++ b/src/app/(dashboard)/leaderboard/page.tsx
@@ -11,7 +11,7 @@ type LeaderProps = {
   winner?: boolean;
 };
 
-export function LeaderBoardCard({ points, winner }: LeaderProps) {
+function LeaderBoardCard({ points, winner }: LeaderProps) {
   return (
     <div className={cn('flex w-full items-center justify-between rounded-lg p-2')}>
       <div className="flex items-center gap-6">
@@ -21,7 +21,7 @@ export function LeaderBoardCard({ points, winner }: LeaderProps) {
           <span className="text-[0.875rem] text-primary-foreground">01</span>
         )}
         <div className="flex items-center gap-2">
-          <img className="h-6 w-6 rounded-full" src="/images/user.png" alt="Rounded avatar" />
+          <img className="size-6 rounded-full" src="/images/user.png" alt="Rounded avatar" />
           <span className="text-[0.875rem] text-primary-foreground">Victor X</span>
         </div>
       </div>
@@ -30,7 +30,8 @@ export function LeaderBoardCard({ points, winner }: LeaderProps) {
     </div>
   );
 }
-async function ChampionCard() {
+
+function ChampionCard() {
   return (
     <>
       <div className="flex justify-between">
@@ -51,14 +52,18 @@ async function ChampionCard() {
     </>
   );
 }
-export default async function Page() {
+
+export default function Page() {
   return (
     <Shell>
       <div className="flex justify-between">
         <div className="flex items-center gap-2">
-          <img
-            className="h-10 w-10 rounded-full"
+          <Image
+            className="size-10 rounded-full"
             src="/images/user.png"
+            width={40}
+            height={40}
+            priority
             alt="Rounded avatar"
           />
           <p className=" ml-3">Deal Real Dev</p>
diff --git a/src/app/(dashboard)/marketplace/page.tsx b/src/app/(dashboard)/marketplace/page.tsx
index 7dfc631..4313b0a 100644
--- a/src/app/(dashboard)/marketplace/page.tsx
+++ b/src/app/(dashboard)/marketplace/page.tsx
@@ -4,6 +4,7 @@ import { Shell } from '@/components/shell';
 import { Button } from '@/components/ui/button';
 import { siteConfig } from '@/config/site';
 import Image from 'next/image';
+import Link from 'next/link';
 
 const collections = ['All', 'Blue', 'Red', 'Pink', 'Orange', 'Purple', 'Teal', 'Coral'];
 
@@ -20,7 +21,7 @@ export default function Page({
   return (
     <Shell>
       <Card title="Trending">
-        <div className="grid h-full w-full grid-cols-4 gap-[13px]">
+        <div className="grid size-full grid-cols-4 gap-[13px]">
           {data.map((nft: any) => (
             <NFTCard
               key={nft.nftId}
@@ -46,12 +47,12 @@ export default function Page({
                 key={collection}
                 variant={'outline'}
                 size={'sm'}
-                href={`/marketplace?collection=${collection}`}
                 className={
                   active ? 'border-primary-300 bg-primary-300/15 text-primary-300' : ''
                 }
+                asChild
               >
-                {collection}
+                <Link href={`/marketplace?collection=${collection}`}>{collection}</Link>
               </Button>
             );
           })}
@@ -61,7 +62,7 @@ export default function Page({
       <section className="flex w-full flex-col gap-8">
         <h2 className="text-[1rem] font-medium">Listings</h2>
 
-        <div className="grid h-full w-full grid-cols-4 gap-[23px]">
+        <div className="grid size-full grid-cols-4 gap-[23px]">
           {siteConfig.nfts.map((nft: any) => (
             <NFTCard
               key={nft.nftId}
diff --git a/src/app/(dashboard)/tasks/page.tsx b/src/app/(dashboard)/tasks/page.tsx
index 268622b..2a22605 100644
--- a/src/app/(dashboard)/tasks/page.tsx
+++ b/src/app/(dashboard)/tasks/page.tsx
@@ -13,7 +13,7 @@ export default function Tasks() {
   return (
     <Shell>
       <section className="flex justify-between">
-        <CardWithoutHeading className="w-[40%]">
+        <CardWithoutHeading className="w-2/5">
           <PlayerStats title="Guesses" value={10} />
           <PlayerStats title="Correct " value={6} />
           <PlayerStats title="Failed " value={0} />
@@ -85,7 +85,7 @@ export default function Tasks() {
 
 export const TaskCard = ({ type, title, description }: TaskCardProps) => {
   return (
-    <div className="flex flex-col items-start justify-start gap-4 rounded-lg bg-[#3E4F6D] px-6 py-10 backdrop-blur-[8px] backdrop-filter">
+    <div className="flex flex-col items-start justify-start gap-4 rounded-lg bg-[#3E4F6D] px-6 py-10 backdrop-blur">
       <dt className="flex items-start gap-2 ">
         <Icons.xLogo className="size-6" />{' '}
         <span className="font-heading text-[0.875rem]/[1.543m] font-medium">{title}</span>
diff --git a/src/app/(dashboard)/test/page.tsx b/src/app/(dashboard)/test/page.tsx
index 38afbef..a2bc413 100644
--- a/src/app/(dashboard)/test/page.tsx
+++ b/src/app/(dashboard)/test/page.tsx
@@ -29,7 +29,7 @@ export default function HomePage() {
   const handlePlayGame = async () => {
     console.log('Button clicked');
     try {
-      await playGame(0, '5FEda1GYvjMYcBiuRE7rb85QbD5bQNHuZajhRvHYTxm4PPz5', data => {
+      await playGame(0, '5FEda1GYvjMYcBiuRE7rb85QbD5bQNHuZajhRvHYTxm4PPz5', async data => {
         setPropertyDisplay(data);
       });
     } catch (error) {
diff --git a/src/app/(page)/page.tsx b/src/app/(page)/page.tsx
index b803e3c..5ff875f 100644
--- a/src/app/(page)/page.tsx
+++ b/src/app/(page)/page.tsx
@@ -36,7 +36,7 @@ export default function Home() {
         </div>
         <div className="flex items-start gap-5">
           <div className="flex flex-col items-center gap-6">
-            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur backdrop-filter">
+            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur">
               <div className="bg-primary p-6">
                 <Image src={'/images/feature-img-1.png'} alt="" width={246} height={255} />
               </div>
@@ -44,7 +44,7 @@ export default function Home() {
             <p className="text-[1rem]">win valuable NFTs</p>
           </div>
           <div className="flex flex-col items-center gap-6">
-            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur backdrop-filter">
+            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur">
               <div className="bg-primary p-6">
                 <Image src={'/images/feature-img-1.png'} alt="" width={246} height={255} />
               </div>
@@ -52,7 +52,7 @@ export default function Home() {
             <p className="text-[1rem]">win valuable NFTs</p>
           </div>
           <div className="flex flex-col items-center gap-6">
-            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur backdrop-filter">
+            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur">
               <div className="bg-primary p-6">
                 <Image src={'/images/feature-img-1.png'} alt="" width={246} height={255} />
               </div>
@@ -60,7 +60,7 @@ export default function Home() {
             <p className="text-[1rem]">win valuable NFTs</p>
           </div>
           <div className="flex flex-col items-center gap-6">
-            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur backdrop-filter">
+            <div className=" rounded-lg bg-primary-300/35 p-1 backdrop-blur">
               <div className="bg-primary p-6">
                 <Image src={'/images/feature-img-1.png'} alt="" width={246} height={255} />
               </div>
diff --git a/src/app/gameplay/_components/success.tsx b/src/app/gameplay/_components/success.tsx
index 5b751f7..344c54c 100644
--- a/src/app/gameplay/_components/success.tsx
+++ b/src/app/gameplay/_components/success.tsx
@@ -9,7 +9,7 @@ export function SuccessRedirect() {
       <h1 className="text-center">
         Points : <span className="text-[#ECB278]">{points}</span>
       </h1>
-      <div className="guess-card-bg mx-auto flex h-[80vh] w-[40%] flex-col items-center justify-center">
+      <div className="guess-card-bg mx-auto flex h-[80vh] w-2/5 flex-col items-center justify-center">
         <div className="border-3 h-[50%] w-1/2 overflow-hidden rounded-lg shadow-xl shadow-[#172234]">
           <Image src="/images/sucess-guess.png" alt="" width={603} height={603} />
         </div>
@@ -33,7 +33,7 @@ export function FailRedirect() {
         Points : <span className="text-[#ECB278]">{points}x</span>
       </h1>
 
-      <div className="guess-card-bg mx-auto flex h-[80vh] w-[40%] flex-col items-center justify-center">
+      <div className="guess-card-bg mx-auto flex h-[80vh] w-2/5 flex-col items-center justify-center">
         <div className="border-3 h-[50%] w-1/2 overflow-hidden rounded-lg border border-red-400 shadow-2xl shadow-red-500 drop-shadow-xl"></div>
         <h1 className="mt-12 text-xl font-bold">Sorry wrong guess</h1>
         <p className="mt-2 text-center">You have lost -10 points</p>
diff --git a/src/components/cards/card.tsx b/src/components/cards/card.tsx
index 1e318eb..c73918c 100644
--- a/src/components/cards/card.tsx
+++ b/src/components/cards/card.tsx
@@ -9,7 +9,7 @@ export function Card({ className, title, description, children, ...props }: Card
   return (
     <section
       className={cn(
-        'flex w-full flex-col items-start gap-8 rounded-lg border border-[#3B4F74] bg-black/[0.20] px-4 py-6 shadow-header backdrop-blur-[8px] backdrop-filter',
+        'flex w-full flex-col items-start gap-8 rounded-lg border border-border bg-black/[0.20] px-4 py-6 shadow-header backdrop-blur',
         className
       )}
       {...props}
@@ -33,7 +33,7 @@ export function CardWithoutHeading({
   return (
     <section
       className={cn(
-        'flex w-full items-start gap-8 rounded-lg border border-[#3B4F74] bg-black/[0.20] px-4 py-6 shadow-header backdrop-blur-[8px] backdrop-filter',
+        'flex w-full items-start gap-8 rounded-lg border border-border bg-black/[0.20] px-4 py-6 shadow-header backdrop-blur',
         className
       )}
       {...props}
diff --git a/src/components/layouts/connect-wallet.tsx b/src/components/layouts/connect-wallet.tsx
index 8c4242f..5892d47 100644
--- a/src/components/layouts/connect-wallet.tsx
+++ b/src/components/layouts/connect-wallet.tsx
@@ -200,7 +200,7 @@ export default function ConnectWallet({ open = false }: { open?: boolean }) {
   return (
     <AlertDialog open={isDialogOpen} onOpenChange={setIsDialogOpen}>
       <AlertDialogTrigger asChild>
-        <button className="flex max-w-[250px] items-center gap-2 overflow-hidden text-ellipsis whitespace-nowrap rounded-lg border border-primary-300 px-[45px] py-4 font-heading text-[1rem] font-medium text-primary-300 hover:border-white hover:text-white">
+        <button className="flex max-w-[250px] items-center gap-2 truncate rounded-lg border border-primary-300 px-[45px] py-4 font-heading text-[1rem] font-medium text-primary-300 hover:border-white hover:text-white">
           {selectedAccount ? (
             <span className="">{formatAddress(address)}</span>
           ) : (
diff --git a/src/components/layouts/site-header.tsx b/src/components/layouts/site-header.tsx
index f75b2ce..c37a869 100644
--- a/src/components/layouts/site-header.tsx
+++ b/src/components/layouts/site-header.tsx
@@ -6,7 +6,7 @@ import ConnectWallet from './connect-wallet';
 
 export function SiteHeader() {
   return (
-    <header className="w-full backdrop-blur-[8px]">
+    <header className="w-full backdrop-blur">
       <div className="container mx-auto flex w-full  max-w-screen-2xl items-center justify-between py-4 md:px-[100px]">
         <Link href={'/'}>
           <Image src={'/images/logo.svg'} alt="logo" width={183} height={72} priority />
diff --git a/src/components/shell.tsx b/src/components/shell.tsx
index 67ba5b1..04f8217 100644
--- a/src/components/shell.tsx
+++ b/src/components/shell.tsx
@@ -6,7 +6,7 @@ import { cn } from '@/lib/utils';
 const shellVariants = cva('grid items-center gap-10', {
   variants: {
     variant: {
-      default: 'container max-w-screen-[1440px] mx-auto p-[47px] grid gap-8'
+      default: 'max-w-screen-[1440px] container mx-auto grid gap-8 p-[47px]'
     }
   },
   defaultVariants: {
diff --git a/src/components/ui/alert-dialog.tsx b/src/components/ui/alert-dialog.tsx
index 1afb1e0..a4df5c7 100644
--- a/src/components/ui/alert-dialog.tsx
+++ b/src/components/ui/alert-dialog.tsx
@@ -18,7 +18,7 @@ const AlertDialogOverlay = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <AlertDialogPrimitive.Overlay
     className={cn(
-      'fixed inset-0 z-50 bg-primary/50  backdrop-blur-[4px] backdrop-filter data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
+      'fixed inset-0 z-50 bg-primary/50  backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
       className
     )}
     {...props}
diff --git a/src/components/ui/extension-carousel.tsx b/src/components/ui/extension-carousel.tsx
index fb713cc..27930c3 100644
--- a/src/components/ui/extension-carousel.tsx
+++ b/src/components/ui/extension-carousel.tsx
@@ -332,7 +332,7 @@ const CarouselPrevious = forwardRef<HTMLButtonElement, React.ComponentProps<type
         variant={variant}
         size={size}
         className={cn(
-          'absolute z-10 h-6 w-6 rounded-full',
+          'absolute z-10 size-6 rounded-full',
           orientation === 'vertical'
             ? '-top-2 left-1/2 -translate-x-1/2 rotate-90'
             : '-left-2 top-1/2 -translate-y-1/2',
@@ -342,7 +342,7 @@ const CarouselPrevious = forwardRef<HTMLButtonElement, React.ComponentProps<type
         disabled={!canScroll}
         {...props}
       >
-        <LessThan className="h-4 w-4" />
+        <LessThan className="size-4" />
         <span className="sr-only">Previous slide</span>
       </Button>
     );
@@ -362,7 +362,7 @@ const CarouselNext = forwardRef<HTMLButtonElement, React.ComponentProps<typeof B
         variant={variant}
         size={size}
         className={cn(
-          'absolute z-10 h-6 w-6 rounded-full',
+          'absolute z-10 size-6 rounded-full',
           orientation === 'vertical'
             ? '-bottom-2 left-1/2 -translate-x-1/2 rotate-90'
             : '-right-2 top-1/2 -translate-y-1/2',
@@ -372,7 +372,7 @@ const CarouselNext = forwardRef<HTMLButtonElement, React.ComponentProps<typeof B
         disabled={!canScroll}
         {...props}
       >
-        <ChevronRightIcon className="h-4 w-4" />
+        <ChevronRightIcon className="size-4" />
         <span className="sr-only">Next slide</span>
       </Button>
     );
diff --git a/src/components/ui/sheet.tsx b/src/components/ui/sheet.tsx
index e1f1fa0..205e7c8 100644
--- a/src/components/ui/sheet.tsx
+++ b/src/components/ui/sheet.tsx
@@ -31,7 +31,7 @@ const SheetOverlay = React.forwardRef<
 SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
 
 const sheetVariants = cva(
-  'fixed z-50 gap-4 bg-background p-6 transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500',
+  'fixed z-50 gap-4 bg-background p-6 transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out',
   {
     variants: {
       side: {
diff --git a/src/components/ui/toast.tsx b/src/components/ui/toast.tsx
index 12b09ab..cccb43e 100644
--- a/src/components/ui/toast.tsx
+++ b/src/components/ui/toast.tsx
@@ -83,7 +83,7 @@ const ToastClose = React.forwardRef<
     toast-close=""
     {...props}
   >
-    <X className="h-4 w-4" />
+    <X className="size-4" />
   </ToastPrimitives.Close>
 ));
 ToastClose.displayName = ToastPrimitives.Close.displayName;
diff --git a/src/config/site.ts b/src/config/site.ts
index f03c340..a9e0e95 100644
--- a/src/config/site.ts
+++ b/src/config/site.ts
@@ -131,6 +131,7 @@ export const siteConfig = {
       latitude: 52.625284,
       longitude: 1.30124
     },
+    images: [],
     summary:
       'Second floor apartment located a short stroll from the City centre, Good sized lounge, Kitchen/Diner, Two bedrooms, E-Suite & Bathroom, Double glazing & electric heating, Designated Parking Space.'
   } as GameData
diff --git a/src/lib/extrinsic.ts b/src/lib/extrinsic.ts
index 9df9f70..dfcbdef 100644
--- a/src/lib/extrinsic.ts
+++ b/src/lib/extrinsic.ts
@@ -16,7 +16,7 @@ function getPropertyId(gameId: number) {}
 export async function playGame(
   gameType: 0 | 1 | 2,
   address: string,
-  handlePropertyDisplay: (data: any) => void
+  handlePropertyDisplay: (data: any) => Promise<void>
 ) {
   try {
     const api = await getApi();
@@ -43,7 +43,8 @@ export async function playGame(
             console.log('The game info is: ', gameInfo);
 
             const propertyDisplay = await fetchPropertyForDisplay(139361966);
-            handlePropertyDisplay(propertyDisplay);
+            console.log(propertyDisplay);
+            await handlePropertyDisplay(propertyDisplay);
 
             // console.log(propertyDisplay);
 
@@ -63,7 +64,7 @@ export async function playGame(
   }
 }
 
-export async function submitGameAnswer(address: string, guess: any, gameId: number) {
+export async function submitGameAnswer(address: string, guess: number, gameId: number) {
   try {
     const api = await getApi();
     const injected = await web3FromAddress(address);
diff --git a/src/types/index.ts b/src/types/index.ts
index 9839adb..20dce2f 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -13,11 +13,11 @@ export type GameData = {
   bedrooms: number;
   bathrooms: number;
   size: any;
-  address: string;
-  post_code: string;
-  features: string;
-  images?: string[];
-  location?: {
+  // address: string;
+  // post_code: string;
+  // features: string;
+  images: string[];
+  location: {
     latitude: any;
     longitude: any;
   };