mirror
/
go-ethereum
mirror of https://github.com/ethereum/go-ethereum
2
0
Fork 1
Code Issues Releases Wiki Activity

PageMetaData component (#30)

Browse Source 
* create PageMetaData component

* small clean up

* add page descriptions

Co-authored-by: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
pull/26459/head^2
Corwin Smith 2 years ago committed by GitHub
parent e1e2043a50
commit 6ff05ed817
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 80 additions and 4 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 49
      src/components/UI/PageMetadata.tsx
  2. 1
      src/components/UI/index.ts
  3. 11
      src/constants.ts
  4. 6
      src/pages/[...slug].tsx
  5. 8
      src/pages/downloads.tsx
  6. 9
      src/pages/index.tsx

49
src/components/UI/PageMetadata.tsx
Unescape View File

@ -0,0 +1,49 @@
import Head from 'next/head';
import { useRouter } from 'next/router';
import { SITE_NAME, SITE_URL } from '../../constants';
interface Props {
title: string;
description: string;
image?: string;
}
export const PageMetadata: React.FC<Props> = ({ title, description, image }) => {
const router = useRouter();
const url = `${SITE_URL}${router.asPath}`;
const fullTitle = `${title} | ${SITE_NAME}`;
const defaultOgImage = `${SITE_URL}/images/pages/gopher-downloads-front-light.svg`; // TODO: update with right image
const ogImage = !image ? defaultOgImage : `${SITE_URL}${image}`;
return (
<Head>
<title>{fullTitle}</title>
<meta name='title' content={fullTitle} />
<meta name='description' content={description} />
<meta name='application-name' content={SITE_NAME} />
<meta name='image' content={ogImage} />
{/* OpenGraph */}
<meta property='og:title' content={fullTitle} />
<meta property='og:description' content={description} />
<meta property='og:type' content='website' />
<meta property='og:site_name' content={SITE_NAME} />
<meta property='og:url' content={url} />
<meta property='og:image' content={ogImage} />
<meta property='og:image:url' content={ogImage} />
<meta property='og:image:secure_url' content={ogImage} />
<meta property='og:image:alt' content={SITE_NAME} />
<meta property='og:image:type' content='image/png' />
{/* Twitter */}
<meta name='twitter:card' content='summary_large_image' />
<meta property='twitter:url' content={url} />
<meta name='twitter:creator' content='@go_ethereum' />
<meta name='twitter:site' content='@go_ethereum' />
<meta name='twitter:title' content={fullTitle} />
<meta name='twitter:description' content={description} />
{/* patch to force a cache invalidation of twitter's card bot */}
<meta name='twitter:image' content={`${ogImage}/#`} />
<link rel='icon' href='/images/favicon.png' />
</Head>
);
};

1
src/components/UI/index.ts
Unescape View File

@ -1,3 +1,4 @@
export * from './ButtonLinkSecondary'; export * from './ButtonLinkSecondary';
export * from './DataTable'; export * from './DataTable';
export * from './Header'; export * from './Header';
export * from './PageMetadata';

11
src/constants.ts
Unescape View File

@ -76,6 +76,17 @@ export const DOWNLOAD_OPENPGP_DEVELOPER_HEADERS = [
'Fingerprint' 'Fingerprint'
]; ];
// Metadata
export const SITE_URL = 'https://geth.ethereum.org';
export const SITE_NAME = 'go-ethereum';
export const METADATA = {
HOME_TITLE: 'Home',
HOME_DESCRIPTION:
'Go-ethereum website, home for the official Golang execution layer implementation of the Ethereum protocol',
DOWNLOADS_TITLE: 'Downloads',
DOWNLOADS_DESCRIPTION: 'All Geth releases and builds, available for download'
};
// GitHub urls // GitHub urls
export const LATEST_GETH_RELEASE_URL = export const LATEST_GETH_RELEASE_URL =
'https://api.github.com/repos/ethereum/go-ethereum/releases/latest'; 'https://api.github.com/repos/ethereum/go-ethereum/releases/latest';

