137 lines
4.1 KiB
TypeScript
137 lines
4.1 KiB
TypeScript
import { Button, Page, Text } from "@geist-ui/core";
|
|
|
|
import { useRouter } from "next/router";
|
|
import Document from '../../components/document'
|
|
import Header from "../../components/header";
|
|
import VisibilityBadge from "../../components/visibility-badge";
|
|
import PageSeo from "components/page-seo";
|
|
import styles from './styles.module.css';
|
|
import cookie from "cookie";
|
|
import { GetServerSideProps, GetStaticPaths, GetStaticProps } from "next";
|
|
import { PostVisibility, ThemeProps } from "@lib/types";
|
|
|
|
type File = {
|
|
id: string
|
|
title: string
|
|
content: string
|
|
}
|
|
|
|
type Files = File[]
|
|
|
|
export type PostProps = ThemeProps & {
|
|
post: {
|
|
id: string
|
|
title: string
|
|
description: string
|
|
visibility: PostVisibility
|
|
files: Files
|
|
}
|
|
}
|
|
|
|
const Post = ({ post, theme, changeTheme }: PostProps) => {
|
|
const download = async () => {
|
|
const clientZip = require("client-zip")
|
|
|
|
const blob = await clientZip.downloadZip(post.files.map((file: any) => {
|
|
return {
|
|
name: file.title,
|
|
input: file.content,
|
|
lastModified: new Date(file.updatedAt)
|
|
}
|
|
})).blob()
|
|
const link = document.createElement("a")
|
|
link.href = URL.createObjectURL(blob)
|
|
link.download = `${post.title}.zip`
|
|
link.click()
|
|
link.remove()
|
|
}
|
|
|
|
return (
|
|
<Page width={"100%"}>
|
|
<PageSeo
|
|
title={`${post.title} - Drift`}
|
|
description={post.description}
|
|
isPrivate={post.visibility !== 'public'}
|
|
/>
|
|
|
|
<Page.Header>
|
|
<Header theme={theme} changeTheme={changeTheme} />
|
|
</Page.Header>
|
|
<Page.Content width={"var(--main-content-width)"} margin="auto">
|
|
{/* {!isLoading && <PostFileExplorer files={post.files} />} */}
|
|
<div className={styles.header}>
|
|
<div className={styles.titleAndBadge}>
|
|
<Text h2>{post.title}</Text>
|
|
<span><VisibilityBadge visibility={post.visibility} /></span>
|
|
</div>
|
|
<Button auto onClick={download}>
|
|
Download as ZIP archive
|
|
</Button>
|
|
</div>
|
|
{post.files.map(({ id, content, title }: { id: any, content: string, title: string }) => (
|
|
<Document
|
|
key={id}
|
|
id={id}
|
|
content={content}
|
|
title={title}
|
|
editable={false}
|
|
initialTab={'preview'}
|
|
/>
|
|
))}
|
|
</Page.Content>
|
|
</Page >
|
|
)
|
|
}
|
|
|
|
export const getServerSideProps: GetServerSideProps = async (context) => {
|
|
const headers = context.req.headers
|
|
const host = headers.host
|
|
const driftToken = cookie.parse(headers.cookie || '')[`drift-token`]
|
|
let driftTheme = cookie.parse(headers.cookie || '')[`drift-theme`]
|
|
if (driftTheme !== "light" && driftTheme !== "dark") {
|
|
driftTheme = "light"
|
|
}
|
|
|
|
if (context.query.id) {
|
|
const post = await fetch('http://' + host + `/server-api/posts/${context.query.id}`, {
|
|
method: "GET",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
"Authorization": `Bearer ${driftToken}`
|
|
}
|
|
})
|
|
|
|
if (!post.ok || post.status !== 200) {
|
|
return {
|
|
redirect: {
|
|
destination: '/',
|
|
permanent: false,
|
|
},
|
|
}
|
|
}
|
|
try {
|
|
const json = await post.json();
|
|
const maxAge = 60 * 60 * 24 * 365;
|
|
context.res.setHeader(
|
|
'Cache-Control',
|
|
`${json.visibility === "public" ? "public" : "private"}, s-maxage=${maxAge}`
|
|
)
|
|
return {
|
|
props: {
|
|
post: json
|
|
}
|
|
}
|
|
} catch (e) {
|
|
console.log(e)
|
|
}
|
|
}
|
|
|
|
return {
|
|
props: {
|
|
post: null
|
|
}
|
|
}
|
|
}
|
|
|
|
export default Post
|
|
|