diff --git a/og-image/api/_lib/parser.ts b/og-image/api/_lib/parser.ts index 1a0863bd..6d5c9b3d 100644 --- a/og-image/api/_lib/parser.ts +++ b/og-image/api/_lib/parser.ts @@ -16,6 +16,7 @@ export function parseRequest(req: IncomingMessage) { // Attributes for Manifold card: question, probability, + numericValue, metadata, creatorName, creatorUsername, @@ -71,6 +72,7 @@ export function parseRequest(req: IncomingMessage) { question: getString(question) || 'Will you create a prediction market on Manifold?', probability: getString(probability), + numericValue: getString(numericValue) || '', metadata: getString(metadata) || 'Jan 1  •  M$ 123 pool', creatorName: getString(creatorName) || 'Manifold Markets', creatorUsername: getString(creatorUsername) || 'ManifoldMarkets', diff --git a/og-image/api/_lib/template.ts b/og-image/api/_lib/template.ts index 1fe54554..e7b4fcaf 100644 --- a/og-image/api/_lib/template.ts +++ b/og-image/api/_lib/template.ts @@ -91,6 +91,7 @@ export function getHtml(parsedReq: ParsedRequest) { creatorName, creatorUsername, creatorAvatarUrl, + numericValue, } = parsedReq const MAX_QUESTION_CHARS = 100 const truncatedQuestion = @@ -147,8 +148,14 @@ export function getHtml(parsedReq: ParsedRequest) {
${truncatedQuestion}
-
+
${probability}
+ +
${ + numericValue !== '' && probability === '' ? numericValue : '' + }
+
${numericValue !== '' ? 'expected' : ''}
+
${probability !== '' ? 'chance' : ''}
diff --git a/og-image/api/_lib/types.ts b/og-image/api/_lib/types.ts index 3ade016a..ef0a8135 100644 --- a/og-image/api/_lib/types.ts +++ b/og-image/api/_lib/types.ts @@ -14,6 +14,7 @@ export interface ParsedRequest { // Attributes for Manifold card: question: string probability: string + numericValue: string metadata: string creatorName: string creatorUsername: string diff --git a/web/components/SEO.tsx b/web/components/SEO.tsx index b1e0ca5f..08dee31e 100644 --- a/web/components/SEO.tsx +++ b/web/components/SEO.tsx @@ -9,6 +9,7 @@ export type OgCardProps = { creatorName: string creatorUsername: string creatorAvatarUrl?: string + numericValue?: string } function buildCardUrl(props: OgCardProps, challenge?: Challenge) { @@ -25,6 +26,12 @@ function buildCardUrl(props: OgCardProps, challenge?: Challenge) { props.probability === undefined ? '' : `&probability=${encodeURIComponent(props.probability ?? '')}` + + const numericValueParam = + props.numericValue === undefined + ? '' + : `&numericValue=${encodeURIComponent(props.numericValue ?? '')}` + const creatorAvatarUrlParam = props.creatorAvatarUrl === undefined ? '' @@ -41,6 +48,7 @@ function buildCardUrl(props: OgCardProps, challenge?: Challenge) { `https://manifold-og-image.vercel.app/m.png` + `?question=${encodeURIComponent(props.question)}` + probabilityParam + + numericValueParam + `&metadata=${encodeURIComponent(props.metadata)}` + `&creatorName=${encodeURIComponent(props.creatorName)}` + creatorAvatarUrlParam + diff --git a/web/components/contract/contract-card-preview.tsx b/web/components/contract/contract-card-preview.tsx index 06a7f7f6..354fe308 100644 --- a/web/components/contract/contract-card-preview.tsx +++ b/web/components/contract/contract-card-preview.tsx @@ -2,6 +2,8 @@ import { Contract } from 'common/contract' import { getBinaryProbPercent } from 'web/lib/firebase/contracts' import { richTextToString } from 'common/util/parse' import { contractTextDetails } from 'web/components/contract/contract-details' +import { getFormattedMappedValue } from 'common/pseudo-numeric' +import { getProbability } from 'common/calculate' export const getOpenGraphProps = (contract: Contract) => { const { @@ -16,6 +18,11 @@ export const getOpenGraphProps = (contract: Contract) => { const probPercent = outcomeType === 'BINARY' ? getBinaryProbPercent(contract) : undefined + const numericValue = + outcomeType === 'PSEUDO_NUMERIC' + ? getFormattedMappedValue(contract)(getProbability(contract)) + : undefined + const stringDesc = typeof desc === 'string' ? desc : richTextToString(desc) const description = resolution @@ -32,5 +39,6 @@ export const getOpenGraphProps = (contract: Contract) => { creatorUsername, creatorAvatarUrl, description, + numericValue, } }