57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
"use client"
|
|
|
|
import { useState } from "react"
|
|
|
|
// Importing necessary components
|
|
import { SettingsArea } from "@/components/Exporter/SettingsArea"
|
|
import { UploadArea } from "@/components/Exporter/UploadArea"
|
|
import { PreviewArea } from "@/components/Exporter/PreviewArea"
|
|
|
|
import { Footer } from "@/components/Footer/Footer"
|
|
|
|
export default function Home() {
|
|
const [hasContent, setHasContent] = useState(false)
|
|
const [isExporting, setIsExporting] = useState(false)
|
|
|
|
const handleExport = () => {
|
|
setIsExporting(true)
|
|
setTimeout(() => setIsExporting(false), 2000)
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-col min-h-screen">
|
|
<main className="flex-1 py-10 px-4 md:px-6">
|
|
<div className="w-full max-w-7xl mx-auto space-y-8">
|
|
|
|
{/* Header Area (Optional) */}
|
|
<div>
|
|
<h1 className="text-2xl font-bold tracking-tight">Web Exporter</h1>
|
|
<p className="text-zinc-500 dark:text-zinc-400">
|
|
Convert your web assets to PDF, PNG, or JSON.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
|
|
{/* Left Column: Settings */}
|
|
<div className="md:col-span-1">
|
|
<SettingsArea
|
|
onExport={handleExport}
|
|
isExporting={isExporting}
|
|
/>
|
|
</div>
|
|
|
|
{/* Right Column: Dynamic Content */}
|
|
<div className="md:col-span-2 gap-y-6 flex flex-col">
|
|
<UploadArea />
|
|
<PreviewArea />
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<Footer />
|
|
</div>
|
|
)
|
|
} |