diff --git a/client/package.json b/client/package.json
index 59fa0b18..0d194d17 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 115b69fb..edfebf5c 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 Head from "next/head";
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 = ({renderedPost, theme, changeTheme}: PostProps) => {
const [post, setPost] = useState()
const [isLoading, setIsLoading] = useState(true)
const [error, setError] = useState()
@@ -21,6 +24,14 @@ const Post = ({ theme, changeTheme }: ThemeProps) => {
useEffect(() => {
async function fetchPost() {
setIsLoading(true);
+
+ if (renderedPost) {
+ console.log('Using Server Side Post');
+ setPost(renderedPost)
+ setIsLoading(false)
+ return;
+ }
+
if (router.query.id) {
const post = await fetch(`/server-api/posts/${router.query.id}`, {
method: "GET",
@@ -108,4 +119,31 @@ 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}`
+ }
+ }).then(res => res.json());
+
+ console.log(post);
+ }
+
+ return {
+ props: {
+ renderedPost: post
+ }
+ }
+}
+
export default Post
diff --git a/client/yarn.lock b/client/yarn.lock
index 28d7f557..1286cb15 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"