diff --git a/src/app/(posts)/post/[id]/components/post-files/index.tsx b/src/app/(posts)/post/[id]/components/post-files/index.tsx index 4354a67d..7773d620 100644 --- a/src/app/(posts)/post/[id]/components/post-files/index.tsx +++ b/src/app/(posts)/post/[id]/components/post-files/index.tsx @@ -21,7 +21,7 @@ const PostFiles = ({ post: _initialPost }: Props) => { const [post, setPost] = useState(initialPost) const router = useRouter() - if (post.expiresAt) { + if (post?.expiresAt) { if (new Date(post.expiresAt) < new Date()) { router.push("/expired") } @@ -29,7 +29,7 @@ const PostFiles = ({ post: _initialPost }: Props) => { useEffect(() => { let interval: NodeJS.Timer | null = null - if (post.expiresAt) { + if (post?.expiresAt) { interval = setInterval(() => { const expirationDate = new Date(post.expiresAt ? post.expiresAt : "") if (expirationDate < new Date()) { @@ -41,10 +41,10 @@ const PostFiles = ({ post: _initialPost }: Props) => { return () => { if (interval) clearInterval(interval) } - }, [post.expiresAt, router]) + }, [post?.expiresAt, router]) - const isProtected = post.visibility === "protected" - const hasFetched = post.files !== undefined + const isProtected = post?.visibility === "protected" + const hasFetched = post?.files !== undefined if (isProtected && !hasFetched) { return ( { gap: "var(--gap-double)" }} > - {post.files?.map(({ id, content, title, html }) => ( + {post?.files?.map(({ id, content, title, html }) => ( { status === "loading" ? undefined : session?.user && session?.user?.id === authorId - const [isPasswordModalOpen, setIsPasswordModalOpen] = useState(true) - + const [isPasswordModalOpen, setIsPasswordModalOpen] = useState(false) const onSubmit = useCallback(async (password: string) => { const res = await fetch(`/api/post/${postId}?password=${password}`, { method: "GET", @@ -48,7 +47,7 @@ const PasswordModalPage = ({ setPost, postId, authorId }: Props) => { }) } else { setIsPasswordModalOpen(false) - setPost(data) + setPost(data.post) } } }, [postId, setPost, setToast]) @@ -66,6 +65,8 @@ const PasswordModalPage = ({ setPost, postId, authorId }: Props) => { "You're the author of this post, so you automatically have access to it.", type: "default" }) + } else if (isAuthor === false) { + setIsPasswordModalOpen(true) } }, [isAuthor, onSubmit, setToast]) diff --git a/src/app/components/badges/visibility-control/index.tsx b/src/app/components/badges/visibility-control/index.tsx index 3d52da8a..a8d16299 100644 --- a/src/app/components/badges/visibility-control/index.tsx +++ b/src/app/components/badges/visibility-control/index.tsx @@ -7,6 +7,7 @@ import Button from "@components/button" import { useToasts } from "@components/toasts" import { Spinner } from "@components/spinner" import { useSession } from "next-auth/react" +import { useRouter } from "next/navigation" type Props = { authorId: string @@ -22,6 +23,7 @@ const VisibilityControl = ({ authorId, postId, visibility: postVisibility }: Pro const [isSubmitting, setSubmitting] = useState() const [passwordModalVisible, setPasswordModalVisible] = useState(false) const { setToast } = useToasts() + const router = useRouter(); const sendRequest = useCallback( async (visibility: string, password?: string) => { @@ -36,6 +38,7 @@ const VisibilityControl = ({ authorId, postId, visibility: postVisibility }: Pro if (res.ok) { const json = await res.json() setVisibility(json.visibility) + router.refresh() } else { setToast({ message: "An error occurred", diff --git a/src/app/components/header/header.module.css b/src/app/components/header/header.module.css index 06f9f772..2f69ef6b 100644 --- a/src/app/components/header/header.module.css +++ b/src/app/components/header/header.module.css @@ -38,7 +38,7 @@ .header { transition: opacity 0.2s ease-in-out; - opacity: 0; + opacity: .5; } .header:not(.loading) { @@ -67,6 +67,10 @@ } @media only screen and (max-width: 768px) { + .header { + opacity: 1; + } + .wrapper [data-tab="github"] { display: none; } diff --git a/src/app/components/page/page.module.css b/src/app/components/page/page.module.css index 1f2a4236..3957cab0 100644 --- a/src/app/components/page/page.module.css +++ b/src/app/components/page/page.module.css @@ -7,3 +7,10 @@ height: auto; margin: 0 auto; } + +/* 55rem == --main-content */ +@media screen and (max-width: 55rem) { + .page { + padding: 0 1rem; + } +} diff --git a/src/app/page.tsx b/src/app/page.tsx index 1078959d..882669bd 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -66,7 +66,7 @@ export default async function Page() {

Recent public posts

- {/* @ts-ignore because of async RSC */} + {/* @ts-expect-error because of async RSC */}
@@ -78,16 +78,28 @@ async function PublicPostList({ }: { getPostsPromise: Promise }) { - const posts = await getPostsPromise - return ( - - ) + try { + const posts = await getPostsPromise + return ( + + ) + } catch (error) { + return ( + + ) + } } export const revalidate = 60 diff --git a/src/pages/api/post/[id].ts b/src/pages/api/post/[id].ts index 0fd60656..d95db352 100644 --- a/src/pages/api/post/[id].ts +++ b/src/pages/api/post/[id].ts @@ -44,7 +44,8 @@ async function handleGet(req: NextApiRequest, res: NextApiResponse) { // the user can always go directly to their own post if (session?.user.id === post.authorId) { return res.json({ - ...post + post: post, + password: undefined }) } @@ -58,7 +59,8 @@ async function handleGet(req: NextApiRequest, res: NextApiResponse) { if (hash === post.password) { return res.json({ - ...post + post, + password: undefined }) } else { return res.json({