Installation & Integration

This document describes how to integrate the AI Powered Search package into Next.js projects for all brands. It is prepared to enable technical teams to perform a fast and standardized integration.

---

1. Package Installation

yarn add git+https://bitbucket.org/akinonteam/samanlik-client-js.git

---

2. Environment Variables

Required

SAMANLIK_API_URL=https://<ai-powered-search-api-url>

Optional

The following variables are optional. Default values are used if not defined.

Variable	Default
SAMANLIK_FALLBACK_PATH	/list/
SAMANLIK_PREFIX_PATH	(empty)
SAMANLIK_LANGUAGE	tr
SAMANLIK_TIMEOUT	5000

---

3. Creating the Server Action

Create the file src/views/header/samanlik-client.tsx:

'use server';

import { getNavigationAction } from 'samanlik-client';
import { ROUTES } from '@theme/routes';

const fetchSearchRedirectionResult = async (search_text: string) => {
  const params = new URLSearchParams();
  params.append('search_text', search_text);

  if (process.env.SAMANLIK_API_URL === undefined) {
    return { url_path: `${ROUTES.LIST}/?${params.toString()}` };
  }

  try {
    const result = await getNavigationAction(search_text);

    if (result.error || !result.url_path) {
      console.error('AI Powered Search API Error:', result.error);
      return { url_path: `${ROUTES.LIST}/?${params.toString()}` };
    }

    return { url_path: result.url_path };
  } catch (error) {
    console.error('AI Powered Search fetch error:', error);
    return { url_path: `${ROUTES.LIST}/?${params.toString()}` };
  }
};

export default fetchSearchRedirectionResult;

---

4. Search Component Integration

Import

import fetchSearchRedirectionResult from '../samanlik-client';

Usage

• The AI Powered Search API call must be added to the handleSearchQuery function.

• On a successful response, redirect using router.push(data.url_path).

• On error, the user is redirected to the list page as a fallback.

---

5. File Structure

src/views/header/
├── samanlik-client.tsx
├── search/
│   └── index.tsx
└── index.tsx

---

6. Testing

1. Start the project with yarn dev.

2. Enter test queries into the search box (e.g. polo, tişört, ayakkabı).

3. Verify that the redirect works correctly.

4. Test the fallback redirect in case of an API error.