1 files changed, 49 insertions, 0 deletions
diff --git a/packages/prosody-ui/src/thai/ThaiText.tsx b/packages/prosody-ui/src/thai/ThaiText.tsx
new file mode 100644
index 0000000..fc1e1e6
--- /dev/null
+++ b/packages/prosody-ui/src/thai/ThaiText.tsx
@@ -0,0 +1,49 @@
+import React, { useCallback, useEffect, useState } from "react";
+import "../assets/fonts/Thai/style.css";
+import { segmentateThai } from "./logic/thainlp";
+import type { AnalyzeRes } from "../logic/types";
+import { ColoredText } from "../components/Sentence";
+import Word from "../components/Word";
+
+export default function ThaiText({
+  text,
+  openWord,
+}: {
+  text: string;
+  openWord: (s: string) => void;
+}) {
+  useEffect(() => {
+    pythonseg();
+  }, [text]);
+
+  const [data, setData] = useState<Record<string, AnalyzeRes>>({});
+  const [modal, setModal] = useState<any>();
+  const pythonseg = useCallback(async () => {
+    const s2 = await segmentateThai(text.trim());
+    if ("ok" in s2) {
+      const ob = s2.ok.reduce((acc, item) => {
+        acc[item.word] = item;
+        return acc;
+      }, {} as any);
+      setData(ob);
+      console.log(s2, "s2");
+    } else console.error(s2.error);
+  }, [text]);
+
+  // function openWord(e: React.MouseEvent<any>) {
+  //   const s = e.currentTarget.innerText;
+  //   const d = data[s];
+  //   setModal(d);
+  //   // setModal(<WordModal data={d} lang={lang} />);
+  // }
+  return (
+    <div className="thaitext">
+      <ColoredText lang="tha" frags={Object.keys(data)} fn={openWord} />
+      {modal && <Word data={modal} lang={"tha"} />}
+    </div>
+  );
+}
+
+function ThaiWord() {
+  return <div />;
+}