diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx new file mode 100644 index 0000000..c1ffff8 --- /dev/null +++ b/src/app/dashboard/page.tsx @@ -0,0 +1,190 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import { useState } from "react"; +import { BarChart3, TrendingUp, Clock, FileText } from "lucide-react"; + +export default function DashboardPage() { + const [stats] = useState({ + totalWords: 24580, + conversions: 156, + averageScore: 92.5, + timeActive: "45 days" + }); + + const [recentActivity] = useState([ + { id: 1, text: "Product launch announcement", tone: "Professional", words: 340, date: "Today", status: "Completed" }, + { id: 2, text: "Blog post introduction", tone: "Friendly", words: 520, date: "Yesterday", status: "Completed" }, + { id: 3, text: "Email marketing copy", tone: "Casual", words: 280, date: "2 days ago", status: "Completed" }, + { id: 4, text: "Technical documentation", tone: "Academic", words: 1240, date: "3 days ago", status: "Completed" }, + { id: 5, text: "Social media captions", tone: "Friendly", words: 180, date: "4 days ago", status: "Completed" } + ]); + + return ( + + + +
+
+ {/* Header */} +
+

Your Dashboard

+

+ Track your humanization progress and conversions +

+
+ + {/* Stats Grid */} +
+ {[ + { + icon: FileText, + label: "Total Words", value: stats.totalWords.toLocaleString(), + color: "bg-blue-100 dark:bg-blue-900", textColor: "text-blue-600 dark:text-blue-300" + }, + { + icon: TrendingUp, + label: "Conversions", value: stats.conversions, + color: "bg-green-100 dark:bg-green-900", textColor: "text-green-600 dark:text-green-300" + }, + { + icon: BarChart3, + label: "Avg. AI Score", value: `${stats.averageScore}%`, + color: "bg-purple-100 dark:bg-purple-900", textColor: "text-purple-600 dark:text-purple-300" + }, + { + icon: Clock, + label: "Account Age", value: stats.timeActive, + color: "bg-orange-100 dark:bg-orange-900", textColor: "text-orange-600 dark:text-orange-300" + } + ].map((stat, idx) => { + const Icon = stat.icon; + return ( +
+
+ +
+

+ {stat.label} +

+

+ {stat.value} +

+
+ ); + })} +
+ + {/* Recent Activity */} +
+
+

Recent Conversions

+
+
+ + + + + + + + + + + + {recentActivity.map((activity) => ( + + + + + + + + ))} + +
ContentToneWordsDateStatus
{activity.text} + + {activity.tone} + + {activity.words}{activity.date} + + {activity.status} + +
+
+
+ + {/* Usage Chart */} +
+ {/* Words Usage */} +
+

Monthly Usage

+
+ {[ + { month: "Jan", usage: 45, limit: 100 }, + { month: "Feb", usage: 62, limit: 100 }, + { month: "Mar", usage: 78, limit: 100 }, + { month: "Apr", usage: 92, limit: 100 } + ].map((month) => ( +
+
+ {month.month} + {month.usage}/{month.limit} +
+
+
+
+
+ ))} +
+
+ + {/* Plan Info */} +
+

Current Plan

+
+
+

Plan Type

+

Free Plan

+
+
+

Words Remaining

+

234 / 500

+
+ +
+
+
+
+
+ + ); +} diff --git a/src/app/features/page.tsx b/src/app/features/page.tsx new file mode 100644 index 0000000..36a084a --- /dev/null +++ b/src/app/features/page.tsx @@ -0,0 +1,73 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import ProductCardThree from "@/components/sections/product/ProductCardThree"; + +export default function FeaturesPage() { + return ( + + + +
+ +
+ + ); +} diff --git a/src/app/humanizer/page.tsx b/src/app/humanizer/page.tsx new file mode 100644 index 0000000..971705d --- /dev/null +++ b/src/app/humanizer/page.tsx @@ -0,0 +1,211 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple"; +import { useState } from "react"; +import { Copy, Download, RefreshCw, Zap } from "lucide-react"; + +export default function HumanizerPage() { + const [inputText, setInputText] = useState(""); + const [outputText, setOutputText] = useState(""); + const [tone, setTone] = useState("professional"); + const [isProcessing, setIsProcessing] = useState(false); + const [wordCount, setWordCount] = useState(0); + const [aiDetectionScore, setAiDetectionScore] = useState(0); + const [conversionHistory, setConversionHistory] = useState>([]); + + const handleInputChange = (e: React.ChangeEvent) => { + const text = e.target.value; + setInputText(text); + setWordCount(text.split(/\s+/).filter(word => word.length > 0).length); + }; + + const handleHumanize = async () => { + if (!inputText.trim()) return; + + setIsProcessing(true); + // Simulate processing + setTimeout(() => { + const humanized = `[${tone}] ${inputText.replace(/AI|artificial/gi, 'smart')}`; + setOutputText(humanized); + setAiDetectionScore(Math.random() * 30 + 5); // Simulated score + setConversionHistory(prev => [{ + input: inputText, + output: humanized, + tone, + timestamp: new Date() + }, ...prev.slice(0, 4)]); + setIsProcessing(false); + }, 1500); + }; + + const copyToClipboard = (text: string) => { + navigator.clipboard.writeText(text); + }; + + return ( + + + +
+
+ {/* Header */} +
+

AI Text Humanizer

+

+ Transform your AI-generated content into natural human-written text instantly +

+
+ + {/* Main Editor */} +
+ {/* Input Section */} +
+
+

AI-Generated Text

+ Words: {wordCount} +
+