52 lines
1.6 KiB
TypeScript
52 lines
1.6 KiB
TypeScript
import Link from 'next/link';
|
|
import { DidYouKnow } from 'src/interfaces/shared/name';
|
|
import styles from 'src/styles/modules/components/name/did-you-know.module.scss';
|
|
|
|
type Props = {
|
|
data: DidYouKnow;
|
|
};
|
|
|
|
const DidYouKnow = ({ data }: Props) => (
|
|
<section className={styles.container}>
|
|
<h2 className='heading heading__secondary'>Did you know</h2>
|
|
{!!data.trivia?.total && (
|
|
<section>
|
|
<h3 className='heading heading__tertiary'>Trivia</h3>
|
|
<div dangerouslySetInnerHTML={{ __html: data.trivia.html }}></div>
|
|
</section>
|
|
)}
|
|
{!!data.quotes?.total && (
|
|
<section>
|
|
<h3 className='heading heading__tertiary'>Quotes</h3>
|
|
<div dangerouslySetInnerHTML={{ __html: data.quotes.html }}></div>
|
|
</section>
|
|
)}
|
|
{!!data.trademark?.total && (
|
|
<section>
|
|
<h3 className='heading heading__tertiary'>Trademark</h3>
|
|
<div dangerouslySetInnerHTML={{ __html: data.trademark.html }}></div>
|
|
</section>
|
|
)}
|
|
{!!data.nicknames.length && (
|
|
<section>
|
|
<h3 className='heading heading__tertiary'>Nicknames</h3>
|
|
<p>{data.nicknames.join(', ')}</p>
|
|
</section>
|
|
)}
|
|
{!!data.salary?.total && (
|
|
<section>
|
|
<h3 className='heading heading__tertiary'>Salary</h3>
|
|
<p>
|
|
<span>{data.salary.value} in </span>
|
|
<Link href={`/title/${data.salary.title.id}`}>
|
|
<a className={'link'}>{data.salary.title.text}</a>
|
|
</Link>
|
|
<span> ({data.salary.title.year})</span>
|
|
</p>
|
|
</section>
|
|
)}
|
|
</section>
|
|
);
|
|
|
|
export default DidYouKnow;
|