diff --git a/extensions/void/src/sidebar/MarkdownRender/BlockCode.tsx b/extensions/void/src/sidebar/MarkdownRender/BlockCode.tsx deleted file mode 100644 index 1ce07d80..00000000 --- a/extensions/void/src/sidebar/MarkdownRender/BlockCode.tsx +++ /dev/null @@ -1,85 +0,0 @@ -import React, { ReactNode, useCallback, useEffect, useState } from "react" -import { getVSCodeAPI } from "../getVscodeApi" -import { classNames } from "../utils" - -enum CopyButtonState { - Copy = "Copy", - Copied = "Copied!", - Error = "Could not copy", -} - -const COPY_FEEDBACK_TIMEOUT = 1000 - -// code block with Apply button at top -const BlockCode = ({ - text, - toolbar, - hideToolbar = false, - className, -}: { - text: string - toolbar?: ReactNode - hideToolbar?: boolean - className?: string -}) => { - const [copyButtonState, setCopyButtonState] = useState(CopyButtonState.Copy) - - useEffect(() => { - if (copyButtonState !== CopyButtonState.Copy) { - setTimeout(() => { - setCopyButtonState(CopyButtonState.Copy) - }, COPY_FEEDBACK_TIMEOUT) - } - }, [copyButtonState]) - - const onCopy = useCallback(() => { - navigator.clipboard.writeText(text).then( - () => { - setCopyButtonState(CopyButtonState.Copied) - }, - () => { - setCopyButtonState(CopyButtonState.Error) - } - ) - }, [text]) - - const defaultToolbar = ( - <> - - - - ) - - return ( -
- {!hideToolbar && ( -
-
{toolbar || defaultToolbar}
-
- )} -
-
{text}
-
-
- ) -} - -export default BlockCode diff --git a/extensions/void/src/sidebar/MarkdownRender/MarkdownRender.tsx b/extensions/void/src/sidebar/MarkdownRender/MarkdownRender.tsx deleted file mode 100644 index c972342e..00000000 --- a/extensions/void/src/sidebar/MarkdownRender/MarkdownRender.tsx +++ /dev/null @@ -1,164 +0,0 @@ -import React, { JSX, useState } from "react" -import { MarkedToken, Token, TokensList } from "marked" -import { awaitVSCodeResponse, getVSCodeAPI } from "../getVscodeApi" -import BlockCode from "./BlockCode" - -const Render = ({ token }: { token: Token }) => { - // deal with built-in tokens first (assume marked token) - const t = token as MarkedToken - - if (t.type === "space") { - return {t.raw} - } - - if (t.type === "code") { - return - } - - if (t.type === "heading") { - const HeadingTag = `h${t.depth}` as keyof JSX.IntrinsicElements - return {t.text} - } - - if (t.type === "table") { - return ( - - - - {t.header.map((cell: any, index: number) => ( - - ))} - - - - {t.rows.map((row: any[], rowIndex: number) => ( - - {row.map((cell: any, cellIndex: number) => ( - - ))} - - ))} - -
- {cell.raw} -
- {cell.raw} -
- ) - } - - if (t.type === "hr") { - return
- } - - if (t.type === "blockquote") { - return
{t.text}
- } - - if (t.type === "list") { - const ListTag = t.ordered ? "ol" : "ul" - return ( - - {t.items.map((item, index) => ( -
  • - {item.task && ( - - )} - {item.text} -
  • - ))} -
    - ) - } - - if (t.type === "paragraph") { - return ( -

    - {t.tokens.map((token, index) => ( - - ))} -

    - ) - } - - if (t.type === "html") { - return ( -
    -				{``}
    -				{t.raw}
    -				{``}
    -			
    - ) - } - - if (t.type === "text" || t.type === "escape") { - return {t.raw} - } - - if (t.type === "def") { - return null // Definitions are typically not rendered - } - - if (t.type === "link") { - return ( - - {t.text} - - ) - } - - if (t.type === "image") { - return {t.text} - } - - if (t.type === "strong") { - return {t.text} - } - - if (t.type === "em") { - return {t.text} - } - - // inline code - if (t.type === "codespan") { - return ( - - {t.text} - - ) - } - - if (t.type === "br") { - return
    - } - - if (t.type === "del") { - return {t.text} - } - - // default - return ( -
    - Unknown type: - {t.raw} -
    - ) -} - -const MarkdownRender = ({ tokens }: { tokens: TokensList }) => { - return ( - <> - {tokens.map((token, index) => ( - - ))} - - ) -} - -export default MarkdownRender diff --git a/extensions/void/src/sidebar/MarkdownRender/index.ts b/extensions/void/src/sidebar/MarkdownRender/index.ts deleted file mode 100644 index f37e9ea5..00000000 --- a/extensions/void/src/sidebar/MarkdownRender/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { default as MarkdownRender } from "./MarkdownRender" -export { default as BlockCode } from "./BlockCode" diff --git a/extensions/void/src/sidebar/markdown/BlockCode.tsx b/extensions/void/src/sidebar/markdown/BlockCode.tsx index 5c45a9f5..59128ddd 100644 --- a/extensions/void/src/sidebar/markdown/BlockCode.tsx +++ b/extensions/void/src/sidebar/markdown/BlockCode.tsx @@ -1,5 +1,6 @@ -import React, { useCallback, useEffect, useState } from "react" +import React, { ReactNode, useCallback, useEffect, useState } from "react" import { getVSCodeAPI } from "../getVscodeApi" +import { classNames } from "../utils" enum CopyButtonState { Copy = "Copy", @@ -12,10 +13,14 @@ const COPY_FEEDBACK_TIMEOUT = 1000 // code block with toolbar (Apply, Copy, etc) at top const BlockCode = ({ text, + toolbar, hideToolbar = false, + className, }: { text: string + toolbar?: ReactNode hideToolbar?: boolean + className?: string }) => { const [copyButtonState, setCopyButtonState] = useState(CopyButtonState.Copy) @@ -38,32 +43,40 @@ const BlockCode = ({ ) }, [text]) + const defaultToolbar = ( + <> + + + + ) + return (
    {!hideToolbar && (
    -
    - - -
    +
    {toolbar || defaultToolbar}
    )}
    -
    {text}
    +
    {text}
    )