404 page made right (#323)

This commit is contained in:
Igor Lobanov 2023-11-18 16:20:15 +01:00 committed by GitHub
parent 8cad60bdda
commit ef784e288a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 27 additions and 18 deletions

View File

@ -84,8 +84,11 @@ const pagesMap: Record<keyof typeof ROUTES, Component<PageProps>> = {
fourOuFour: FourOuFourPage,
}
export const App = (props: PageProps) => {
type Props = PageProps & { is404: boolean }
export const App = (props: Props) => {
const { page, searchParams } = useRouter<RootSearchParams>()
let is404 = props.is404
createEffect(() => {
if (!searchParams().modal) {
@ -101,7 +104,8 @@ export const App = (props: PageProps) => {
const pageComponent = createMemo(() => {
const result = pagesMap[page()?.route || 'home']
if (!result || page()?.path === '/404') {
if (is404 || !result || page()?.path === '/404') {
is404 = false
return FourOuFourPage
}

View File

@ -10,7 +10,7 @@ export const onBeforeRender = async (pageContext: PageContext) => {
const article = await apiClient.getShoutBySlug(slug)
if (!article) {
throw render(404, '/404')
throw render(404)
}
const pageProps: PageProps = { article, seo: { title: article.title } }

View File

@ -1,17 +1,24 @@
import type { PageProps } from './types'
import type { PageContext } from '../renderer/types'
import { render } from 'vike/abort'
import { PRERENDERED_ARTICLES_COUNT } from '../components/Views/Author'
import { apiClient } from '../utils/apiClient'
export const onBeforeRender = async (pageContext: PageContext) => {
const { slug } = pageContext.routeParams
const author = await apiClient.getAuthor({ slug })
if (!author) {
throw render(404)
}
const authorShouts = await apiClient.getShouts({
filters: { author: slug, visibility: 'community' },
limit: PRERENDERED_ARTICLES_COUNT,
})
const author = await apiClient.getAuthor({ slug })
const pageProps: PageProps = { author, authorShouts, seo: { title: author.name } }

View File

@ -1,6 +1,8 @@
import type { PageProps } from './types'
import type { PageContext } from '../renderer/types'
import { render } from 'vike/abort'
import { apiClient } from '../utils/apiClient'
export const onBeforeRender = async (pageContext: PageContext) => {
@ -8,6 +10,10 @@ export const onBeforeRender = async (pageContext: PageContext) => {
const topic = await apiClient.getTopic({ slug })
if (!topic) {
throw render(404)
}
const pageProps: PageProps = { topic, seo: { title: topic.title } }
return {

View File

@ -17,13 +17,9 @@ let layoutReady = false
export const render = async (pageContext: PageContextBuiltInClientWithClientRouting & PageContext) => {
const { lng, pageProps, is404 } = pageContext
if (is404) {
initRouter('/404')
} else {
const { pathname, search } = window.location
const searchParams = Object.fromEntries(new URLSearchParams(search))
initRouter(pathname, searchParams)
}
if (SENTRY_DSN) {
Sentry.init({
@ -53,7 +49,7 @@ export const render = async (pageContext: PageContextBuiltInClientWithClientRout
const content = document.querySelector('#root')
if (!layoutReady) {
hydrate(() => <App {...pageProps} />, content)
hydrate(() => <App {...pageProps} is404={is404} />, content)
layoutReady = true
}
}

View File

@ -48,15 +48,11 @@ export const render = async (pageContext: PageContext) => {
await i18next.changeLanguage(lng)
}
if (pageContext.is404) {
initRouter('/404')
} else {
initRouter(pageContext.urlParsed.pathname, pageContext.urlParsed.search)
}
pageContext.lng = lng
const rootContent = renderToString(() => <App {...pageContext.pageProps} />)
const rootContent = renderToString(() => <App {...pageContext.pageProps} is404={pageContext.is404} />)
return escapeInject`<!DOCTYPE html>
<html lang="${lng}">