refactor: drop toast + over-engineered extras, add inline admin feedback
CI / quality (push) Waiting to run
CI / quality (push) Waiting to run
Phase 1 cleanup of the personal-site revamp. Backend/architecture untouched; changes are limited to removing unused complexity and restoring feedback. Removals - Toast system: delete react-hot-toast, Toaster, QueryToastBridge, lib/toast, the toggle/easter-egg calls, related i18n keys and the dependency. - Contact protection: remove Turnstile + per-IP rate limiting (lib/contact-guard, lib/contact-protection, admin screen, form widget, app-config wiring, nav entry, test). - Speculative specs: delete orders, products, downloads, project-inquiry. Inline feedback (replaces toast, no new deps) - Add lib/admin-feedback (withFlash/readFlash) and components/admin/admin-flash, rendered centrally by AdminDashboardShell. - Emit success/error messages for media, site-settings, portfolio, smtp, marquee and maintenance actions; pages read them via searchParams. - Contact form shows validation/delivery errors inline; success still redirects to /success. Docs - Fix stale paths in frontend-system-* (components/root -> components/admin, lib/root-navigation -> lib/admin-navigation, drop phantom src/) and remove contact-protection references from docs and CLAUDE.md. - Add docs/PHASE0_DIAGNOSIS.md (diagnosis report). Note: proxy.ts self-fetch kept intentionally; it also drives maintenance mode.
This commit is contained in:
@@ -2,12 +2,10 @@
|
||||
|
||||
import Link from "next/link";
|
||||
|
||||
import { ContactTurnstile } from "@/components/site/contact-turnstile";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import type { PublicContactProtectionSettings } from "@/lib/contact-protection";
|
||||
|
||||
type ContactFormCopy = {
|
||||
name: string;
|
||||
@@ -25,7 +23,6 @@ type ContactFormProps = {
|
||||
locale: string;
|
||||
previewHref: string;
|
||||
copy: ContactFormCopy;
|
||||
protection: PublicContactProtectionSettings;
|
||||
};
|
||||
|
||||
export function ContactForm({
|
||||
@@ -33,7 +30,6 @@ export function ContactForm({
|
||||
locale,
|
||||
previewHref,
|
||||
copy,
|
||||
protection,
|
||||
}: ContactFormProps) {
|
||||
return (
|
||||
<form action={action} className="grid gap-5">
|
||||
@@ -68,10 +64,6 @@ export function ContactForm({
|
||||
|
||||
<p className="text-sm text-muted-foreground">{copy.note}</p>
|
||||
|
||||
{protection.turnstile.enabled ? (
|
||||
<ContactTurnstile siteKey={protection.turnstile.siteKey} />
|
||||
) : null}
|
||||
|
||||
<div className="flex flex-wrap gap-3">
|
||||
<Button type="submit">{copy.submit}</Button>
|
||||
<Button asChild variant="outline">
|
||||
|
||||
@@ -1,107 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useId, useRef, useState } from "react";
|
||||
|
||||
declare global {
|
||||
interface Window {
|
||||
turnstile?: {
|
||||
render: (
|
||||
container: HTMLElement,
|
||||
options: {
|
||||
sitekey: string;
|
||||
callback?: (token: string) => void;
|
||||
"expired-callback"?: () => void;
|
||||
"error-callback"?: () => void;
|
||||
},
|
||||
) => string;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
type ContactTurnstileProps = {
|
||||
siteKey: string;
|
||||
};
|
||||
|
||||
export function ContactTurnstile({ siteKey }: ContactTurnstileProps) {
|
||||
const containerRef = useRef<HTMLDivElement | null>(null);
|
||||
const [token, setToken] = useState("");
|
||||
const [error, setError] = useState("");
|
||||
const widgetId = useId();
|
||||
|
||||
useEffect(() => {
|
||||
if (!siteKey || !containerRef.current) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
let cancelled = false;
|
||||
|
||||
function renderWidget() {
|
||||
if (cancelled || !containerRef.current || !window.turnstile) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (containerRef.current.dataset.widgetMounted === widgetId) {
|
||||
return;
|
||||
}
|
||||
|
||||
containerRef.current.innerHTML = "";
|
||||
window.turnstile.render(containerRef.current, {
|
||||
sitekey: siteKey,
|
||||
callback: (nextToken) => {
|
||||
setToken(nextToken);
|
||||
setError("");
|
||||
},
|
||||
"expired-callback": () => {
|
||||
setToken("");
|
||||
setError("Verification expired. Please try again.");
|
||||
},
|
||||
"error-callback": () => {
|
||||
setToken("");
|
||||
setError("Verification could not be completed.");
|
||||
},
|
||||
});
|
||||
containerRef.current.dataset.widgetMounted = widgetId;
|
||||
}
|
||||
|
||||
function ensureScript() {
|
||||
const existingScript = document.querySelector<HTMLScriptElement>(
|
||||
'script[src="https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit"]',
|
||||
);
|
||||
|
||||
if (existingScript) {
|
||||
if (window.turnstile) {
|
||||
renderWidget();
|
||||
} else {
|
||||
existingScript.addEventListener("load", renderWidget, { once: true });
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
const script = document.createElement("script");
|
||||
script.src = "https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit";
|
||||
script.async = true;
|
||||
script.defer = true;
|
||||
script.addEventListener("load", renderWidget, { once: true });
|
||||
document.head.appendChild(script);
|
||||
}
|
||||
|
||||
ensureScript();
|
||||
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, [siteKey, widgetId]);
|
||||
|
||||
if (!siteKey) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-2">
|
||||
<div ref={containerRef} />
|
||||
<input type="hidden" name="turnstileToken" value={token} />
|
||||
{error ? <p className="text-xs text-destructive">{error}</p> : null}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user