blob: fc1e1e6d4f4c8ec521d1fe0f0f7ff7934bb34944 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
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 />;
}
|