update
This commit is contained in:
parent
fd592a5a2e
commit
d5510aae14
|
|
@ -8,10 +8,10 @@ export interface PlanLimits {
|
||||||
|
|
||||||
const PLANS: Record<Plan, PlanLimits> = {
|
const PLANS: Record<Plan, PlanLimits> = {
|
||||||
free: { maxMonitors: 10, minIntervalS: 30, maxRegions: 1 },
|
free: { maxMonitors: 10, minIntervalS: 30, maxRegions: 1 },
|
||||||
pro: { maxMonitors: 200, minIntervalS: 5, maxRegions: 99 },
|
pro: { maxMonitors: 200, minIntervalS: 10, maxRegions: 99 },
|
||||||
pro2x: { maxMonitors: 400, minIntervalS: 2, maxRegions: 99 },
|
pro2x: { maxMonitors: 400, minIntervalS: 5, maxRegions: 99 },
|
||||||
pro4x: { maxMonitors: 800, minIntervalS: 1, maxRegions: 99 },
|
pro4x: { maxMonitors: 800, minIntervalS: 2, maxRegions: 99 },
|
||||||
lifetime: { maxMonitors: 200, minIntervalS: 5, maxRegions: 99 },
|
lifetime: { maxMonitors: 200, minIntervalS: 10, maxRegions: 99 },
|
||||||
};
|
};
|
||||||
|
|
||||||
export function getPlanLimits(plan: string): PlanLimits {
|
export function getPlanLimits(plan: string): PlanLimits {
|
||||||
|
|
@ -24,9 +24,9 @@ export const PLAN_LABELS: Record<string, string> = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export const PRO_MULTIPLIERS = [
|
export const PRO_MULTIPLIERS = [
|
||||||
{ plan: "pro", label: "1x", monitors: 200, interval: "5s", priceMultiplier: 1 },
|
{ plan: "pro", label: "1x", monitors: 200, interval: "10s", priceMultiplier: 1 },
|
||||||
{ plan: "pro2x", label: "2x", monitors: 400, interval: "2s", priceMultiplier: 2 },
|
{ plan: "pro2x", label: "2x", monitors: 400, interval: "5s", priceMultiplier: 2 },
|
||||||
{ plan: "pro4x", label: "4x", monitors: 800, interval: "1s", priceMultiplier: 4 },
|
{ plan: "pro4x", label: "4x", monitors: 800, interval: "2s", priceMultiplier: 4 },
|
||||||
];
|
];
|
||||||
|
|
||||||
export const PRO_MONTHLY_USD = 12;
|
export const PRO_MONTHLY_USD = 12;
|
||||||
|
|
|
||||||
|
|
@ -41,7 +41,7 @@
|
||||||
class="cursor-pointer text-left bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-xl p-5 transition-colors">
|
class="cursor-pointer text-left bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-xl p-5 transition-colors">
|
||||||
<div class="text-xs text-gray-500 uppercase tracking-wider font-mono mb-1">Pro</div>
|
<div class="text-xs text-gray-500 uppercase tracking-wider font-mono mb-1">Pro</div>
|
||||||
<div class="text-2xl font-bold text-gray-100">From $12<span class="text-sm font-normal text-gray-500">/mo</span></div>
|
<div class="text-2xl font-bold text-gray-100">From $12<span class="text-sm font-normal text-gray-500">/mo</span></div>
|
||||||
<div class="text-xs text-gray-500 mt-2">200–800 monitors, 5s–1s intervals</div>
|
<div class="text-xs text-gray-500 mt-2">200–800 monitors, 10s–2s intervals</div>
|
||||||
</label>
|
</label>
|
||||||
<label for="plan-lifetime"
|
<label for="plan-lifetime"
|
||||||
class="cursor-pointer text-left bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-xl p-5 transition-colors relative">
|
class="cursor-pointer text-left bg-surface border-2 border-border-subtle hover:border-yellow-500/40 rounded-xl p-5 transition-colors relative">
|
||||||
|
|
@ -61,17 +61,17 @@
|
||||||
<input type="radio" name="plan" value="pro" id="tier-1x" class="hidden tier-radio" checked>
|
<input type="radio" name="plan" value="pro" id="tier-1x" class="hidden tier-radio" checked>
|
||||||
<label for="tier-1x" class="cursor-pointer text-center bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-lg py-2.5 transition-colors">
|
<label for="tier-1x" class="cursor-pointer text-center bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-lg py-2.5 transition-colors">
|
||||||
<div class="text-sm font-semibold text-gray-200">1x</div>
|
<div class="text-sm font-semibold text-gray-200">1x</div>
|
||||||
<div class="text-xs text-gray-500">200 monitors · 5s · $12/mo</div>
|
<div class="text-xs text-gray-500">200 monitors · 10s · $12/mo</div>
|
||||||
</label>
|
</label>
|
||||||
<input type="radio" name="plan" value="pro2x" id="tier-2x" class="hidden tier-radio">
|
<input type="radio" name="plan" value="pro2x" id="tier-2x" class="hidden tier-radio">
|
||||||
<label for="tier-2x" class="cursor-pointer text-center bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-lg py-2.5 transition-colors">
|
<label for="tier-2x" class="cursor-pointer text-center bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-lg py-2.5 transition-colors">
|
||||||
<div class="text-sm font-semibold text-gray-200">2x</div>
|
<div class="text-sm font-semibold text-gray-200">2x</div>
|
||||||
<div class="text-xs text-gray-500">400 monitors · 2s · $24/mo</div>
|
<div class="text-xs text-gray-500">400 monitors · 5s · $24/mo</div>
|
||||||
</label>
|
</label>
|
||||||
<input type="radio" name="plan" value="pro4x" id="tier-4x" class="hidden tier-radio">
|
<input type="radio" name="plan" value="pro4x" id="tier-4x" class="hidden tier-radio">
|
||||||
<label for="tier-4x" class="cursor-pointer text-center bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-lg py-2.5 transition-colors">
|
<label for="tier-4x" class="cursor-pointer text-center bg-surface border-2 border-border-subtle hover:border-blue-500/40 rounded-lg py-2.5 transition-colors">
|
||||||
<div class="text-sm font-semibold text-gray-200">4x</div>
|
<div class="text-sm font-semibold text-gray-200">4x</div>
|
||||||
<div class="text-xs text-gray-500">800 monitors · 1s · $48/mo</div>
|
<div class="text-xs text-gray-500">800 monitors · 2s · $48/mo</div>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -520,7 +520,7 @@
|
||||||
</li>
|
</li>
|
||||||
<li class="flex items-center gap-2">
|
<li class="flex items-center gap-2">
|
||||||
<svg class="w-4 h-4 text-blue-400 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7"/></svg>
|
<svg class="w-4 h-4 text-blue-400 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7"/></svg>
|
||||||
5s–1s check interval
|
10s–2s check interval
|
||||||
</li>
|
</li>
|
||||||
<li class="flex items-center gap-2">
|
<li class="flex items-center gap-2">
|
||||||
<svg class="w-4 h-4 text-blue-400 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7"/></svg>
|
<svg class="w-4 h-4 text-blue-400 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7"/></svg>
|
||||||
|
|
|
||||||
|
|
@ -5,11 +5,11 @@
|
||||||
const bg = it._form?.bg || 'bg-gray-900';
|
const bg = it._form?.bg || 'bg-gray-900';
|
||||||
const border = it._form?.border || 'border-gray-800';
|
const border = it._form?.border || 'border-gray-800';
|
||||||
const plan = it.plan || 'free';
|
const plan = it.plan || 'free';
|
||||||
const minInterval = { free: 30, pro: 5, pro2x: 2, pro4x: 1, lifetime: 5 }[plan] || 30;
|
const minInterval = { free: 30, pro: 10, pro2x: 5, pro4x: 2, lifetime: 10 }[plan] || 30;
|
||||||
const btnText = isEdit ? 'Save Changes' : 'Create Monitor';
|
const btnText = isEdit ? 'Save Changes' : 'Create Monitor';
|
||||||
const formId = prefix + 'form';
|
const formId = prefix + 'form';
|
||||||
const methods = ['GET','POST','PUT','PATCH','DELETE','HEAD','OPTIONS'];
|
const methods = ['GET','POST','PUT','PATCH','DELETE','HEAD','OPTIONS'];
|
||||||
const allIntervals = [['1','1 second'],['2','2 seconds'],['5','5 seconds'],['10','10 seconds'],['20','20 seconds'],['30','30 seconds'],['60','1 minute'],['300','5 minutes'],['600','10 minutes'],['1800','30 minutes'],['3600','1 hour']];
|
const allIntervals = [['2','2 seconds'],['5','5 seconds'],['10','10 seconds'],['20','20 seconds'],['30','30 seconds'],['60','1 minute'],['300','5 minutes'],['600','10 minutes'],['1800','30 minutes'],['3600','1 hour']];
|
||||||
const intervals = allIntervals.filter(([val]) => Number(val) >= minInterval);
|
const intervals = allIntervals.filter(([val]) => Number(val) >= minInterval);
|
||||||
const timeouts = [['5000','5 seconds'],['10000','10 seconds'],['20000','20 seconds'],['30000','30 seconds'],['40000','40 seconds'],['50000','50 seconds'],['60000','60 seconds']];
|
const timeouts = [['5000','5 seconds'],['10000','10 seconds'],['20000','20 seconds'],['30000','30 seconds'],['40000','40 seconds'],['50000','50 seconds'],['60000','60 seconds']];
|
||||||
const regions = [['eu-central','EU Central'],['us-west','US West']];
|
const regions = [['eu-central','EU Central'],['us-west','US West']];
|
||||||
|
|
|
||||||
|
|
@ -8,10 +8,10 @@
|
||||||
const planLabel = { free: 'Free', pro: 'Pro', pro2x: 'Pro 2x', pro4x: 'Pro 4x', lifetime: 'Lifetime' }[plan] || plan;
|
const planLabel = { free: 'Free', pro: 'Pro', pro2x: 'Pro 2x', pro4x: 'Pro 4x', lifetime: 'Lifetime' }[plan] || plan;
|
||||||
const limits = {
|
const limits = {
|
||||||
free: { monitors: 10, interval: '30s', regions: 1 },
|
free: { monitors: 10, interval: '30s', regions: 1 },
|
||||||
pro: { monitors: 200, interval: '5s', regions: 'All' },
|
pro: { monitors: 200, interval: '10s', regions: 'All' },
|
||||||
pro2x: { monitors: 400, interval: '2s', regions: 'All' },
|
pro2x: { monitors: 400, interval: '5s', regions: 'All' },
|
||||||
pro4x: { monitors: 800, interval: '1s', regions: 'All' },
|
pro4x: { monitors: 800, interval: '2s', regions: 'All' },
|
||||||
lifetime: { monitors: 200, interval: '5s', regions: 'All' },
|
lifetime: { monitors: 200, interval: '10s', regions: 'All' },
|
||||||
}[plan] || { monitors: 10, interval: '30s', regions: 1 };
|
}[plan] || { monitors: 10, interval: '30s', regions: 1 };
|
||||||
%>
|
%>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue