feature: dashboard settings and invite activation flow consistency fixed. frontend warnings fixed
This commit is contained in:
@@ -5,7 +5,7 @@ import Link from 'next/link';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useAuth } from '@/lib/hooks/useAuth';
|
||||
import { authApi } from '@/lib/api/auth';
|
||||
import type { SubscriptionAlertData } from '@/types';
|
||||
import type { SubscriptionAlertData } from '@/types/subscription';
|
||||
|
||||
export default function SubscriptionsSettingsPage() {
|
||||
const { currentOrganization } = useAuth();
|
||||
@@ -39,9 +39,24 @@ export default function SubscriptionsSettingsPage() {
|
||||
|
||||
const plan = currentOrganization.plan;
|
||||
const maxUsers = plan?.maxUsers;
|
||||
const isUnlimited = typeof maxUsers === 'number' && maxUsers >= 999999;
|
||||
const seatsUsed = alert?.seatsUsed;
|
||||
const seatsRemaining =
|
||||
typeof seatsUsed === 'number' && typeof maxUsers === 'number' && !isUnlimited
|
||||
? Math.max(0, maxUsers - seatsUsed)
|
||||
: null;
|
||||
const daysUntilPlanEnd = alert?.daysUntilPlanEnd ?? null;
|
||||
const planDayTone =
|
||||
daysUntilPlanEnd == null
|
||||
? 'text-text-primary'
|
||||
: daysUntilPlanEnd > 20
|
||||
? 'text-emerald-400'
|
||||
: daysUntilPlanEnd >= 10
|
||||
? 'text-amber-300'
|
||||
: 'text-red-400';
|
||||
|
||||
return (
|
||||
<div className="max-w-xl space-y-6">
|
||||
<div className="max-w-4xl space-y-6">
|
||||
<div>
|
||||
<Link
|
||||
href="/today"
|
||||
@@ -59,21 +74,38 @@ export default function SubscriptionsSettingsPage() {
|
||||
</div>
|
||||
|
||||
<div className="surface-card p-6 space-y-4">
|
||||
<div className="flex flex-wrap gap-4 justify-between">
|
||||
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-5">
|
||||
<div>
|
||||
<p className="text-xs text-text-muted uppercase tracking-wide">Current plan</p>
|
||||
<p className="text-lg font-medium text-text-primary capitalize">
|
||||
{plan?.name ?? '—'}
|
||||
</p>
|
||||
</div>
|
||||
{typeof maxUsers === 'number' && maxUsers < 999999 && (
|
||||
<div>
|
||||
<p className="text-xs text-text-muted uppercase tracking-wide">Seats (this org)</p>
|
||||
<p className="text-lg font-medium text-text-primary">
|
||||
{alert?.seatsUsed ?? '—'} / {maxUsers}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
<div>
|
||||
<p className="text-xs text-text-muted uppercase tracking-wide">Plan price</p>
|
||||
<p className="text-lg font-medium text-text-primary">
|
||||
{typeof plan?.price === 'number' ? `$${plan.price}` : '—'}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-xs text-text-muted uppercase tracking-wide">Seats used</p>
|
||||
<p className="text-lg font-medium text-text-primary">
|
||||
{typeof seatsUsed === 'number' ? seatsUsed : '—'}
|
||||
{typeof maxUsers === 'number' ? ` / ${isUnlimited ? 'Unlimited' : maxUsers}` : ''}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-xs text-text-muted uppercase tracking-wide">Seats remaining</p>
|
||||
<p className="text-lg font-medium text-text-primary">
|
||||
{isUnlimited ? 'Unlimited' : seatsRemaining ?? '—'}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-xs text-text-muted uppercase tracking-wide">Days remaining</p>
|
||||
<p className={`text-lg font-medium ${planDayTone}`}>
|
||||
{daysUntilPlanEnd ?? '—'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{alert?.showWarning && (
|
||||
|
||||
Reference in New Issue
Block a user