mirror of
https://github.com/PeWu/topola-viewer.git
synced 2026-02-18 02:55:48 +00:00
Translating tags on the details panel
This commit is contained in:
parent
018bbe9ff0
commit
7a791ace4d
@ -1,13 +1,38 @@
|
|||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import {GedcomData} from './gedcom_util';
|
import {GedcomData} from './gedcom_util';
|
||||||
import {GedcomEntry} from 'parse-gedcom';
|
import {GedcomEntry} from 'parse-gedcom';
|
||||||
|
import {FormattedMessage} from 'react-intl';
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
gedcom: GedcomData;
|
gedcom: GedcomData;
|
||||||
indi: string;
|
indi: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
function eventDetails(entry: GedcomEntry, header: string) {
|
const NAME_TAGS = ['NAME'];
|
||||||
|
const EVENT_TAGS = ['BIRT', 'BAPM', 'CHR', 'DEAT', 'BURI'];
|
||||||
|
const DATA_TAGS = ['TITL', 'OCCU', 'WWW', 'EMAIL'];
|
||||||
|
const TAG_DESCRIPTIONS = new Map([
|
||||||
|
['BAPM', 'Baptism'],
|
||||||
|
['BIRT', 'Birth'],
|
||||||
|
['BURI', 'Burial'],
|
||||||
|
['CHR', 'Christening'],
|
||||||
|
['DEAT', 'Death'],
|
||||||
|
['EMAIL', 'E-mail'],
|
||||||
|
['OCCU', 'Occupation'],
|
||||||
|
['TITL', 'Title'],
|
||||||
|
['WWW', 'WWW'],
|
||||||
|
]);
|
||||||
|
|
||||||
|
function translateTag(tag: string) {
|
||||||
|
return (
|
||||||
|
<FormattedMessage
|
||||||
|
id={`gedcom.${tag}`}
|
||||||
|
defaultMessage={TAG_DESCRIPTIONS.get(tag) || tag}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function eventDetails(entry: GedcomEntry, tag: string) {
|
||||||
const lines = [];
|
const lines = [];
|
||||||
const date = entry.tree.find((subentry) => subentry.tag === 'DATE');
|
const date = entry.tree.find((subentry) => subentry.tag === 'DATE');
|
||||||
if (date && date.data) {
|
if (date && date.data) {
|
||||||
@ -27,7 +52,7 @@ function eventDetails(entry: GedcomEntry, header: string) {
|
|||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="ui sub header">{header}</div>
|
<div className="ui sub header">{translateTag(tag)}</div>
|
||||||
<span>
|
<span>
|
||||||
{lines.map((line) => (
|
{lines.map((line) => (
|
||||||
<>
|
<>
|
||||||
@ -40,7 +65,7 @@ function eventDetails(entry: GedcomEntry, header: string) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function dataDetails(entry: GedcomEntry, header: string) {
|
function dataDetails(entry: GedcomEntry, tag: string) {
|
||||||
const lines = [];
|
const lines = [];
|
||||||
if (entry.data) {
|
if (entry.data) {
|
||||||
lines.push(entry.data);
|
lines.push(entry.data);
|
||||||
@ -55,7 +80,7 @@ function dataDetails(entry: GedcomEntry, header: string) {
|
|||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="ui sub header">{header}</div>
|
<div className="ui sub header">{translateTag(tag)}</div>
|
||||||
<span>
|
<span>
|
||||||
{lines.map((line) => (
|
{lines.map((line) => (
|
||||||
<>
|
<>
|
||||||
@ -68,7 +93,7 @@ function dataDetails(entry: GedcomEntry, header: string) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function nameDetails(entry: GedcomEntry, header: string) {
|
function nameDetails(entry: GedcomEntry, tag: string) {
|
||||||
return (
|
return (
|
||||||
<h2 className="ui header">
|
<h2 className="ui header">
|
||||||
{entry.data
|
{entry.data
|
||||||
@ -87,7 +112,7 @@ function nameDetails(entry: GedcomEntry, header: string) {
|
|||||||
function getDetails(
|
function getDetails(
|
||||||
entries: GedcomEntry[],
|
entries: GedcomEntry[],
|
||||||
tags: string[],
|
tags: string[],
|
||||||
detailsFunction: (entry: GedcomEntry, header: string) => JSX.Element | null,
|
detailsFunction: (entry: GedcomEntry, tag: string) => JSX.Element | null,
|
||||||
): JSX.Element[] {
|
): JSX.Element[] {
|
||||||
return tags
|
return tags
|
||||||
.flatMap((tag) =>
|
.flatMap((tag) =>
|
||||||
@ -99,10 +124,6 @@ function getDetails(
|
|||||||
.map((element) => <div className="ui segment">{element}</div>);
|
.map((element) => <div className="ui segment">{element}</div>);
|
||||||
}
|
}
|
||||||
|
|
||||||
const NAME_TAGS = ['NAME'];
|
|
||||||
const EVENT_TAGS = ['BIRT', 'BAPM', 'CHR', 'DEAT', 'BURI'];
|
|
||||||
const DATA_TAGS = ['TITL', 'OCCU', 'WWW', 'EMAIL'];
|
|
||||||
|
|
||||||
export class Details extends React.Component<Props, {}> {
|
export class Details extends React.Component<Props, {}> {
|
||||||
render() {
|
render() {
|
||||||
const entries = this.props.gedcom.indis[this.props.indi].tree;
|
const entries = this.props.gedcom.indis[this.props.indi].tree;
|
||||||
|
|||||||
@ -17,5 +17,14 @@
|
|||||||
"load_from_url.title": "Otwórz z adresu URL",
|
"load_from_url.title": "Otwórz z adresu URL",
|
||||||
"load_from_url.comment": "Dane z podanego adresu URL zostaną załadowane poprzez usługę {link} w celu uniknięcia problemów z CORS.",
|
"load_from_url.comment": "Dane z podanego adresu URL zostaną załadowane poprzez usługę {link} w celu uniknięcia problemów z CORS.",
|
||||||
"load_from_url.cancel": "Anuluj",
|
"load_from_url.cancel": "Anuluj",
|
||||||
"load_from_url.load": "Otwórz"
|
"load_from_url.load": "Otwórz",
|
||||||
|
"gedcom.BAPM": "Chrzest",
|
||||||
|
"gedcom.BIRT": "Narodziny",
|
||||||
|
"gedcom.BURI": "Pogrzeb",
|
||||||
|
"gedcom.CHR": "Chrzest",
|
||||||
|
"gedcom.DEAT": "Śmierć",
|
||||||
|
"gedcom.EMAIL": "E-mail",
|
||||||
|
"gedcom.OCCU": "Zawód",
|
||||||
|
"gedcom.TITL": "Tytuł",
|
||||||
|
"gedcom.WWW": "Strona WWW"
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user