screenshot-to-code/frontend/src/App.tsx
2023-11-14 13:33:06 -05:00

31 lines
746 B
TypeScript

import { useState } from "react";
import ImageUpload from "./components/ImageUpload";
import CodePreview from "./components/CodePreview";
function App() {
const [referenceImages, setReferenceImages] = useState<string[]>([]);
return (
<div className="mx-auto mt-10 max-w-2xl">
<h1 className="text-2xl mb-4">Drag & Drop a Screenshot</h1>
{referenceImages.length > 0 && (
<img
className="w-[300px]"
src={referenceImages[0].data}
alt="Reference"
/>
)}
<CodePreview content="Hello World" />
{referenceImages.length === 0 && (
<>
<ImageUpload setReferenceImages={setReferenceImages} />
</>
)}
</div>
);
}
export default App;