feat: import button description

This commit is contained in:
DIYgod 2022-09-29 19:02:15 +01:00
parent b857a13b62
commit 4a04893dd1
No known key found for this signature in database
GPG Key ID: D159328F47A80DCA
1 changed files with 65 additions and 59 deletions

View File

@ -23,6 +23,7 @@ import { Button } from "../ui/Button"
import { UniLink } from "../ui/UniLink"
import { nanoid } from "nanoid"
import { renderPageContent } from "~/markdown"
import { Tooltip } from "../ui/Tooltip"
export const PagesManager: React.FC<{
isPost: boolean
@ -269,66 +270,71 @@ export const PagesManager: React.FC<{
</svg>
<span>New {isPost ? "Post" : "Page"}</span>
</Button>
<Button
className={clsx(`space-x-2 inline-flex`)}
onClick={() => {
const input = document.createElement("input")
input.type = "file"
input.accept = "text/markdown"
input.addEventListener("change", async (e: any) => {
const file = e.target?.files?.[0]
const reader = new FileReader()
reader.readAsText(file, "UTF-8")
reader.onload = (evt) => {
if (evt.target?.result) {
const pageContent = renderPageContent(
evt.target.result as string,
)
const id = nanoid()
const key = `draft-${subdomain}-local-${id}`
const tags =
pageContent.frontMatter.tags ||
pageContent.frontMatter.categories
setStorage(key, {
date: +new Date(),
values: {
content: evt.target.result,
published: false,
publishedAt: (
pageContent.frontMatter.date ||
file.lastModifiedDate ||
new Date()
).toISOString(),
slug:
pageContent.frontMatter.permalink ||
file.name.split(".").slice(0, -1).join("."),
tags: tags?.join?.(", ") || tags,
title: pageContent.frontMatter.title,
},
isPost: isPost,
})
queryClient.invalidateQueries([
"getPagesBySite",
subdomain,
])
router.push(
`/dashboard/${subdomain}/editor?id=local-${id}&type=${
isPost ? "post" : "page"
}`,
)
}
}
reader.onerror = (evt) => {
toast.error("Error reading file")
}
})
input.click()
}}
<Tooltip
label="Import markdown file with front matter supported"
placement="bottom"
>
<span className="i-bxs:duplicate inline-block"></span>
<span>Import</span>
</Button>
<Button
className={clsx(`space-x-2 inline-flex`)}
onClick={() => {
const input = document.createElement("input")
input.type = "file"
input.accept = ".md"
input.addEventListener("change", async (e: any) => {
const file = e.target?.files?.[0]
const reader = new FileReader()
reader.readAsText(file, "UTF-8")
reader.onload = (evt) => {
if (evt.target?.result) {
const pageContent = renderPageContent(
evt.target.result as string,
)
const id = nanoid()
const key = `draft-${subdomain}-local-${id}`
const tags =
pageContent.frontMatter.tags ||
pageContent.frontMatter.categories
setStorage(key, {
date: +new Date(),
values: {
content: evt.target.result,
published: false,
publishedAt: (
pageContent.frontMatter.date ||
file.lastModifiedDate ||
new Date()
).toISOString(),
slug:
pageContent.frontMatter.permalink ||
file.name.split(".").slice(0, -1).join("."),
tags: tags?.join?.(", ") || tags,
title: pageContent.frontMatter.title,
},
isPost: isPost,
})
queryClient.invalidateQueries([
"getPagesBySite",
subdomain,
])
router.push(
`/dashboard/${subdomain}/editor?id=local-${id}&type=${
isPost ? "post" : "page"
}`,
)
}
}
reader.onerror = (evt) => {
toast.error("Error reading file")
}
})
input.click()
}}
>
<span className="i-bxs:duplicate inline-block"></span>
<span>Import</span>
</Button>
</Tooltip>
</div>
</div>
<div className="text-sm text-zinc-500 leading-relaxed">