---
title: useRecentShops
description: >-
  The useRecentShops hook fetches shops the user recently interacted with in the
  Shop app, ordered by recency.
source_url:
  html: 'https://shopify.dev/docs/api/shop-minis/hooks/user/userecentshops'
  md: 'https://shopify.dev/docs/api/shop-minis/hooks/user/userecentshops.md'
---

# 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.

## use​Recent​Shops(**[params](#userecentshopsgeneratedtype-propertydetail-params)**​)

### Parameters

* **params**

  **UseRecentShopsParams**

### Returns

* **UseRecentShopsReturns**

### UseRecentShopsParams

* fetchPolicy

  ```ts
  DataHookFetchPolicy
  ```

* first

  ```ts
  number
  ```

* skip

  ```ts
  boolean
  ```

### DataHookFetchPolicy

```ts
'cache-first' | 'network-only'
```

### UseRecentShopsReturns

* error

  ```ts
  Error | null
  ```

* fetchMore

  ```ts
  () => Promise<void>
  ```

* hasNextPage

  ```ts
  boolean
  ```

* loading

  ```ts
  boolean
  ```

* refetch

  ```ts
  () => Promise<void>
  ```

* shops

  The recent shops returned from the query.

  ```ts
  Shop[] | null
  ```

### Shop

* id

  ```ts
  string
  ```

* isFollowing

  ```ts
  boolean | null
  ```

* logoImage

  ```ts
  ProductImage | null
  ```

* name

  ```ts
  string
  ```

* primaryDomain

  ```ts
  { url: string; }
  ```

* reviewAnalytics

  ```ts
  { averageRating?: number; reviewCount: number; }
  ```

* shareUrl

  ```ts
  string | null
  ```

* visualTheme

  ```ts
  VisualTheme | null
  ```

### ProductImage

* altText

  ```ts
  string | null
  ```

* height

  ```ts
  number | null
  ```

* id

  ```ts
  string | null
  ```

* sensitive

  ```ts
  boolean | null
  ```

* thumbhash

  ```ts
  string | null
  ```

* url

  ```ts
  string
  ```

* width

  ```ts
  number | null
  ```

### VisualTheme

* brandSettings

  ```ts
  BrandSettings | null
  ```

* description

  ```ts
  string | null
  ```

* featuredImages

  ```ts
  ImageType[]
  ```

* id

  ```ts
  string
  ```

* logoImage

  ```ts
  ImageType | null
  ```

### BrandSettings

* colors

  ```ts
  ColorTheme | null
  ```

* headerTheme

  ```ts
  HeaderTheme | null
  ```

* id

  ```ts
  string
  ```

* logos

  ```ts
  LogoTheme | null
  ```

### ColorTheme

* coverDominant

  ```ts
  string | null
  ```

* id

  ```ts
  string
  ```

* logoAverage

  ```ts
  string | null
  ```

* logoDominant

  ```ts
  string | null
  ```

* primary

  ```ts
  string | null
  ```

* secondary

  ```ts
  string | null
  ```

* secondaryText

  ```ts
  string | null
  ```

* statusBarStyle

  ```ts
  string | null
  ```

### HeaderTheme

* coverImage

  ```ts
  ImageType | null
  ```

* endingScrimColor

  ```ts
  string | null
  ```

* id

  ```ts
  string
  ```

* startingScrimColor

  ```ts
  string | null
  ```

* thumbnailImage

  ```ts
  ImageType | null
  ```

* videoUrl

  ```ts
  string | null
  ```

* wordmark

  ```ts
  ImageType | null
  ```

### ImageType

* altText

  ```ts
  string | null
  ```

* height

  ```ts
  number | null
  ```

* sensitive

  ```ts
  boolean
  ```

* thumbhash

  ```ts
  string | null
  ```

* url

  ```ts
  string
  ```

* width

  ```ts
  number | null
  ```

### LogoTheme

* id

  ```ts
  string
  ```

* logoImage

  ```ts
  ImageType | null
  ```

Examples

### Examples

* ####

  ##### tsx

  ```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 onClick={loadMore} disabled={loading}>
            Load More
          </Button>
        )}
      </>
    )
  }
  ```

***