feat: widget partner system with JS embed, isHidden toggle, category/neighborhood filters
This commit is contained in:
@@ -30,14 +30,21 @@ export default function WidgetPartnerForm({
|
||||
|
||||
const isEditing = !!partner
|
||||
|
||||
const [isHidden, setIsHidden] = useState(partner ? Boolean((partner as any).isHidden) : false)
|
||||
const [selectedNeighborhood, setSelectedNeighborhood] = useState(partner?.neighborhoodSlug || '')
|
||||
|
||||
const embedCode = partner
|
||||
? `<iframe
|
||||
src="https://marmarislocal.com/tr/widget${partner.neighborhoodSlug ? `?neighborhood=${partner.neighborhoodSlug}` : ''}"
|
||||
width="100%"
|
||||
height="600"
|
||||
style="border:none; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.1);"
|
||||
title="Marmaris Local Önerileri"
|
||||
></iframe>`
|
||||
? [
|
||||
'<!-- Marmaris Local Widget -->',
|
||||
'<div',
|
||||
' data-marmaris-widget',
|
||||
` data-neighborhood="${selectedNeighborhood}"`,
|
||||
' data-limit="3"',
|
||||
' data-lang="tr"',
|
||||
isHidden ? ' style="display:none;"' : '',
|
||||
'></div>',
|
||||
'<script src="https://marmarislocal.com/widget.js" async></script>'
|
||||
].filter(Boolean).join('\n')
|
||||
: ''
|
||||
|
||||
const handleCopy = () => {
|
||||
@@ -107,7 +114,7 @@ export default function WidgetPartnerForm({
|
||||
<p className="text-xs text-ink/70 mb-4">
|
||||
Aşağıdaki kodu kopyalayarak partnerin web sitesine yerleştirin. Bu kod, sitenizden backlink almayı sağlar.
|
||||
</p>
|
||||
<pre className="bg-stone-deep/80 text-paper p-4 rounded-xl text-xs overflow-x-auto font-mono whitespace-pre-wrap">
|
||||
<pre className="bg-pine text-white p-4 rounded-xl text-xs overflow-x-auto font-mono whitespace-pre-wrap">
|
||||
{embedCode}
|
||||
</pre>
|
||||
</div>
|
||||
@@ -155,7 +162,8 @@ export default function WidgetPartnerForm({
|
||||
<select
|
||||
id="neighborhoodSlug"
|
||||
name="neighborhoodSlug"
|
||||
defaultValue={partner?.neighborhoodSlug || ''}
|
||||
value={selectedNeighborhood}
|
||||
onChange={(e) => setSelectedNeighborhood(e.target.value)}
|
||||
className="w-full bg-stone/30 border border-pine/10 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:border-turquoise focus:ring-1 focus:ring-turquoise transition-all"
|
||||
>
|
||||
<option value="">Tüm Marmaris (Karışık)</option>
|
||||
@@ -166,7 +174,7 @@ export default function WidgetPartnerForm({
|
||||
<p className="text-[10px] text-shutter mt-1">Eğer seçilirse widget sadece o bölgedeki mekanları gösterir.</p>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col justify-center pt-6">
|
||||
<div className="flex flex-col justify-center pt-6 space-y-4">
|
||||
<label className="flex items-center gap-3 cursor-pointer group">
|
||||
<div className="relative">
|
||||
<input
|
||||
@@ -184,6 +192,25 @@ export default function WidgetPartnerForm({
|
||||
<span className="text-[10px] text-shutter">Bu widget yayında mı?</span>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<label className="flex items-center gap-3 cursor-pointer group">
|
||||
<div className="relative">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="isHidden"
|
||||
value="true"
|
||||
checked={isHidden}
|
||||
onChange={(e) => setIsHidden(e.target.checked)}
|
||||
className="peer sr-only"
|
||||
/>
|
||||
<div className="w-11 h-6 bg-stone-deep/20 rounded-full peer peer-checked:bg-pine transition-colors duration-300"></div>
|
||||
<div className="absolute top-1 left-1 bg-white w-4 h-4 rounded-full transition-transform duration-300 peer-checked:translate-x-5 shadow-sm"></div>
|
||||
</div>
|
||||
<div>
|
||||
<span className="text-sm font-bold text-pine block group-hover:text-pine/80 transition-colors">Gizli Widget</span>
|
||||
<span className="text-[10px] text-shutter">Indexlensin ama görünmesin</span>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user