6
src/pages/[...slug].tsx
Unescape View File

@ -6,6 +6,7 @@ import { Heading } from '@chakra-ui/react';
import MDXComponents from '../components/'; import MDXComponents from '../components/';
import { ParsedUrlQuery } from 'querystring'; import { ParsedUrlQuery } from 'querystring';
import type { GetStaticPaths, GetStaticProps, NextPage } from 'next'; import type { GetStaticPaths, GetStaticProps, NextPage } from 'next';
import { PageMetadata } from '../components/UI';
const MATTER_OPTIONS = { const MATTER_OPTIONS = {
engines: { engines: {
@ -70,6 +71,11 @@ interface Props {
const DocPage: NextPage<Props> = ({ frontmatter, content }) => { const DocPage: NextPage<Props> = ({ frontmatter, content }) => {
return ( return (
<> <>
<PageMetadata
title={frontmatter.title}
description={frontmatter.description}
/>
<main> <main>
<Heading as='h1'>{frontmatter.title}</Heading> <Heading as='h1'>{frontmatter.title}</Heading>

8
src/pages/downloads.tsx
Unescape View File

@ -8,7 +8,7 @@ import {
DownloadsTable, DownloadsTable,
SpecificVersionsSection SpecificVersionsSection
} from '../components/UI/downloads'; } from '../components/UI/downloads';
import { DataTable } from '../components/UI'; import { DataTable, PageMetadata } from '../components/UI';
import { import {
ALL_GETH_COMMITS_URL, ALL_GETH_COMMITS_URL,
@ -16,6 +16,7 @@ import {
DOWNLOAD_OPENPGP_BUILD_HEADERS, DOWNLOAD_OPENPGP_BUILD_HEADERS,
DOWNLOAD_OPENPGP_DEVELOPER_HEADERS, DOWNLOAD_OPENPGP_DEVELOPER_HEADERS,
GETH_REPO_URL, GETH_REPO_URL,
METADATA,
LATEST_GETH_RELEASE_URL, LATEST_GETH_RELEASE_URL,
LATEST_SOURCES_BASE_URL, LATEST_SOURCES_BASE_URL,
LINUX_BINARY_BASE_URL, LINUX_BINARY_BASE_URL,
@ -112,7 +113,10 @@ const DownloadsPage: NextPage<Props> = ({ data }) => {
return ( return (
<> <>
{/* TODO: add PageMetadata */} <PageMetadata
title={METADATA.DOWNLOADS_TITLE}
description={METADATA.DOWNLOADS_DESCRIPTION}
/>
<main> <main>
<Stack spacing={4}> <Stack spacing={4}>

9
src/pages/index.tsx
Unescape View File

@ -10,6 +10,7 @@ import {
WhatIsEthereum, WhatIsEthereum,
WhyRunANode WhyRunANode
} from '../components/UI/homepage'; } from '../components/UI/homepage';
import { PageMetadata } from '../components/UI';
import { GopherHomeLinks } from '../components/UI/svgs'; import { GopherHomeLinks } from '../components/UI/svgs';
import { import {
@ -18,13 +19,17 @@ import {
ETHEREUM_FOUNDATION_URL, ETHEREUM_FOUNDATION_URL,
ETHEREUM_ORG_URL, ETHEREUM_ORG_URL,
GETH_REPO_URL, GETH_REPO_URL,
GO_URL GO_URL,
METADATA
} from '../constants'; } from '../constants';
const HomePage: NextPage = ({}) => { const HomePage: NextPage = ({}) => {
return ( return (
<> <>
{/* TODO: add PageMetadata */} <PageMetadata
title={METADATA.HOME_TITLE}
description={METADATA.HOME_DESCRIPTION}
/>
<main> <main>
<Stack spacing={4}> <Stack spacing={4}>

Write Preview
Loading…
Cancel
Save