1e0845f4b9
* Add tsconfig.json for common * Prefer `const` over `let` over `var` * Kill dead code * Fix some trivial Typescript issues * Turn on Typescript linting in common except for no-explicit-any * Correctly specify tsconfig dir name in functions eslintrc * Give react children explicit types * Add explicit types to removeUndefinedProps * Create StripeSession type * Give event in Dropdown an explicit type * Revert "Give event in Dropdown an explicit type" This reverts commit80604310f2. * Give bids in NewBidTable an explicit type * Cast results of removeUndefinedProps when neccessary * Fix type of JoinSpans * Revert "Cast results of removeUndefinedProps when neccessary" This reverts commit5541617bc8. * Revert "Add explicit types to removeUndefinedProps" This reverts commitccf8ffb0b5. * Give React children types everywhere * Give event a type * Give event correct type * Lint * Standardize React import Co-authored-by: Marshall Polaris <marshall@pol.rs>
90 lines
2.2 KiB
TypeScript
90 lines
2.2 KiB
TypeScript
import { ReactNode } from 'react'
|
|
import Head from 'next/head'
|
|
|
|
export type OgCardProps = {
|
|
question: string
|
|
probability?: string
|
|
metadata: string
|
|
creatorName: string
|
|
creatorUsername: string
|
|
creatorAvatarUrl?: string
|
|
}
|
|
|
|
function buildCardUrl(props: OgCardProps) {
|
|
const probabilityParam =
|
|
props.probability === undefined
|
|
? ''
|
|
: `&probability=${encodeURIComponent(props.probability ?? '')}`
|
|
const creatorAvatarUrlParam =
|
|
props.creatorAvatarUrl === undefined
|
|
? ''
|
|
: `&creatorAvatarUrl=${encodeURIComponent(props.creatorAvatarUrl ?? '')}`
|
|
|
|
// URL encode each of the props, then add them as query params
|
|
return (
|
|
`https://manifold-og-image.vercel.app/m.png` +
|
|
`?question=${encodeURIComponent(props.question)}` +
|
|
probabilityParam +
|
|
`&metadata=${encodeURIComponent(props.metadata)}` +
|
|
`&creatorName=${encodeURIComponent(props.creatorName)}` +
|
|
creatorAvatarUrlParam +
|
|
`&creatorUsername=${encodeURIComponent(props.creatorUsername)}`
|
|
)
|
|
}
|
|
|
|
export function SEO(props: {
|
|
title: string
|
|
description: string
|
|
url?: string
|
|
children?: ReactNode
|
|
ogCardProps?: OgCardProps
|
|
}) {
|
|
const { title, description, url, children, ogCardProps } = props
|
|
|
|
return (
|
|
<Head>
|
|
<title>{title} | Manifold Markets</title>
|
|
|
|
<meta
|
|
property="og:title"
|
|
name="twitter:title"
|
|
content={title}
|
|
key="title"
|
|
/>
|
|
<meta name="description" content={description} key="description1" />
|
|
<meta
|
|
property="og:description"
|
|
name="twitter:description"
|
|
content={description}
|
|
key="description2"
|
|
/>
|
|
|
|
{url && (
|
|
<meta
|
|
property="og:url"
|
|
content={'https://manifold.markets' + url}
|
|
key="url"
|
|
/>
|
|
)}
|
|
|
|
{ogCardProps && (
|
|
<>
|
|
<meta
|
|
property="og:image"
|
|
content={buildCardUrl(ogCardProps)}
|
|
key="image1"
|
|
/>
|
|
<meta name="twitter:card" content="summary_large_image" key="card" />
|
|
<meta
|
|
name="twitter:image"
|
|
content={buildCardUrl(ogCardProps)}
|
|
key="image2"
|
|
/>
|
|
</>
|
|
)}
|
|
|
|
{children}
|
|
</Head>
|
|
)
|
|
}
|