- 
+ })
电子书
@@ -80,7 +81,7 @@ export default function EbookPage({ params }: { params: Promise<{ slug: string }
{item.mediaUrl ? (
-
+
下载电子书
) : (
diff --git a/app/[locale]/meetups/host/page.tsx b/app/[locale]/meetups/host/page.tsx
index 66ea740..48b60fa 100644
--- a/app/[locale]/meetups/host/page.tsx
+++ b/app/[locale]/meetups/host/page.tsx
@@ -1,18 +1,107 @@
"use client";
-import { useState } from "react";
-import { Link, useTranslation } from "@/i18n/navigation";
+import { useMemo, useState, type FormEvent } from "react";
+import { Link, useLocale, useTranslation } from "@/i18n/navigation";
import { cities } from "@/app/data/cities";
import { apiFetch } from "@/app/lib/api-client";
+import {
+ createMiroTalkRoomSlug,
+ DEFAULT_ONLINE_FEATURES,
+ getMiroTalkServerLabel,
+ MIROTALK_PROVIDER_LABEL,
+ MEETUP_FEATURE_OPTIONS,
+ normalizeMiroTalkRoom,
+ type MeetupAccessLevel,
+ type MeetupMode,
+} from "@/app/lib/meetups";
const CITY_OPTIONS = cities.map((c) => ({ value: c.name, label: `${c.icon} ${c.name}` }));
const CITY_BY_NAME = new Map(cities.map((city) => [city.name, city]));
+interface HostMeetupForm {
+ mode: MeetupMode;
+ city: string;
+ date: string;
+ time: string;
+ venue: string;
+ address: string;
+ description: string;
+ maxAttendees: string;
+ organizer: string;
+ accessLevel: MeetupAccessLevel;
+ meetingProvider: string;
+ mirotalkRoom: string;
+ meetingUrl: string;
+ features: string[];
+}
+
+const copy = {
+ zh: {
+ activityType: "活动形式",
+ offline: "线下",
+ online: "线上",
+ hybrid: "混合",
+ organizer: "主办方",
+ organizerPlaceholder: "如：NomadCNA / 城市主理人",
+ onlineSettings: "线上活动配置",
+ provider: "视频服务",
+ accessLevel: "访问权限",
+ publicAccess: "公开",
+ membersAccess: "登录成员",
+ vipAccess: "VIP 成员",
+ hostsAccess: "主持人",
+ room: "MiroTalk 房间名",
+ roomPlaceholder: "留空时自动生成",
+ roomSuggestion: "将使用房间",
+ meetingUrl: "自定义入会链接",
+ meetingUrlPlaceholder: "可选，例如 https://mirotalk.nomadro.cn/join?room=...",
+ features: "开放功能",
+ onlineHint: "线上/混合活动会保存 provider、room、accessLevel、features 等字段，并默认通过自建 MiroTalk P2P 服务生成入会入口。",
+ defaultServer: "默认服务",
+ pendingHint: "提交后会进入本机 PocketBase 的 meetups 表，审核通过前状态为 pending。",
+ submitOnline: "发布活动",
+ crossCity: "线上 / 跨城市",
+ },
+ en: {
+ activityType: "Event type",
+ offline: "Offline",
+ online: "Online",
+ hybrid: "Hybrid",
+ organizer: "Organizer",
+ organizerPlaceholder: "e.g. NomadCNA / city host",
+ onlineSettings: "Online event settings",
+ provider: "Video service",
+ accessLevel: "Access level",
+ publicAccess: "Public",
+ membersAccess: "Members",
+ vipAccess: "VIP members",
+ hostsAccess: "Hosts",
+ room: "MiroTalk room",
+ roomPlaceholder: "Auto-generated when empty",
+ roomSuggestion: "Room to use",
+ meetingUrl: "Custom join URL",
+ meetingUrlPlaceholder: "Optional, e.g. https://mirotalk.nomadro.cn/join?room=...",
+ features: "Enabled features",
+ onlineHint: "Online/hybrid events store provider, room, accessLevel, and features, then generate join links through the self-hosted MiroTalk P2P service by default.",
+ defaultServer: "Default server",
+ pendingHint: "After submission, this writes to the local PocketBase meetups table with pending status.",
+ submitOnline: "Publish event",
+ crossCity: "Online / cross-city",
+ },
+};
+
+function getCopy(locale: string) {
+ return locale === "zh" ? copy.zh : copy.en;
+}
+
export default function HostMeetupPage() {
const { t } = useTranslation("hostMeetup");
+ const locale = useLocale();
+ const c = getCopy(locale);
const [submitted, setSubmitted] = useState(false);
const [submitting, setSubmitting] = useState(false);
- const [form, setForm] = useState({
+ const [form, setForm] = useState({
+ mode: "offline",
city: "",
date: "",
time: "19:00",
@@ -20,29 +109,78 @@ export default function HostMeetupPage() {
address: "",
description: "",
maxAttendees: "20",
+ organizer: "",
+ accessLevel: "members",
+ meetingProvider: "mirotalk",
+ mirotalkRoom: "",
+ meetingUrl: "",
+ features: DEFAULT_ONLINE_FEATURES,
});
- const handleSubmit = async (e: React.FormEvent) => {
+ const isOnlineMode = form.mode !== "offline";
+ const isOnlineOnly = form.mode === "online";
+ const city = CITY_BY_NAME.get(form.city);
+ const mirotalkServer = getMiroTalkServerLabel();
+ const roomToUse = useMemo(
+ () =>
+ normalizeMiroTalkRoom(form.mirotalkRoom) ||
+ createMiroTalkRoomSlug({
+ id: "new",
+ city: form.city || "online",
+ date: form.date,
+ time: form.time,
+ }),
+ [form.city, form.date, form.mirotalkRoom, form.time]
+ );
+
+ const setField = (field: K, value: HostMeetupForm[K]) => {
+ setForm((current) => ({ ...current, [field]: value }));
+ };
+
+ const toggleFeature = (feature: string) => {
+ setForm((current) => {
+ const selected = new Set(current.features);
+ if (selected.has(feature)) {
+ selected.delete(feature);
+ } else {
+ selected.add(feature);
+ }
+ return { ...current, features: Array.from(selected) };
+ });
+ };
+
+ const handleSubmit = async (e: FormEvent) => {
e.preventDefault();
- const city = CITY_BY_NAME.get(form.city);
setSubmitting(true);
try {
+ const finalCity = isOnlineOnly && !form.city ? "线上" : form.city;
+ const finalVenue = isOnlineOnly && !form.venue ? "MiroTalk 多人视频房" : form.venue;
+ const finalAddress = isOnlineOnly && !form.address ? "线上活动" : form.address;
await apiFetch("/api/meetups", {
method: "POST",
body: JSON.stringify({
- city: form.city,
- emoji: city?.icon || "📍",
+ city: finalCity,
+ emoji: city?.icon || (isOnlineOnly ? "💻" : "📍"),
date: form.date,
time: form.time,
- venue: form.venue,
- address: form.address,
+ venue: finalVenue,
+ address: finalAddress,
description: form.description,
rsvpCount: 1,
- gradientFrom: city?.gradientFrom || "#ff4d4f",
- gradientTo: city?.gradientTo || "#ff7a45",
+ gradientFrom: city?.gradientFrom || (isOnlineMode ? "#0f766e" : "#ff4d4f"),
+ gradientTo: city?.gradientTo || (isOnlineMode ? "#2563eb" : "#ff7a45"),
attendees: [],
isUpcoming: true,
status: "pending",
+ mode: form.mode,
+ maxAttendees: Number(form.maxAttendees || 0),
+ organizer: form.organizer.trim() || "NomadCNA",
+ accessLevel: form.accessLevel,
+ meetingProvider: isOnlineMode ? form.meetingProvider : "",
+ mirotalkRoom: isOnlineMode ? roomToUse : "",
+ meetingUrl: isOnlineMode ? form.meetingUrl.trim() : "",
+ replayUrl: "",
+ features: isOnlineMode ? form.features : [],
}),
});
setSubmitted(true);
@@ -54,26 +192,26 @@ export default function HostMeetupPage() {
if (submitted) {
return (
-
-
- 🎉
-
+
+
+
+ 🎉
+
{t("successTitle")}
-
+
{t("successDesc")}
-
+
setSubmitted(false)}
- className="px-6 py-3 rounded-xl border border-gray-200 dark:border-gray-700 text-gray-700 dark:text-gray-300 font-medium hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
+ className="cursor-pointer rounded-xl border border-gray-200 px-6 py-3 font-medium text-gray-700 transition-colors hover:bg-gray-50 dark:border-gray-700 dark:text-gray-300 dark:hover:bg-gray-800"
>
{t("createAnother")}
{t("viewMeetups")}
@@ -86,138 +224,267 @@ export default function HostMeetupPage() {
return (
-
+
← {t("backToMeetups")}
-
-
+
+
{t("title")}
-
+
{t("subtitle")}
+ 🎉
+
{t("successTitle")}
-+
{t("successDesc")}
-
+
setSubmitted(false)}
- className="px-6 py-3 rounded-xl border border-gray-200 dark:border-gray-700 text-gray-700 dark:text-gray-300 font-medium hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
+ className="cursor-pointer rounded-xl border border-gray-200 px-6 py-3 font-medium text-gray-700 transition-colors hover:bg-gray-50 dark:border-gray-700 dark:text-gray-300 dark:hover:bg-gray-800"
>
{t("createAnother")}
{t("viewMeetups")}
@@ -86,138 +224,267 @@ export default function HostMeetupPage() {
return (
-
+
← {t("backToMeetups")}
-
-
+
-
+
+
{t("title")}
-
+
{t("subtitle")}