eric/gitlab-instance-0a899031_cnomadcna
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

's'

Browse Source
This commit is contained in:
eric
2026-03-12 05:40:38 -05:00
parent feddc85df3
commit 14bbd3b306
6 changed files with 190 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
app/components/HeroSection.tsx
View File

@@ -3,14 +3,7 @@
import { useState } from "react";
import { Link, useLocale } from "@/i18n/navigation";
import { useTranslation } from "@/i18n/navigation";
import {
getPayEnv,
getRecommendedChannel,
mustUseWxPay,
redirectToPay,
getDeviceFromEnv,
} from "@/app/lib/payment";
import type { PayChannel, PayEnv } from "@/app/lib/payment";
import JoinModal from "./JoinModal";
const MEDIA_NAMES_ZH = ["36氪", "少数派", "极客公园", "虎嗅", "创业邦", "澎湃新闻"];
const MEDIA_NAMES_EN = ["36Kr", "sspai", "GeekPark", "Huxiu", "Cyzone", "The Paper"];
@@ -38,54 +31,14 @@ const features = [
];
export default function HeroSection() {
const { t } = useTranslation("common");
const { t: tHero } = useTranslation("hero");
const locale = useLocale();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [loading, setLoading] = useState(false);
const [error, setError] = useState<string | null>(null);
const [joinModalOpen, setJoinModalOpen] = useState(false);
const handleJoin = async (e: React.FormEvent) => {
const handleJoinClick = (e: React.FormEvent) => {
e.preventDefault();
const em = email.trim();
if (!em) {
setError(locale === "zh" ? "请输入邮箱" : "Please enter your email");
return;
}
setError(null);
setLoading(true);
try {
const res = await fetch("/api/meetup/ensure-user", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ email: em, password: password || undefined }),
credentials: "include",
});
const data = await res.json();
if (!res.ok || !data?.ok) {
throw new Error(data?.error || (locale === "zh" ? "操作失败" : "Operation failed"));
}
await fetch("/api/auth/sync-session", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ token: data.token, record: data.record }),
});
const returnUrl = typeof window !== "undefined" ? `${window.location.origin}/${locale}/join/paid` : "/zh/join/paid";
const env: PayEnv = typeof window !== "undefined" ? (navigator.userAgent.includes("MicroMessenger") ? "wechat" : "pc") : "pc";
const channel: PayChannel = mustUseWxPay(env) ? "wxpay" : getRecommendedChannel(env);
redirectToPay({
user_id: data.user_id,
return_url: returnUrl,
channel,
device: getDeviceFromEnv(env),
useJoinConfig: true,
});
} catch (err) {
setError(err instanceof Error ? err.message : "操作失败");
} finally {
setLoading(false);
}
setJoinModalOpen(true);
};
return (
@@ -193,36 +146,30 @@ export default function HeroSection() {
</button>
</div>
<form onSubmit={handleJoin} className="p-4 sm:p-5">
<form onSubmit={handleJoinClick} className="p-4 sm:p-5">
<input
type="email"
value={email}
onChange={(e) => { setEmail(e.target.value); setError(null); }}
onChange={(e) => setEmail(e.target.value)}
placeholder={tHero("emailPlaceholder")}
className="w-full border border-gray-200 dark:border-gray-700 rounded-lg px-4 py-3 text-sm placeholder-gray-400 dark:placeholder-gray-500 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-[#ff4d4f]/20 focus:border-[#ff4d4f] transition-colors mb-3"
/>
<input
type="password"
value={password}
onChange={(e) => { setPassword(e.target.value); setError(null); }}
placeholder={locale === "zh" ? "密码（老用户必填）" : "Password (required for existing users)"}
className="w-full border border-gray-200 dark:border-gray-700 rounded-lg px-4 py-3 text-sm placeholder-gray-400 dark:placeholder-gray-500 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring-2 focus:ring-[#ff4d4f]/20 focus:border-[#ff4d4f] transition-colors mb-3"
/>
{error && (
<p className="mb-2 text-sm text-red-600 dark:text-red-400">{error}</p>
)}
<button
type="submit"
disabled={loading}
className="w-full bg-[#ff4d4f] hover:bg-[#ff3333] dark:hover:bg-[#ff5c5e] text-white py-3 rounded-lg text-sm font-semibold transition-colors active:scale-[0.98] disabled:opacity-70"
className="w-full bg-[#ff4d4f] hover:bg-[#ff3333] dark:hover:bg-[#ff5c5e] text-white py-3 rounded-lg text-sm font-semibold transition-colors active:scale-[0.98]"
>
{loading ? (locale === "zh" ? "处理中…" : "Processing…") : tHero("ctaJoin")}
{tHero("ctaJoin")}
</button>
<p className="text-xs text-gray-400 dark:text-gray-500 text-center mt-3">
{locale === "zh" ? "新用户将自动注册，支付成功后需修改默认密码" : "New users auto-register; change default password after payment"}
</p>
</form>
</div>
<JoinModal
isOpen={joinModalOpen}
onClose={() => setJoinModalOpen(false)}
initialEmail={email.trim()}
/>
<div className="mt-4 flex flex-wrap gap-2 justify-center">
<Link href="/dashboard" className="text-xs text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 bg-white dark:bg-gray-800 rounded-full px-3 py-1.5 border border-gray-100 dark:border-gray-700 transition-colors min-h-[2rem] inline-flex items-center">