76 lines
2.0 KiB
TypeScript
76 lines
2.0 KiB
TypeScript
import { LoaderFunctionArgs, useLoaderData } from "react-router-dom";
|
|
import { createSharesPageURL } from "#lib/urls";
|
|
import { parseOffset } from "#lib/pagination";
|
|
import { fetchShares } from "#api/shares";
|
|
import { PageSkeleton } from "#components/pages";
|
|
import { Paginator } from "#components/pagination";
|
|
import { CardList, ShareCard } from "#components/cards";
|
|
import { IShare } from "#entities/files";
|
|
|
|
interface IProps {
|
|
count: number;
|
|
offset?: number;
|
|
shares: IShare[];
|
|
}
|
|
|
|
export function SharesPage() {
|
|
const { count, offset, shares } = useLoaderData() as IProps;
|
|
const title = "Filehaus";
|
|
const heading = "Filehaus";
|
|
|
|
return (
|
|
<PageSkeleton name="all-dms" title={title} heading={heading}>
|
|
<div className="paginator" id="paginator-top">
|
|
<Paginator
|
|
count={count}
|
|
offset={offset}
|
|
constructURL={(offset) => String(createSharesPageURL(offset))}
|
|
/>
|
|
</div>
|
|
|
|
<CardList layout="phone">
|
|
{count === 0 ? (
|
|
<div className="no-results">
|
|
<h2 className="site-section__subheading">
|
|
Nobody here but us chickens!
|
|
</h2>
|
|
<p className="subtitle">There are no uploads.</p>
|
|
</div>
|
|
) : (
|
|
shares.map((share) => <ShareCard key={share.id} share={share} />)
|
|
)}
|
|
</CardList>
|
|
|
|
<div className="paginator" id="paginator-bottom">
|
|
<Paginator
|
|
count={count}
|
|
offset={offset}
|
|
constructURL={(offset) => String(createSharesPageURL(offset))}
|
|
/>
|
|
</div>
|
|
</PageSkeleton>
|
|
);
|
|
}
|
|
|
|
export async function loader({ request }: LoaderFunctionArgs): Promise<IProps> {
|
|
const searchParams = new URL(request.url).searchParams;
|
|
|
|
let offset: number | undefined = undefined;
|
|
{
|
|
const inputOffset = searchParams.get("o")?.trim();
|
|
|
|
if (inputOffset) {
|
|
offset = parseOffset(inputOffset);
|
|
}
|
|
}
|
|
|
|
const { props } = await fetchShares(offset);
|
|
const { count, shares } = props;
|
|
|
|
return {
|
|
offset,
|
|
count,
|
|
shares,
|
|
};
|
|
}
|