Examples

import { ChatWidget } from '@ai-commerce/react';

function App() {
  return (
    <div>
      <h1>My Storeh1>
      
      <ChatWidget
        apiKey="YOUR_API_KEY"
        storeId="your-store-id"
        theme={{
          primaryColor: '#6366f1',
          position: 'bottom-right',
          borderRadius: 16
        }}
        welcomeMessage="Hi! How can I help you find products today?"
        onProductClick={(product) => {
          window.location.href = `/products/${product.id}`;
        }}
        onSessionStart={(session) => {
          analytics.track('chat_started', { sessionId: session.id });
        }}
      />
    div>
  );
}

// pages/api/chat.ts
import type { NextApiRequest, NextApiResponse } from 'next';
import { AICommerce } from '@yassirbenmoussa/aicommerce-sdk';

const client = new AICommerce({
  apiKey: process.env.AI_COMMERCE_API_KEY!,
  storeId: process.env.AI_COMMERCE_STORE_ID!
});

export default async function handler(
  req: NextApiRequest,
  res: NextApiResponse
) {
  if (req.method !== 'POST') {
    return res.status(405).json({ error: 'Method not allowed' });
  }

  const { sessionId, message } = req.body;

  try {
    let session;
    
    if (sessionId) {
      session = await client.chat.getSession(sessionId);
    } else {
      session = await client.chat.createSession({
        metadata: { userId: req.cookies.userId }
      });
    }

    const response = await session.sendMessage(message);

    return res.json({
      sessionId: session.id,
      reply: response.reply,
      products: response.products
    });
  } catch (error) {
    console.error('Chat error:', error);
    return res.status(500).json({ error: 'Chat failed' });
  }
}

// Vanilla JavaScript integration
class AICommerceChat {
  constructor(config) {
    this.apiKey = config.apiKey;
    this.storeId = config.storeId;
    this.baseUrl = 'https://api.aicommerce.dev/v1';
    this.sessionId = null;
  }

  async init() {
    const response = await fetch(`${this.baseUrl}/chat/sessions`, {
      method: 'POST',
      headers: {
        'Authorization': `Bearer ${this.apiKey}`,
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({ storeId: this.storeId })
    });
    
    const data = await response.json();
    this.sessionId = data.sessionId;
    return this;
  }

  async sendMessage(message) {
    const response = await fetch(`${this.baseUrl}/chat/messages`, {
      method: 'POST',
      headers: {
        'Authorization': `Bearer ${this.apiKey}`,
        'X-Session-Id': this.sessionId,
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({ message })
    });
    
    return response.json();
  }
}

// Usage
const chat = new AICommerceChat({
  apiKey: 'YOUR_API_KEY',
  storeId: 'your-store-id'
});

await chat.init();
const response = await chat.sendMessage("Show me laptops");
console.log(response.products);