fix: switch to Gemini AI, fix free-tier output, fix spinner state, upgrade prompts, multi-domain routing

app/[tool]/page.tsx

@@ -19,6 +19,7 @@ export default function ToolPage() {
   const [generating, setGenerating] = useState(false);
   const [paymentLoading, setPaymentLoading] = useState(false);
   const [email, setEmail] = useState('');
+  const [error, setError] = useState<string | null>(null);
 
   if (!tool) {
     return (
@@ -32,6 +33,7 @@ export default function ToolPage() {
     setGenerating(true);
     setPreview(null);
     setSessionId(null);
+    setError(null);
     try {
       const res = await fetch(`/api/${slug}/generate-draft`, {
         method: 'POST',
@@ -39,11 +41,19 @@ export default function ToolPage() {
         body: JSON.stringify({ input, email: email || undefined }),
       });
       const data = await res.json();
+      if (!res.ok) {
+        setError(data.error || `Server error: ${res.status}`);
+        return;
+      }
       setSessionId(data.session_id);
       setPreview(data.preview);
       setIsPaid(data.is_paid);
+      if (data.full_output) {
+        setFullOutput(data.full_output);
+      }
     } catch (e) {
       console.error('Generate failed:', e);
+      setError(e instanceof Error ? e.message : 'An unexpected error occurred. Please try again.');
     } finally {
       setGenerating(false);
     }
@@ -125,12 +135,18 @@ export default function ToolPage() {
 
         {/* Right: Output */}
         <div className="min-h-[400px]">
+          {error && (
+            <div className="mb-4 p-4 bg-red-50 border border-red-200 rounded-lg text-red-700 text-sm">
+              <strong>Error:</strong> {error}
+            </div>
+          )}
           <OutputPanel
             tool={slug}
             sessionId={sessionId}
             preview={preview}
             fullOutput={fullOutput}
             isPaid={isPaid}
+            generating={generating}
             onPaymentRequest={handlePayment}
             paymentLoading={paymentLoading}
           />

app/api/[tool]/generate-draft/route.ts

@@ -56,7 +56,16 @@ export async function POST(
 
     // Generate the draft
     const toolPrompts = prompts[tool];
-    const systemPrompt = 'You are a professional NGO grant writing assistant. Always respond with well-structured, professional content.';
+    const systemPrompt = `You are a seasoned international development consultant with 20+ years of experience designing and evaluating programmes for major donors including USAID, DFID/FCDO, the EU, UN agencies, the World Bank, and large private foundations. You have written and reviewed hundreds of successful grant applications, logframes, theories of change, and M&E frameworks across sub-Saharan Africa, South and Southeast Asia, the Middle East, and Latin America.
+
+Your writing is:
+- Precise, evidence-informed, and donor-ready
+- Grounded in current best practice (adaptive management, systems thinking, feminist M&E, localisation agendas)
+- Free of jargon and buzzwords unless they carry specific technical meaning
+- Structured clearly with logical hierarchy and consistent formatting
+- Calibrated to the specific sector, geography, and donor context provided
+
+Always produce outputs that a programme officer could submit with minimal revision. Favour concrete, measurable language over vague aspirations.`;
     const userPrompt = toolPrompts.master(input);
 
     const result = await generate(systemPrompt, userPrompt);