commit aa2b1a583a7e1e8d1bc426762214119f1146c23c · veryroundbird.house/fixao3

+5 -1

src/app/api/series/[seriesId]/route.js

···

       1
       1
        
       import { getSeries } from "@fujocoded/ao3.js"

     

       2
       2
       +
       import { setArchiveBaseUrl, resetArchiveBaseUrl } from "@fujocoded/ao3.js/urls"

     

       2
       3
        
       

     

       3
       4
        
       export const dynamic = 'force-static'

     

       4
       5
        
       

     

       5
       5
       -
       export async function GET(_req, ctx) {

     

       6
       6
       +
       export async function GET(req, ctx) {

     

       6
       7
        
         const { seriesId } = await ctx.params

     

       8
       8
       +
         const { archive } = await req.nextUrl.searchParams

     

       9
       9
       +
         if (archive) setArchiveBaseUrl(archive)

     

       7
       10
        
         const series = await getSeries({seriesId: seriesId})

     

       11
       11
       +
         if (archive) resetArchiveBaseUrl()

     

       8
       12
        
         return Response.json(series)

     

       9
       13
        
       }

+6 -1

src/app/api/works/[workId]/chapters/[chapterId]/route.js

···

       1
       1
        
       import { getWork } from "@fujocoded/ao3.js"

     

       2
       2
       +
       import { setArchiveBaseUrl, resetArchiveBaseUrl } from "@fujocoded/ao3.js/urls"

     

       2
       3
        
       

     

       3
       4
        
       export const dynamic = 'force-static'

     

       4
       5
        
       

     

       5
       5
       -
       export async function GET(_req, ctx) {

     

       6
       6
       +
       export async function GET(req, ctx) {

     

       6
       7
        
         const { workId, chapterId } = await ctx.params

     

       8
       8
       +
         const params = await req.nextUrl.searchParams

     

       9
       9
       +
         const archive = params.get('archive')

     

       10
       10
       +
         if (archive) setArchiveBaseUrl(archive)

     

       7
       11
        
         const work = await getWork({workId: workId, chapterId: chapterId})

     

       12
       12
       +
         if (archive) resetArchiveBaseUrl()

     

       8
       13
        
         return Response.json(work)

     

       9
       14
        
       }

+6 -3

src/app/api/works/[workId]/route.js

···

       1
       1
        
       import { getWork } from "@fujocoded/ao3.js"

     

       2
       2
       +
       import { setArchiveBaseUrl, getArchiveBaseUrl, resetArchiveBaseUrl } from "@fujocoded/ao3.js/urls"

     

       2
       3
        
       

     

       3
       3
       -
       export const dynamic = 'force-static'

     

       4
       4
       -
       

     

       5
       5
       -
       export async function GET(_req, ctx) {

     

       4
       4
       +
       export async function GET(req, ctx) {

     

       6
       5
        
         const { workId } = await ctx.params

     

       6
       6
       +
         const params = await req.nextUrl.searchParams

     

       7
       7
       +
         const archive = params.get('archive')

     

       8
       8
       +
         if (archive) setArchiveBaseUrl(archive)

     

       7
       9
        
         const work = await getWork({workId: workId})

     

       10
       10
       +
         if (archive) resetArchiveBaseUrl()

     

       8
       11
        
         return Response.json(work)

     

       9
       12
        
       }

+25 -3

src/app/generator/page.js

···

       1
       1
        
       "use client"

     

       2
       2
        
       

     

       3
       3
        
       import { useEffect, useState } from "react"

     

       4
       4
       +
       import { setArchiveBaseUrl, resetArchiveBaseUrl } from "@fujocoded/ao3.js/urls"

     

       4
       5
        
       import themes from "@/lib/themes.js"

     

       5
       6
        
       import baseFonts from "@/lib/baseFonts.js"

     

       6
       7
        
       import titleFonts from "@/lib/titleFonts.js"

     
···

       13
       14
        
         const [addr, setAddr] = useState('')

     

       14
       15
        
         const [imgData, setImgData] = useState(null)

     

       15
       16
        
         const [props, setProps] = useState(defaults)

     

       17
       17
       +
         const [domain, setDomain] = useState('')

     

       16
       18
        
         

     

       17
       19
        
         const updateProp = (name, value) => {

     

       18
       20
        
           const newProps = props

     
···

       22
       24
        
         }

     

       23
       25
        
         

     

       24
       26
        
         const updateData = async () => {

     

       27
       27
       +
           if (url === '') return

     

       25
       28
        
           const workMatch = /\/works\/(?<workId>[0-9]+)(?:\/chapters\/(?<chapterId>[0-9]+))?$/

     

       26
       29
        
           const seriesMatch = /\/series\/(?<seriesId>[0-9]+)$/

     

       30
       30
       +
           const baseurl = /(?<domain>https:\/\/[a-z0-9\-\.]+)\//

     

       31
       31
       +
           const domainMatch = url.match(baseurl)

     

       32
       32
       +
           if (!domainMatch) return

     

       33
       33
       +
           setDomain(domainMatch.groups.domain)

     

       34
       34
       +
           const domainParam = domain && !(["ao3.org", "archiveofourown.org", "archive.transformativeworks.org"].includes(domain)) ? `?archive=${domain}` : ''

     

       27
       35
        
           if (workMatch.test(url)) {

     

       28
       36
        
             const match = url.match(workMatch)

     

       29
       29
       -
             const resp = match.groups.chapterId ? await fetch(`/api/works/${match.groups.workId}/chapters/${match.groups.chapterId}`) : await fetch(`/api/works/${match.groups.workId}`)

     

       37
       37
       +
             const resp = match.groups.chapterId ? await fetch(`/api/works/${match.groups.workId}/chapters/${match.groups.chapterId}${domainParam}`) : await fetch(`/api/works/${match.groups.workId}${domainParam}`)

     

       38
       38
       +
             if (!resp) return

     

       30
       39
        
             const data = await resp.json()

     

       31
       40
        
             setAddr(match.groups.chapterId ? `works/${match.groups.workId}/chapters/${match.groups.chapterId}` : `works/${match.groups.workId}`)

     

       32
       41
        
             setWorkData(data)

     

       33
       42
        
           } else if (seriesMatch.test(url)) {

     

       34
       43
        
             const match = url.match(seriesMatch)

     

       35
       35
       -
             const resp = await fetch(`/api/series/${match.groups.seriesId}`)

     

       44
       44
       +
             const resp = await fetch(`/api/series/${match.groups.seriesId}${domainParam}`)

     

       45
       45
       +
             if (!resp) return

     

       36
       46
        
             const data = await resp.json()

     

       37
       47
        
             setAddr(`series/${match.groups.seriesId}`)

     

       38
       48
        
             setWorkData(data)

     
···

       46
       56
        
         useEffect(() => {

     

       47
       57
        
           const fn = async () => {

     

       48
       58
        
             if (!addr) return;

     

       59
       59
       +
             if (workData.locked) {

     

       60
       60
       +
               const image = await fetch('/locked')

     

       61
       61
       +
               if (image.status !== 200) return;

     

       62
       62
       +
               const imageBlob = await image.blob()

     

       63
       63
       +
               const reader = new FileReader()

     

       64
       64
       +
               reader.onloadend = () => {

     

       65
       65
       +
                 console.log(reader.result)

     

       66
       66
       +
                 setImgData(reader.result)

     

       67
       67
       +
               }

     

       68
       68
       +
               return

     

       69
       69
       +
             }

     

       49
       70
        
             const params = new URLSearchParams(props)

     

       50
       50
       -
             const image = await fetch(`/${addr}/preview?${params.toString()}`)

     

       71
       71
       +
             const image = await fetch(`/${addr}/preview?${params.toString()}&archive=${domain}`)

     

       51
       72
        
             if (image.status !== 200) return;

     

       52
       73
        
             const imageBlob = await image.blob()

     

       53
       74
        
             const reader = new FileReader()

     

       54
       75
        
             reader.onloadend = () => {

     

       55
       76
        
               setImgData(reader.result)

     

       77
       77
       +
               console.log(imgData)

     

       56
       78
        
             }

     

       57
       79
        
             reader.readAsDataURL(imageBlob)

     

       58
       80
        
           }

+13

src/app/locked/route.js

···

       1
       1
       +
       import OGImageLocked from "@/lib/ogimagelocked.js"

     

       2
       2
       +
       

     

       3
       3
       +
       export const size = {

     

       4
       4
       +
         width: 1600,

     

       5
       5
       +
         height: 900,

     

       6
       6
       +
       }

     

       7
       7
       +
       

     

       8
       8
       +
       export const contentType = 'image/png'

     

       9
       9
       +
       

     

       10
       10
       +
       export async function GET(req, _ctx) {

     

       11
       11
       +
         const props = await req.nextUrl.searchParams

     

       12
       12
       +
         return OGImageLocked({theme: props.has('theme') ? props.get('theme') : process.env.DEFAULT_THEME})

     

       13
       13
       +
       }

+4 -1

src/app/series/[seriesId]/preview/route.js

···

       1
       1
        
       import { getSeries } from "@fujocoded/ao3.js"

     

       2
       2
       +
       import { setArchiveBaseUrl, resetArchiveBaseUrl } from "@fujocoded/ao3.js/urls"

     

       2
       3
        
       import querystring  from 'node:querystring'

     

       3
       4
        
       import sanitizeData from "@/lib/sanitizeData.js"

     

       4
       5
        
       import OGImage from "@/lib/ogimage.js"

     
···

       10
       11
        
         height: 900,

     

       11
       12
        
       }

     

       12
       13
        
       

     

       13
       13
       -
       export const contentType = 'image/webp'

     

       14
       14
       +
       export const contentType = 'image/png'

     

       14
       15
        
       

     

       15
       16
        
       export async function GET(req, ctx) {

     

       16
       17
        
         const { seriesId } = await ctx.params

     

       17
       18
        
         const p = await req.nextUrl.searchParams

     

       18
       19
        
         const props = querystring.parse(p.toString())

     

       19
       20
        
         const addr = `series/${seriesId}`

     

       21
       21
       +
         if (props.archive) setArchiveBaseUrl('https://'+props.archive)

     

       20
       22
        
         const data = await getSeries({seriesId: seriesId})

     

       23
       23
       +
         if (props.archive) resetArchiveBaseUrl()

     

       21
       24
        
         const imageParams = await sanitizeData({type: 'series', data: data, props: props})

     

       22
       25
        
         const theme = imageParams.theme

     

       23
       26
        
         const baseFont = baseFonts[imageParams.baseFont].displayName

+6 -6

src/app/works/[workId]/chapters/[chapterId]/preview/route.js

···

       1
       1
       -
       import { getWork } from "@fujocoded/ao3.js"

     

       2
       1
        
       import querystring  from 'node:querystring'

     

       3
       2
        
       import sanitizeData from "@/lib/sanitizeData.js"

     

       4
       3
        
       import OGImage from "@/lib/ogimage.js"

     
···

       10
       9
        
         height: 900,

     

       11
       10
        
       }

     

       12
       11
        
       

     

       13
       13
       -
       export const contentType = 'image/webp'

     

       12
       12
       +
       export const contentType = 'image/png'

     

       14
       13
        
       

     

       15
       14
        
       export async function GET(req, ctx) {

     

       16
       15
        
         const { workId, chapterId } = await ctx.params

     

       17
       17
       -
         const p = await req.nextUrl.searchParams

     

       18
       18
       -
         const props = querystring.parse(p.toString())

     

       19
       19
       -
         const addr = `works/${workId}/chapters/${chapterId}`

     

       20
       20
       -
         const data = await getWork({workId: workId, chapterId: chapterId})

     

       16
       16
       +
         const props = await req.nextUrl.searchParams

     

       17
       17
       +
         const work = await fetch(`http://${process.env.DOMAIN}/api/works/${workId}${domainParam}`)

     

       18
       18
       +
         const data = await data.json()

     

       19
       19
       +
         const addr = `${props.has('archive') ? props.get('archive').replace("https://", "")+"/" : 'archiveofourown.org/'}works/${workId}/chapters/${chapterId}`

     

       20
       20
       +
         const domainParam = props.has('archive') ? `?archive=${props.get('archive')}` : ''

     

       21
       21
        
         const imageParams = await sanitizeData({type: 'work', data: data, props: props})

     

       22
       22
        
         const theme = imageParams.theme

     

       23
       23
        
         const baseFont = baseFonts[imageParams.baseFont].displayName

+6 -13

src/app/works/[workId]/preview/route.js

···

       1
       1
       -
       import { getWork } from "@fujocoded/ao3.js"

     

       2
       2
       -
       import { cache } from "react"

     

       3
       3
       -
       import querystring  from 'node:querystring'

     

       4
       1
        
       import sanitizeData from "@/lib/sanitizeData.js"

     

       5
       2
        
       import OGImage from "@/lib/ogimage.js"

     

       6
       3
        
       import baseFonts from "@/lib/baseFonts.js"

     
···

       11
       8
        
         height: 900,

     

       12
       9
        
       }

     

       13
       10
        
       

     

       14
       14
       -
       export const contentType = 'image/webp'

     

       15
       15
       -
       

     

       16
       16
       -
       const getItem = cache(async (workId) => {

     

       17
       17
       -
         const work = await getWork({workId: workId})

     

       18
       18
       -
         return work

     

       19
       19
       -
       })

     

       11
       11
       +
       export const contentType = 'image/png'

     

       20
       12
        
       

     

       21
       13
        
       export async function GET(req, ctx) {

     

       22
       14
        
         const { workId } = await ctx.params

     

       23
       23
       -
         const p = await req.nextUrl.searchParams

     

       24
       24
       -
         const props = querystring.parse(p.toString())

     

       25
       25
       -
         const addr = `works/${workId}`

     

       26
       26
       -
         const data = await getItem(workId)

     

       15
       15
       +
         const props = await req.nextUrl.searchParams

     

       16
       16
       +
         const addr = `${props.has('archive') ? props.get('archive').replace("https://", "")+"/" : 'archiveofourown.org/'}works/${workId}`

     

       17
       17
       +
         const domainParam = props.has('archive') ? `?archive=${props.get('archive')}` : ''

     

       18
       18
       +
         const work = await fetch(`http://${process.env.DOMAIN}/api/works/${workId}${domainParam}`)

     

       19
       19
       +
         const data = await work.json()

     

       27
       20
        
         const imageParams = await sanitizeData({type: 'work', data: data, props: props})

     

       28
       21
        
         const theme = imageParams.theme

     

       29
       22
        
         const baseFont = baseFonts[imageParams.baseFont].displayName

+19 -14

src/lib/ogimage.js

···

       38
       38
        
                 }}

     

       39
       39
        
               >

     

       40
       40
        
                 <div

     

       41
       41
       +
                 style={{

     

       42
       42
       +
                   textTransform: "uppercase",

     

       43
       43
       +
                   display: "flex",

     

       44
       44
       +
                   justifyContent: "center",

     

       45
       45
       +
                   color: theme.accent,

     

       46
       46
       +
                   alignItems: "center",

     

       47
       47
       +
                   display: "flex",

     

       48
       48
       +
                   justifyContent: "center",

     

       49
       49
       +
                   alignItems: "center",

     

       50
       50
       +
                   textAlign: "center"

     

       51
       51
       +
                 }}

     

       52
       52
       +
                 >

     

       53
       53
       +
                   {image.topLine}

     

       54
       54
       +
                 </div>

     

       55
       55
       +
                 <div

     

       41
       56
        
                   style={{

     

       42
       42
       -
                     textTransform: "uppercase",

     

       43
       57
        
                     display: "flex",

     

       44
       58
        
                     justifyContent: "center",

     

       45
       45
       -
                     gap: 10,

     

       46
       46
       -
                     color: theme.accent,

     

       47
       47
       -
                     alignItems: "center"

     

       48
       48
       -
                   }}

     

       59
       59
       +
                     alignItems: "center",

     

       60
       60
       +
                     gap: 10

     

       61
       61
       +
                   }}  

     

       49
       62
        
                 >

     

       50
       50
       -
                   <div

     

       51
       51
       -
                   style={{

     

       52
       52
       -
                     display: "flex"

     

       53
       53
       -
                   }}

     

       54
       54
       -
                   >

     

       55
       55
       -
                     {image.topLine}

     

       56
       56
       -
                   </div>

     

       57
       57
       -
                     

     

       58
       63
        
                   {image.props.rating && image.rating === 'E' && (<Explicit fg={theme.accentColor} bg={theme.accent} width={28} height={28} />)}

     

       59
       64
        
                   {image.props.rating && image.rating === 'M' && (<Mature fg={theme.accentColor} bg={theme.accent} width={28} height={28} />)}

     

       60
       65
        
                   {image.props.rating && image.rating === 'T' && (<Teen fg={theme.accentColor} bg={theme.accent} width={28} height={28} />)}

     
···

       219
       224
        
                     color: theme.accent2

     

       220
       225
        
                   }}

     

       221
       226
        
                 >

     

       222
       222
       -
                   {image.props.wordcount && `${image.words} words • `}{(image.props.chapters && image.chapterCount !== null) && `${image.chapterCount}  chapters • `}{image.props.postedAt && `posted on ${image.postedAt} • `}{image.props.updatedAt && `updated on ${image.updatedAt} • `}{process.env.ARCHIVE}/{addr}

     

       227
       227
       +
                   {image.props.wordcount && `${image.words} words • `}{(image.props.chapters && image.chapterCount !== null) && `${image.chapterCount}  chapters • `}{image.props.postedAt && `posted on ${image.postedAt} • `}{image.props.updatedAt && `updated on ${image.updatedAt} • `}{addr}

     

       223
       228
        
                 </div>

     

       224
       229
        
               </div>

     

       225
       230
        
             </div>

+7 -7

src/lib/ogimagelocked.js

···

       1
       1
        
       import { ImageResponse } from "next/og"

     

       2
       2
       -
       import General from "@/icons/locked.js"

     

       2
       2
       +
       import themes from "@/lib/themes.js"

     

       3
       3
       +
       import Lock from "@/icons/lock.js"

     

       3
       4
        
       

     

       4
       5
        
       export default async function OGImageLocked ({ theme }) {

     

       6
       6
       +
         const themeData = themes[theme]

     

       5
       7
        
         return new ImageResponse(

     

       6
       8
        
           (

     

       7
       9
        
             <div

     
···

       10
       12
        
                 flexDirection: "column",

     

       11
       13
        
                 justifyContent: "center",

     

       12
       14
        
                 alignItems: "center",

     

       13
       13
       -
                 color: theme.color,

     

       14
       14
       -
                 backgroundColor: theme.background,

     

       15
       15
       -
                 fontFamily: baseFont,

     

       15
       15
       +
                 color: themeData.color,

     

       16
       16
       +
                 backgroundColor: themeData.background,

     

       16
       17
        
                 fontSize: 24,

     

       17
       18
        
                 padding: 20,

     

       18
       19
        
                 width: "100%",

     

       19
       20
        
                 height: "100%",

     

       20
       21
        
               }}

     

       21
       22
        
             >

     

       22
       22
       -
               <Locked bg={theme.background} fg={theme.color} width={480} height={480} />

     

       23
       23
       +
               <Lock bg={themeData.background} fg={themeData.color} width={480} height={480} />

     

       23
       24
        
             </div>

     

       24
       24
       -
           ),

     

       25
       25
       -
           opts

     

       25
       25
       +
           )

     

       26
       26
        
         )

     

       27
       27
        
       }

