/** @jsxImportSource https://esm.sh/react@18.2.0 */ import React, { useState, useEffect } from "https://esm.sh/react@18.2.0"; import { createRoot } from "https://esm.sh/react-dom@18.2.0/client"; const SUBSCRIPTION_TIERS = { FREE: { name: "Free", contentLimit: 1, price: 0 }, BASIC: { name: "Basic", contentLimit: 10, price: 9.99 }, PRO: { name: "Pro", contentLimit: 50, price: 29.99 }, ENTERPRISE: { name: "Enterprise", contentLimit: Infinity, price: 99.99 }, }; const AI_PROVIDERS = [ "OpenAI", "Anthropic", "Groq", "Google AI", "XAI", "Mistral", ]; function App() { const [topic, setTopic] = useState(""); const [format, setFormat] = useState("blog"); const [generatedContent, setGeneratedContent] = useState(""); const [isLoading, setIsLoading] = useState(false); const [user, setUser] = useState(null); const [adContent, setAdContent] = useState(""); const [selectedProvider, setSelectedProvider] = useState("OpenAI"); const [apiKey, setApiKey] = useState(""); useEffect(() => { fetchUserData(); fetchAd(); }, []); const fetchUserData = async () => { const response = await fetch("/user"); const userData = await response.json(); setUser(userData); setSelectedProvider(userData.aiProvider || "OpenAI"); setApiKey(userData.apiKey || ""); }; const fetchAd = async () => { const response = await fetch("/ad"); const adData = await response.json(); setAdContent(adData.content); }; const handleSubmit = async (e) => { e.preventDefault(); setIsLoading(true); try { const response = await fetch("/generate", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ topic, format, provider: selectedProvider, apiKey }), }); const data = await response.json(); if (data.error) { setGeneratedContent(data.error); } else { setGeneratedContent(data.content); fetchUserData(); // Refresh user data to update usage } } catch (error) { console.error("Error generating content:", error); setGeneratedContent("Error generating content. Please try again."); } setIsLoading(false); }; const handleUpgrade = async (tier) => { const response = await fetch("/upgrade", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ tier }), }); const data = await response.json(); if (data.success) { fetchUserData(); } else { alert("Upgrade failed. Please try again."); } }; const handleProviderChange = async (e) => { const newProvider = e.target.value; setSelectedProvider(newProvider); await updateUserSettings({ aiProvider: newProvider }); }; const handleApiKeyChange = async (e) => { const newApiKey = e.target.value; setApiKey(newApiKey); await updateUserSettings({ apiKey: newApiKey }); }; const updateUserSettings = async (settings) => { const response = await fetch("/updateSettings", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(settings), }); const data = await response.json(); if (data.success) { fetchUserData(); } else { alert("Failed to update settings. Please try again."); } }; return (

Webs R AI: AI Content Generator

{user && (

Welcome, {user.name}!

Subscription: {SUBSCRIPTION_TIERS[user.tier].name}

Content Generated: {user.contentGenerated} / {SUBSCRIPTION_TIERS[user.tier].contentLimit}

)}

Topic: setTopic(e.target.value)} required className="w-full p-2 border rounded" />

Format:

AI Provider:

API Key:

{generatedContent && (

Generated Content:

{generatedContent}

)}

Upgrade Your Plan

{Object.entries(SUBSCRIPTION_TIERS).map(([tier, details]) => ( ))}

Premium Services

{adContent && (

Sponsored Content

{adContent}

)}

Facebook Twitter Email 💸 Donate

