client: delete protected/ dir and SSG homepage again, but with graceful fallback (#107)
This commit is contained in:
parent
57cded29c3
commit
265f7b6161
2 changed files with 22 additions and 112 deletions
|
@ -2,9 +2,17 @@ import styles from "@styles/Home.module.css"
|
|||
import PageSeo from "@components/page-seo"
|
||||
import HomeComponent from "@components/home"
|
||||
import { Page, Text } from "@geist-ui/core"
|
||||
import { GetServerSideProps } from "next"
|
||||
import type { GetStaticProps } from "next"
|
||||
import { InferGetStaticPropsType } from 'next'
|
||||
type Props = {
|
||||
introContent: string
|
||||
introTitle: string
|
||||
rendered: string
|
||||
} | {
|
||||
error: boolean
|
||||
}
|
||||
|
||||
export const getServerSideProps: GetServerSideProps = async ({ res }) => {
|
||||
export const getStaticProps: GetStaticProps = async () => {
|
||||
try {
|
||||
const resp = await fetch(process.env.API_URL + `/welcome`, {
|
||||
method: "GET",
|
||||
|
@ -15,36 +23,30 @@ export const getServerSideProps: GetServerSideProps = async ({ res }) => {
|
|||
})
|
||||
|
||||
const { title, content, rendered } = await resp.json()
|
||||
|
||||
res.setHeader(
|
||||
"Cache-Control",
|
||||
`public, s-maxage=${60 * 60 * 24 * 360}, max-age=${60 * 60 * 24 * 360}`
|
||||
)
|
||||
|
||||
return {
|
||||
props: {
|
||||
introContent: content || null,
|
||||
rendered: rendered || null,
|
||||
introTitle: title || null
|
||||
}
|
||||
},
|
||||
// Next.js will attempt to re-generate the page:
|
||||
// - When a request comes in
|
||||
// - At most every 60 seconds
|
||||
revalidate: 60, // In seconds
|
||||
}
|
||||
} catch (error) {
|
||||
} catch (err) {
|
||||
// If there was an error, it's likely due to the server not running, so we attempt to regenerate the page
|
||||
return {
|
||||
props: {
|
||||
error: true
|
||||
}
|
||||
error: true,
|
||||
},
|
||||
revalidate: 10, // In seconds
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
type Props = {
|
||||
introContent: string
|
||||
introTitle: string
|
||||
rendered: string
|
||||
error?: boolean
|
||||
}
|
||||
|
||||
const Home = ({ rendered, introContent, introTitle, error }: Props) => {
|
||||
// TODO: fix props type
|
||||
const Home = ({ rendered, introContent, introTitle, error }: InferGetStaticPropsType<typeof getStaticProps>) => {
|
||||
return (
|
||||
<Page className={styles.wrapper}>
|
||||
<PageSeo />
|
||||
|
|
|
@ -1,92 +0,0 @@
|
|||
import { Page, useToasts } from "@geist-ui/core"
|
||||
|
||||
import type { Post } from "@lib/types"
|
||||
import PasswordModal from "@components/new-post/password-modal"
|
||||
import { useEffect, useState } from "react"
|
||||
import { useRouter } from "next/router"
|
||||
import Cookies from "js-cookie"
|
||||
import PostPage from "@components/post-page"
|
||||
|
||||
const Post = () => {
|
||||
const [isPasswordModalOpen, setIsPasswordModalOpen] = useState(true)
|
||||
const [post, setPost] = useState<Post>()
|
||||
const router = useRouter()
|
||||
const { setToast } = useToasts()
|
||||
|
||||
useEffect(() => {
|
||||
if (router.isReady) {
|
||||
const fetchPostWithAuth = async () => {
|
||||
const resp = await fetch(`/server-api/posts/${router.query.id}`, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${Cookies.get("drift-token")}`
|
||||
}
|
||||
})
|
||||
if (!resp.ok) return
|
||||
const post = await resp.json()
|
||||
|
||||
if (!post) return
|
||||
setPost(post)
|
||||
}
|
||||
fetchPostWithAuth()
|
||||
}
|
||||
}, [router.isReady, router.query.id])
|
||||
|
||||
const onSubmit = async (password: string) => {
|
||||
const res = await fetch(
|
||||
`/server-api/posts/${router.query.id}?password=${password}`,
|
||||
{
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
if (!res.ok) {
|
||||
setToast({
|
||||
type: "error",
|
||||
text: "Wrong password"
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
const data = await res.json()
|
||||
if (data) {
|
||||
if (data.error) {
|
||||
setToast({
|
||||
text: data.error,
|
||||
type: "error"
|
||||
})
|
||||
} else {
|
||||
setPost(data)
|
||||
setIsPasswordModalOpen(false)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const onClose = () => {
|
||||
setIsPasswordModalOpen(false)
|
||||
router.push("/")
|
||||
}
|
||||
|
||||
if (!router.isReady) {
|
||||
return <></>
|
||||
}
|
||||
|
||||
if (!post) {
|
||||
return (
|
||||
<Page>
|
||||
<PasswordModal
|
||||
creating={false}
|
||||
onClose={onClose}
|
||||
onSubmit={onSubmit}
|
||||
isOpen={isPasswordModalOpen}
|
||||
/>
|
||||
</Page>
|
||||
)
|
||||
}
|
||||
|
||||
return <PostPage post={post} />
|
||||
}
|
||||
|
||||
export default Post
|
Loading…
Reference in a new issue