@funhub/platform 0.2.30 → 0.2.31

package/dist/components/biz/basics/fullscreen-feed/runtime/client.mjs

@@ -1,2 +1,391 @@
 
-"use client";import{useRouter as e}from"../../../../../utils/use-compatible-router.mjs";import{prefetchVideoPlayerSrc as t}from"../../../../common/video-player/process-m3u8-cache.mjs";import{useLoginModalStore as n}from"../../../../../store/modules/login-modal-store.mjs";import{BasicFullscreen as r}from"../basic-fullscreen.mjs";import{adaptFeedItemToSafeInformation as i,normalizeToFeedItem as a}from"./adapters.mjs";import o from"./styles.module.mjs";import{BottomInfo as s}from"./bottom-info.mjs";import{PostSlide as ee}from"./post-slide.mjs";import{UserAction as te}from"./user-action.mjs";import{VideoSlide as ne}from"./video-slide.mjs";import{useCallback as c,useEffect as l,useMemo as u,useRef as d,useState as f}from"react";import{useParams as p}from"next/navigation";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";import _ from"next/dynamic";const re=_(()=>import(`./comment-modal.mjs`),{ssr:!1,loading:()=>null});function v(_){let v=e(),y=p(),{items:b,activeIndex:x,top:S,bottom:ie,videoConfig:ae,userInteracted:C,onUserInteracted:w,onActiveIndexChange:oe,onDataUpdate:se,onOpenComment:T,getNavigationInfo:E,onControlsVisibilityChange:D,onGestureStart:O,onGestureEnd:k,onSwipeCancel:ce,onCustomActionRender:le,onVideoProgressUpdate:ue,currentUserId:de,followIds:fe,onFollowIdsChange:pe,commentContentId:me,onRequireLogin:A,style:he,activeEpisodeId:ge}=_,j=ae;function M(){C||w()}function N(e){M();let t=typeof y?.locale==`string`?`/${y.locale}`:``;v.push(`${t}/profile/${e}`)}let P=c(e=>`${typeof y?.locale==`string`?`/${y.locale}`:``}/feed-series/${e}/episode/1`,[y?.locale]);function F(e){M();let t=P(e);v.push(t)}function I(){if(A){A();return}n.getState().open()}let[L,_e]=f({});function ve(e,t){if(!t)return e;let n=t.static?{...e.static||{},...t.static}:e.static,r=t.author?{...e.author||{},...t.author}:e.author;return{...e,...t,static:n,author:r}}function R(e,t){_e(n=>{let r=n[e]||{},i=t.static?{...r.static||{},...t.static}:r.static,a=t.author?{...r.author||{},...t.author}:r.author;return{...n,[e]:{...r,...t,...i?{static:i}:{},...a?{author:a}:{}}}}),se(e,t)}let[z,ye]=f(null),[B,be]=f(``),[xe,Se]=f(1),[V,H]=f(!1);function Ce(e,t,n){if(M(),T){T(t);return}ye(t),be(e),Se(n),H(!0)}function we(e){let t=e.static?.comment_cnt;t!=null&&B&&R(B,{static:{comment_cnt:t}})}let U=u(()=>{function e(e){return!!e&&typeof e==`object`&&typeof e.kind==`string`&&!!e.originalData}function t(e){return!!e&&typeof e==`object`&&typeof e.content_id==`string`}function n(e){return!!e&&typeof e==`object`&&typeof e.id==`string`&&typeof e.name==`string`}function r(e){let t=Array.isArray(e.medias)?e.medias:[],n=t.map(e=>e?.media_url?e.is_video&&e.cover_image||e.media_url:``).filter(e=>!!e),r=e.content||``,i=r.length>18?`${r.slice(0,18)}...`:r,a={id:e.content_id,mid:e.content_id,name:i,img_y:e.cover_image||``,preview_images:t,description:r,tags:(e.tags||[]).map(e=>({id:e,name:e})),links:[],static:{like_cnt:e.like_count??0,dislike_cnt:e.dislike_count??0,comment_cnt:e.comment_count??0,share_cnt:e.share_count??0,browse_cnt:e.view_count??0,collect_cnt:0},type:e.type,is_liked:!!e.is_liked,is_dislike:!!e.is_dislike,is_collected:!!e.is_collected,is_followed:!!e.is_followed,author:e.author,up_user:e.user_id};return{kind:`post`,id:e.content_id,title:i,content:r,images:n,originalData:a}}function o(e){let t=(Array.isArray(e.preview_images)?e.preview_images:[]).map(e=>e?typeof e==`string`?e:e.is_video?e.cover_image||e.media_url||``:e.media_url||``:``).filter(e=>!!e);return{kind:`post`,id:e.id,title:e.name,content:e.description??``,images:t,originalData:e}}return(b||[]).map(s=>{if(e(s))return s;if(t(s))return r(s);if(n(s)){let e=i(s);return e.type===1&&e.links.length===0?o(e):a(e)}return null}).filter(Boolean)},[b]),W=u(()=>{if(!U.length)return[];let e=Math.max(0,x-1),t=Math.min(U.length-1,x+2),n=[];for(let r=e;r<=t;r+=1){let e=U[r];if(!e||e.kind!==`video`)continue;let t=e.videoUrl||e.hlsList?.[0]?.url||``;t&&n.push(t)}return Array.from(new Set(n))},[x,U]);l(()=>{W.forEach(e=>t(e))},[W]);let G=d(new Set);l(()=>{let e=U[x];if(!e||e.kind!==`video`||Number(e.originalData?.episode_cnt||0)<=1||E(x).onSeriesClick)return;let t=e.originalData?.id||e.id;if(!t)return;let n=P(t);G.current.has(n)||(G.current.add(n),v.prefetch(n))},[x,P,E,U,v]);let K=S??0,q=ie??0,Te={...he,top:`${K}px`,bottom:`${q}px`,height:`calc(100dvh - ${K}px - ${q}px)`},J=d(x),[Ee,Y]=f(!1),[X,Z]=f(!1),[De,Q]=f(!1),$=Ee&&X&&De;return l(()=>{J.current=x,Y(!1),Z(!1),Q(!1)},[x,D]),l(()=>{D?.($)},[$,D]),g(m,{children:[h(r,{items:U,activeIndex:x,userInteracted:C,onUserInteracted:w,onActiveIndexChange:oe,onViewportIndexChange:e=>{J.current=e,Y(!1),Z(!1),Q(!1)},onGestureStart:O,onGestureEnd:k,onSwipeCancel:ce,style:Te,className:`w-full h-full fixed top-0 left-0 overflow-hidden z-[2] touch-none ${o.fullscreenFeed}`,trackClassName:o.feedTrack,itemWrapperClassName:o.feedItem,renderItem:({item:e,index:t,activeIndex:n,isActive:r,isSettledActive:i,shouldMount:a,swipeNext:c})=>{if(!e)return h(`div`,{className:o.emptySlide});let l=Math.abs(t-n)<=1,u=ve(e.originalData,L[e.id]);return g(m,{children:[e.kind===`post`?h(ee,{item:e,isSettledActive:i,shouldMount:a}):e.kind===`video`?h(ne,{item:e,videoConfig:j,isActive:r,isSettledActive:i,shouldMount:a,shouldLoadCover:l,isPaused:V,userInteracted:C,onPlayerInteract:()=>{t===J.current&&X&&Q(!0)},onControlsVisibilityChange:e=>{t===J.current&&Y(e)},onVideoEnded:j?.autoNext?c:void 0,onProgressUpdate:(n,r)=>{t===J.current&&(!X&&n>=.05&&Z(!0),ue?.({id:e.id,currentTime:n,duration:r}))}}):h(`div`,{className:o.emptySlide}),h(te,{information:u,onUpdate:t=>R(e.id,t),onOpenComment:()=>Ce(e.id,u,e.kind===`post`?2:1),onCustomActionRender:le,onUserNavigate:N,currentUserId:de,followIds:fe,onFollowChange:e=>{pe?.(e)},onRequireLogin:I,activeEpisodeId:ge}),r&&h(s,{information:u,isPost:e.kind===`post`,navigation:(()=>{let e=E(t);return(u.episode_cnt??0)>1&&!e.onSeriesClick?{...e,onSeriesClick:()=>F(u.id)}:e})(),isControlsVisible:$,onUserNavigate:N,onNextClick:c})]})}}),!T&&V&&z&&h(re,{open:V,information:z,contentId:me||z.id,content_type:xe,onUpdate:we,onClose:()=>H(!1)})]})}export{v as default};
+'use client';
+
+import { useRouter as useRouter$1 } from "../../../../../utils/use-compatible-router.mjs";
+import { prefetchVideoPlayerSrc } from "../../../../common/video-player/process-m3u8-cache.mjs";
+import { useLoginModalStore } from "../../../../../store/modules/login-modal-store.mjs";
+import { BasicFullscreen } from "../basic-fullscreen.mjs";
+import { adaptFeedItemToSafeInformation, normalizeToFeedItem } from "./adapters.mjs";
+import styles_module_default from "./styles.module.mjs";
+import { BottomInfo } from "./bottom-info.mjs";
+import { PostSlide } from "./post-slide.mjs";
+import { UserAction } from "./user-action.mjs";
+import { VideoSlide } from "./video-slide.mjs";
+import { useParams } from "next/navigation";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import dynamic from "next/dynamic";
+
+//#region components/biz/basics/fullscreen-feed/runtime/client.tsx
+/**
+* 评论弹窗属于“非首屏必需功能”：
+* - 只有用户点击评论时才需要
+* - 避免首屏把 CommentList 等依赖一起打包/执行，降低跳转加载时延
+*/
+const CommentModal = dynamic(() => import("./comment-modal.mjs"), {
+	ssr: false,
+	loading: () => null
+});
+const PROCESS_M3U8_CLIENT_WARMUP_WINDOW = 2;
+/**
+* FullscreenFeedClient
+*
+* 只负责渲染（items + activeIndex + 业务回调）；
+* BaseComponentProps / runtime 兼容由上层业务组件处理。
+*/
+function FullscreenFeedClient(props) {
+	const router = useRouter$1();
+	const params = useParams();
+	const { items, activeIndex, top, bottom, videoConfig, userInteracted, onUserInteracted, onActiveIndexChange, onDataUpdate, onOpenComment, getNavigationInfo, onControlsVisibilityChange, onGestureStart, onGestureEnd, onSwipeCancel, onCustomActionRender, onVideoProgressUpdate, currentUserId, followIds, onFollowIdsChange, commentContentId, onRequireLogin, style, activeEpisodeId } = props;
+	const resolvedVideoConfig = videoConfig;
+	function markUserInteracted() {
+		if (!userInteracted) onUserInteracted();
+	}
+	function handleUserNavigate(userId) {
+		markUserInteracted();
+		const prefix = typeof params?.locale === "string" ? `/${params.locale}` : "";
+		router.push(`${prefix}/profile/${userId}`);
+	}
+	const buildSeriesEpisodePath = useCallback((seriesId) => {
+		return `${typeof params?.locale === "string" ? `/${params.locale}` : ""}/feed-series/${seriesId}/episode/1`;
+	}, [params?.locale]);
+	function handleSeriesNavigate(seriesId) {
+		markUserInteracted();
+		const url = buildSeriesEpisodePath(seriesId);
+		router.push(url);
+	}
+	function handleRequireLogin() {
+		if (onRequireLogin) {
+			onRequireLogin();
+			return;
+		}
+		useLoginModalStore.getState().open();
+	}
+	/**
+	* FullscreenFeedClient 内部的乐观更新缓存：
+	* - 由于 `UserAction` 的点赞/收藏是本地 state 乐观更新，但评论数依赖上层数据刷新；
+	* - 当上层 `onDataUpdate` 未把 patch 及时反映回 `items` 时，评论成功后的计数不会更新；
+	* - 这里在组件内部维护 overrides，确保 UI 立即更新，同时仍调用上层 `onDataUpdate` 做同步。
+	*/
+	const [localOverrides, setLocalOverrides] = useState({});
+	/**
+	* 合并 SafeInformationType 补丁（浅合并 + static/author 深层合并）。
+	*/
+	function mergeSafeInformation(base, patch) {
+		if (!patch) return base;
+		const nextStatic = patch.static ? {
+			...base.static || {},
+			...patch.static
+		} : base.static;
+		const nextAuthor = patch.author ? {
+			...base.author || {},
+			...patch.author
+		} : base.author;
+		return {
+			...base,
+			...patch,
+			static: nextStatic,
+			author: nextAuthor
+		};
+	}
+	/**
+	* 统一数据更新入口：先写入本地 overrides，保证 UI 立即更新，再透传给上层。
+	*/
+	function handleDataUpdate(id, patch) {
+		setLocalOverrides((prev) => {
+			const prevPatch = prev[id] || {};
+			const mergedStatic = patch.static ? {
+				...prevPatch.static || {},
+				...patch.static
+			} : prevPatch.static;
+			const mergedAuthor = patch.author ? {
+				...prevPatch.author || {},
+				...patch.author
+			} : prevPatch.author;
+			return {
+				...prev,
+				[id]: {
+					...prevPatch,
+					...patch,
+					...mergedStatic ? { static: mergedStatic } : {},
+					...mergedAuthor ? { author: mergedAuthor } : {}
+				}
+			};
+		});
+		onDataUpdate(id, patch);
+	}
+	const [commentInfo, setCommentInfo] = useState(null);
+	const [commentTargetItemId, setCommentTargetItemId] = useState("");
+	const [commentContentType, setCommentContentType] = useState(1);
+	const [showCommentModal, setShowCommentModal] = useState(false);
+	function handleOpenComment(itemId, info, contentType) {
+		markUserInteracted();
+		if (onOpenComment) {
+			onOpenComment(info);
+			return;
+		}
+		setCommentInfo(info);
+		setCommentTargetItemId(itemId);
+		setCommentContentType(contentType);
+		setShowCommentModal(true);
+	}
+	/**
+	* 评论弹窗内会通过 `onTotalChange` / `onCommentAdded` 回写 `static.comment_cnt`；
+	* 这里仅透传 `comment_cnt`，避免用弹窗打开时的旧 `static` 覆盖外层最新的点赞/收藏等计数。
+	*/
+	function handleCommentModalUpdate(updateData) {
+		const commentCnt = updateData.static?.comment_cnt;
+		if (commentCnt === void 0 || commentCnt === null) return;
+		if (!commentTargetItemId) return;
+		handleDataUpdate(commentTargetItemId, { static: { comment_cnt: commentCnt } });
+	}
+	const normalizedItems = useMemo(() => {
+		function isFeedItem(input) {
+			return !!input && typeof input === "object" && typeof input.kind === "string" && !!input.originalData;
+		}
+		function isPostRaw(input) {
+			return !!input && typeof input === "object" && typeof input.content_id === "string";
+		}
+		function isSafeInformation(input) {
+			return !!input && typeof input === "object" && typeof input.id === "string" && typeof input.name === "string";
+		}
+		function toPostFeedItem(raw) {
+			const medias = Array.isArray(raw.medias) ? raw.medias : [];
+			const images = medias.map((media) => {
+				if (!media?.media_url) return "";
+				if (media.is_video) return media.cover_image || media.media_url;
+				return media.media_url;
+			}).filter((src) => Boolean(src));
+			const text = raw.content || "";
+			const title = text.length > 18 ? `${text.slice(0, 18)}...` : text;
+			const info = {
+				id: raw.content_id,
+				mid: raw.content_id,
+				name: title,
+				img_y: raw.cover_image || "",
+				preview_images: medias,
+				description: text,
+				tags: (raw.tags || []).map((tag) => ({
+					id: tag,
+					name: tag
+				})),
+				links: [],
+				static: {
+					like_cnt: raw.like_count ?? 0,
+					dislike_cnt: raw.dislike_count ?? 0,
+					comment_cnt: raw.comment_count ?? 0,
+					share_cnt: raw.share_count ?? 0,
+					browse_cnt: raw.view_count ?? 0,
+					collect_cnt: 0
+				},
+				type: raw.type,
+				is_liked: Boolean(raw.is_liked),
+				is_dislike: Boolean(raw.is_dislike),
+				is_collected: Boolean(raw.is_collected),
+				is_followed: Boolean(raw.is_followed),
+				author: raw.author,
+				up_user: raw.user_id
+			};
+			return {
+				kind: "post",
+				id: raw.content_id,
+				title,
+				content: text,
+				images,
+				originalData: info
+			};
+		}
+		function toPostFeedItemFromSafeInfo(info) {
+			const images = (Array.isArray(info.preview_images) ? info.preview_images : []).map((item) => {
+				if (!item) return "";
+				if (typeof item === "string") return item;
+				return item.is_video ? item.cover_image || item.media_url || "" : item.media_url || "";
+			}).filter((src) => Boolean(src));
+			return {
+				kind: "post",
+				id: info.id,
+				title: info.name,
+				content: info.description ?? "",
+				images,
+				originalData: info
+			};
+		}
+		return (items || []).map((input) => {
+			if (isFeedItem(input)) return input;
+			if (isPostRaw(input)) return toPostFeedItem(input);
+			if (isSafeInformation(input)) {
+				const safeInfo = adaptFeedItemToSafeInformation(input);
+				if (safeInfo.type === 1 && safeInfo.links.length === 0) return toPostFeedItemFromSafeInfo(safeInfo);
+				return normalizeToFeedItem(safeInfo);
+			}
+			return null;
+		}).filter(Boolean);
+	}, [items]);
+	/**
+	* 客户端预热当前及邻近条目的 m3u8，降低翻页到下一条视频时的首帧等待。
+	*/
+	const warmupVideoUrls = useMemo(() => {
+		if (!normalizedItems.length) return [];
+		const start = Math.max(0, activeIndex - 1);
+		const end = Math.min(normalizedItems.length - 1, activeIndex + PROCESS_M3U8_CLIENT_WARMUP_WINDOW);
+		const urls = [];
+		for (let index = start; index <= end; index += 1) {
+			const item = normalizedItems[index];
+			if (!item || item.kind !== "video") continue;
+			const targetUrl = item.videoUrl || item.hlsList?.[0]?.url || "";
+			if (!targetUrl) continue;
+			urls.push(targetUrl);
+		}
+		return Array.from(new Set(urls));
+	}, [activeIndex, normalizedItems]);
+	useEffect(() => {
+		warmupVideoUrls.forEach((url) => prefetchVideoPlayerSrc(url));
+	}, [warmupVideoUrls]);
+	const prefetchedSeriesPathRef = useRef(/* @__PURE__ */ new Set());
+	/**
+	* 当前激活项若为剧集，提前 prefetch 详情路由，缩短点击“选集”后的首包等待。
+	*/
+	useEffect(() => {
+		const activeItem = normalizedItems[activeIndex];
+		if (!activeItem || activeItem.kind !== "video") return;
+		if (Number(activeItem.originalData?.episode_cnt || 0) <= 1) return;
+		if (getNavigationInfo(activeIndex).onSeriesClick) return;
+		const seriesId = activeItem.originalData?.id || activeItem.id;
+		if (!seriesId) return;
+		const targetPath = buildSeriesEpisodePath(seriesId);
+		if (prefetchedSeriesPathRef.current.has(targetPath)) return;
+		prefetchedSeriesPathRef.current.add(targetPath);
+		router.prefetch(targetPath);
+	}, [
+		activeIndex,
+		buildSeriesEpisodePath,
+		getNavigationInfo,
+		normalizedItems,
+		router
+	]);
+	/**
+	* top/bottom 需通过 inline style 处理，避免被外层 `style` 覆盖 class 样式。
+	* top/bottom 参数表示额外预留的顶部/底部高度（例如顶部搜索栏、底部 TabBar 的 56px）。
+	*/
+	const baseTop = top ?? 0;
+	const baseBottom = bottom ?? 0;
+	const wrapperStyle = {
+		...style,
+		top: `${baseTop}px`,
+		bottom: `${baseBottom}px`,
+		height: `calc(100dvh - ${baseTop}px - ${baseBottom}px)`
+	};
+	const viewportIndexRef = useRef(activeIndex);
+	const [rawControlsVisible, setRawControlsVisible] = useState(false);
+	const [activeVideoHasFirstFrame, setActiveVideoHasFirstFrame] = useState(false);
+	const [activeVideoInteracted, setActiveVideoInteracted] = useState(false);
+	const isControlsVisible = rawControlsVisible && activeVideoHasFirstFrame && activeVideoInteracted;
+	useEffect(() => {
+		viewportIndexRef.current = activeIndex;
+		setRawControlsVisible(false);
+		setActiveVideoHasFirstFrame(false);
+		setActiveVideoInteracted(false);
+	}, [activeIndex, onControlsVisibilityChange]);
+	useEffect(() => {
+		onControlsVisibilityChange?.(isControlsVisible);
+	}, [isControlsVisible, onControlsVisibilityChange]);
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(BasicFullscreen, {
+		items: normalizedItems,
+		activeIndex,
+		userInteracted,
+		onUserInteracted,
+		onActiveIndexChange,
+		onViewportIndexChange: (nextIndex) => {
+			viewportIndexRef.current = nextIndex;
+			setRawControlsVisible(false);
+			setActiveVideoHasFirstFrame(false);
+			setActiveVideoInteracted(false);
+		},
+		onGestureStart,
+		onGestureEnd,
+		onSwipeCancel,
+		style: wrapperStyle,
+		className: `w-full h-full fixed top-0 left-0 overflow-hidden z-[2] touch-none ${styles_module_default.fullscreenFeed}`,
+		trackClassName: styles_module_default.feedTrack,
+		itemWrapperClassName: styles_module_default.feedItem,
+		renderItem: ({ item, index, activeIndex: currentIndex, isActive, isSettledActive, shouldMount, swipeNext }) => {
+			if (!item) return /* @__PURE__ */ jsx("div", { className: styles_module_default.emptySlide });
+			const shouldLoadCover = Math.abs(index - currentIndex) <= 1;
+			const patchedInfo = mergeSafeInformation(item.originalData, localOverrides[item.id]);
+			return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+				item.kind === "post" ? /* @__PURE__ */ jsx(PostSlide, {
+					item,
+					isSettledActive,
+					shouldMount
+				}) : item.kind === "video" ? /* @__PURE__ */ jsx(VideoSlide, {
+					item,
+					videoConfig: resolvedVideoConfig,
+					isActive,
+					isSettledActive,
+					shouldMount,
+					shouldLoadCover,
+					isPaused: showCommentModal,
+					userInteracted,
+					onPlayerInteract: () => {
+						if (index !== viewportIndexRef.current) return;
+						if (!activeVideoHasFirstFrame) return;
+						setActiveVideoInteracted(true);
+					},
+					onControlsVisibilityChange: (visible) => {
+						if (index !== viewportIndexRef.current) return;
+						setRawControlsVisible(visible);
+					},
+					onVideoEnded: resolvedVideoConfig?.autoNext ? swipeNext : void 0,
+					onProgressUpdate: (currentTime, duration) => {
+						if (index !== viewportIndexRef.current) return;
+						if (!activeVideoHasFirstFrame && currentTime >= .05) setActiveVideoHasFirstFrame(true);
+						onVideoProgressUpdate?.({
+							id: item.id,
+							currentTime,
+							duration
+						});
+					}
+				}) : /* @__PURE__ */ jsx("div", { className: styles_module_default.emptySlide }),
+				/* @__PURE__ */ jsx(UserAction, {
+					information: patchedInfo,
+					onUpdate: (data) => handleDataUpdate(item.id, data),
+					onOpenComment: () => handleOpenComment(item.id, patchedInfo, item.kind === "post" ? 2 : 1),
+					onCustomActionRender,
+					onUserNavigate: handleUserNavigate,
+					currentUserId,
+					followIds,
+					onFollowChange: (ids) => {
+						onFollowIdsChange?.(ids);
+					},
+					onRequireLogin: handleRequireLogin,
+					activeEpisodeId
+				}),
+				isActive && /* @__PURE__ */ jsx(BottomInfo, {
+					information: patchedInfo,
+					isPost: item.kind === "post",
+					navigation: (() => {
+						const next = getNavigationInfo(index);
+						if ((patchedInfo.episode_cnt ?? 0) > 1 && !next.onSeriesClick) return {
+							...next,
+							onSeriesClick: () => handleSeriesNavigate(patchedInfo.id)
+						};
+						return next;
+					})(),
+					isControlsVisible,
+					onUserNavigate: handleUserNavigate,
+					onNextClick: swipeNext
+				})
+			] });
+		}
+	}), !onOpenComment && showCommentModal && commentInfo && /* @__PURE__ */ jsx(CommentModal, {
+		open: showCommentModal,
+		information: commentInfo,
+		contentId: commentContentId || commentInfo.id,
+		content_type: commentContentType,
+		onUpdate: handleCommentModalUpdate,
+		onClose: () => setShowCommentModal(false)
+	})] });
+}
+
+//#endregion
+export { FullscreenFeedClient as default };

