react-native-ai-hooks 0.2.0 → 0.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-ai-hooks",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "AI hooks for React Native — useAIChat, useAIStream, useImageAnalysis. Works with Claude, OpenAI & Gemini.",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/hooks/useAICode.ts

@@ -0,0 +1,206 @@
+import { useCallback, useRef, useState } from 'react';
+
+interface UseAICodeOptions {
+  apiKey: string;
+  model?: string;
+  system?: string;
+  maxTokens?: number;
+  temperature?: number;
+  defaultLanguage?: string;
+}
+
+interface GenerateCodeInput {
+  prompt: string;
+  language?: string;
+}
+
+interface ExplainCodeInput {
+  code: string;
+  language?: string;
+  focus?: string;
+}
+
+interface UseAICodeReturn {
+  language: string;
+  generatedCode: string;
+  explanation: string;
+  isLoading: boolean;
+  error: string | null;
+  setLanguage: (language: string) => void;
+  generateCode: (input: GenerateCodeInput) => Promise<string | null>;
+  explainCode: (input: ExplainCodeInput) => Promise<string | null>;
+  clearCodeState: () => void;
+}
+
+interface ClaudeTextBlock {
+  type?: string;
+  text?: string;
+}
+
+interface ClaudeApiResult {
+  content?: ClaudeTextBlock[];
+  error?: {
+    message?: string;
+  };
+}
+
+function getClaudeTextContent(data: unknown): string {
+  const content = (data as ClaudeApiResult)?.content;
+  if (!Array.isArray(content)) {
+    return '';
+  }
+
+  return content
+    .filter(item => item?.type === 'text' && typeof item.text === 'string')
+    .map(item => item.text as string)
+    .join('\n')
+    .trim();
+}
+
+export function useAICode(options: UseAICodeOptions): UseAICodeReturn {
+  const [language, setLanguage] = useState(options.defaultLanguage || 'typescript');
+  const [generatedCode, setGeneratedCode] = useState('');
+  const [explanation, setExplanation] = useState('');
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const isMountedRef = useRef(true);
+
+  const clearCodeState = useCallback(() => {
+    setGeneratedCode('');
+    setExplanation('');
+    setError(null);
+  }, []);
+
+  const sendClaudeRequest = useCallback(
+    async (prompt: string) => {
+      const apiResponse = await fetch('https://api.anthropic.com/v1/messages', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'x-api-key': options.apiKey,
+          'anthropic-version': '2023-06-01',
+        },
+        body: JSON.stringify({
+          model: options.model || 'claude-sonnet-4-20250514',
+          max_tokens: options.maxTokens ?? 1800,
+          temperature: options.temperature ?? 0.2,
+          system:
+            options.system ||
+            'You are an expert software engineer. Produce practical, correct code and clear explanations.',
+          messages: [{ role: 'user', content: prompt }],
+        }),
+      });
+
+      const data = (await apiResponse.json()) as ClaudeApiResult;
+      if (!apiResponse.ok) {
+        throw new Error(data?.error?.message || `Claude API error: ${apiResponse.status}`);
+      }
+
+      const text = getClaudeTextContent(data);
+      if (!text) {
+        throw new Error('No content returned by Claude API.');
+      }
+
+      return text;
+    },
+    [options.apiKey, options.maxTokens, options.model, options.system, options.temperature],
+  );
+
+  const generateCode = useCallback(
+    async (input: GenerateCodeInput) => {
+      const taskPrompt = input.prompt.trim();
+      const selectedLanguage = (input.language || language).trim();
+
+      if (!taskPrompt) {
+        setError('No code generation prompt provided.');
+        return null;
+      }
+
+      if (!options.apiKey) {
+        setError('Missing Claude API key.');
+        return null;
+      }
+
+      setIsLoading(true);
+      setError(null);
+      setLanguage(selectedLanguage);
+
+      try {
+        const prompt = [
+          `Generate ${selectedLanguage} code for the following request:`,
+          taskPrompt,
+          'Return runnable code and include brief usage notes only when necessary.',
+        ].join('\n');
+
+        const result = await sendClaudeRequest(prompt);
+        setGeneratedCode(result);
+        return result;
+      } catch (err) {
+        const message = (err as Error).message || 'Failed to generate code';
+        setError(message);
+        return null;
+      } finally {
+        if (isMountedRef.current) {
+          setIsLoading(false);
+        }
+      }
+    },
+    [language, options.apiKey, sendClaudeRequest],
+  );
+
+  const explainCode = useCallback(
+    async (input: ExplainCodeInput) => {
+      const code = input.code.trim();
+      const selectedLanguage = (input.language || language).trim();
+
+      if (!code) {
+        setError('No code provided for explanation.');
+        return null;
+      }
+
+      if (!options.apiKey) {
+        setError('Missing Claude API key.');
+        return null;
+      }
+
+      setIsLoading(true);
+      setError(null);
+      setLanguage(selectedLanguage);
+
+      try {
+        const prompt = [
+          `Explain the following ${selectedLanguage} code.`,
+          input.focus ? `Focus: ${input.focus}` : 'Focus: logic, structure, and potential pitfalls.',
+          'Code:',
+          code,
+        ].join('\n');
+
+        const result = await sendClaudeRequest(prompt);
+        setExplanation(result);
+        return result;
+      } catch (err) {
+        const message = (err as Error).message || 'Failed to explain code';
+        setError(message);
+        return null;
+      } finally {
+        if (isMountedRef.current) {
+          setIsLoading(false);
+        }
+      }
+    },
+    [language, options.apiKey, sendClaudeRequest],
+  );
+
+  return {
+    language,
+    generatedCode,
+    explanation,
+    isLoading,
+    error,
+    setLanguage,
+    generateCode,
+    explainCode,
+    clearCodeState,
+  };
+}

