import React, { useState } from ‘react’;
import axios from ‘axios’;
const AIContentGenerator = () => {
const [apiKey, setApiKey] = useState(”);
const [topic, setTopic] = useState(”);
const [contentType, setContentType] = useState(‘blog’);
const [generatedContent, setGeneratedContent] = useState(”);
const [loading, setLoading] = useState(false);
const generateContent = async () => {
setLoading(true);
try {
const response = await axios.post(‘https://api.openai.com/v1/chat/completions’, {
model: “gpt-3.5-turbo”,
messages: [
{
role: “system”,
content: “You are a helpful content creator that generates high-quality articles.”
},
{
role: “user”,
content: `Write a ${contentType} about ${topic} of approximately 500-700 words`
}
]
}, {
headers: {
‘Authorization’: `Bearer ${apiKey}`,
‘Content-Type’: ‘application/json’
}
});
setGeneratedContent(response.data.choices[0].message.content);
} catch (error) {
console.error(‘Error generating content:’, error);
alert(‘Failed to generate content’);
} finally {
setLoading(false);
}
};
const copyToClipboard = () => {
navigator.clipboard.writeText(generatedContent);
alert(‘Content copied!’);
};
return (
AI Content Generator
setApiKey(e.target.value)}
className=”w-full p-2 border rounded”
placeholder=”Enter your OpenAI API key”
/>
setTopic(e.target.value)}
className=”w-full p-2 border rounded”
placeholder=”Enter topic for content”
/>
{generatedContent && (
Generated Content
)}
);
};
export default AIContentGenerator;