vynte-infra/plunk
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add additional banner and information about security metrics

Browse Source
This commit is contained in:
Dries Augustyns
2025-12-28 14:00:15 +01:00
parent 2ddfceca36
commit bc8611a662
2 changed files with 48 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/SecurityWarningBanner.tsx
+22 -10
View File
@@ -8,28 +8,40 @@ interface SecurityWarningBannerProps {
}
export function SecurityWarningBanner({status}: SecurityWarningBannerProps) {
// Don't show if no warnings or already disabled
if (status.warnings.length === 0 || status.shouldDisable) {
// Don't show if no warnings or violations
const hasCriticalViolations = status.violations.length > 0;
const hasWarnings = status.warnings.length > 0;
if (!hasCriticalViolations && !hasWarnings) {
return null;
}
// Determine severity - critical violations take precedence
const variant = hasCriticalViolations ? 'destructive' : 'warning';
const title = hasCriticalViolations
? 'Critical Security Violations - Immediate Action Required'
: 'Security Warning - Action Required';
const issues = hasCriticalViolations ? status.violations : status.warnings;
const messageColor = hasCriticalViolations ? 'text-red-800' : 'text-amber-800';
return (
<Alert variant="warning">
<Alert variant={variant}>
<AlertTriangle className="h-4 w-4" />
<AlertTitle>Security Warning - Action Required</AlertTitle>
<AlertTitle>{title}</AlertTitle>
<AlertDescription className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-3">
<div className="space-y-2 flex-1">
<p className="text-sm font-medium">
Your project has exceeded the following security thresholds:
</p>
<ul className="list-disc list-inside space-y-1 text-sm text-amber-800">
{status.warnings.map((warning, idx) => (
<li key={idx}>{warning}</li>
<ul className={`list-disc list-inside space-y-1 text-sm ${messageColor}`}>
{issues.map((issue, idx) => (
<li key={idx}>{issue}</li>
))}
</ul>
<p className="text-xs text-amber-800 mt-2">
High bounce or complaint rates can lead to project suspension. Review the detailed metrics
and take action to improve your email quality.
<p className={`text-xs ${messageColor} mt-2`}>
{hasCriticalViolations
? 'Your project may be suspended soon. Please review the detailed metrics immediately and take action to improve your email quality.'
: 'High bounce or complaint rates can lead to project suspension. Review the detailed metrics and take action to improve your email quality.'}
</p>
</div>
<Link href="/settings?tab=security">
apps/web/src/pages/index.tsx
+26 -5
View File
@@ -86,11 +86,32 @@ export default function Index() {
<Alert variant="destructive">
<AlertCircle className="h-4 w-4" />
<AlertTitle>Project Disabled - Read-Only Mode</AlertTitle>
<AlertDescription>
This project has been disabled due to security violations (high bounce or complaint rates). All
scheduled campaigns and workflows have been cancelled. The project is now in read-only mode - you can
view your data but cannot create, update, or delete anything. Please contact support to resolve this
issue.
<AlertDescription className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-3">
<div className="space-y-2 flex-1">
<p className="text-sm font-medium">
This project has been disabled due to security violations. All scheduled campaigns and workflows
have been cancelled. The project is now in read-only mode - you can view your data but cannot
create, update, or delete anything.
</p>
{securityMetrics && securityMetrics.status.violations.length > 0 && (
<>
<p className="text-sm font-medium mt-3">Security violations that caused suspension:</p>
<ul className="list-disc list-inside space-y-1 text-sm text-red-800">
{securityMetrics.status.violations.map((violation, idx) => (
<li key={idx}>{violation}</li>
))}
</ul>
</>
)}
<p className="text-xs text-red-800 mt-2">
Please contact support to resolve this issue and get your project re-enabled.
</p>
</div>
<Link href="/settings?tab=security">
<Button size="sm" variant="outline" className="w-full sm:w-auto flex-shrink-0">
View Details
</Button>
</Link>
</AlertDescription>
</Alert>
)}