package/dist/components/biz/basics/fullscreen-feed/runtime/comment-modal.mjs

@@ -1,2 +1,108 @@
 
-"use client";import{Dialog as e,DialogContent as t}from"../../../../ui/dialog.mjs";import{useLoginModalStore as n}from"../../../../../store/modules/login-modal-store.mjs";import r from"../../../../../assets/icons/close.mjs";import i from"../../../business/comment/comment-list.mjs";import{useEffect as a,useRef as o,useState as s}from"react";import{jsx as c,jsxs as l}from"react/jsx-runtime";import{useTranslations as u}from"next-intl";const d=`funhub:comment-reply-detail-visible-change`;function f({open:f,information:p,contentId:m,onClose:h,content_type:g,onUpdate:_}){let v=u(`components.biz.basics.fullscreenFeed.runtime`),[y,b]=s(!1),[x,S]=s(!1),[C,w]=s(!1),T=o(Number(p.static?.comment_cnt||0)),E=g===1?`video`:g===2?`post`:p.links?.length?`video`:`post`,D=m||p.id;return a(()=>{f&&b(!0)},[f]),a(()=>{if(typeof window>`u`)return;let e=e=>{let t=e.detail?.visible;S(!!t)},t=e=>{let t=e.detail?.visible;w(!!t)};return window.addEventListener(`funhub:visible-contact-change`,e),window.addEventListener(d,t),()=>{window.removeEventListener(`funhub:visible-contact-change`,e),window.removeEventListener(d,t)}},[]),a(()=>{f||(S(!1),w(!1))},[f]),a(()=>{T.current=Number(p.static?.comment_cnt||0)},[p.id,p.static?.comment_cnt]),c(e,{open:f,onOpenChange:e=>!e&&h(),children:l(t,{showCloseButton:!1,style:{opacity:x||C?0:1,transitionProperty:`transform, opacity`},className:`fixed !top-auto !left-0 !right-0 !-translate-x-0 !-translate-y-0 bottom-0 w-full max-w-none flex h-[540px] flex-col gap-0 border border-white/10 bg-black/95 p-0 text-white rounded-t-2xl duration-300 ease-out ${y?`translate-y-0`:`translate-y-full`}`,children:[l(`div`,{className:`relative flex h-[56px] shrink-0 items-center justify-center border-b border-white/10`,children:[c(`button`,{type:`button`,className:`absolute left-0 top-0 flex h-full w-[48px] items-center justify-center text-white`,onClick:h,children:c(r,{className:`h-[16px] w-[16px]`})}),c(`span`,{className:`text-[16px] font-semibold`,children:v(`commentModal.comment`)})]}),c(`div`,{className:`flex-1 min-h-0 overflow-y-auto`,children:c(i,{information:{id:D,links:p.links},contentId:D,contentType:E,onCommentAdded:()=>{_&&(T.current+=1,_({static:{...p.static,comment_cnt:T.current}}))},onTotalChange:e=>{_&&(T.current=Math.max(T.current,Number(e||0)),_({static:{...p.static,comment_cnt:T.current}}))},onReplyDetailVisibleChange:w,onRequireLogin:()=>n.getState().open()})})]})})}export{f as default};
+'use client';
+
+import { Dialog, DialogContent } from "../../../../ui/dialog.mjs";
+import { useLoginModalStore } from "../../../../../store/modules/login-modal-store.mjs";
+import SvgClose from "../../../../../assets/icons/close.mjs";
+import CommentList from "../../../business/comment/comment-list.mjs";
+import { useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslations } from "next-intl";
+
+//#region components/biz/basics/fullscreen-feed/runtime/comment-modal.tsx
+const replyDetailVisibleChangeEvent = "funhub:comment-reply-detail-visible-change";
+function CommentModal({ open, information, contentId, onClose, content_type, onUpdate }) {
+	const t = useTranslations("components.biz.basics.fullscreenFeed.runtime");
+	const [isAnimating, setIsAnimating] = useState(false);
+	const [isContactVisible, setIsContactVisible] = useState(false);
+	const [isReplyDetailVisible, setIsReplyDetailVisible] = useState(false);
+	const commentCntRef = useRef(Number(information.static?.comment_cnt || 0));
+	const resolvedContentType = content_type === 1 ? "video" : content_type === 2 ? "post" : information.links?.length ? "video" : "post";
+	const resolvedContentId = contentId || information.id;
+	useEffect(() => {
+		if (open) setIsAnimating(true);
+	}, [open]);
+	useEffect(() => {
+		if (typeof window === "undefined") return;
+		const contactVisibleHandler = (event) => {
+			const next = event.detail?.visible;
+			setIsContactVisible(Boolean(next));
+		};
+		const replyDetailVisibleHandler = (event) => {
+			const next = event.detail?.visible;
+			setIsReplyDetailVisible(Boolean(next));
+		};
+		window.addEventListener("funhub:visible-contact-change", contactVisibleHandler);
+		window.addEventListener(replyDetailVisibleChangeEvent, replyDetailVisibleHandler);
+		return () => {
+			window.removeEventListener("funhub:visible-contact-change", contactVisibleHandler);
+			window.removeEventListener(replyDetailVisibleChangeEvent, replyDetailVisibleHandler);
+		};
+	}, []);
+	useEffect(() => {
+		if (!open) {
+			setIsContactVisible(false);
+			setIsReplyDetailVisible(false);
+		}
+	}, [open]);
+	useEffect(() => {
+		commentCntRef.current = Number(information.static?.comment_cnt || 0);
+	}, [information.id, information.static?.comment_cnt]);
+	const handleCommentAdded = () => {
+		if (!onUpdate) return;
+		commentCntRef.current += 1;
+		onUpdate({ static: {
+			...information.static,
+			comment_cnt: commentCntRef.current
+		} });
+	};
+	const handleTotalChange = (total) => {
+		if (!onUpdate) return;
+		commentCntRef.current = Math.max(commentCntRef.current, Number(total || 0));
+		onUpdate({ static: {
+			...information.static,
+			comment_cnt: commentCntRef.current
+		} });
+	};
+	return /* @__PURE__ */ jsx(Dialog, {
+		open,
+		onOpenChange: (next) => !next && onClose(),
+		children: /* @__PURE__ */ jsxs(DialogContent, {
+			showCloseButton: false,
+			style: {
+				opacity: isContactVisible || isReplyDetailVisible ? 0 : 1,
+				transitionProperty: "transform, opacity"
+			},
+			className: `fixed !top-auto !left-0 !right-0 !-translate-x-0 !-translate-y-0 bottom-0 w-full max-w-none flex h-[540px] flex-col gap-0 border border-white/10 bg-black/95 p-0 text-white rounded-t-2xl duration-300 ease-out ${isAnimating ? "translate-y-0" : "translate-y-full"}`,
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "relative flex h-[56px] shrink-0 items-center justify-center border-b border-white/10",
+				children: [/* @__PURE__ */ jsx("button", {
+					type: "button",
+					className: "absolute left-0 top-0 flex h-full w-[48px] items-center justify-center text-white",
+					onClick: onClose,
+					children: /* @__PURE__ */ jsx(SvgClose, { className: "h-[16px] w-[16px]" })
+				}), /* @__PURE__ */ jsx("span", {
+					className: "text-[16px] font-semibold",
+					children: t("commentModal.comment")
+				})]
+			}), /* @__PURE__ */ jsx("div", {
+				className: "flex-1 min-h-0 overflow-y-auto",
+				children: /* @__PURE__ */ jsx(CommentList, {
+					information: {
+						id: resolvedContentId,
+						links: information.links
+					},
+					contentId: resolvedContentId,
+					contentType: resolvedContentType,
+					onCommentAdded: handleCommentAdded,
+					onTotalChange: handleTotalChange,
+					onReplyDetailVisibleChange: setIsReplyDetailVisible,
+					onRequireLogin: () => useLoginModalStore.getState().open()
+				})
+			})]
+		})
+	});
+}
+
+//#endregion
+export { CommentModal as default };

