AI Assistant Integration

Easy Email Pro provides AI assistant capabilities to enhance your email content creation. The AI assistant can help with content generation, improvement, and optimization.

Overview

Configuration

The AI assistant can be configured through the AIAssistant property in your editor configuration:

const AIAssistant: ThemeConfigProps["AIAssistant"] = useMemo(() => {
  return {
    // Handle AI content generation requests
    async onGenerate(messages) {
      const { data } = await axios.post<{ content: string; role: string }>(
        `https://your-api-server.com/api/ai`,
        {
          data: {
            messages: messages,
            model: "gpt-3.5-turbo",
          },
        }
      );
      return { content: data.content, role: data.role };
    },
    // Optional: Custom prompt options
    // options: customOptions,
  };
}, []);

// Apply the configuration
const config = Retro.useCreateConfig({
  // ... other config options
  AIAssistant,
});

Interface Definition

interface AIAssistantConfig {
  // Handle AI generation requests
  onGenerate: (
    messages: Array<{
      role: string;
      content: string;
    }>
  ) => Promise<{
    role: string;
    content: string;
  }>;

  // Optional prompt options
  options?: Array<{
    label: string; // Display name for the option
    value: string; // Unique identifier
    getMessages(text: string): {
      role: string; // Message role (e.g., "system", "user")
      content: string; // Message content
    }[];
  }>;
}

Built-in Prompt Options

Here are a few pre-configured AI assistant options:

1. Ask AI

General purpose AI assistance for any question.

{
  label: "Ask AI",
  value: "Ask AI",
  getMessages(text: string) {
    return [
      {
        role: "system",
        content: "Answer the question based on the context below.",
      },
      {
        role: "system",
        content: "The response should be in HTML format.",
      },
      {
        role: "system",
        content: "The response should preserve any HTML formatting, links, and styles in the context.",
      },
    ];
  },
}

2. Content Operations

Several built-in options for content manipulation:

const contentOptions = [
  {
    label: "Summarize content",
    value: "Summarize content",
    getMessages(text: string) {
      return [
        // System instructions...
        {
          role: "user",
          content: `Question: Provide the key points and concepts in this content in a succinct summary. Context: ${text}`,
        },
      ];
    },
  },
  {
    label: "Improve writing",
    value: "Improve writing",
    getMessages(text: string) {
      return [
        // System instructions...
        {
          role: "user",
          content: `Question: Rewrite this content with no spelling mistakes, proper grammar, and with more descriptive language. Context: ${text}`,
        },
      ];
    },
  },
  {
    label: "Simplify language",
    value: "Simplify language",
    getMessages(text: string) {
      return [
        // System instructions...
        {
          role: "user",
          content: `Question: Rewrite this content with simplified language for easier understanding. Context: ${text}`,
        },
      ];
    },
  },
];

3. Content Length Adjustment

Options for expanding or trimming content:

const lengthOptions = [
  {
    label: "Expand upon",
    value: "Expand upon",
    getMessages(text: string) {
      return [
        // System instructions...
        {
          role: "user",
          content: `Question: Expand this content with more detailed explanations and descriptive language. Context: ${text}`,
        },
      ];
    },
  },
  {
    label: "Trim content",
    value: "Trim content",
    getMessages(text: string) {
      return [
        // System instructions...
        {
          role: "user",
          content: `Question: Remove redundant or non-essential writing while preserving key information. Context: ${text}`,
        },
      ];
    },
  },
];

Usage Notes

1. The onGenerate function should connect to your AI service (e.g., OpenAI's GPT API)
2. All responses should maintain HTML formatting
3. Custom options can be added to provide specialized AI assistance
4. System messages help maintain consistent AI behavior
5. The AI assistant supports HTML-formatted responses for rich text editing

For implementation examples and advanced usage, check our demo application.