View Source

); } function client() { createRoot(document.getElementById("root")).render(); } if (typeof document !== "undefined") { client(); } export default async function server(request: Request): Promise { const { sqlite } = await import("https://esm.town/v/stevekrouse/sqlite"); const { OpenAI } = await import("https://esm.town/v/std/openai"); const openai = new OpenAI(); const SCHEMA_VERSION = 2; const KEY = new URL(import.meta.url).pathname.split("/").at(-1); // Initialize database await sqlite.execute(` CREATE TABLE IF NOT EXISTS ${KEY}_users_${SCHEMA_VERSION} ( id INTEGER PRIMARY KEY AUTOINCREMENT, name TEXT NOT NULL, tier TEXT NOT NULL, contentGenerated INTEGER NOT NULL, aiProvider TEXT, apiKey TEXT ) `); // Helper function to get or create user async function getOrCreateUser() { let user = (await sqlite.execute(`SELECT * FROM ${KEY}_users_${SCHEMA_VERSION} LIMIT 1`)).rows[0]; if (!user) { await sqlite.execute(` INSERT INTO ${KEY}_users_${SCHEMA_VERSION} (name, tier, contentGenerated, aiProvider, apiKey) VALUES (?, ?, ?, ?, ?) `, ["Demo User", "FREE", 0, "OpenAI", ""]); user = (await sqlite.execute(`SELECT * FROM ${KEY}_users_${SCHEMA_VERSION} LIMIT 1`)).rows[0]; } return user; } // Handle different routes if (request.method === "GET") { const url = new URL(request.url); // User data route if (url.pathname === "/user") { const user = await getOrCreateUser(); return new Response(JSON.stringify(user), { headers: { "Content-Type": "application/json" } }); } // Ad content route (placeholder) if (url.pathname === "/ad") { return new Response(JSON.stringify({ content: "Upgrade to Pro for unlimited AI-powered content generation!" }), { headers: { "Content-Type": "application/json" } }); } } // POST routes if (request.method === "POST") { const url = new URL(request.url); // Content generation route if (url.pathname === "/generate") { try { const { topic, format, provider, apiKey } = await request.json(); // Get current user const user = await getOrCreateUser(); // Check content generation limit if (user.contentGenerated >= SUBSCRIPTION_TIERS[user.tier].contentLimit) { return new Response(JSON.stringify({ error: "Content generation limit reached. Please upgrade your plan." }), { headers: { "Content-Type": "application/json" } }); } // Generate content using OpenAI const completion = await openai.chat.completions.create({ messages: [ { role: "system", content: `Generate a ${format} about ${topic}. Provide a professional and engaging piece of content.` } ], model: "gpt-4o-mini", max_tokens: 500 }); // Update user's content generation count await sqlite.execute(` UPDATE ${KEY}_users_${SCHEMA_VERSION} SET contentGenerated = contentGenerated + 1 WHERE id = ? `, [user.id]); return new Response(JSON.stringify({ content: completion.choices[0].message.content }), { headers: { "Content-Type": "application/json" } }); } catch (error) { return new Response(JSON.stringify({ error: "Failed to generate content: " + error.message }), { status: 500, headers: { "Content-Type": "application/json" } }); } } // Upgrade subscription route if (url.pathname === "/upgrade") { try { const { tier } = await request.json(); const user = await getOrCreateUser(); await sqlite.execute(` UPDATE ${KEY}_users_${SCHEMA_VERSION} SET tier = ? WHERE id = ? `, [tier, user.id]); return new Response(JSON.stringify({ success: true }), { headers: { "Content-Type": "application/json" } }); } catch (error) { return new Response(JSON.stringify({ success: false, error: error.message }), { status: 500, headers: { "Content-Type": "application/json" } }); } } // Update user settings route if (url.pathname === "/updateSettings") { try { const settings = await request.json(); const user = await getOrCreateUser(); const updateFields = []; const updateValues = []; if (settings.aiProvider) { updateFields.push("aiProvider = ?"); updateValues.push(settings.aiProvider); } if (settings.apiKey) { updateFields.push("apiKey = ?"); updateValues.push(settings.apiKey); } if (updateFields.length > 0) { updateValues.push(user.id); await sqlite.execute(` UPDATE ${KEY}_users_${SCHEMA_VERSION} SET ${updateFields.join(", ")} WHERE id = ? `, updateValues); } return new Response(JSON.stringify({ success: true }), { headers: { "Content-Type": "application/json" } }); } catch (error) { return new Response(JSON.stringify({ success: false, error: error.message }), { status: 500, headers: { "Content-Type": "application/json" } }); } } } // Serve HTML return new Response(` Webs R AI: AI Content Generator

`, { headers: { "Content-Type": "text/html" } }); }

seoKeywordResearchTool

Version 2