Improve user pages

This commit is contained in:
MeowcaTheoRange 2024-04-24 22:40:30 -05:00
parent 2512dd0732
commit 63a90cb3a4

View file

@ -16,11 +16,15 @@ export default async function Home({
user: string user: string
}, },
searchParams: { searchParams: {
until: string jamuntil: string,
conuntil: string,
juduntil: string
} }
}) { }) {
const curDate = Date.now(); const curDate = Date.now();
const curPage = parseInt(searchParams?.until) || curDate; const jamPage = parseInt(searchParams?.jamuntil) || curDate;
const contentPage = parseInt(searchParams?.conuntil) || curDate;
const judgementPage = parseInt(searchParams?.juduntil) || curDate;
const cookieStore = cookies(); const cookieStore = cookies();
const token = cookieStore.get('token')?.value; const token = cookieStore.get('token')?.value;
@ -57,7 +61,7 @@ export default async function Home({
let content = await db let content = await db
.selectFrom('content') .selectFrom('content')
.where('content.author_id', '=', user.id) .where('content.author_id', '=', user.id)
.where('content.submitted', '<=', curPage) .where('content.submitted', '<=', contentPage)
.limit(20) .limit(20)
.orderBy('content.submitted', 'desc') .orderBy('content.submitted', 'desc')
.selectAll() .selectAll()
@ -66,7 +70,7 @@ export default async function Home({
let jams = await db let jams = await db
.selectFrom('jams') .selectFrom('jams')
.where('jams.author_id', '=', user.id) .where('jams.author_id', '=', user.id)
.where('jams.created', '<=', curPage) .where('jams.created', '<=', jamPage)
.limit(20) .limit(20)
.orderBy('jams.created', 'desc') .orderBy('jams.created', 'desc')
.selectAll() .selectAll()
@ -75,7 +79,7 @@ export default async function Home({
let judgements = await db let judgements = await db
.selectFrom('judgements') .selectFrom('judgements')
.where('judgements.author_id', '=', user.id) .where('judgements.author_id', '=', user.id)
.where('judgements.published', '<=', curPage) .where('judgements.published', '<=', judgementPage)
.limit(20) .limit(20)
.orderBy('judgements.published', 'desc') .orderBy('judgements.published', 'desc')
.selectAll() .selectAll()
@ -93,85 +97,109 @@ export default async function Home({
<ConditionalNull condition={existingUser?.admin || existingUser?.id == user.id}><p><a href={`/jams/delete/user/${user.id}`}>Delete user</a></p></ConditionalNull> <ConditionalNull condition={existingUser?.admin || existingUser?.id == user.id}><p><a href={`/jams/delete/user/${user.id}`}>Delete user</a></p></ConditionalNull>
</div> </div>
</ConditionalNull> </ConditionalNull>
<h1>Jams</h1> <ConditionalNull condition={jams.length > 0}>
{jams.map(async (jam:JSONJamTable) => { <h1>Jams</h1>
const started = Date.now() >= parseInt(jam.date_start); {jams.map(async (jam:JSONJamTable) => {
const ended = Date.now() >= parseInt(jam.date_end); const started = Date.now() >= parseInt(jam.date_start);
const ended = Date.now() >= parseInt(jam.date_end);
let jamOwner = await db
.selectFrom('users') let jamOwner = await db
.where('users.id', '=', jam.author_id) .selectFrom('users')
.selectAll() .where('users.id', '=', jam.author_id)
.executeTakeFirst(); .selectAll()
.executeTakeFirst();
if (jamOwner == null) return <p>An error occured.</p>;
if (jamOwner == null) return <p>An error occured.</p>;
return (<div style={{ return (<div style={{
margin: "16px 0" margin: "16px 0"
}}> }}>
<h2><Link href={`/jams/jam/${jam.id}`}>{jam.name}</Link></h2> <h2><Link href={`/jams/jam/${jam.id}`}>{jam.name}</Link></h2>
<p><small>{started ? "Started" : "Starts"} {new Date(parseInt(jam.date_start)).toDateString()} - {ended ? "Ended" : "Ends"} {new Date(parseInt(jam.date_end)).toDateString()}</small></p> <p><small>{started ? "Started" : "Starts"} {new Date(parseInt(jam.date_start)).toDateString()} - {ended ? "Ended" : "Ends"} {new Date(parseInt(jam.date_end)).toDateString()}</small></p>
<p>{jam.description}</p> <p>{jam.description}</p>
</div>); </div>);
})} })}
<h1>Submissions</h1> <div className="navigation">
{content.map(async (content:JSONContentTable) => { <ConditionalNull condition={jamPage < curDate}>
let contentOwner = await db <Link href={`?`}>Later</Link>
.selectFrom('users') </ConditionalNull>
.where('users.id', '=', content.author_id) <ConditionalNull condition={jams.length > 20}>
.selectAll() <Link href={`?jamuntil=${parseInt(jams.at(-1)?.created || jamPage + "") - 1}`}>Earlier</Link>
.executeTakeFirst(); </ConditionalNull>
</div>
if (contentOwner == null) return <p>An error occured.</p>; </ConditionalNull>
<ConditionalNull condition={content.length > 0}>
// It's a JSONJamTable. I don't know why TS hates `number` => `string` conversion. <h1>Submissions</h1>
let submittedJam = await db {content.map(async (content:JSONContentTable) => {
.selectFrom('jams') let contentOwner = await db
.where('jams.id', '=', content.jam_id) .selectFrom('users')
.selectAll() .where('users.id', '=', content.author_id)
.executeTakeFirst() as unknown as JSONJamTable; .selectAll()
.executeTakeFirst();
if (submittedJam == null) return <p>An error occured.</p>;
if (contentOwner == null) return <p>An error occured.</p>;
// It's a JSONJamTable. I don't know why TS hates `number` => `string` conversion.
let submittedJam = await db
.selectFrom('jams')
.where('jams.id', '=', content.jam_id)
.selectAll()
.executeTakeFirst() as unknown as JSONJamTable;
if (submittedJam == null) return <p>An error occured.</p>;
return (<div style={{ return (<div style={{
margin: "16px 0" margin: "16px 0"
}}> }}>
<h2><Link href={`/jams/content/${content.id}`}>{content.name}</Link></h2> <h2><Link href={`/jams/content/${content.id}`}>{content.name}</Link></h2>
<p><small>Submitted {new Date(parseInt(content.submitted)).toDateString()} to <a href={`/jams/jam/${submittedJam.id}?until=${content.submitted}`}>{submittedJam.name}</a></small></p> <p><small>Submitted {new Date(parseInt(content.submitted)).toDateString()} to <a href={`/jams/jam/${submittedJam.id}?until=${content.submitted}`}>{submittedJam.name}</a></small></p>
<p>{content.description}</p> <p>{content.description}</p>
</div>); </div>);
})} })}
<h1>Judgements</h1> <div className="navigation">
{judgements.map(async (judgement:JSONJudgementTable) => { <ConditionalNull condition={contentPage < curDate}>
let judgementOwner = await db <Link href={`?`}>Later</Link>
.selectFrom('users') </ConditionalNull>
.where('users.id', '=', judgement.author_id) <ConditionalNull condition={content.length > 20}>
.selectAll() <Link href={`?conuntil=${parseInt(content.at(-1)?.submitted || contentPage + "") - 1}`}>Earlier</Link>
.executeTakeFirst(); </ConditionalNull>
</div>
// It's a JSONJamTable. I don't know why TS hates `number` => `string` conversion. </ConditionalNull>
let submittedContent = await db <ConditionalNull condition={judgements.length > 0}>
.selectFrom('content') <h1>Judgements</h1>
.where('content.id', '=', judgement.content_id) {judgements.map(async (judgement:JSONJudgementTable) => {
.selectAll() let judgementOwner = await db
.executeTakeFirst() as unknown as JSONContentTable; .selectFrom('users')
.where('users.id', '=', judgement.author_id)
if (judgementOwner == null) return <p>An error occured.</p>; .selectAll()
.executeTakeFirst();
// It's a JSONJamTable. I don't know why TS hates `number` => `string` conversion.
let submittedContent = await db
.selectFrom('content')
.where('content.id', '=', judgement.content_id)
.selectAll()
.executeTakeFirst() as unknown as JSONContentTable;
if (judgementOwner == null) return <p>An error occured.</p>;
return (<div style={{ return (<div style={{
margin: "16px 0" margin: "16px 0"
}}> }}>
<h2><a href={`/jams/content/${judgement.content_id}?until=${judgement.published}`}>{`${judgementOwner.username}@${judgementOwner.instance}`}</a></h2> <h2><a href={`/jams/content/${judgement.content_id}?until=${judgement.published}`}>{`${judgementOwner.username}@${judgementOwner.instance}`}</a></h2>
<p><small>Published {new Date(parseInt(judgement.published)).toDateString()} on <a href={`/jams/content/${submittedContent.id}?until=${judgement.published}`}>{submittedContent.name}</a></small></p> <p><small>Published {new Date(parseInt(judgement.published)).toDateString()} on <a href={`/jams/content/${submittedContent.id}?until=${judgement.published}`}>{submittedContent.name}</a></small></p>
<p>{judgement.content}</p> <p>{judgement.content}</p>
</div>); </div>);
})} })}
{/* <div className="navigation"> <div className="navigation">
<ConditionalNull condition={curPage < curDate}> <ConditionalNull condition={judgementPage < curDate}>
<Link href={`?`}>Later</Link> <Link href={`?`}>Later</Link>
</ConditionalNull> </ConditionalNull>
<Link href={`?until=${content.at(-1)?.submitted}`}>Earlier</Link> <ConditionalNull condition={judgements.length > 20}>
</div> */} <Link href={`?juduntil=${parseInt(judgements.at(-1)?.published || judgementPage + "") - 1}`}>Earlier</Link>
</ConditionalNull>
</div>
</ConditionalNull>
</MainLayout> </MainLayout>
) )
} }