package/src/hooks/useAISummarize.ts

@@ -0,0 +1,158 @@
+import { useCallback, useRef, useState } from 'react';
+
+type SummaryLength = 'short' | 'medium' | 'long';
+
+interface UseAISummarizeOptions {
+  apiKey: string;
+  model?: string;
+  system?: string;
+  maxTokens?: number;
+  temperature?: number;
+  defaultLength?: SummaryLength;
+}
+
+interface SummarizeInput {
+  text: string;
+  length?: SummaryLength;
+}
+
+interface UseAISummarizeReturn {
+  summary: string;
+  length: SummaryLength;
+  isLoading: boolean;
+  error: string | null;
+  setLength: (length: SummaryLength) => void;
+  summarizeText: (input: SummarizeInput) => Promise<string | null>;
+  clearSummary: () => void;
+}
+
+interface ClaudeTextBlock {
+  type?: string;
+  text?: string;
+}
+
+interface ClaudeApiResult {
+  content?: ClaudeTextBlock[];
+  error?: {
+    message?: string;
+  };
+}
+
+function getClaudeTextContent(data: unknown): string {
+  const content = (data as ClaudeApiResult)?.content;
+  if (!Array.isArray(content)) {
+    return '';
+  }
+
+  return content
+    .filter(item => item?.type === 'text' && typeof item.text === 'string')
+    .map(item => item.text as string)
+    .join('\n')
+    .trim();
+}
+
+function lengthInstruction(length: SummaryLength): string {
+  if (length === 'short') {
+    return 'Produce a concise summary in 2-4 bullet points.';
+  }
+
+  if (length === 'long') {
+    return 'Produce a detailed summary with key points, context, and implications in 3-5 short paragraphs.';
+  }
+
+  return 'Produce a balanced summary in 1-2 paragraphs plus a short bullet list of key takeaways.';
+}
+
+export function useAISummarize(options: UseAISummarizeOptions): UseAISummarizeReturn {
+  const [summary, setSummary] = useState('');
+  const [length, setLength] = useState<SummaryLength>(options.defaultLength || 'medium');
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const isMountedRef = useRef(true);
+
+  const clearSummary = useCallback(() => {
+    setSummary('');
+    setError(null);
+  }, []);
+
+  const summarizeText = useCallback(
+    async (input: SummarizeInput) => {
+      const text = input.text.trim();
+      const selectedLength = input.length || length;
+
+      if (!text) {
+        setError('No text provided for summarization.');
+        return null;
+      }
+
+      if (!options.apiKey) {
+        setError('Missing Claude API key.');
+        return null;
+      }
+
+      setIsLoading(true);
+      setError(null);
+      setLength(selectedLength);
+
+      try {
+        const prompt = [
+          'Summarize the following text.',
+          lengthInstruction(selectedLength),
+          'Text:',
+          text,
+        ].join('\n');
+
+        const apiResponse = await fetch('https://api.anthropic.com/v1/messages', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            'x-api-key': options.apiKey,
+            'anthropic-version': '2023-06-01',
+          },
+          body: JSON.stringify({
+            model: options.model || 'claude-sonnet-4-20250514',
+            max_tokens: options.maxTokens ?? 1200,
+            temperature: options.temperature ?? 0.3,
+            system:
+              options.system ||
+              'You are an expert summarization assistant. Keep summaries faithful to source text and avoid fabrications.',
+            messages: [{ role: 'user', content: prompt }],
+          }),
+        });
+
+        const data = (await apiResponse.json()) as ClaudeApiResult;
+        if (!apiResponse.ok) {
+          throw new Error(data?.error?.message || `Claude API error: ${apiResponse.status}`);
+        }
+
+        const result = getClaudeTextContent(data);
+        if (!result) {
+          throw new Error('No summary returned by Claude API.');
+        }
+
+        setSummary(result);
+        return result;
+      } catch (err) {
+        const message = (err as Error).message || 'Failed to summarize text';
+        setError(message);
+        return null;
+      } finally {
+        if (isMountedRef.current) {
+          setIsLoading(false);
+        }
+      }
+    },
+    [length, options.apiKey, options.maxTokens, options.model, options.system, options.temperature],
+  );
+
+  return {
+    summary,
+    length,
+    isLoading,
+    error,
+    setLength,
+    summarizeText,
+    clearSummary,
+  };
+}

