useRecentShops

The useRecentShops hook fetches shops the user recently interacted with in the Shop app, ordered by recency. You can use this to create quick access to favorite stores or personalized shop recommendations.

Anchor to useRecentShops
useRecentShops(
params
)

Anchor to useRecentShops-parametersParameters

Anchor to params params

Anchor to useRecentShops-returnsReturns

UseRecentShopsParams

fetchPolicy
```
DataHookFetchPolicy
```
first
```
number
```
skip
```
boolean
```

DataHookFetchPolicy

'cache-first' | 'network-only'

UseRecentShopsReturns

error
```
Error | null
```
fetchMore
```
() => Promise<void>
```
hasNextPage
```
boolean
```
loading
```
boolean
```
refetch
```
() => Promise<void>
```
shops
The recent shops returned from the query.
```
Shop[] | null
```

Shop

id
```
string
```
isFollowing
```
boolean | null
```
logoImage
```
ProductImage | null
```
name
```
string
```
primaryDomain
```
{ url: string; }
```

reviewAnalytics

{ averageRating?: number; reviewCount: number; }

shareUrl
```
string | null
```
visualTheme
```
VisualTheme | null
```

ProductImage

altText
```
string | null
```
height
```
number | null
```
id
```
string | null
```
sensitive
```
boolean | null
```
thumbhash
```
string | null
```
url
```
string
```
width
```
number | null
```

VisualTheme

brandSettings
```
BrandSettings | null
```
description
```
string | null
```
featuredImages
```
ImageType[]
```
id
```
string
```
logoImage
```
ImageType | null
```

BrandSettings

colors
```
ColorTheme | null
```
headerTheme
```
HeaderTheme | null
```
id
```
string
```
logos
```
LogoTheme | null
```

ColorTheme

coverDominant
```
string | null
```
id
```
string
```
logoAverage
```
string | null
```
logoDominant
```
string | null
```
primary
```
string | null
```
secondary
```
string | null
```
secondaryText
```
string | null
```
statusBarStyle
```
string | null
```

HeaderTheme

coverImage
```
ImageType | null
```
endingScrimColor
```
string | null
```
id
```
string
```
startingScrimColor
```
string | null
```
thumbnailImage
```
ImageType | null
```
videoUrl
```
string | null
```
wordmark
```
ImageType | null
```

ImageType

altText
```
string | null
```
height
```
number | null
```
sensitive
```
boolean
```
thumbhash
```
string | null
```
url
```
string
```
width
```
number | null
```

LogoTheme

id
```
string
```
logoImage
```
ImageType | null
```

Examples

tsx

import {useRecentShops, Button} from '@shopify/shop-minis-react'

export default function MyComponent() {

const {shops, loading, error, hasNextPage, loadMore} = useRecentShops({

first: 10,

})

console.log({shops, loading, error})

return (

{/* Render shops here */}

{hasNextPage && (

</Button>

)}

</>

)

}