diff --git a/src/app/admin/embed/page.tsx b/src/app/admin/embed/page.tsx new file mode 100644 index 0000000..0b531e5 --- /dev/null +++ b/src/app/admin/embed/page.tsx @@ -0,0 +1,73 @@ + +'use client'; + +import React, { useState, useEffect } from 'react'; +import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card'; +import { Button } from '@/components/ui/button'; +import { Textarea } from '@/components/ui/textarea'; +import { useToast } from '@/hooks/use-toast'; +import { Copy } from 'lucide-react'; + +export default function EmbedPage() { + const [embedCode, setEmbedCode] = useState(''); + const [origin, setOrigin] = useState(''); + const { toast } = useToast(); + + useEffect(() => { + if (typeof window !== 'undefined') { + setOrigin(window.location.origin); + } + }, []); + + useEffect(() => { + if (origin) { + const code = ``; + setEmbedCode(code); + } + }, [origin]); + + const handleCopy = () => { + navigator.clipboard.writeText(embedCode); + toast({ + title: 'Copied!', + description: 'The embed code has been copied to your clipboard.', + }); + }; + + return ( +
+
+
+

Embed

+

+ Copy the code below to embed the estimator on your website. +

+
+
+ + + Embed Code + + Paste this HTML code into your website's source where you want the estimator to appear. + + + +