@@ -52,7 +21,7 @@ export default function Home() {
Version control, collaboration tools, and analytics in one professional platform.
-
)
-}
+}
\ No newline at end of file
diff --git a/src/app/studio/page.tsx b/src/app/studio/page.tsx
new file mode 100644
index 0000000..2f38160
--- /dev/null
+++ b/src/app/studio/page.tsx
@@ -0,0 +1,324 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+import { useAuth } from '@/hooks/useAuth'
+import { Header } from '@/components/layout/Header'
+import { Button } from '@/components/ui/button'
+import { Input } from '@/components/ui/input'
+import { Label } from '@/components/ui/label'
+import { Textarea } from '@/components/ui/textarea'
+import { LoadingSpinner } from '@/components/ui/loading-spinner'
+import {
+ Play,
+ Save,
+ Copy,
+ Settings,
+ FileText,
+ Folder,
+ Plus,
+ Search,
+ Filter,
+ MoreHorizontal,
+ Zap,
+ History
+} from 'lucide-react'
+
+export default function StudioPage() {
+ const { user, loading } = useAuth()
+ const [promptContent, setPromptContent] = useState('')
+ const [promptTitle, setPromptTitle] = useState('Untitled Prompt')
+ const [testResult, setTestResult] = useState('')
+ const [isRunning, setIsRunning] = useState(false)
+ const [isSaving, setIsSaving] = useState(false)
+
+ useEffect(() => {
+ // Redirect to sign in if not authenticated
+ if (!loading && !user) {
+ window.location.href = '/signin'
+ }
+ }, [user, loading])
+
+ if (loading) {
+ return (
+
+ )
+ }
+
+ if (!user) {
+ return (
+
+
+
Authentication Required
+
Please sign in to access the Prompt Studio
+
+
+
+ )
+ }
+
+ const handleRunPrompt = async () => {
+ if (!promptContent.trim()) return
+
+ setIsRunning(true)
+ setTestResult('')
+
+ try {
+ // Simulate API call for now
+ await new Promise(resolve => setTimeout(resolve, 2000))
+
+ // Mock response
+ setTestResult(`Test result for: "${promptContent.substring(0, 50)}${promptContent.length > 50 ? '...' : ''}"\n\nThis is a simulated response from the AI model. In a real implementation, this would be the actual output from your chosen AI provider (OpenAI, Anthropic, etc.).\n\nResponse quality: Good\nToken usage: 150 tokens\nLatency: 1.2s`)
+ } catch (error) {
+ setTestResult('Error: Failed to run prompt. Please try again.')
+ } finally {
+ setIsRunning(false)
+ }
+ }
+
+ const handleSavePrompt = async () => {
+ setIsSaving(true)
+
+ try {
+ // Simulate save operation
+ await new Promise(resolve => setTimeout(resolve, 1000))
+
+ // In real implementation, save to database via API
+ console.log('Saving prompt:', { title: promptTitle, content: promptContent })
+
+ // Show success feedback (you could add a toast notification here)
+ } catch (error) {
+ console.error('Failed to save prompt:', error)
+ } finally {
+ setIsSaving(false)
+ }
+ }
+
+ const copyToClipboard = (text: string) => {
+ navigator.clipboard.writeText(text)
+ // You could add a toast notification here
+ }
+
+ return (
+
+
+
+
+ {/* Sidebar */}
+
+
+
Prompt Studio
+
+
+
+ {/* Search */}
+
+
+
+
+
+ {/* Filters */}
+
+
+
+
+
+ {/* Prompt List */}
+
+
+
Welcome Message Generator
+
Generate personalized welcome messages...
+
+ 2 hours ago
+ v1.2
+
+
+
+
+
Code Review Assistant
+
Help review code and suggest improvements...
+
+ 1 day ago
+ v2.1
+
+
+
+
+
Email Marketing Copy
+
Create compelling email subject lines...
+
+ 3 days ago
+ v1.0
+
+
+
+
+
+ {/* Main Content */}
+
+ {/* Toolbar */}
+
+
+ setPromptTitle(e.target.value)}
+ className="text-lg font-semibold border-none p-0 h-auto bg-transparent focus-visible:ring-0"
+ placeholder="Prompt title..."
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* Editor */}
+
+ {/* Prompt Editor */}
+
+
+
+
+
+
+
+
+
+
+