feat: widget partner system with JS embed, isHidden toggle, category/neighborhood filters

This commit is contained in:
AyrisAI
2026-07-13 15:00:46 +03:00
parent b44acc2678
commit 1d98409385
7 changed files with 177 additions and 298 deletions
@@ -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>