feat: implement subscription limit check in NewSitePage; update HomePage to conditionally display site addition link or upgrade prompt based on subscription status
This commit is contained in:
13
app/page.tsx
13
app/page.tsx
@@ -259,7 +259,18 @@ export default function HomePage() {
|
||||
<h1 className="text-2xl font-bold text-neutral-900 dark:text-white">Your Sites</h1>
|
||||
<p className="mt-1 text-sm text-neutral-500 dark:text-neutral-400">Manage your analytics sites and view insights.</p>
|
||||
</div>
|
||||
<Link href="/sites/new" className="btn-primary text-sm">Add New Site</Link>
|
||||
{subscription?.plan_id === 'solo' && sites.length >= 1 ? (
|
||||
<div className="flex items-center gap-3">
|
||||
<span className="text-sm font-medium text-neutral-500 dark:text-neutral-400 bg-neutral-100 dark:bg-neutral-800 px-3 py-1.5 rounded-lg border border-neutral-200 dark:border-neutral-700">
|
||||
Limit reached (1/1)
|
||||
</span>
|
||||
<Link href="/pricing" className="btn-primary text-sm bg-brand-orange hover:bg-brand-orange/90 border-transparent text-white shadow-lg shadow-brand-orange/20">
|
||||
Upgrade
|
||||
</Link>
|
||||
</div>
|
||||
) : (
|
||||
<Link href="/sites/new" className="btn-primary text-sm">Add New Site</Link>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* * Global Overview */}
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
'use client'
|
||||
|
||||
import { useState } from 'react'
|
||||
import { useState, useEffect } from 'react'
|
||||
import { useRouter } from 'next/navigation'
|
||||
import { createSite } from '@/lib/api/sites'
|
||||
import { createSite, listSites } from '@/lib/api/sites'
|
||||
import { getSubscription } from '@/lib/api/billing'
|
||||
import { toast } from '@ciphera-net/ui'
|
||||
import { Button, Input } from '@ciphera-net/ui'
|
||||
|
||||
@@ -14,6 +15,28 @@ export default function NewSitePage() {
|
||||
domain: '',
|
||||
})
|
||||
|
||||
// * Check for plan limits on mount
|
||||
useEffect(() => {
|
||||
const checkLimits = async () => {
|
||||
try {
|
||||
const [sites, subscription] = await Promise.all([
|
||||
listSites(),
|
||||
getSubscription()
|
||||
])
|
||||
|
||||
if (subscription?.plan_id === 'solo' && sites.length >= 1) {
|
||||
toast.error('Solo plan limit reached (1 site). Please upgrade to add more sites.')
|
||||
router.replace('/')
|
||||
}
|
||||
} catch (error) {
|
||||
// Ignore errors here, let the backend handle the hard check on submit
|
||||
console.error('Failed to check limits', error)
|
||||
}
|
||||
}
|
||||
|
||||
checkLimits()
|
||||
}, [router])
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
setLoading(true)
|
||||
|
||||
Reference in New Issue
Block a user