mirror of https://github.com/MaxLeiter/Drift
Max Leiter
4 years ago
committed by
GitHub
commit
fb38ecc932
@ -1,3 +1,4 @@
|
||||
API_URL=http://localhost:3000
|
||||
WELCOME_TITLE="Welcome to Drift"
|
||||
WELCOME_CONTENT="### Drift is a self-hostable clone of GitHub Gist. \nIt is a simple way to share code and text snippets with your friends, with support for the following:\n \n - Render GitHub Extended Markdown (including images)\n - User authentication\n - Private, public, and secret posts\n \n If you want to signup, you can join at [/signup](/signup) as long as you have a passcode provided by the administrator (which you don\'t need for this demo).\n **This demo is on a memory-only database, so accounts and pastes can be deleted at any time.**\n You can find the source code on [GitHub](https://github.com/MaxLeiter/drift).\n \n Drift was inspired by [this tweet](https://twitter.com/emilyst/status/1499858264346935297):\n > What is the absolute closest thing to GitHub Gist that can be self-hosted?\n In terms of design and functionality. Hosts images and markdown, rendered. Creates links that can be private or public. Uses/requires registration. I have looked at dozens of pastebin-like things."
|
||||
SECRET_KEY=secret
|
||||
@ -1,17 +1,7 @@
|
||||
import useSWR from "swr"
|
||||
import PostList from "../post-list"
|
||||
import Cookies from "js-cookie"
|
||||
|
||||
const fetcher = (url: string) => fetch(url, {
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${Cookies.get("drift-token")}`
|
||||
},
|
||||
}).then(r => r.json())
|
||||
|
||||
const MyPosts = () => {
|
||||
const { data, error } = useSWR('/server-api/users/mine', fetcher)
|
||||
return <PostList posts={data} error={error} />
|
||||
const MyPosts = ({ posts, error }: { posts: any, error: any }) => {
|
||||
return <PostList posts={posts} error={error} />
|
||||
}
|
||||
|
||||
export default MyPosts
|
||||
|
||||
@ -0,0 +1,50 @@
|
||||
import { Input, Modal, Note, Spacer } from "@geist-ui/core"
|
||||
import { useState } from "react"
|
||||
|
||||
type Props = {
|
||||
isOpen: boolean
|
||||
onClose: () => void
|
||||
onSubmit: (password: string) => void
|
||||
}
|
||||
|
||||
const PasswordModal = ({ isOpen, onClose, onSubmit: onSubmitAfterVerify }: Props) => {
|
||||
const [password, setPassword] = useState<string>()
|
||||
const [confirmPassword, setConfirmPassword] = useState<string>()
|
||||
const [error, setError] = useState<string>()
|
||||
|
||||
const onSubmit = () => {
|
||||
if (!password || !confirmPassword) {
|
||||
setError('Please enter a password')
|
||||
return
|
||||
}
|
||||
|
||||
if (password !== confirmPassword) {
|
||||
setError("Passwords do not match")
|
||||
return
|
||||
}
|
||||
|
||||
onSubmitAfterVerify(password)
|
||||
}
|
||||
|
||||
return (<>
|
||||
{<Modal visible={isOpen} >
|
||||
<Modal.Title>Enter a password</Modal.Title>
|
||||
<Modal.Content>
|
||||
{!error && <Note type="warning" label='Warning'>
|
||||
This doesn't protect your post from the server administrator.
|
||||
</Note>}
|
||||
{error && <Note type="error" label='Error'>
|
||||
{error}
|
||||
</Note>}
|
||||
<Spacer />
|
||||
<Input width={"100%"} label="Password" marginBottom={1} htmlType="password" placeholder="Password" onChange={(e) => setPassword(e.target.value)} />
|
||||
<Input width={"100%"} label="Confirm" htmlType="password" placeholder="Confirm Password" onChange={(e) => setConfirmPassword(e.target.value)} />
|
||||
</Modal.Content>
|
||||
<Modal.Action passive onClick={onClose}>Cancel</Modal.Action>
|
||||
<Modal.Action onClick={onSubmit}>Submit</Modal.Action>
|
||||
</Modal>}
|
||||
</>)
|
||||
}
|
||||
|
||||
|
||||
export default PasswordModal
|
||||
@ -0,0 +1,13 @@
|
||||
import type { PostVisibility } from "./types"
|
||||
|
||||
export default function getPostPath(visibility: PostVisibility, id: string) {
|
||||
switch (visibility) {
|
||||
case "private":
|
||||
return `/post/private/${id}`
|
||||
case "protected":
|
||||
return `/post/protected/${id}`
|
||||
case "unlisted":
|
||||
case "public":
|
||||
return `/post/${id}`
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
export type PostVisibility = "unlisted" | "private" | "public" | "protected"
|
||||
|
||||
export type ThemeProps = {
|
||||
theme: "light" | "dark" | string,
|
||||
changeTheme: () => void
|
||||
}
|
||||
|
||||
export type Document = {
|
||||
title: string
|
||||
content: string
|
||||
id: string
|
||||
}
|
||||
@ -0,0 +1,129 @@
|
||||
import { Button, Page, Text } from "@geist-ui/core";
|
||||
|
||||
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 type { GetServerSideProps } 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={true}
|
||||
/>
|
||||
|
||||
<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`]
|
||||
|
||||
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}`,
|
||||
"x-secret-key": process.env.SECRET_KEY || "",
|
||||
}
|
||||
})
|
||||
|
||||
if (!post.ok || post.status !== 200) {
|
||||
return {
|
||||
redirect: {
|
||||
destination: '/',
|
||||
permanent: false,
|
||||
},
|
||||
}
|
||||
}
|
||||
try {
|
||||
const json = await post.json();
|
||||
|
||||
return {
|
||||
props: {
|
||||
post: json
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.log(e)
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
props: {
|
||||
post: null
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default Post
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,14 @@
|
||||
import { NextFunction, Request, Response } from 'express';
|
||||
|
||||
const key = process.env.SECRET_KEY;
|
||||
if (!key) {
|
||||
throw new Error('SECRET_KEY is not set.');
|
||||
}
|
||||
|
||||
export default function authenticateToken(req: Request, res: Response, next: NextFunction) {
|
||||
const requestKey = req.headers['x-secret-key']
|
||||
if (requestKey !== key) {
|
||||
return res.sendStatus(401)
|
||||
}
|
||||
next()
|
||||
}
|
||||
Loading…
Reference in New Issue