feat(markdown): use FilterReadMeScripts setting (#465)

* fix(monaco-editor): update import path for monaco editor API to include .js extension

Signed-off-by: MadDogOwner <xiaoran@xrgzs.top>

* refactor(useFetchText): remove raw parameter

Signed-off-by: MadDogOwner <xiaoran@xrgzs.top>

* feat(Markdown): add sanitize option

Signed-off-by: MadDogOwner <xiaoran@xrgzs.top>

---------

Signed-off-by: MadDogOwner <xiaoran@xrgzs.top>

Author: xrgzs

src/components/Markdown.tsx

@@ -13,7 +13,7 @@ import { Motion } from "solid-motionone"
 import { unified } from "unified"
 import { useCDN, useParseText, useRouter } from "~/hooks"
 import { useScrollListener } from "~/pages/home/toolbar/BackTop.jsx"
-import { getMainColor, me } from "~/store"
+import { getMainColor, getSettingBool, me } from "~/store"
 import { api, notify, pathDir, pathJoin, pathResolve } from "~/utils"
 import { isMobile } from "~/utils/compatibility.js"
 import hljs from "highlight.js"
@@ -169,6 +169,7 @@ const loadMermaidJS = once(
 
 async function renderMarkdown(
   content: string,
+  sanitize: boolean,
 ): Promise<{ html: string; hasMermaid: boolean }> {
   let processor = unified()
 
@@ -189,10 +190,10 @@ async function renderMarkdown(
     )
   }
 
-  processor
-    .use(remarkRehype, { allowDangerousHtml: true })
-    .use(rehypeRaw)
-    .use(rehypeSanitize, {
+  processor.use(remarkRehype, { allowDangerousHtml: true }).use(rehypeRaw)
+
+  if (sanitize)
+    processor.use(rehypeSanitize, {
       ...defaultSchema,
       attributes: {
         ...defaultSchema.attributes,
@@ -220,6 +221,7 @@ export function Markdown(props: {
   ext?: string
   readme?: boolean
   toc?: boolean
+  sanitize?: boolean
 }) {
   const [encoding, setEncoding] = createSignal<string>("utf-8")
   const [show, setShow] = createSignal(true)
@@ -263,7 +265,10 @@ export function Markdown(props: {
     on([md, mermaidTheme], async () => {
       setShow(false)
 
-      const { html, hasMermaid } = await renderMarkdown(md())
+      const { html, hasMermaid } = await renderMarkdown(
+        md(),
+        props.sanitize || getSettingBool("filter_readme_scripts"),
+      )
       setMarkdownHTML(html)
 
       setTimeout(() => {

src/components/MonacoEditor.tsx

@@ -3,7 +3,7 @@ import { createEffect, createSignal, onCleanup, onMount } from "solid-js"
 import { MaybeLoading } from "./FullLoading"
 import loader from "@monaco-editor/loader"
 import { useCDN } from "~/hooks"
-import type * as monacoType from "monaco-editor/esm/vs/editor/editor.api"
+import type * as monacoType from "monaco-editor/esm/vs/editor/editor.api.js"
 import { local } from "~/store"
 
 export interface MonacoEditorProps {

src/hooks/useUtil.ts

@@ -34,14 +34,10 @@ export const useUtil = () => {
   }
 }
 
-export function useFetchText(raw?: boolean) {
+export function useFetchText() {
   const { proxyLink } = useLink()
   const fetchContent = async () => {
     let fileurl = proxyLink(objStore.obj, true)
-    if (raw) {
-      const separator = fileurl.includes("?") ? "&" : "?"
-      fileurl = `${fileurl}${separator}raw=true`
-    }
     return fetchText(fileurl)
   }
   return createResource("", fetchContent)

src/pages/home/previews/text-editor.tsx

@@ -75,7 +75,7 @@ function Editor(props: { data?: string | ArrayBuffer; contentType?: string }) {
 
 // TODO add encoding select
 const TextEditor = () => {
-  const [content] = useFetchText(true)
+  const [content] = useFetchText()
   return (
     <MaybeLoading loading={content.loading}>
       <Editor data={content()?.content} contentType={content()?.contentType} />

src/pages/manage/About.tsx

@@ -15,7 +15,7 @@ const About = () => {
   const [readme] = createResource(fetchReadme)
   return (
     <MaybeLoading loading={readme.loading}>
-      <Markdown children={readme()} />
+      <Markdown children={readme()} sanitize={true} />
     </MaybeLoading>
   )
 }