diff --git a/website/README.md b/website/README.md index a8fa9c175..1083665ee 100644 --- a/website/README.md +++ b/website/README.md @@ -78,6 +78,7 @@ bit of time. ```yaml ├── docs # the actual markdown content ├── meta # JSON-formatted site metadata +| ├── dynamicMeta.js # At build time generated meta data | ├── languages.json # supported languages and statistical models | ├── sidebars.json # sidebar navigations for different sections | ├── site.json # general site metadata diff --git a/website/gatsby-config.js b/website/gatsby-config.js index 1d919dc33..ca3c75aad 100644 --- a/website/gatsby-config.js +++ b/website/gatsby-config.js @@ -13,16 +13,11 @@ const codeBlocksPlugin = require('./src/plugins/remark-code-blocks.js') // Import metadata const site = require('./meta/site.json') -const sidebars = require('./meta/sidebars.json') -const models = require('./meta/languages.json') -const universe = require('./meta/universe.json') +const { domain, nightly: isNightly, legacy: isLegacy } = site +const { siteUrl } = require('./meta/dynamicMeta') const DEFAULT_TEMPLATE = path.resolve('./src/templates/index.js') -const domain = process.env.BRANCH || site.domain -const siteUrl = `https://${domain}` -const isNightly = site.nightlyBranches.includes(domain) -const isLegacy = site.legacy || !!+process.env.SPACY_LEGACY const favicon = `src/images/icon${isNightly ? '_nightly' : isLegacy ? '_legacy' : ''}.png` const branch = isNightly ? 'develop' : 'master' @@ -34,30 +29,11 @@ const replacements = { SPACY_PKG_FLAGS: isNightly ? ' --pre' : '', } -/** - * Compute the overall total counts of models and languages - */ -function getCounts(langs = []) { - return { - langs: langs.length, - modelLangs: langs.filter(({ models }) => models && !!models.length).length, - models: langs.map(({ models }) => (models ? models.length : 0)).reduce((a, b) => a + b, 0), - } -} - module.exports = { siteMetadata: { ...site, - sidebars, - ...models, - counts: getCounts(models.languages), - universe, - nightly: isNightly, - legacy: isLegacy, - binderBranch: domain, siteUrl, }, - plugins: [ { resolve: `gatsby-plugin-sass`, diff --git a/website/gatsby-node.js b/website/gatsby-node.js index 4a580eb03..caa507db6 100644 --- a/website/gatsby-node.js +++ b/website/gatsby-node.js @@ -4,6 +4,9 @@ const { createFilePath } = require('gatsby-source-filesystem') const DEFAULT_TEMPLATE = path.resolve('./src/templates/index.js') const BASE_PATH = 'docs' const PAGE_EXTENSIONS = ['.md', '.mdx'] +const siteMetadata = require('./meta/site.json') +const universe = require('./meta/universe.json') +const models = require('./meta/languages.json') function replacePath(pagePath) { return pagePath === `/` ? pagePath : pagePath.replace(/\/$/, ``) @@ -26,37 +29,6 @@ exports.createPages = ({ graphql, actions }) => { graphql( ` { - site { - siteMetadata { - sections { - id - title - theme - } - languages { - code - name - models - example - has_examples - } - universe { - resources { - id - title - slogan - } - categories { - label - items { - id - title - description - } - } - } - } - } allFile(filter: { ext: { in: [".md", ".mdx"] } }) { edges { node { @@ -107,8 +79,10 @@ exports.createPages = ({ graphql, actions }) => { reject(result.errors) } - const sectionData = result.data.site.siteMetadata.sections - const sections = Object.assign({}, ...sectionData.map((s) => ({ [s.id]: s }))) + const sections = Object.assign( + {}, + ...siteMetadata.sections.map((s) => ({ [s.id]: s })) + ) /* Regular pages */ @@ -183,8 +157,8 @@ exports.createPages = ({ graphql, actions }) => { }, }) - const universe = result.data.site.siteMetadata.universe.resources - universe.forEach((page) => { + const universeResources = universe.resources + universeResources.forEach((page) => { const slug = `/universe/project/${page.id}` createPage({ @@ -202,7 +176,7 @@ exports.createPages = ({ graphql, actions }) => { }) }) - const universeCategories = result.data.site.siteMetadata.universe.categories + const universeCategories = universe.categories const categories = [].concat.apply( [], universeCategories.map((cat) => cat.items) @@ -227,7 +201,7 @@ exports.createPages = ({ graphql, actions }) => { /* Models */ - const langs = result.data.site.siteMetadata.languages + const langs = models.languages const modelLangs = langs.filter(({ models }) => models && models.length) modelLangs.forEach(({ code, name, models, example, has_examples }, i) => { const slug = `/models/${code}` diff --git a/website/meta/dynamicMeta.js b/website/meta/dynamicMeta.js new file mode 100644 index 000000000..da3031c13 --- /dev/null +++ b/website/meta/dynamicMeta.js @@ -0,0 +1,11 @@ +const site = require('./site.json') + +const domain = process.env.BRANCH || site.domain + +module.exports = { + domain, + siteUrl: `https://${domain}`, + nightly: site.nightlyBranches.includes(domain), + legacy: site.legacy || !!+process.env.SPACY_LEGACY, + binderBranch: domain, +} diff --git a/website/meta/site.json b/website/meta/site.json index fa79d3c69..5dcb89443 100644 --- a/website/meta/site.json +++ b/website/meta/site.json @@ -27,7 +27,6 @@ "indexName": "spacy" }, "binderUrl": "explosion/spacy-io-binder", - "binderBranch": "spacy.io", "binderVersion": "3.4", "sections": [ { "id": "usage", "title": "Usage Documentation", "theme": "blue" }, diff --git a/website/src/components/code.js b/website/src/components/code.js index 93c4cf519..28e3cb5d4 100644 --- a/website/src/components/code.js +++ b/website/src/components/code.js @@ -4,7 +4,6 @@ import classNames from 'classnames' import highlightCode from 'gatsby-remark-prismjs/highlight-code.js' import 'prismjs-bibtex' import rangeParser from 'parse-numeric-range' -import { StaticQuery, graphql } from 'gatsby' import { window } from 'browser-monads' import CUSTOM_TYPES from '../../meta/type-annotations.json' @@ -12,6 +11,8 @@ import { isString, htmlToReact } from './util' import Link, { OptionalLink } from './link' import GitHubCode from './github' import classes from '../styles/code.module.sass' +import siteMetadata from '../../meta/site.json' +import { binderBranch } from '../../meta/dynamicMeta' const WRAP_THRESHOLD = 30 const CLI_GROUPS = ['init', 'debug', 'project', 'ray', 'huggingface-hub'] @@ -270,51 +271,34 @@ export class Code extends React.Component { } } -const JuniperWrapper = ({ Juniper, title, lang, children }) => ( - { - const { binderUrl, binderBranch, binderVersion } = data.site.siteMetadata - const juniperTitle = title || 'Editable Code' - return ( -
-

