# Misc

### useAutocompleteQuery

This function is used to match the entered keyword in categories and products for search input.

The **useAutocompleteQuery** function is imported from `'@akinon/next/data/client/misc'`.

```javascript
import { useAutocompleteQuery } from '@akinon/next/data/client/misc';
```

To use the function, create a variable and call the function with the following properties:

* **debouncedSearchText**
* **refetchOnMountOrArgChange**
* **skip**

```javascript
const { currentData, isFetching, isLoading } = useAutocompleteQuery(
    debouncedSearchText,
    {
      refetchOnMountOrArgChange: true,
      skip: debouncedSearchText.length < MINIMUM_SEARCH_LENGTH
    }
  );
```

For example, if searching for the keyword "**WOM**", the data returned from the function:

```json
{
  "groups": [{
      "entries": [{
        "label": "WOMAN",
        "url": "/woman/",
        "suggestion_type": "category",
        "extra": {
          "category_id": 2,
          "parent_categories": []
        }
      }],
      "suggestion_type": "Category"
    },
    {
      "entries": [{
          "label": "Mini Turnlock Flap Zebra Print Clutch Bag Black",
          "url": "/mini-turnlock-flap-zebra-print-clutch-bag-black/",
          "suggestion_type": "product",
          "extra": {
            "image": "https://0fb534.cdn.akinoncloud.com/products/2022/02/02/303/ae5f3cc6-d918-4dff-bdc0-b8b397f3882f_size273x210.jpg",
            "retail_price": 89.99,
            "product_type": "0",
            "price": 49.99
          }
        },
        {
          "label": "Resin Hair Clip Claw Zebra Print",
          "url": "/resin-hair-clip-claw-zebra-print/",
          "suggestion_type": "product",
          "extra": {
            "image": "https://0fb534.cdn.akinoncloud.com/products/2022/02/02/305/7374553d-151d-4cf0-b06f-45164313c959_size273x210.jpg",
            "retail_price": 8.49,
            "product_type": "0",
            "price": 8.49
          }
        },
        {
          "label": "Frill Neck Mini Dress With Fluted Three Quarter Sleeves Black",
          "url": "/frill-neck-mini-dress-with-fluted-three-quarter-sleeves-black-1/",
          "suggestion_type": "product",
          "extra": {
            "image": "https://0fb534.cdn.akinoncloud.com/products/2022/04/11/274/7f470497-fb62-4c41-afe8-f3c1bc01ed37_size273x210.jpg",
            "retail_price": 1000,
            "product_type": "0",
            "price": 1000
          }
        },
        {
          "label": "Wide Fit Embrace Leather High-Heeled Square Toe Boots Burgundy",
          "url": "/wide-fit-embrace-leather-high-heeled-square-toe-boots-burgundy/",
          "suggestion_type": "product",
          "extra": {
            "image": "https://0fb534.cdn.akinoncloud.com/products/2022/02/02/297/fdc50378-d570-44c0-9a69-1c16e3c15321_size273x210.jpg",
            "retail_price": 109.99,
            "product_type": "0",
            "price": 99.99
          }
        }
      ],
      "suggestion_type": "Product"
    }
  ]
}
```

### useGetWidgetQuery

The **useGetWidgetQuery** function is used to fetch widget data in '**use client**' components.

It should be imported into the component:

```javascript
import { useGetWidgetQuery } from '@akinon/next/data/client/misc';
```

To use this function, create a variable where you specify the slug name of the widget you want to access:

```javascript
const { data } = useGetWidgetQuery('slug-name');
```

The returned data varies depending on the widget you have created.

The returned data can be sent to another component as `<ComponentName data={data} />` or can be processed in the component where it is located.

### useGetMenuQuery

The **useGetMenuQuery** function is used to fetch menu data in '**use client**' components.

It should be imported into the component:

```javascript
import { useGetMenuQuery } from '@akinon/next/data/client/misc';
```

To use this function, create a variable and provide the menu level as an argument when calling the function:

```javascript
const { data: menuData, isSuccess, isFetching } = useGetMenuQuery(4);
```

### useGetBukalemunImageUrlQuery

The `useGetBukalemunImageUrlQuery` function is used to fetch a dynamic image URL from the Bukalemun system based on a specific product variant. The image is generated according to the selected attributes. The query requires the `sku`, `current_chapter`, and the variant's attribute selections.

The **useGetBukalemunImageUrlQuery** function is imported from `'@akinon/next/data/client/misc'`.

```javascript
import { useGetBukalemunImageUrlQuery } from '@akinon/next/data/client/misc';
```

This function can be used like this:

```javascript
const { data: bukalemun_image } = useGetBukalemunImageUrlQuery({
   current_chapter: item.chapter_slug,
   sku: customProduct?.sku,
   selected_attributes: customProduct?.bukalemun_query
 });
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.akinon.com/technical-guides/project-zero/next.js/plugins/akinon-next/data-fetching/client/misc.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.