diff --git a/client/package.json b/client/package.json
index 0a61aa98..cf6ce614 100644
--- a/client/package.json
+++ b/client/package.json
@@ -12,9 +12,11 @@
"@fec/remark-a11y-emoji": "^3.1.0",
"@geist-ui/core": "^2.3.5",
"@geist-ui/icons": "^1.0.1",
+ "@types/cookie": "^0.4.1",
"@types/js-cookie": "^3.0.1",
"client-zip": "^2.0.0",
"comlink": "^4.3.1",
+ "cookie": "^0.4.2",
"dotenv": "^16.0.0",
"js-cookie": "^3.0.1",
"next": "12.1.0",
diff --git a/client/pages/_app.tsx b/client/pages/_app.tsx
index 91888263..d3bf55d3 100644
--- a/client/pages/_app.tsx
+++ b/client/pages/_app.tsx
@@ -13,6 +13,12 @@ export type ThemeProps = {
changeTheme: () => void
}
+export type PostProps = {
+ renderedPost: any | null, // Still don't have an official data type for posts
+ theme: "light" | "dark" | string,
+ changeTheme: () => void
+}
+
type AppProps
= {
pageProps: P;
} & Omit, "pageProps">;
diff --git a/client/pages/post/[id].tsx b/client/pages/post/[id].tsx
index 0bd32738..cddf7947 100644
--- a/client/pages/post/[id].tsx
+++ b/client/pages/post/[id].tsx
@@ -6,13 +6,16 @@ import { useEffect, useState } from "react";
import Document from '../../components/document'
import Header from "../../components/header";
import VisibilityBadge from "../../components/visibility-badge";
-import { ThemeProps } from "../_app";
+import { PostProps } from "../_app";
import PageSeo from "components/page-seo";
import styles from './styles.module.css';
import Cookies from "js-cookie";
+import cookie from "cookie";
+import { GetServerSideProps } from "next";
-const Post = ({ theme, changeTheme }: ThemeProps) => {
- const [post, setPost] = useState()
+
+const Post = ({renderedPost, theme, changeTheme}: PostProps) => {
+ const [post, setPost] = useState(renderedPost);
const [isLoading, setIsLoading] = useState(true)
const [error, setError] = useState()
const router = useRouter();
@@ -20,29 +23,18 @@ const Post = ({ theme, changeTheme }: ThemeProps) => {
useEffect(() => {
async function fetchPost() {
setIsLoading(true);
- if (router.query.id) {
- const post = await fetch(`/server-api/posts/${router.query.id}`, {
- method: "GET",
- headers: {
- "Content-Type": "application/json",
- "Authorization": `Bearer ${Cookies.get("drift-token")}`
- }
- })
- if (post.ok) {
- const res = await post.json()
- if (res)
- setPost(res)
- else
- setError("Post not found")
- } else {
- if (post.status.toString().startsWith("4")) {
- router.push("/signin")
- } else {
- setError(post.statusText)
- }
- }
+ if (renderedPost) {
+ setPost(renderedPost)
setIsLoading(false)
+
+ return;
+ }
+
+ if (!Cookies.get('drift-token')) {
+ router.push('/signin');
+ } else {
+ setError('Something went wrong fetching the post');
}
}
fetchPost()
@@ -111,4 +103,36 @@ const Post = ({ theme, changeTheme }: ThemeProps) => {
)
}
+export const getServerSideProps: GetServerSideProps = async (context) => {
+
+ const headers = context.req.headers;
+ const host = headers.host;
+ const driftToken = cookie.parse(headers.cookie || '')[`drift-token`];
+
+ let post;
+
+ if (context.query.id) {
+ post = await fetch('http://' + host + `/server-api/posts/${context.query.id}`, {
+ method: "GET",
+ headers: {
+ "Content-Type": "application/json",
+ "Authorization": `Bearer ${driftToken}`
+ }
+ });
+
+ try {
+ post = await post.json();
+ } catch (e) {
+ console.log(e);
+ post = null;
+ }
+ }
+
+ return {
+ props: {
+ renderedPost: post
+ }
+ }
+}
+
export default Post
diff --git a/client/yarn.lock b/client/yarn.lock
index 5c3bd26b..2ba24293 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -161,6 +161,11 @@
resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.1.0.tgz#7f698254aadf921e48dda8c0a6b304026b8a9323"
integrity sha512-JLo+Y592QzIE+q7Dl2pMUtt4q8SKYI5jDrZxrozEQxnGVOyYE+GWK9eLkwTaeN9DDctlaRAQ3TBmzZ1qdLE30A==
+"@types/cookie@^0.4.1":
+ version "0.4.1"
+ resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.4.1.tgz#bfd02c1f2224567676c1545199f87c3a861d878d"
+ integrity sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q==
+
"@types/debug@^4.0.0":
version "4.1.7"
resolved "https://registry.yarnpkg.com/@types/debug/-/debug-4.1.7.tgz#7cc0ea761509124709b8b2d1090d8f6c17aadb82"
@@ -532,6 +537,11 @@ concat-map@0.0.1:
resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
integrity sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=
+cookie@^0.4.2:
+ version "0.4.2"
+ resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.2.tgz#0e41f24de5ecf317947c82fc789e06a884824432"
+ integrity sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==
+
core-js-pure@^3.20.2:
version "3.21.1"
resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.21.1.tgz#8c4d1e78839f5f46208de7230cebfb72bc3bdb51"