granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Adds og:image for showing the page preview (#421)

Browse source
This commit is contained in:
Justin Edmund 2025-01-18 09:08:11 -08:00 committed by GitHub
parent 4a30dbbf9f
commit 0dc03d44f3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 8 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
components/party/PartyHead/index.tsx
View file

@ -2,6 +2,7 @@ import React from 'react'
import Head from 'next/head' import Head from 'next/head'
import { useRouter } from 'next/router' import { useRouter } from 'next/router'
import { useTranslation } from 'next-i18next' import { useTranslation } from 'next-i18next'
import api from '~utils/api'
import generateTitle from '~utils/generateTitle' import generateTitle from '~utils/generateTitle'
@ -18,6 +19,7 @@ const PartyHead = ({ party, meta }: Props) => {
const router = useRouter() const router = useRouter()
const locale = const locale =
router.locale && ['en', 'ja'].includes(router.locale) ? router.locale : 'en' router.locale && ['en', 'ja'].includes(router.locale) ? router.locale : 'en'
const previewUrl = api.previewUrl(party.shortcode)
return ( return (
<Head> <Head>
@ -52,6 +54,7 @@ const PartyHead = ({ party, meta }: Props) => {
content={`https://app.granblue.team/p/${party.shortcode}`} content={`https://app.granblue.team/p/${party.shortcode}`}
/> />
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<meta property="og:image" content={previewUrl} />
{/* Twitter */} {/* Twitter */}
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:card" content="summary_large_image" />
@ -67,6 +70,7 @@ const PartyHead = ({ party, meta }: Props) => {
raidName: party.raid ? party.raid.name[locale] : '', raidName: party.raid ? party.raid.name[locale] : '',
})} })}
/> />
<meta name="twitter:image" content={previewUrl} />
</Head> </Head>
) )
} }

4
utils/api.tsx
View file

@ -139,6 +139,10 @@ class Api {
return axios.get(resourceUrl, params) return axios.get(resourceUrl, params)
} }
previewUrl(shortcode: string): string {
return `${this.url}/parties/${shortcode}/preview`
}
raidGroups(params?: {}) { raidGroups(params?: {}) {
const resourceUrl = `${this.url}/raids/groups` const resourceUrl = `${this.url}/raids/groups`
return axios.get(resourceUrl, params) return axios.get(resourceUrl, params)