2024-03-14 update
This commit is contained in:
Chris Grimmett
parent
94c10d07e1
commit
6f66755871
packages
link2cid
next/app
14
packages/link2cid/app.json
Normal file
14
packages/link2cid/app.json
Normal file
@ -0,0 +1,14 @@
|
||||
{
|
||||
"healthchecks": {
|
||||
"web": [
|
||||
{
|
||||
"type": "startup",
|
||||
"name": "web check",
|
||||
"description": "Checking for expecting string at /health",
|
||||
"path": "/health",
|
||||
"content": "link2cid",
|
||||
"attempts": 3
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,5 @@
|
||||
import { getAllStreamsForVtuber } from "@/lib/streams";
|
||||
import { getVodsForVtuber } from "@/lib/vods";
|
||||
import { IVtuber } from "@/lib/vtubers";
|
||||
|
||||
export interface IArchiveProgressProps {
|
||||
@ -6,6 +7,7 @@ export interface IArchiveProgressProps {
|
||||
}
|
||||
|
||||
export default async function ArchiveProgress ({ vtuber }: IArchiveProgressProps) {
|
||||
const vods = await getVodsForVtuber(vtuber.id)
|
||||
// const streams = await getAllStreamsForVtuber(vtuber.id);
|
||||
// const goodStreams = await getAllStreamsForVtuber(vtuber.id, ['good']);
|
||||
// const issueStreams = await getAllStreamsForVtuber(vtuber.id, ['issue']);
|
||||
@ -20,5 +22,11 @@ export default async function ArchiveProgress ({ vtuber }: IArchiveProgressProps
|
||||
// <progress className="progress is-success" value={eligibleStreams} max={totalStreams}>{completedPercentage}%</progress>
|
||||
// </div>
|
||||
// )
|
||||
return "@todo"
|
||||
// @todo
|
||||
|
||||
return (
|
||||
<div>
|
||||
<i><p className="">{(vods) ? vods.data.length : 0} vods</p></i>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -17,7 +17,7 @@ export default function Footer() {
|
||||
<ul>
|
||||
<li><Link href="#top">↑ Top of page</Link></li>
|
||||
<li><Link href="/vt">Vtubers</Link></li>
|
||||
<li><Link href="/streams">Stream Archive</Link></li>
|
||||
{/* <li><Link href="/streams">Stream Archive</Link></li> */}
|
||||
<li><Link href="/about">About</Link></li>
|
||||
<li><Link href="/faq">FAQ</Link></li>
|
||||
<li><Link href="/goals">Goals</Link></li>
|
||||
@ -26,7 +26,7 @@ export default function Footer() {
|
||||
<li><Link href="/feed">RSS Feed</Link></li>
|
||||
<li><Link href="/api">API</Link></li>
|
||||
<li><Link href="https://status.futureporn.net/" target="_blank"><span className="mr-1">Status</span><FontAwesomeIcon icon={faExternalLinkAlt} className="fab fa-external-link-alt"></FontAwesomeIcon></Link></li>
|
||||
<li><Link href="/upload">Upload</Link></li>
|
||||
{/* <li><Link href="/upload">Upload</Link></li> */}
|
||||
<li><Link href="/profile">Profile</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -4,6 +4,17 @@ interface ILocalizedDateProps {
|
||||
date: Date;
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* this causes hydration issues
|
||||
*
|
||||
* Error: Text content does not match server-rendered HTML.
|
||||
*
|
||||
* Warning: Text content did not match. Server: "2024-01-01" Client: "2023-12-31"
|
||||
*
|
||||
* See more info here: https://nextjs.org/docs/messages/react-hydration-error
|
||||
*/
|
||||
|
||||
export function LocalizedDate ({ date }: ILocalizedDateProps) {
|
||||
const isoDateTime = formatISO(date);
|
||||
const isoDate = formatISO(date, { representation: 'date' });
|
||||
|
||||
@ -43,7 +43,7 @@ export default function Navbar() {
|
||||
<div className={`navbar-menu ${isExpanded ? 'is-active' : ''}`} id="navMenu">
|
||||
<div className='navbar-start'>
|
||||
<Link className="navbar-item is-expanded" href="/vt">Vtubers</Link>
|
||||
<Link className="navbar-item is-expanded" href="/streams">Stream Archive</Link>
|
||||
{/* <Link className="navbar-item is-expanded" href="/streams">Stream Archive</Link> */}
|
||||
<Link className="navbar-item is-expanded" href="/about">About</Link>
|
||||
<Link className="navbar-item is-expanded" href="/faq">FAQ</Link>
|
||||
<Link className="navbar-item is-expanded" href="/goals">Goals</Link>
|
||||
|
||||
@ -10,6 +10,7 @@ import { buildIpfsUrl } from '@/lib/ipfs';
|
||||
import { getSafeDate } from "@/lib/dates";
|
||||
import { StreamButton } from '@/components/stream-button';
|
||||
import VtuberButton from "./vtuber-button";
|
||||
import { LocalizedDate } from "./localized-date";
|
||||
|
||||
export function getDownloadLink(cid: string, safeDate: string, slug: string, quality: string) {
|
||||
return buildIpfsUrl(`${cid}?filename=${slug}-${safeDate}-${quality}.mp4`)
|
||||
@ -35,7 +36,8 @@ export default function VodNav ({ vod }: IVodNavProps) {
|
||||
</Link>
|
||||
</div>
|
||||
<div className="level-item">
|
||||
<StreamButton stream={vod.attributes.stream.data} />
|
||||
{/* <StreamButton stream={vod.attributes.stream.data} /> */}
|
||||
{vod.attributes.date2}
|
||||
</div>
|
||||
</div>
|
||||
<div className='level-right'>
|
||||
|
||||
@ -29,8 +29,8 @@ export function buildMuxThumbnailUrl(playbackId: string, token: string) {
|
||||
|
||||
|
||||
export default async function VodPage({vod}: { vod: IVod }) {
|
||||
console.log('vod page helllo')
|
||||
console.log(vod)
|
||||
// console.log('vod page helllo')
|
||||
// console.log(vod)
|
||||
|
||||
if (!vod) notFound();
|
||||
const slug = vod.attributes.vtuber.data.attributes.slug;
|
||||
|
||||
@ -30,218 +30,218 @@ export default async function Page({ params }: { params: { slug: string } }) {
|
||||
const vods = await getVodsForVtuber(vtuber.id, 1, 9);
|
||||
if (!vods) notFound();
|
||||
|
||||
return '@todo'
|
||||
// @todo
|
||||
// const missingStreams = await getAllStreamsForVtuber(vtuber.id, ['missing']);
|
||||
// const issueStreams = await getAllStreamsForVtuber(vtuber.id, ['issue']);
|
||||
// const goodStreams = await getAllStreamsForVtuber(vtuber.id, ['good']);
|
||||
|
||||
|
||||
|
||||
// // return (
|
||||
// // <>
|
||||
// // <p>hi mom!</p>
|
||||
// // <pre>
|
||||
// // <code>
|
||||
// // {JSON.stringify(missingStreams, null, 2)}
|
||||
// // </code>
|
||||
// // </pre>
|
||||
// // </>
|
||||
// // )
|
||||
|
||||
// return (
|
||||
// <>
|
||||
// {vtuber && (
|
||||
// <>
|
||||
// <div className="box">
|
||||
|
||||
// <div className="columns is-multiline">
|
||||
// <div className="column is-full">
|
||||
// <h1 className="title is-2">{vtuber.attributes.displayName}</h1>
|
||||
// </div>
|
||||
// <div className="column is-one-quarter">
|
||||
// <figure className="image is-rounded is-1by1">
|
||||
// <Image
|
||||
// className="is-rounded"
|
||||
// alt={vtuber.attributes.displayName}
|
||||
// src={vtuber.attributes.image}
|
||||
// fill={true}
|
||||
// placeholder='blur'
|
||||
// blurDataURL={vtuber.attributes.imageBlur}
|
||||
// />
|
||||
// </figure>
|
||||
// </div>
|
||||
// <div className="column is-three-quarters">
|
||||
// <p className="is-size-5 mb-3">{vtuber.attributes.description1}</p>
|
||||
// <p className="is-size-5">{vtuber.attributes.description2}</p>
|
||||
// </div>
|
||||
// </div>
|
||||
|
||||
// <h2 id="socials" className="title is-3">
|
||||
// <Link href="#socials">Socials</Link>
|
||||
// </h2>
|
||||
|
||||
|
||||
// <div className="column is-full mb-5">
|
||||
// <div className="columns has-text-centered is-multiline is-centered">
|
||||
// {vtuber.attributes.patreon && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link href={vtuber.attributes.patreon} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faPatreon} className="fab fa-patreon" /></span><span className="mr-2">Patreon</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.twitter && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.twitter} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faXTwitter} className="fab fa-x-twitter" /></span><span className="mr-2">Twitter</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.youtube && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.youtube} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faYoutube} className="fab fa-youtube" /></span><span className="mr-2">YouTube</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.twitch && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.twitch} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faTwitch} className="fab fa-twitch" /></span><span className="mr-2">Twitch</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.tiktok && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.tiktok} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faTiktok} className="fab fa-tiktok" /></span><span className="mr-2">TikTok</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.fansly && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.fansly} className='subtitle is-5'>
|
||||
// <span className='mr-2'><FanslyIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Fansly</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.onlyfans && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.onlyfans} className='subtitle is-5'>
|
||||
// <span className='mr-2'>
|
||||
// <OnlyfansIcon width={20} height={20} className={styles.icon}></OnlyfansIcon>
|
||||
// </span><span className="mr-2">OnlyFans</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.pornhub && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.pornhub} className='subtitle is-5'>
|
||||
// <span className='mr-2'><PornhubIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Pornhub</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.reddit && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.reddit} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faReddit} className="fab fa-reddit" /></span><span className="mr-2">Reddit</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.discord && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.discord} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faDiscord} className="fab fa-discord" /></span><span className="mr-2">Discord</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.instagram && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.instagram} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faInstagram} className="fab fa-instagram" /></span><span className="mr-2">Instagram</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.facebook && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.facebook} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faFacebook} className="fab fa-facebook" /></span><span className="mr-2">Facebook</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.merch && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.merch} className="subtitle is-5">
|
||||
// <span className="mr-2"><FontAwesomeIcon icon={faBagShopping} className="fas fa-bag-shopping" /></span><span className="mr-2">Merch</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.chaturbate && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.chaturbate} className='subtitle is-5'>
|
||||
// <span className='mr-2'><ChaturbateIcon width={20} className={styles.icon}/></span><span className="mr-2">Chaturbate</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.throne && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.throne} className='subtitle is-5'>
|
||||
// <span className='mr-2'><ThroneIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Throne</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.linktree && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.linktree} className='subtitle is-5'>
|
||||
// <span className='mr-2'><LinktreeIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Linktree</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// {vtuber.attributes.carrd && (
|
||||
// <div className="column is-3 is-narrow">
|
||||
// <Link target="_blank" href={vtuber.attributes.carrd} className='subtitle is-5'>
|
||||
// <span className='mr-2'><CarrdIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Carrd</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
// </Link>
|
||||
// </div>
|
||||
// )}
|
||||
// </div>
|
||||
// </div>
|
||||
|
||||
|
||||
// {/* <h2 id="toys" className="title is-3">
|
||||
// <Link href="#toys">Toys</Link>
|
||||
// </h2>
|
||||
|
||||
// <>
|
||||
// <ToysList vtuber={vtuber} toys={toys} page={1} pageSize={toySampleCount} />
|
||||
// {(toys.pagination.total > toySampleCount) && <Link href={`/vt/${vtuber.slug}/toys/1`} className='button mb-5'>See all of {vtuber.displayName}'s toys</Link>}
|
||||
// </> */}
|
||||
|
||||
// <h2 id="vods" className="title is-3">
|
||||
// <Link href="#vods">Vods</Link>
|
||||
// </h2>
|
||||
|
||||
// <VodsList vtuber={vtuber} vods={vods.data} page={1} pageSize={9} />
|
||||
// {
|
||||
// (vtuber.attributes.vods) ? (
|
||||
// <Link className='button mb-5' href={`/vt/${vtuber.attributes.slug}/vods/1`}>See all {vtuber.attributes.displayName} vods</Link>
|
||||
// ) : (<p className='section'><i>No VODs have been added, yet.</i></p>)
|
||||
// }
|
||||
|
||||
// <h2 id="streams" className='title is-3'>
|
||||
// <Link href="#streams">Streams</Link>
|
||||
// </h2>
|
||||
// <StreamsCalendar missingStreams={missingStreams} issueStreams={issueStreams} goodStreams={goodStreams} />
|
||||
// {/*
|
||||
// <h2 id="progress" className='title is-3'>
|
||||
// <Link href="#progress">Archive Progress</Link>
|
||||
// </h2>
|
||||
// <ArchiveProgress vtuber={vtuber} /> */}
|
||||
|
||||
|
||||
// </div>
|
||||
// <p>hi mom!</p>
|
||||
// <pre>
|
||||
// <code>
|
||||
// {JSON.stringify(missingStreams, null, 2)}
|
||||
// </code>
|
||||
// </pre>
|
||||
// </>
|
||||
// )}
|
||||
// </>
|
||||
// );
|
||||
// )
|
||||
|
||||
return (
|
||||
<>
|
||||
{vtuber && (
|
||||
<>
|
||||
<div className="box">
|
||||
|
||||
<div className="columns is-multiline">
|
||||
<div className="column is-full">
|
||||
<h1 className="title is-2">{vtuber.attributes.displayName}</h1>
|
||||
</div>
|
||||
<div className="column is-one-quarter">
|
||||
<figure className="image is-rounded is-1by1">
|
||||
<Image
|
||||
className="is-rounded"
|
||||
alt={vtuber.attributes.displayName}
|
||||
src={vtuber.attributes.image}
|
||||
fill={true}
|
||||
placeholder='blur'
|
||||
blurDataURL={vtuber.attributes.imageBlur}
|
||||
/>
|
||||
</figure>
|
||||
</div>
|
||||
<div className="column is-three-quarters">
|
||||
<p className="is-size-5 mb-3">{vtuber.attributes.description1}</p>
|
||||
<p className="is-size-5">{vtuber.attributes.description2}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2 id="socials" className="title is-3">
|
||||
<Link href="#socials">Socials</Link>
|
||||
</h2>
|
||||
|
||||
|
||||
<div className="column is-full mb-5">
|
||||
<div className="columns has-text-centered is-multiline is-centered">
|
||||
{vtuber.attributes.patreon && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link href={vtuber.attributes.patreon} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faPatreon} className="fab fa-patreon" /></span><span className="mr-2">Patreon</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.twitter && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.twitter} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faXTwitter} className="fab fa-x-twitter" /></span><span className="mr-2">Twitter</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.youtube && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.youtube} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faYoutube} className="fab fa-youtube" /></span><span className="mr-2">YouTube</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.twitch && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.twitch} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faTwitch} className="fab fa-twitch" /></span><span className="mr-2">Twitch</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.tiktok && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.tiktok} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faTiktok} className="fab fa-tiktok" /></span><span className="mr-2">TikTok</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.fansly && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.fansly} className='subtitle is-5'>
|
||||
<span className='mr-2'><FanslyIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Fansly</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.onlyfans && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.onlyfans} className='subtitle is-5'>
|
||||
<span className='mr-2'>
|
||||
<OnlyfansIcon width={20} height={20} className={styles.icon}></OnlyfansIcon>
|
||||
</span><span className="mr-2">OnlyFans</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.pornhub && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.pornhub} className='subtitle is-5'>
|
||||
<span className='mr-2'><PornhubIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Pornhub</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.reddit && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.reddit} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faReddit} className="fab fa-reddit" /></span><span className="mr-2">Reddit</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.discord && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.discord} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faDiscord} className="fab fa-discord" /></span><span className="mr-2">Discord</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.instagram && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.instagram} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faInstagram} className="fab fa-instagram" /></span><span className="mr-2">Instagram</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.facebook && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.facebook} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faFacebook} className="fab fa-facebook" /></span><span className="mr-2">Facebook</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.merch && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.merch} className="subtitle is-5">
|
||||
<span className="mr-2"><FontAwesomeIcon icon={faBagShopping} className="fas fa-bag-shopping" /></span><span className="mr-2">Merch</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.chaturbate && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.chaturbate} className='subtitle is-5'>
|
||||
<span className='mr-2'><ChaturbateIcon width={20} className={styles.icon}/></span><span className="mr-2">Chaturbate</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.throne && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.throne} className='subtitle is-5'>
|
||||
<span className='mr-2'><ThroneIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Throne</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.linktree && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.linktree} className='subtitle is-5'>
|
||||
<span className='mr-2'><LinktreeIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Linktree</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
{vtuber.attributes.carrd && (
|
||||
<div className="column is-3 is-narrow">
|
||||
<Link target="_blank" href={vtuber.attributes.carrd} className='subtitle is-5'>
|
||||
<span className='mr-2'><CarrdIcon width={20} height={20} className={styles.icon}/></span><span className="mr-2">Carrd</span><span><FontAwesomeIcon icon={faExternalLinkAlt} className="fas fa-external-link-alt" /></span>
|
||||
</Link>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{/* <h2 id="toys" className="title is-3">
|
||||
<Link href="#toys">Toys</Link>
|
||||
</h2>
|
||||
|
||||
<>
|
||||
<ToysList vtuber={vtuber} toys={toys} page={1} pageSize={toySampleCount} />
|
||||
{(toys.pagination.total > toySampleCount) && <Link href={`/vt/${vtuber.slug}/toys/1`} className='button mb-5'>See all of {vtuber.displayName}'s toys</Link>}
|
||||
</> */}
|
||||
|
||||
<h2 id="vods" className="title is-3">
|
||||
<Link href="#vods">Vods</Link>
|
||||
</h2>
|
||||
|
||||
<VodsList vtuber={vtuber} vods={vods.data} page={1} pageSize={9} />
|
||||
{
|
||||
(vtuber.attributes.vods) ? (
|
||||
<Link className='button mb-5' href={`/vt/${vtuber.attributes.slug}/vods/1`}>See all {vtuber.attributes.displayName} vods</Link>
|
||||
) : (<p className='section'><i>No VODs have been added, yet.</i></p>)
|
||||
}
|
||||
|
||||
{/* <h2 id="streams" className='title is-3'>
|
||||
<Link href="#streams">Streams</Link>
|
||||
</h2> */}
|
||||
{/* <StreamsCalendar missingStreams={missingStreams} issueStreams={issueStreams} goodStreams={goodStreams} /> */}
|
||||
{/*
|
||||
<h2 id="progress" className='title is-3'>
|
||||
<Link href="#progress">Archive Progress</Link>
|
||||
</h2>
|
||||
<ArchiveProgress vtuber={vtuber} /> */}
|
||||
|
||||
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user