82 lines
2.7 KiB
TypeScript
82 lines
2.7 KiB
TypeScript
|
import * as React from 'react';
|
||
|
|
import { Dimmer, Loader } from 'semantic-ui-react';
|
||
|
|
import * as XML from 'xml2js';
|
||
|
|
import * as _ from 'lodash';
|
||
|
|
import { LexEditor } from './LexComponents';
|
||
|
|
|
||
|
|
const fieldMetaMap = {
|
||
|
|
label: { lens: 'label[0]', type: 'text' },
|
||
|
|
unl: { lens: 'unl[0]', type: 'text' },
|
||
|
|
synset: { lens: 'lexprops[0].wnsynset[0]', type: 'text' },
|
||
|
|
guid: { lens: 'guid[0]', type: 'text' },
|
||
|
|
pos: { lens: 'pos[0]', type: 'select' },
|
||
|
|
image: { lens: 'image[0]', type: 'preview' },
|
||
|
|
relations: { lens: 'relations[0]', type: 'text' },
|
||
|
|
frame: { lens: 'syntacticprops[0].property[0]._', type: 'select' },
|
||
|
|
morphclass: {
|
||
|
|
lens: 'lexprops[0].morphology[0].morph[0]._',
|
||
|
|
type: 'select'
|
||
|
|
},
|
||
|
|
stats: { lens: 'stats[0].property[0]._', type: 'text' },
|
||
|
|
lang: { lens: '$.id', type: 'select', options: ['en', 'es'] },
|
||
|
|
};
|
||
|
|
|
||
|
|
export class LexSetup extends React.Component<any, any> {
|
||
|
|
public componentDidMount() {
|
||
|
|
fetch(this.props.fileName)
|
||
|
|
.then((response) => response.text())
|
||
|
|
.then((xmlString) => {
|
||
|
|
XML.parseString(xmlString, (err, lexData) => {
|
||
|
|
let allEntries = _.chain(lexData)
|
||
|
|
.get<any>('document.lexicon[0].item')
|
||
|
|
.flatMap((o: any) => _.chain(o)
|
||
|
|
.get<any>('entry')
|
||
|
|
.map((p: any) => _.chain(p)
|
||
|
|
.get<any>('lang[0]')
|
||
|
|
.set('guid[0]', o.$.guid)
|
||
|
|
.value())
|
||
|
|
.value()
|
||
|
|
)
|
||
|
|
.value();
|
||
|
|
|
||
|
|
let langReducer = ((result: any, q: any) => {
|
||
|
|
let lang = _.get<any>(q, fieldMetaMap.lang.lens, 'en');
|
||
|
|
(result[lang] || (result[lang] = [])).push(q);
|
||
|
|
return result;
|
||
|
|
});
|
||
|
|
let langEntries = _.reduce(allEntries, langReducer, {});
|
||
|
|
let langs = _.keys(langEntries);
|
||
|
|
let selectFields = _.fromPairs(langs.map((lang) => {
|
||
|
|
let langOpts = _.fromPairs(_.keys(fieldMetaMap).filter((s) => {
|
||
|
|
return fieldMetaMap[s].type === 'select';
|
||
|
|
}).map((s) => {
|
||
|
|
let lens = fieldMetaMap[s].lens;
|
||
|
|
let entries = _.get<any>(langEntries, lang, 'en');
|
||
|
|
let selectOptions = _.uniq(entries.map((q: any) => {
|
||
|
|
return _.get<any>(q, lens, '');
|
||
|
|
}));
|
||
|
|
return [s, selectOptions];
|
||
|
|
}));
|
||
|
|
return [lang, langOpts];
|
||
|
|
}));
|
||
|
|
this.setState({
|
||
|
|
lexData, allEntries, selectFields, fieldMetaMap
|
||
|
|
});
|
||
|
|
});
|
||
|
|
})
|
||
|
|
.catch((e) => {
|
||
|
|
console.log('errored :', e);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
return this.state ? (
|
||
|
|
<LexEditor {...this.state} {...this.props} />
|
||
|
|
) : (
|
||
|
|
<Dimmer active={true} inverted={true}>
|
||
|
|
<Loader inverted={true}>Loading</Loader>
|
||
|
|
</Dimmer>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|