sitesmith: upgrade banner + scope-replace confirmation dialog

2026-05-23 14:24:20 -07:00
parent bf55ee85b9
commit b4d71340e1
2 changed files with 71 additions and 0 deletions
@@ -0,0 +1,35 @@
+import React from 'react';
+import { SitesmithSummary } from '../../types/sitesmith';
+
+interface Props { summary: SitesmithSummary | null; }
+
+export const UpgradeBanner: React.FC<Props> = ({ summary }) => {
+  if (!summary) return null;
+  if (summary.status === 'OK_BONUS' || summary.status === 'OK_MONTHLY') return null;
+  const isLocked = summary.status === 'DISABLED';
+  const isCapped = summary.status === 'CAP_REACHED';
+  return (
+    <div role="status" style={{
+      background: isLocked ? '#3b1d4d' : '#3b2d1d',
+      border: `1px solid ${isLocked ? '#7c3aed' : '#b45309'}`,
+      color: '#fbcfe8', padding: '14px 18px', borderRadius: 8, marginBottom: 14,
+    }}>
+      {isLocked && (<>
+        <div style={{ fontWeight: 600, marginBottom: 6 }}>Sitesmith is a paid addon</div>
+        <div style={{ fontSize: 13, marginBottom: 10 }}>
+          Describe the site you want and our AI builds it. You can edit everything afterward.
+        </div>
+        <a href="https://anhonesthost.com/clientarea.php?action=services" target="_blank" rel="noopener noreferrer"
+           style={{ color: '#fff', background: '#7c3aed', padding: '8px 14px', borderRadius: 6, textDecoration: 'none' }}>
+          Upgrade your plan →
+        </a>
+      </>)}
+      {isCapped && (<>
+        <div style={{ fontWeight: 600, marginBottom: 6 }}>Monthly cap reached</div>
+        <div style={{ fontSize: 13 }}>
+          You've used {summary.monthly_used} of {summary.monthly_cap} Sitesmith builds this month. Resets on {summary.resets_on}.
+        </div>
+      </>)}
+    </div>
+  );
+};