Fix home page

This commit is contained in:
2025-10-04 09:28:30 +08:00
parent 9bf5149cff
commit 02a33e00b3

View File

@@ -67,18 +67,25 @@ export default function HomePage() {
); );
} }
let cachedPinnedResources: Resource[] | null = null;
function HomeHeader() { function HomeHeader() {
const [pinnedResources, setPinnedResources] = useState<Resource[]>([]); const [pinnedResources, setPinnedResources] = useState<Resource[]>([]);
const [statistic, setStatistic] = useState<Statistics | null>(null); const [statistic, setStatistic] = useState<Statistics | null>(null);
const navigator = useNavigator(); const navigator = useNavigator();
const appContext = useAppContext();
useEffect(() => { useEffect(() => {
if (cachedPinnedResources != null) { const pinned = appContext.get("pinned_resources");
setPinnedResources(cachedPinnedResources); const stats = appContext.get("site_statistics");
if (pinned) {
setPinnedResources(pinned);
}
if (stats) {
setStatistic(stats);
}
if (pinned && stats) {
return; return;
} }
const prefetchData = app.getPreFetchData(); const prefetchData = app.getPreFetchData();
if (prefetchData && prefetchData.background) { if (prefetchData && prefetchData.background) {
navigator.setBackground( navigator.setBackground(
@@ -89,32 +96,36 @@ function HomeHeader() {
let ok2 = false; let ok2 = false;
if (prefetchData && prefetchData.statistics) { if (prefetchData && prefetchData.statistics) {
setStatistic(prefetchData.statistics); setStatistic(prefetchData.statistics);
appContext.set("site_statistics", prefetchData.statistics);
ok1 = true; ok1 = true;
} }
if (prefetchData && prefetchData.pinned) { if (prefetchData && prefetchData.pinned) {
cachedPinnedResources = prefetchData.pinned; const r = prefetchData.pinned;
setPinnedResources(cachedPinnedResources!); appContext.set("pinned_resources", r);
setPinnedResources(r!);
ok2 = true; ok2 = true;
} }
if (ok1 && ok2) { if (ok1 && ok2) {
return; return;
} }
const fetchPinnedResources = async () => { const fetchPinnedResources = async () => {
const res = await network.getPinnedResources(); const res = await network.getPinnedResources();
if (res.success) { if (res.success) {
cachedPinnedResources = res.data ?? []; appContext.set("pinned_resources", res.data);
setPinnedResources(res.data ?? []); setPinnedResources(res.data ?? []);
} }
}; };
const fetchStatistics = async () => { const fetchStatistics = async () => {
const res = await network.getStatistic(); const res = await network.getStatistic();
if (res.success) { if (res.success) {
appContext.set("site_statistics", res.data);
setStatistic(res.data!); setStatistic(res.data!);
} }
}; };
fetchPinnedResources(); fetchPinnedResources();
fetchStatistics(); fetchStatistics();
}, [navigator]); }, [appContext, navigator]);
if (pinnedResources.length == 0 || statistic == null) { if (pinnedResources.length == 0 || statistic == null) {
return <></>; return <></>;
@@ -123,8 +134,8 @@ function HomeHeader() {
return ( return (
<div className="grid grid-cols-1 md:grid-cols-2 p-4 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 p-4 gap-4">
<PinnedResourceItem resource={pinnedResources[0]} /> <PinnedResourceItem resource={pinnedResources[0]} />
<div className={"hidden md:block"}> <div className={"hidden md:flex h-52 md:h-60 flex-col"}>
<div className={"card w-full shadow p-4 mb-4 bg-base-100-tr82 h-28"}> <div className={"card w-full shadow p-4 mb-4 bg-base-100-tr82 flex-1"}>
<h2 className={"text-lg font-bold pb-2"}>{app.appName}</h2> <h2 className={"text-lg font-bold pb-2"}>{app.appName}</h2>
<p className={"text-xs"}>{app.siteDescription}</p> <p className={"text-xs"}>{app.siteDescription}</p>
</div> </div>
@@ -156,7 +167,7 @@ function PinnedResourceItem({ resource }: { resource: Resource }) {
<img <img
src={network.getResampledImageUrl(resource.image.id)} src={network.getResampledImageUrl(resource.image.id)}
alt="cover" alt="cover"
className="w-full h-52 lg:h-60 object-cover" className="w-full h-52 md:h-60 object-cover"
/> />
</figure> </figure>
)} )}