Skip to content

Commit 75732e0

Browse files
zyachelzyachel
committed
feat(route): add name route
adds much needed route fix #39, #36, https://codeberg.org/zyachel/libremdb/issues/11
1 parent 18ca98f commit 75732e0

File tree

21 files changed

+2150
-2
lines changed

21 files changed

+2150
-2
lines changed

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ Inspired by projects like [teddit](https://codeberg.org/teddit/teddit), [nitter]
107107

108108
- [ ] lists
109109
- [ ] moviemeter
110-
- [ ] person info(includes directors and actors)
110+
- [x] person info(includes directors and actors)
111111
- [ ] company info
112112
- [ ] user info
113113

‎src/components/name/Basic.tsx‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import { CardBasic } from 'src/components/card';
2+
import { Basic as BasicType } from 'src/interfaces/shared/name';
3+
import { formatNumber } from 'src/utils/helpers';
4+
import styles from 'src/styles/modules/components/name/basic.module.scss';
5+
6+
type Props = {
7+
className: string;
8+
data: BasicType;
9+
};
10+
11+
const Basic = ({ data, className }: Props) => {
12+
return (
13+
<CardBasic className={className} image={data.poster.url} title={data.name}>
14+
<div className={styles.ratings}>
15+
{data.ranking && (
16+
<p className={styles.rating}>
17+
<span className={styles.rating__num}>{formatNumber(data.ranking.position)}</span>
18+
<svg className={styles.rating__icon}>
19+
<use href='/svg/sprite.svg#icon-graph-rising'></use>
20+
</svg>
21+
<span className={styles.rating__text}>
22+
{' '}
23+
Popularity (
24+
<span className={styles.rating__sub}>{getRankingStats(data.ranking)}</span>)
25+
</span>
26+
</p>
27+
)}
28+
</div>
29+
30+
{!!data.primaryProfessions.length && (
31+
<p className={styles.genres}>
32+
<span className={styles.heading}>Profession: </span>
33+
{data.primaryProfessions.join(', ')}
34+
</p>
35+
)}
36+
{
37+
<p className={styles.overview}>
38+
<span className={styles.heading}>About: </span>
39+
{data.bio.short}...
40+
</p>
41+
}
42+
<p className={styles.genres}>
43+
<span className={styles.heading}>Known for: </span>
44+
{data.knownFor.title} ({data.knownFor.role})
45+
</p>
46+
</CardBasic>
47+
);
48+
};
49+
50+
const getRankingStats = (ranking: NonNullable<Props['data']['ranking']>) => {
51+
if (ranking.direction === 'FLAT') return '\u2192';
52+
53+
const change = formatNumber(ranking.change);
54+
return (ranking.direction === 'UP' ? '\u2191' : '\u2193') + change;
55+
};
56+
57+
export default Basic;

‎src/components/name/Bio.tsx‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import styles from 'src/styles/modules/components/name/did-you-know.module.scss';
2+
3+
type Props = { bio: string };
4+
5+
const Bio = ({ bio }: Props) => (
6+
<section className={styles.bio}>
7+
<h2 className='heading heading__secondary'>About</h2>
8+
<div dangerouslySetInnerHTML={{ __html: bio }} />
9+
</section>
10+
);
11+
12+
export default Bio;

‎src/components/name/Credits.tsx‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import { Credits } from 'src/interfaces/shared/name';
2+
import { CardTitle } from 'src/components/card';
3+
import styles from 'src/styles/modules/components/name/credits.module.scss';
4+
5+
type Props = {
6+
className: string;
7+
data: Credits;
8+
};
9+
10+
const Credits = ({ className, data }: Props) => {
11+
if (!data.total) return null;
12+
13+
return (
14+
<section className={`${className} ${styles.credits}`}>
15+
<h2 className='heading heading__secondary'>Credits</h2>
16+
<section>
17+
<h3 className='heading heading__tertiary'>Released</h3>
18+
{data.released.map(
19+
(item, i) =>
20+
!!item.total && (
21+
<details open={i === 0} key={item.category.id}>
22+
<summary>
23+
{item.category.text} ({item.total})
24+
</summary>
25+
<ul className={styles.container} key={item.category.id}>
26+
{item.titles.map(title => (
27+
<CardTitle
28+
key={title.id}
29+
link={`/title/${title.id}`}
30+
name={title.title}
31+
titleType={title.type.text}
32+
image={title.poster?.url}
33+
year={title.releaseYear}
34+
ratings={title.ratings}
35+
/>
36+
))}
37+
</ul>
38+
</details>
39+
)
40+
)}
41+
</section>
42+
<section>
43+
<h3 className='heading heading__tertiary'>Unreleased</h3>
44+
{data.unreleased.map(
45+
(item, i) =>
46+
!!item.total && (
47+
<details open={i === 0} key={item.category.id}>
48+
<summary>
49+
{item.category.text} ({item.total})
50+
</summary>
51+
<ul className={styles.container}>
52+
{item.titles.map(title => (
53+
<CardTitle
54+
key={title.id}
55+
link={`/title/${title.id}`}
56+
name={title.title}
57+
titleType={title.type.text}
58+
image={title.poster?.url}
59+
year={title.releaseYear}
60+
>
61+
<p>{title.productionStatus}</p>
62+
</CardTitle>
63+
))}
64+
</ul>
65+
</details>
66+
)
67+
)}
68+
</section>
69+
</section>
70+
);
71+
};
72+
73+
export default Credits;

‎src/components/name/DidYouKnow.tsx‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import Link from 'next/link';
2+
import { DidYouKnow } from 'src/interfaces/shared/name';
3+
import styles from 'src/styles/modules/components/name/did-you-know.module.scss';
4+
5+
type Props = {
6+
data: DidYouKnow;
7+
};
8+
9+
const DidYouKnow = ({ data }: Props) => (
10+
<section className={styles.didYouKnow}>
11+
<h2 className='heading heading__secondary'>Did you know</h2>
12+
<div className={styles.container}>
13+
{!!data.trivia?.total && (
14+
<section>
15+
<h3 className='heading heading__tertiary'>Trivia</h3>
16+
<div dangerouslySetInnerHTML={{ __html: data.trivia.html }}></div>
17+
</section>
18+
)}
19+
{!!data.quotes?.total && (
20+
<section>
21+
<h3 className='heading heading__tertiary'>Quotes</h3>
22+
<div dangerouslySetInnerHTML={{ __html: data.quotes.html }}></div>
23+
</section>
24+
)}
25+
{!!data.trademark?.total && (
26+
<section>
27+
<h3 className='heading heading__tertiary'>Trademark</h3>
28+
<div dangerouslySetInnerHTML={{ __html: data.trademark.html }}></div>
29+
</section>
30+
)}
31+
{!!data.nicknames.length && (
32+
<section>
33+
<h3 className='heading heading__tertiary'>Nicknames</h3>
34+
<p>{data.nicknames.join(', ')}</p>
35+
</section>
36+
)}
37+
{!!data.salary?.total && (
38+
<section>
39+
<h3 className='heading heading__tertiary'>Salary</h3>
40+
<p>
41+
<span>{data.salary.value} in </span>
42+
<Link href={`/title/${data.salary.title.id}`}>
43+
<a className={'link'}>{data.salary.title.text}</a>
44+
</Link>
45+
<span> ({data.salary.title.year})</span>
46+
</p>
47+
</section>
48+
)}
49+
</div>
50+
</section>
51+
);
52+
53+
export default DidYouKnow;

0 commit comments

Comments
 (0)