package/src/hooks/useAITranslate.ts

@@ -0,0 +1,207 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+
+interface UseAITranslateOptions {
+  apiKey: string;
+  model?: string;
+  system?: string;
+  maxTokens?: number;
+  temperature?: number;
+  initialTargetLanguage?: string;
+  autoTranslate?: boolean;
+  debounceMs?: number;
+}
+
+interface TranslationResult {
+  translatedText: string;
+  detectedSourceLanguage: string;
+  targetLanguage: string;
+}
+
+interface UseAITranslateReturn {
+  sourceText: string;
+  translatedText: string;
+  detectedSourceLanguage: string;
+  targetLanguage: string;
+  isTranslating: boolean;
+  error: string | null;
+  setSourceText: (text: string) => void;
+  setTargetLanguage: (language: string) => void;
+  translateText: (overrideText?: string) => Promise<TranslationResult | null>;
+  clearTranslation: () => void;
+}
+
+interface ClaudeTextBlock {
+  type?: string;
+  text?: string;
+}
+
+interface ClaudeApiResult {
+  content?: ClaudeTextBlock[];
+  error?: {
+    message?: string;
+  };
+}
+
+function getClaudeTextContent(data: unknown): string {
+  const content = (data as ClaudeApiResult)?.content;
+  if (!Array.isArray(content)) {
+    return '';
+  }
+
+  return content
+    .filter(item => item?.type === 'text' && typeof item.text === 'string')
+    .map(item => item.text as string)
+    .join('\n')
+    .trim();
+}
+
+function parseJsonFromText<T>(text: string): T {
+  const trimmed = text.trim();
+  const fenced = trimmed.match(/```(?:json)?\s*([\s\S]*?)```/i);
+  const candidate = fenced?.[1]?.trim() || trimmed;
+  return JSON.parse(candidate) as T;
+}
+
+export function useAITranslate(options: UseAITranslateOptions): UseAITranslateReturn {
+  const [sourceText, setSourceText] = useState('');
+  const [translatedText, setTranslatedText] = useState('');
+  const [detectedSourceLanguage, setDetectedSourceLanguage] = useState('');
+  const [targetLanguage, setTargetLanguage] = useState(options.initialTargetLanguage || 'English');
+  const [isTranslating, setIsTranslating] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const isMountedRef = useRef(true);
+
+  const clearTranslation = useCallback(() => {
+    setSourceText('');
+    setTranslatedText('');
+    setDetectedSourceLanguage('');
+    setError(null);
+  }, []);
+
+  const translateText = useCallback(
+    async (overrideText?: string) => {
+      const textToTranslate = (overrideText ?? sourceText).trim();
+
+      if (!textToTranslate) {
+        setError('No text to translate.');
+        return null;
+      }
+
+      if (!options.apiKey) {
+        setError('Missing Claude API key.');
+        return null;
+      }
+
+      setIsTranslating(true);
+      setError(null);
+
+      try {
+        const prompt = [
+          'Detect source language and translate text.',
+          'Return JSON only using this schema:',
+          '{"detectedSourceLanguage":"string","targetLanguage":"string","translatedText":"string"}',
+          `Target language: ${targetLanguage}`,
+          'Text:',
+          textToTranslate,
+        ].join('\n');
+
+        const apiResponse = await fetch('https://api.anthropic.com/v1/messages', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            'x-api-key': options.apiKey,
+            'anthropic-version': '2023-06-01',
+          },
+          body: JSON.stringify({
+            model: options.model || 'claude-sonnet-4-20250514',
+            max_tokens: options.maxTokens ?? 800,
+            temperature: options.temperature ?? 0.2,
+            system:
+              options.system ||
+              'You are a translation assistant. Always detect source language and translate accurately. Return valid JSON only.',
+            messages: [{ role: 'user', content: prompt }],
+          }),
+        });
+
+        const data = (await apiResponse.json()) as ClaudeApiResult;
+        if (!apiResponse.ok) {
+          throw new Error(data?.error?.message || `Claude API error: ${apiResponse.status}`);
+        }
+
+        const text = getClaudeTextContent(data);
+        if (!text) {
+          throw new Error('No translation returned by Claude API.');
+        }
+
+        const parsed = parseJsonFromText<{
+          translatedText?: string;
+          detectedSourceLanguage?: string;
+          targetLanguage?: string;
+        }>(text);
+
+        const result: TranslationResult = {
+          translatedText: parsed?.translatedText?.trim() || '',
+          detectedSourceLanguage: parsed?.detectedSourceLanguage?.trim() || 'Unknown',
+          targetLanguage: parsed?.targetLanguage?.trim() || targetLanguage,
+        };
+
+        if (!result.translatedText) {
+          throw new Error('Invalid translation format returned by Claude API.');
+        }
+
+        setTranslatedText(result.translatedText);
+        setDetectedSourceLanguage(result.detectedSourceLanguage);
+        return result;
+      } catch (err) {
+        const message = (err as Error).message || 'Failed to translate text';
+        setError(message);
+        return null;
+      } finally {
+        if (isMountedRef.current) {
+          setIsTranslating(false);
+        }
+      }
+    },
+    [options.apiKey, options.maxTokens, options.model, options.system, options.temperature, sourceText, targetLanguage],
+  );
+
+  useEffect(() => {
+    isMountedRef.current = true;
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
+
+  useEffect(() => {
+    if (options.autoTranslate === false) {
+      return;
+    }
+
+    const text = sourceText.trim();
+    if (!text) {
+      setTranslatedText('');
+      setDetectedSourceLanguage('');
+      return;
+    }
+
+    const timer = setTimeout(() => {
+      translateText(text).catch(() => undefined);
+    }, options.debounceMs ?? 500);
+
+    return () => clearTimeout(timer);
+  }, [options.autoTranslate, options.debounceMs, sourceText, targetLanguage, translateText]);
+
+  return {
+    sourceText,
+    translatedText,
+    detectedSourceLanguage,
+    targetLanguage,
+    isTranslating,
+    error,
+    setSourceText,
+    setTargetLanguage,
+    translateText,
+    clearTranslation,
+  };
+}

package/src/index.ts

@@ -2,4 +2,7 @@ export { useAIChat } from './hooks/useAIChat';
 export { useAIStream } from './hooks/useAIStream';
 export { useImageAnalysis } from './hooks/useImageAnalysis';
 export { useAIForm } from './hooks/useAIForm';
-export { useAIVoice } from './hooks/useAIVoice';
+export { useAIVoice } from './hooks/useAIVoice';
+export { useAITranslate } from './hooks/useAITranslate';
+export { useAISummarize } from './hooks/useAISummarize';
+export { useAICode } from './hooks/useAICode';