diff --git a/src/App.tsx b/src/App.tsx index 39efa03..efea1aa 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -5,6 +5,31 @@ import {declineSaimiar} from './saimiar_morphology'; const backendUrl = 'https://kucinakobackend.ichigo.everydayimshuflin.com'; +enum Conlang { + Saimiar = 'sai', + Elesu = 'ele', + Tukvaysi = 'tuk', + Juteyuji = 'jut', +} + +const renderConlang = (conlang: Conlang): string => { + if (conlang === Conlang.Saimiar) { + return 'Saimiar'; + } + + if (conlang === Conlang.Elesu) { + return 'Elésu'; + } + + if (conlang === Conlang.Juteyuji) { + return 'Juteyuji'; + } + + if (conlang === Conlang.Tukvaysi) { + return 'Tukvaysi'; + } +}; + function makeRequest(queryString, jsonHandler) { const effectiveUrl = `${backendUrl}/${queryString}`; fetch(`${effectiveUrl}`) @@ -14,31 +39,13 @@ function makeRequest(queryString, jsonHandler) { }); } -function renderConlangName(name: string): string { - if (name === 'saimiar') { - return 'Saimiar'; - } - - if (name === 'elesu') { - return 'Elésu'; - } - - if (name === 'juteyuji') { - return 'Juteyuji'; - } - - if (name === 'tukvaysi') { - return 'Tukvaysi'; - } -} - const Entry = (props) => { const {conlang} = props; - if (conlang === 'saimiar') { + if (conlang === Conlang.Saimiar) { return ; } - return
Unknown entry type for { conlang }
; + return
Conlang { conlang } not yet supported
; }; const SaiEntry = (props) => { @@ -80,7 +87,8 @@ const Results = (props) => { const content = () => { const {conlang} = props; const num = props.searchResults.length; - const renderedName = renderConlangName(conlang); + console.log(`Conlang is: ${conlang}`); + const renderedName = renderConlang(conlang); const searchType = (props.direction === 'toConlang') ? `English -> ${renderedName}` : `${renderedName} -> English`; const header = (
@@ -102,7 +110,7 @@ const Results = (props) => { interface App { [x: string]: any; -}; +} class App extends Component { constructor(props) { @@ -112,17 +120,27 @@ class App extends Component { this.searchEng = this.searchEng.bind(this); this.searchSaimiar = this.searchSaimiar.bind(this); + this.searchConlang = this.searchConlang.bind(this); this.state = { searchResults: null, - conlang: 'saimiar', + conlang: Conlang.Saimiar, direction: null, searchTerm: null, }; } - searchSaimiar(_evt) { + searchConlang(_evt) { const searchTerm = this.input.current.value; + const {conlang} = this.state; + if (conlang === Conlang.Saimiar) { + this.searchSaimiar(searchTerm); + } else { + console.error(`Conlang ${conlang} not supported`); + } + } + + searchSaimiar(searchTerm: string) { const request = `saimiar?sai=like.*${searchTerm}*`; if (searchTerm === '') { this.setState({searchResults: null, searchTerm: null, direction: null}); @@ -146,11 +164,19 @@ class App extends Component { } handleLangChange(evt) { - const conlang = evt.target.value; + const conlang: Conlang = evt.target.value as Conlang; + console.log('Conlang in handlelangchange', conlang); this.setState({conlang}); } render() { + const conlangs = [Conlang.Saimiar, Conlang.Elesu, Conlang.Tukvaysi, Conlang.Juteyuji]; + const langSelectDropdown = ( + + ); + return (
@@ -160,13 +186,8 @@ class App extends Component {

- - + { langSelectDropdown } +