wildebeest/frontend/src/routes/(frontend)/[accountId]/index.tsx

60 wiersze
1.8 KiB
TypeScript

import { $, component$ } from '@builder.io/qwik'
import { loader$ } from '@builder.io/qwik-city'
import { getErrorHtml } from '~/utils/getErrorHtml/getErrorHtml'
import type { MastodonStatus } from '~/types'
import { StatusesPanel } from '~/components/StatusesPanel/StatusesPanel'
import { getLocalStatuses } from 'wildebeest/functions/api/v1/accounts/[id]/statuses'
import { parseHandle } from 'wildebeest/backend/src/utils/parse'
export const statusesLoader = loader$<
Promise<{
accountId: string
statuses: MastodonStatus[]
}>,
{ DATABASE: D1Database }
>(async ({ platform, request, html }) => {
let statuses: MastodonStatus[] = []
let accountId = ''
try {
const url = new URL(request.url)
accountId = url.pathname.split('/')[1]
const handle = parseHandle(accountId)
accountId = handle.localPart
const response = await getLocalStatuses(request as Request, platform.DATABASE, handle, 0, false)
statuses = await response.json<Array<MastodonStatus>>()
} catch {
throw html(
500,
getErrorHtml(`An error happened when trying to retrieve the account's statuses, please try again later`)
)
}
return { accountId, statuses: JSON.parse(JSON.stringify(statuses)) }
})
export default component$(() => {
const { accountId, statuses } = statusesLoader().value
return (
<div data-testid="account-posts">
<StatusesPanel
initialStatuses={statuses}
fetchMoreStatuses={$(async (numOfCurrentStatuses: number) => {
let statuses: MastodonStatus[] = []
try {
const response = await fetch(`/api/v1/accounts/${accountId}/statuses?offset=${numOfCurrentStatuses}`)
if (response.ok) {
const results = await response.text()
statuses = JSON.parse(results)
}
} catch {
/* empty */
}
return statuses
})}
/>
</div>
)
})