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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
|
import { franc } from "franc-all";
import React, { useEffect, useState } from "react";
import ThaiText from "./thai/ThaiText";
import { ColoredText } from "./components/Sentence";
import type { AnalyzeRes, WordData } from "./logic/types";
import { detectScript, scriptFromLang } from "./logic/utils";
import LatinText from "./latin/LatinText";
import { buildWiktionaryURL, parseWiktionary } from "./logic/wiki";
import type { Result } from "sortug";
export default function LangText({
text,
lang,
theme,
fetchWiki,
handleWord,
}: {
text: string;
lang?: string;
theme?: string;
fetchWiki?: (url: string) => Promise<string>;
handleWord?: (wd: Result<WordData>) => any;
}) {
const [llang, setLang] = useState("");
const [script, setScript] = useState(scriptFromLang(lang || "", text));
useEffect(() => {
if (!lang) {
const res = franc(text);
setLang(res);
} else setLang(lang);
}, [text]);
console.log("langtext", { text, llang, script });
async function openWord(word: string) {
// console.log("looking up", word);
// const url = buildWiktionaryURL(word);
// const html = await fetchWiki(url);
// const parsed = parseWiktionary(html, url);
// console.log({ parsed });
// if ("error" in parsed) handleWord(parsed);
// else {
// const wd: WordData = {
// spelling: word,
// lang: llang,
// ipa: parsed.ok.ipa[0],
// meanings: parsed.ok.meanings,
// references: { url: parsed.ok.url },
// };
// handleWord({ ok: wd });
// }
// // const d = data[s];
// // setModal(d);
// // setModal(<WordModal data={d} lang={lang} />);
}
return (
<div className="lang-text-container">
{script === "Thai" ? (
<ThaiText text={text} openWord={openWord} />
) : script === "Latin" ? (
<LatinText text={text} lang={llang} openWord={openWord} />
) : (
<Generic text={text} lang={llang} />
)}
</div>
);
}
function Generic({ text, lang }: { text: string; lang: string }) {
const [data, setData] = useState<AnalyzeRes>();
useEffect(() => {
// segmentate(text, lang)
}, [text, lang]);
console.log({ lang }, "generic");
// <p className="lang-lang">{lang}</p>
// <p className="lang-text">{text}</p>
// {data && <ColoredText frags={Object.keys(data)} />}
return <div className="lang-text-div"></div>;
}
|