+16 -12

src/lib/sanitizeData.js

···

       1
       1
        
       import DOM from "fauxdom"

     

       2
       2
        
       import { readFile } from 'node:fs/promises'

     

       3
       3
       +
       import querystring  from 'node:querystring'

     

       3
       4
        
       import { join } from 'node:path'

     

       4
       5
        
       import themes from '@/lib/themes.js'

     

       5
       6
        
       import baseFonts from '@/lib/baseFonts.js'

     

       6
       7
        
       import titleFonts from '@/lib/titleFonts.js'

     

       7
       8
        
       

     

       8
       8
       -
       const getWork = async (workId) => {

     

       9
       9
       -
         const x = await fetch('https://veryroundbird.house')

     

       10
       10
       -
         const data = await fetch(`http://${process.env.DOMAIN}/api/works/${workId}`)

     

       9
       9
       +
       const getWork = async (workId, archive = null) => {

     

       10
       10
       +
         const domainParam = archive ? `?archive=${archive}` : ''

     

       11
       11
       +
         const data = await fetch(`http://${process.env.DOMAIN}/api/works/${workId}${domainParam}`)

     

       11
       12
        
         const work = await data.json()

     

       12
       13
        
         return work

     

       13
       14
        
       }

     

       14
       15
        
       

     

       15
       15
       -
       const getHighestRating = async (works) => {

     

       16
       16
       +
       const getHighestRating = async (works, archive = null) => {

     

       17
       17
       +
         console.log('get rating')

     

       16
       18
        
         const ratings = await Promise.all(works.map(async (w) => {

     

       17
       17
       -
           const work = await getWork(w.id)

     

       19
       19
       +
           const work = await getWork(w.id, archive)

     

       18
       20
        
           return work.rating

     

       19
       21
        
         }))

     

       20
       22
        
         if (ratings.includes("Not Rated")) {

     
···

       29
       31
        
         return "G"

     

       30
       32
        
       }

     

       31
       33
        
       

     

       32
       32
       -
       const getHighestWarning = async (works) => {

     

       34
       34
       +
       const getHighestWarning = async (works, archive = null) => {

     

       35
       35
       +
         console.log('get warning')

     

       33
       36
        
         const warnings = await Promise.all(works.map(async (w) => {

     

       34
       37
        
           const work = await getWork(w.id)

     

       35
       38
        
           return work.tags.warnings

     

       36
       39
        
         }))

     

       37
       37
       -
         console.log(warnings)

     

       38
       40
        
         const warningsUnique = warnings.reduce((a, b) => { return a.concat(b) }).filter((w, i) => { return i === warnings.indexOf(w) })

     

       39
       41
        
         if (warningsUnique.length === 1 && warningsUnique[0] === "Creator Chose Not To Use Archive Warnings") {

     

       40
       42
        
           return "CNTW"

     
···

       44
       46
        
         return "W"

     

       45
       47
        
       }

     

       46
       48
        
       

     

       47
       47
       -
       const getCategory = async (works) => {

     

       49
       49
       +
       const getCategory = async (works, archive = null) => {

     

       50
       50
       +
         console.log('get category')

     

       48
       51
        
         const categories = await Promise.all(works.map(async (w) => {

     

       49
       52
        
           const work = await getWork(w.id)

     

       50
       53
        
           return work.category

     
···

       82
       85
        
       }

     

       83
       86
        
       

     

       84
       87
        
       export default async function sanitizeData ({ type, data, props}) {

     

       85
       85
       -
         const propsParsed = sanitizeProps(props)

     

       88
       88
       +
         const propsParsed = sanitizeProps(querystring.parse(props.toString()))

     

       89
       89
       +
         const archive = props.has('archive') ? props.get('archive') : 'https://archiveofourown.org'

     

       86
       90
        
         const baseFont = propsParsed.baseFont ? propsParsed.baseFont : process.env.DEFAULT_BASE_FONT

     

       87
       91
        
         const baseFontData = baseFonts[baseFont]

     

       88
       92
        
         const titleFont = propsParsed.titleFont ? propsParsed.titleFont : process.env.DEFAULT_TITLE_FONT

     
···

       116
       120
        
             return a.username

     

       117
       121
        
           })

     

       118
       122
        
           : []

     

       119
       119
       -
         const rating = type === 'work' ? await getHighestRating([data]) : await getHighestRating(data.works)

     

       120
       120
       -
         const warning = type === 'work' ? await getHighestWarning([data]) : await getHighestWarning(data.works)

     

       121
       121
       -
         const category = type === 'work' ? await getCategory([data]) : await getCategory(data.works)

     

       123
       123
       +
         const rating = type === 'work' ? await getHighestRating([data], archive) : await getHighestRating(data.works, archive)

     

       124
       124
       +
         const warning = type === 'work' ? await getHighestWarning([data], archive) : await getHighestWarning(data.works, archive)

     

       125
       125
       +
         const category = type === 'work' ? await getCategory([data], archive) : await getCategory(data.works, archive)

     

       122
       126
        
         const authorString = authorsFormatted.length > 1

     

       123
       127
        
           ? authorsFormatted.slice(0, -1).join(", ") + " & " +

     

       124
       128
        
             authorsFormatted.slice(-1)[0]