feat(pagespeed): inline frequency selector in hero footer

Replace static frequency badge with a pill toggle (Daily/Weekly/Monthly)
matching the Mobile/Desktop tab style. Updates config via API on click.
Read-only badge shown for non-admin users.
This commit is contained in:
Usman Baig
2026-03-23 11:51:40 +01:00
parent 8d9a3f3592
commit a0ef570137

View File

@@ -471,7 +471,34 @@ export default function PageSpeedPage() {
</svg> </svg>
</button> </button>
)} )}
{config?.frequency && ( {/* Frequency selector */}
{canEdit && config && (
<div className="flex items-center gap-0.5 ml-1 bg-neutral-100 dark:bg-neutral-800 rounded-md p-0.5">
{(['daily', 'weekly', 'monthly'] as const).map(f => (
<button
key={f}
onClick={async () => {
if (f === config.frequency) return
try {
await updatePageSpeedConfig(siteId, { enabled: true, frequency: f })
mutateConfig()
toast.success(`Frequency updated to ${f}`)
} catch {
toast.error('Failed to update frequency')
}
}}
className={`px-2 py-0.5 text-[11px] font-medium rounded transition-colors ${
config.frequency === f
? 'bg-white dark:bg-neutral-700 text-neutral-900 dark:text-white shadow-sm'
: 'text-neutral-400 dark:text-neutral-500 hover:text-neutral-600 dark:hover:text-neutral-300'
}`}
>
{f.charAt(0).toUpperCase() + f.slice(1)}
</button>
))}
</div>
)}
{!canEdit && config?.frequency && (
<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-neutral-100 dark:bg-neutral-800 text-neutral-600 dark:text-neutral-400"> <span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-neutral-100 dark:bg-neutral-800 text-neutral-600 dark:text-neutral-400">
{config.frequency} {config.frequency}
</span> </span>