greg
/
gues-kucinako
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

App.jsx improvements

This commit is contained in:
Greg Shuflin 2021-09-12 01:07:30 -07:00
parent e8c53cda2f
commit 0d5e2c90a2
1 changed files with 19 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/App.jsx
View File

@ -32,20 +32,19 @@ function renderConlangName(name) {
} }
} }
function Entry(props) { const Entry = (props) => {
const {conlang} = props; const {conlang} = props;
if (conlang === 'saimiar') { if (conlang === 'saimiar') {
return <SaiEntry entry={ props.entry } />; return <SaiEntry entry={ props.entry } />;
} }
return <div>Unknown entry type for { conlang }</div>; return <div>Unknown entry type for { conlang }</div>;
} };
function SaiEntry(props) { const SaiEntry = (props) => {
const {entry} = props; const {entry} = props;
const synCategory = entry.syn_category; const synCategory = entry.syn_category;
const isNominal = synCategory === 'nominal'; const isNominal = synCategory === 'nominal';
console.log(isNominal);
return ( return (
<div className="searchResult" key={ entry.id }> <div className="searchResult" key={ entry.id }>
<b>{ entry.sai }</b> - { entry.eng } <b>{ entry.sai }</b> - { entry.eng }
@ -58,7 +57,7 @@ function SaiEntry(props) {
</span> </span>
</div> </div>
); );
} };
function formatMorphology(entry) { function formatMorphology(entry) {
const decl = declineSaimiar(entry); const decl = declineSaimiar(entry);
@ -77,36 +76,29 @@ function formatMorphology(entry) {
</span>); </span>);
} }
class Results extends Component { const Results = (props) => {
constructor(props) { const content = () => {
super(props); const {conlang} = props;
this.content = this.content.bind(this); const num = props.searchResults.length;
}
content() {
const {conlang} = this.props;
const num = this.props.searchResults.length;
const renderedName = renderConlangName(conlang); const renderedName = renderConlangName(conlang);
const searchType = (this.props.direction === 'toConlang') ? `English -> ${renderedName}` : `${renderedName} -> English`; const searchType = (props.direction === 'toConlang') ? `English -> ${renderedName}` : `${renderedName} -> English`;
const header = ( const header = (
<div className="searchResultHeader" key="header"> <div className="searchResultHeader" key="header">
Searched for <b>{ this.props.searchTerm }</b>, { searchType }, found { num } result(s) Searched for <b>{ props.searchTerm }</b>, { searchType }, found { num } result(s)
</div>); </div>);
const entries = this.props.searchResults.map( const entries = props.searchResults.map(
(entry, _idx) => <Entry entry={ entry } key= { entry.id } conlang={ conlang } />, (entry, _idx) => <Entry entry={ entry } key= { entry.id } conlang={ conlang } />,
); );
return [header].concat(entries); return [header].concat(entries);
} };
render() { const results = props.searchResults;
const results = this.props.searchResults; return (
return ( <div className="results">
<div className="results"> { results ? content() : 'No search' }
{ results ? this.content() : 'No search' } </div>
</div> );
); };
}
}
class App extends Component { class App extends Component {
constructor(props) { constructor(props) {