- {juniperTitle} - - spaCy v{binderVersion} · Python 3 · via{' '} - - Binder - - -

+const JuniperWrapper = ({ Juniper, title, lang, children }) => { + const { binderUrl, binderVersion } = siteMetadata + const juniperTitle = title || 'Editable Code' + return ( +
+

+ {juniperTitle} + + spaCy v{binderVersion} · Python 3 · via{' '} + + Binder + + +

- - {children} - -
- ) - }} - /> -) - -const query = graphql` - query JuniperQuery { - site { - siteMetadata { - binderUrl - binderBranch - binderVersion - } - } - } -` + + {children} + +
+ ) +} diff --git a/website/src/components/footer.js b/website/src/components/footer.js index df19443f2..759db8a7b 100644 --- a/website/src/components/footer.js +++ b/website/src/components/footer.js @@ -1,6 +1,5 @@ import React from 'react' import PropTypes from 'prop-types' -import { StaticQuery, graphql } from 'gatsby' import classNames from 'classnames' import Link from './link' @@ -8,89 +7,55 @@ import Grid from './grid' import Newsletter from './newsletter' import ExplosionLogo from '-!svg-react-loader!../images/explosion.svg' import classes from '../styles/footer.module.sass' +import siteMetadata from '../../meta/site.json' export default function Footer({ wide = false }) { + const { companyUrl, company, footer, newsletter } = siteMetadata return ( - { - const { companyUrl, company, footer, newsletter } = data.site.siteMetadata - return ( -
- - {footer.map(({ label, items }, i) => ( -
-
    -
  • {label}
    • - {items.map(({ text, url }, j) => ( -
  • - - {text} - -
    • - ))} -
-
+
+ + {footer.map(({ label, items }, i) => ( +
+
    +
  • {label}
    • + {items.map(({ text, url }, j) => ( +
  • + + {text} + +
    • ))} -
    -
      -
    • Stay in the loop!
      • -
    • Receive updates about new releases, tutorials and more.
      • -
    • - -
      • -
    -
    - -
    - - © 2016-{new Date().getFullYear()}{' '} - - {company} - - - - - - - Legal / Imprint - -
    -
- ) - }} - /> + + + ))} +
+
    +
  • Stay in the loop!
    • +
  • Receive updates about new releases, tutorials and more.
    • +
  • + +
    • +
+
+ +
+ + © 2016-{new Date().getFullYear()}{' '} + + {company} + + + + + + + Legal / Imprint + +
+
) } Footer.propTypes = { wide: PropTypes.bool, } - -const query = graphql` - query FooterQuery { - site { - siteMetadata { - company - companyUrl - footer { - label - items { - text - url - } - } - newsletter { - user - id - list - } - } - } - } -` diff --git a/website/src/components/seo.js b/website/src/components/seo.js index b32501948..a426317af 100644 --- a/website/src/components/seo.js +++ b/website/src/components/seo.js @@ -1,13 +1,14 @@ import React from 'react' import PropTypes from 'prop-types' import Helmet from 'react-helmet' -import { StaticQuery, graphql } from 'gatsby' import socialImageDefault from '../images/social_default.jpg' import socialImageApi from '../images/social_api.jpg' import socialImageUniverse from '../images/social_universe.jpg' import socialImageNightly from '../images/social_nightly.jpg' import socialImageLegacy from '../images/social_legacy.jpg' +import siteMetadata from '../../meta/site.json' +import { siteUrl } from '../../meta/dynamicMeta' function getPageTitle(title, sitename, slogan, sectionTitle, nightly, legacy) { if (sectionTitle && title) { @@ -38,86 +39,78 @@ export default function SEO({ nightly, legacy, }) { - return ( - { - const siteMetadata = data.site.siteMetadata - const metaDescription = description || siteMetadata.description - const pageTitle = getPageTitle( - title, - siteMetadata.title, - siteMetadata.slogan, - sectionTitle, - nightly, - legacy - ) - const socialImage = siteMetadata.siteUrl + getImage(section, nightly, legacy) - const meta = [ - { - name: 'description', - content: metaDescription, - }, - { - property: 'og:title', - content: pageTitle, - }, - { - property: 'og:description', - content: metaDescription, - }, - { - property: 'og:type', - content: `website`, - }, - { - property: 'og:site_name', - content: title, - }, - { - property: 'og:image', - content: socialImage, - }, - { - name: 'twitter:card', - content: 'summary_large_image', - }, - { - name: 'twitter:image', - content: socialImage, - }, - { - name: 'twitter:creator', - content: `@${siteMetadata.social.twitter}`, - }, - { - name: 'twitter:site', - content: `@${siteMetadata.social.twitter}`, - }, - { - name: 'twitter:title', - content: pageTitle, - }, - { - name: 'twitter:description', - content: metaDescription, - }, - { - name: 'docsearch:language', - content: lang, - }, - ] + const metaDescription = description || siteMetadata.description + const pageTitle = getPageTitle( + title, + siteMetadata.title, + siteMetadata.slogan, + sectionTitle, + nightly, + legacy + ) + const socialImage = siteUrl + getImage(section, nightly, legacy) + const meta = [ + { + name: 'description', + content: metaDescription, + }, + { + property: 'og:title', + content: pageTitle, + }, + { + property: 'og:description', + content: metaDescription, + }, + { + property: 'og:type', + content: `website`, + }, + { + property: 'og:site_name', + content: title, + }, + { + property: 'og:image', + content: socialImage, + }, + { + name: 'twitter:card', + content: 'summary_large_image', + }, + { + name: 'twitter:image', + content: socialImage, + }, + { + name: 'twitter:creator', + content: `@${siteMetadata.social.twitter}`, + }, + { + name: 'twitter:site', + content: `@${siteMetadata.social.twitter}`, + }, + { + name: 'twitter:title', + content: pageTitle, + }, + { + name: 'twitter:description', + content: metaDescription, + }, + { + name: 'docsearch:language', + content: lang, + }, + ] - return ( - - ) - }} + return ( + ) } @@ -131,19 +124,3 @@ SEO.propTypes = { section: PropTypes.string, bodyClass: PropTypes.string, } - -const query = graphql` - query DefaultSEOQuery { - site { - siteMetadata { - title - description - slogan - siteUrl - social { - twitter - } - } - } - } -` diff --git a/website/src/components/util.js b/website/src/components/util.js index 2b9c6fd4f..e3d5aef65 100644 --- a/website/src/components/util.js +++ b/website/src/components/util.js @@ -3,10 +3,11 @@ import { Parser as HtmlToReactParser } from 'html-to-react' import remark from 'remark' import remark2react from 'remark-react' import siteMetadata from '../../meta/site.json' +import { domain } from '../../meta/dynamicMeta' const htmlToReactParser = new HtmlToReactParser() -const isNightly = siteMetadata.nightlyBranches.includes(siteMetadata.domain) +const isNightly = siteMetadata.nightlyBranches.includes(domain) export const DEFAULT_BRANCH = isNightly ? 'develop' : 'master' export const repo = siteMetadata.repo export const modelsRepo = siteMetadata.modelsRepo diff --git a/website/src/pages/404.js b/website/src/pages/404.js index 4904c11f3..29ff29bca 100644 --- a/website/src/pages/404.js +++ b/website/src/pages/404.js @@ -1,16 +1,15 @@ import React from 'react' import { window } from 'browser-monads' -import { graphql } from 'gatsby' import Template from '../templates/index' import { LandingHeader, LandingTitle } from '../components/landing' import Button from '../components/button' +import { nightly, legacy } from '../../meta/dynamicMeta' -const page404 = ({ data, location }) => { - const { nightly, legacy } = data.site.siteMetadata +const page404 = ({ location }) => { const pageContext = { title: '404 Error', searchExclude: true, isIndex: false } return ( -