package/dist/components/biz/basics/fullscreen-feed/runtime/interaction-sync.mjs

@@ -1,2 +1,135 @@
 
-"use client";function e(e){let t=new Map;return Array.isArray(e)&&e.forEach(e=>{let n=e?.content_id?String(e.content_id):``;n&&t.set(n,e)}),t}function t(e,t){let n=t.is_liked||!1,r=t.is_disliked||!1,i=t.is_collected||!1,a=typeof t.is_followed==`boolean`?t.is_followed:e.is_followed,o=e.static?.like_cnt,s=n&&(typeof o==`number`?o:Number(o||0))===0,c=e.static?.collect_cnt,l=i&&(typeof c==`number`?c:Number(c||0))===0,u=s||l?{...e.static||{},...s?{like_cnt:1}:{},...l?{collect_cnt:1}:{}}:e.static;return e.is_liked===n&&e.is_dislike===r&&e.is_collected===i&&e.is_followed===a&&u===e.static?e:{...e,is_liked:n,is_dislike:r,is_collected:i,is_followed:a,static:u}}function n(e,t){let n=[],r=[];return e.forEach(e=>{if(e?.id){if(e.kind===`video`){if(t.video.has(e.id))return;t.video.add(e.id),n.push(e.id);return}if(e.kind===`post`){if(t.post.has(e.id))return;t.post.add(e.id),r.push(e.id)}}}),{pendingVideoIds:n,pendingPostIds:r}}function r(e,t){let n=[];return e.forEach(e=>{let r=e?.id?String(e.id):``;r&&(t.has(r)||(t.add(r),n.push(r)))}),n}function i(e,n,r){if(n.size===0&&r.size===0)return e;let i=!1,a=e.map(e=>{if(e.kind===`video`){let r=n.get(e.id);if(!r)return e;let a=t(e.originalData,r);return a===e.originalData?e:(i=!0,{...e,originalData:a})}if(e.kind===`post`){let n=r.get(e.id);if(!n)return e;let a=t(e.originalData,n);return a===e.originalData?e:(i=!0,{...e,originalData:a})}return e});return i?a:e}function a(e,n){if(n.size===0)return e;let r=!1,i=e.map(e=>{let i=n.get(String(e.id));if(!i)return e;let a=t(e,i);return a===e?e:(r=!0,a)});return r?i:e}export{e as buildInteractionMap,n as collectPendingInteractionIds,r as collectPendingInteractionIdsFromInfos,i as mergeInteractionIntoFeedItems,a as mergeInteractionIntoInfos};
+'use client';
+
+//#region components/biz/basics/fullscreen-feed/runtime/interaction-sync.ts
+/**
+* 将互动状态列表转换为 Map，便于按 content_id 更新。
+*/
+function buildInteractionMap(list) {
+	const map = /* @__PURE__ */ new Map();
+	if (!Array.isArray(list)) return map;
+	list.forEach((item) => {
+		const id = item?.content_id ? String(item.content_id) : "";
+		if (!id) return;
+		map.set(id, item);
+	});
+	return map;
+}
+/**
+* 将互动状态写回内容信息。
+*/
+function applyInteractionToInfo(info, interaction) {
+	const nextIsLiked = interaction.is_liked || false;
+	const nextIsDisliked = interaction.is_disliked || false;
+	const nextIsCollected = interaction.is_collected || false;
+	const nextIsFollowed = typeof interaction.is_followed === "boolean" ? interaction.is_followed : info.is_followed;
+	const rawLikeCnt = info.static?.like_cnt;
+	const shouldFixLikeCnt = nextIsLiked && (typeof rawLikeCnt === "number" ? rawLikeCnt : Number(rawLikeCnt || 0)) === 0;
+	const rawCollectCnt = info.static?.collect_cnt;
+	const shouldFixCollectCnt = nextIsCollected && (typeof rawCollectCnt === "number" ? rawCollectCnt : Number(rawCollectCnt || 0)) === 0;
+	const nextStatic = shouldFixLikeCnt || shouldFixCollectCnt ? {
+		...info.static || {},
+		...shouldFixLikeCnt ? { like_cnt: 1 } : {},
+		...shouldFixCollectCnt ? { collect_cnt: 1 } : {}
+	} : info.static;
+	if (info.is_liked === nextIsLiked && info.is_dislike === nextIsDisliked && info.is_collected === nextIsCollected && info.is_followed === nextIsFollowed && nextStatic === info.static) return info;
+	return {
+		...info,
+		is_liked: nextIsLiked,
+		is_dislike: nextIsDisliked,
+		is_collected: nextIsCollected,
+		is_followed: nextIsFollowed,
+		static: nextStatic
+	};
+}
+/**
+* 收集需要查询互动状态的内容 ID（按类型区分）。
+*/
+function collectPendingInteractionIds(items, checked) {
+	const pendingVideoIds = [];
+	const pendingPostIds = [];
+	items.forEach((item) => {
+		if (!item?.id) return;
+		if (item.kind === "video") {
+			if (checked.video.has(item.id)) return;
+			checked.video.add(item.id);
+			pendingVideoIds.push(item.id);
+			return;
+		}
+		if (item.kind === "post") {
+			if (checked.post.has(item.id)) return;
+			checked.post.add(item.id);
+			pendingPostIds.push(item.id);
+		}
+	});
+	return {
+		pendingVideoIds,
+		pendingPostIds
+	};
+}
+/**
+* 收集需要查询互动状态的剧集 ID。
+*/
+function collectPendingInteractionIdsFromInfos(infos, checked) {
+	const pendingIds = [];
+	infos.forEach((info) => {
+		const id = info?.id ? String(info.id) : "";
+		if (!id) return;
+		if (checked.has(id)) return;
+		checked.add(id);
+		pendingIds.push(id);
+	});
+	return pendingIds;
+}
+/**
+* 将互动状态合并到 FeedItem 列表。
+*/
+function mergeInteractionIntoFeedItems(items, videoMap, postMap) {
+	if (videoMap.size === 0 && postMap.size === 0) return items;
+	let hasChanges = false;
+	const next = items.map((item) => {
+		if (item.kind === "video") {
+			const interaction = videoMap.get(item.id);
+			if (!interaction) return item;
+			const nextInfo = applyInteractionToInfo(item.originalData, interaction);
+			if (nextInfo === item.originalData) return item;
+			hasChanges = true;
+			return {
+				...item,
+				originalData: nextInfo
+			};
+		}
+		if (item.kind === "post") {
+			const interaction = postMap.get(item.id);
+			if (!interaction) return item;
+			const nextInfo = applyInteractionToInfo(item.originalData, interaction);
+			if (nextInfo === item.originalData) return item;
+			hasChanges = true;
+			return {
+				...item,
+				originalData: nextInfo
+			};
+		}
+		return item;
+	});
+	return hasChanges ? next : items;
+}
+/**
+* 将互动状态合并到 infos 列表。
+*/
+function mergeInteractionIntoInfos(infos, interactionMap) {
+	if (interactionMap.size === 0) return infos;
+	let hasChanges = false;
+	const next = infos.map((info) => {
+		const interaction = interactionMap.get(String(info.id));
+		if (!interaction) return info;
+		const nextInfo = applyInteractionToInfo(info, interaction);
+		if (nextInfo === info) return info;
+		hasChanges = true;
+		return nextInfo;
+	});
+	return hasChanges ? next : infos;
+}
+
+//#endregion
+export { buildInteractionMap, collectPendingInteractionIds, collectPendingInteractionIdsFromInfos, mergeInteractionIntoFeedItems, mergeInteractionIntoInfos };