chore: add privacy policy

src/components/MarkdownRenderer.tsx

@@ -0,0 +1,33 @@
+import React, { useState, useEffect } from "react";
+import ReactMarkdown from "react-markdown";
+
+interface MarkdownRendererProps {
+  url: string;
+}
+
+function MarkdownRenderer(props: MarkdownRendererProps) {
+  const [markdown, setMarkdown] = useState<string>("");
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const response = await fetch(props.url);
+      const data = await response.text();
+      setMarkdown(data);
+    };
+    fetchData();
+  }, [props.url]);
+
+  return (
+    <ReactMarkdown
+      className="w-auto max-w-full px-4 py-2 prose prose-neutral"
+      components={{
+        p: ({ children }) => <p style={{ color: "black" }}>{children}</p>,
+        li: ({ children }) => <li style={{ color: "black" }}>{children}</li>,
+      }}
+    >
+      {markdown}
+    </ReactMarkdown>
+  );
+}
+
+export default MarkdownRenderer;

src/components/SettingView.tsx

@@ -61,6 +61,14 @@ const SettingView = () => {
         </div>
       </div>
 
+      <div className="w-full border border-gray-200 dark:border-zinc-700 p-4 rounded-lg space-y-2">
+        <div className="w-full flex flex-row justify-between items-center gap-2">
+          <a href={"privacy"} target="_blank">
+            Privacy
+          </a>
+        </div>
+      </div>
+
       <div className="w-full border border-red-200 dark:border-zinc-700 p-4 rounded-lg">
         <div className="w-full flex flex-row justify-between items-center gap-2">
           <span>{t("setting.data.clear-all-data")}</span>