Zhou Weidong
ecfbd3b8b5
- 按 app / shared / entities / features 分层，路由懒加载并抽出布局组件 - 请求层改为可插拔拦截器，统一错误类型、超时取消与端点拆分 - 抽取播放器、骨架屏、网格等复用组件，点赞收藏接入统一交互反馈 - 关于页重做为无边框极光风格，补充 iOS / Google Play 下载入口 - 修复播放页滚轮切集吞事件、页面误滚动、后台持续播放与声音记忆问题 - 语言按本地偏好与 IP 识别，国旗改为内联 SVG - 清理未使用的旧站点文件，补充 ESLint 配置
50 lines
2.0 KiB
React
50 lines
2.0 KiB
React
// Author: fruit.com.cn
|
|
import { Search as SearchIcon } from 'lucide-react';
|
|
import { useSearchParams } from 'react-router-dom';
|
|
import { useLocale } from '../../app/providers/AppProviders';
|
|
import { SectionHeading } from '../../shared/components/SectionHeading';
|
|
import { VideoGrid } from '../../shared/components/VideoGrid';
|
|
import { VideoGridSkeleton } from '../../shared/components/skeletons';
|
|
import { useRequest } from '../../shared/hooks/useRequest';
|
|
import { normalizePage } from '../../shared/lib/pagination';
|
|
import { dramaApi } from '../../entities/drama/api';
|
|
import { normalizeDrama, uniqueDramas } from '../../entities/drama/model';
|
|
import { searchApi } from './api';
|
|
|
|
async function loadSearchResults(keyword, localeCode, signal) {
|
|
if (keyword) {
|
|
const payload = await searchApi.search(keyword, { signal });
|
|
return normalizePage(payload).list.map((item) => normalizeDrama(item, localeCode));
|
|
}
|
|
const payload = await dramaApi.homeFeed({ signal });
|
|
const items = payload?.sections?.flatMap((section) => section.dramas || []) || [];
|
|
return uniqueDramas(items.map((item) => normalizeDrama(item, localeCode)));
|
|
}
|
|
|
|
export function SearchPage() {
|
|
const { locale } = useLocale();
|
|
const [params] = useSearchParams();
|
|
const query = (params.get('q') || '').trim();
|
|
const request = useRequest(({ signal }) => loadSearchResults(query, locale.code, signal), [query, locale.code]);
|
|
const results = request.data || [];
|
|
|
|
return (
|
|
<>
|
|
<SectionHeading title={query ? `${locale.searchResults} “${query}”` : locale.picks} />
|
|
{request.loading ? <VideoGridSkeleton count={6} label={locale.loading} /> : (
|
|
<>
|
|
{request.error && <div className="api-note warning">{locale.apiFallback}</div>}
|
|
{!request.error && query && results.length === 0 ? (
|
|
<div className="search-empty">
|
|
<SearchIcon size={28} />
|
|
<b>{locale.noResults} “{query}”</b>
|
|
</div>
|
|
) : (
|
|
<VideoGrid items={results} />
|
|
)}
|
|
</>
|
|
)}
|
|
</>
|
|
);
|
|
}
|