From 236e24968aa40d5d65fc18d7bae1be9654d94eb7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Francisco=20Gonza=CC=81lez?= Date: Mon, 12 Jul 2021 16:10:40 -0500 Subject: [PATCH] add archive component Former-commit-id: b6184cb00b33157b6f149d18cdc40f0f0bbb94ea --- .editorconfig | 9 ++++ README.md | 2 + env | 1 + gatsby-node.js | 100 ++++++++++++++++++++------------------ netlify.toml | 8 +++ src/components/archive.js | 26 ++++++++++ src/components/index.js | 60 ++++++++++++----------- src/components/layout.js | 26 +++++----- 8 files changed, 144 insertions(+), 88 deletions(-) create mode 100644 .editorconfig create mode 100644 env create mode 100644 netlify.toml create mode 100644 src/components/archive.js diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 00000000000..cb8b48c706b --- /dev/null +++ b/.editorconfig @@ -0,0 +1,9 @@ +# Editor configuration, see http://editorconfig.org +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +insert_final_newline = true +trim_trailing_whitespace = true \ No newline at end of file diff --git a/README.md b/README.md index 653f02364b1..9bf164f9885 100644 --- a/README.md +++ b/README.md @@ -20,6 +20,8 @@ We recommend using MacOS to work with the EDB Docs application. 1. Navigate to the cloned repo directory in your Terminal, if you haven't already done so. +1. Create a `.env` file: `cp env .env.development`. + 1. Install [Node.js version 14 LTS](https://nodejs.org/en/download/). We recommend using Node version 14 LTS (the Long Term Support release) as version 15 is not compatible with some of our dependencies at this time. - If you already have Node installed, you can verify your version by running `node -v` in the cloned repo directory. diff --git a/env b/env new file mode 100644 index 00000000000..4acf4ad67e1 --- /dev/null +++ b/env @@ -0,0 +1 @@ +GATSBY_ENVIRONMENT_BRANCH=develop \ No newline at end of file diff --git a/gatsby-node.js b/gatsby-node.js index a769df86bb0..6230bbf8250 100644 --- a/gatsby-node.js +++ b/gatsby-node.js @@ -1,10 +1,11 @@ // this patch is required to consistently load all the doc files -const realFs = require('fs'); -const gracefulFs = require('graceful-fs'); +const realFs = require("fs"); +const path = require("path"); +const gracefulFs = require("graceful-fs"); gracefulFs.gracefulify(realFs); const { createFilePath } = require(`gatsby-source-filesystem`); -const { exec, execSync } = require('child_process'); +const { exec, execSync } = require("child_process"); const { replacePathVersion, @@ -23,16 +24,16 @@ const { configureLegacyRedirects, readFile, writeFile, -} = require('./src/constants/gatsby-utils.js'); +} = require("./src/constants/gatsby-utils.js"); -const isBuild = process.env.NODE_ENV === 'production'; -const isProduction = process.env.APP_ENV === 'production'; +const isBuild = process.env.NODE_ENV === "production"; +const isProduction = process.env.APP_ENV === "production"; exports.onCreateNode = async ({ node, getNode, actions, loadNodeContent }) => { const { createNodeField } = actions; - if (node.internal.mediaType === 'text/yaml') loadNodeContent(node); - if (node.internal.type !== 'Mdx') return; + if (node.internal.mediaType === "text/yaml") loadNodeContent(node); + if (node.internal.type !== "Mdx") return; const fileNode = getNode(node.parent); const nodeFields = { @@ -41,7 +42,7 @@ exports.onCreateNode = async ({ node, getNode, actions, loadNodeContent }) => { }; let relativeFilePath = createFilePath({ node, getNode }); - if (nodeFields.docType === 'doc') { + if (nodeFields.docType === "doc") { relativeFilePath = `/${fileNode.sourceInstanceName}${relativeFilePath}`; } @@ -50,17 +51,17 @@ exports.onCreateNode = async ({ node, getNode, actions, loadNodeContent }) => { depth: pathToDepth(relativeFilePath), }); - if (nodeFields.docType === 'doc') { + if (nodeFields.docType === "doc") { Object.assign(nodeFields, { - product: relativeFilePath.split('/')[1], - version: relativeFilePath.split('/')[2], - topic: 'null', + product: relativeFilePath.split("/")[1], + version: relativeFilePath.split("/")[2], + topic: "null", }); - } else if (nodeFields.docType === 'advocacy') { + } else if (nodeFields.docType === "advocacy") { Object.assign(nodeFields, { - product: 'null', - version: '0', - topic: relativeFilePath.split('/')[2], + product: "null", + version: "0", + topic: relativeFilePath.split("/")[2], }); } @@ -128,7 +129,7 @@ exports.createPages = async ({ actions, graphql, reporter }) => { `); if (result.errors) { - reporter.panic('createPages graphql query has errors!', result.errors); + reporter.panic("createPages graphql query has errors!", result.errors); } processFileNodes(result.data.allFile.nodes, actions); @@ -139,7 +140,7 @@ exports.createPages = async ({ actions, graphql, reporter }) => { // it should be possible to remove these in the future, // they are only used for navLinks generation - const learn = nodes.filter((file) => file.fields.docType === 'advocacy'); + const learn = nodes.filter((file) => file.fields.docType === "advocacy"); // perform depth first preorder traversal const treeRoot = mdxNodesToTree(nodes); @@ -155,17 +156,17 @@ exports.createPages = async ({ actions, graphql, reporter }) => { const addedChildPaths = {}; curr.navigationNodes = []; (curr.mdxNode?.frontmatter?.navigation || []).forEach((navEntry) => { - if (navEntry.startsWith('#')) { + if (navEntry.startsWith("#")) { curr.navigationNodes.push({ path: null, - title: navEntry.replace('#', '').trim(), + title: navEntry.replace("#", "").trim(), }); return; } const navChild = curr.children.find((child) => { if (addedChildPaths[child.path]) return false; - const navName = child.path.split('/').slice(-2)[0]; + const navName = child.path.split("/").slice(-2)[0]; return navName.toLowerCase() === navEntry.toLowerCase(); }); if (!navChild?.mdxNode) return; @@ -203,9 +204,9 @@ exports.createPages = async ({ actions, graphql, reporter }) => { const prevNext = findPrevNextNavNodes(navTree, curr); const { docType } = node.fields; - if (docType === 'doc') { + if (docType === "doc") { createDoc(navTree, prevNext, node, productVersions, actions); - } else if (docType === 'advocacy') { + } else if (docType === "advocacy") { createAdvocacy(navTree, prevNext, node, learn, actions); } } @@ -237,18 +238,18 @@ const createDoc = (navTree, prevNext, doc, productVersions, actions) => { } const isIndexPage = isPathAnIndexPage(doc.fileAbsolutePath); - const docsRepoUrl = 'https://github.com/EnterpriseDB/docs'; - const branch = isProduction ? 'main' : 'develop'; + const docsRepoUrl = "https://github.com/EnterpriseDB/docs"; + const branch = isProduction ? "main" : "develop"; const fileUrlSegment = removeTrailingSlash(doc.fields.path) + - (isIndexPage ? '/index.mdx' : '.mdx'); + (isIndexPage ? "/index.mdx" : ".mdx"); const githubFileLink = `${docsRepoUrl}/commits/${branch}/product_docs/docs${fileUrlSegment}`; const githubEditLink = `${docsRepoUrl}/edit/${branch}/product_docs/docs${fileUrlSegment}`; const githubIssuesLink = `${docsRepoUrl}/issues/new?title=Feedback%20on%20${encodeURIComponent( fileUrlSegment, )}`; - const template = doc.frontmatter.productStub ? 'doc-stub.js' : 'doc.js'; + const template = doc.frontmatter.productStub ? "doc-stub.js" : "doc.js"; const path = isLatest ? replacePathVersion(doc.fields.path) : doc.fields.path; // workaround for https://github.com/gatsbyjs/gatsby/issues/26520 @@ -296,12 +297,12 @@ const createAdvocacy = (navTree, prevNext, doc, learn, actions) => { (node) => node.fields.topic === doc.fields.topic, ); - const advocacyDocsRepoUrl = 'https://github.com/EnterpriseDB/docs'; - const branch = isProduction ? 'main' : 'develop'; + const advocacyDocsRepoUrl = "https://github.com/EnterpriseDB/docs"; + const branch = isProduction ? "main" : "develop"; const isIndexPage = isPathAnIndexPage(doc.fileAbsolutePath); const fileUrlSegment = removeTrailingSlash(doc.fields.path) + - (isIndexPage ? '/index.mdx' : '.mdx'); + (isIndexPage ? "/index.mdx" : ".mdx"); const githubFileLink = `${advocacyDocsRepoUrl}/commits/${branch}/advocacy_docs${fileUrlSegment}`; const githubEditLink = `${advocacyDocsRepoUrl}/edit/${branch}/advocacy_docs${fileUrlSegment}`; const githubIssuesLink = `${advocacyDocsRepoUrl}/issues/new?title=Regarding%20${encodeURIComponent( @@ -311,13 +312,13 @@ const createAdvocacy = (navTree, prevNext, doc, learn, actions) => { // workaround for https://github.com/gatsbyjs/gatsby/issues/26520 actions.createPage({ path: doc.fields.path, - component: require.resolve('./src/templates/learn-doc.js'), + component: require.resolve("./src/templates/learn-doc.js"), context: {}, }); actions.createPage({ path: doc.fields.path, - component: require.resolve('./src/templates/learn-doc.js'), + component: require.resolve("./src/templates/learn-doc.js"), context: { nodeId: doc.id, frontmatter: doc.frontmatter, @@ -342,7 +343,7 @@ const createAdvocacy = (navTree, prevNext, doc, learn, actions) => { const path = `${doc.fields.path}${katacodaPage.scenario}`; actions.createPage({ path: path, - component: require.resolve('./src/templates/katacoda-page.js'), + component: require.resolve("./src/templates/katacoda-page.js"), context: { ...katacodaPage, pagePath: path, @@ -359,7 +360,7 @@ const processFileNodes = (fileNodes, actions) => { fileNodes.forEach((node) => { actions.createPage({ path: node.relativePath, - component: require.resolve('./src/templates/file.js'), + component: require.resolve("./src/templates/file.js"), context: { nodeId: node.id, }, @@ -375,13 +376,13 @@ exports.sourceNodes = async ({ // create edb-git node const sha = ( await new Promise((resolve, reject) => { - exec('git rev-parse HEAD', (error, stdout, stderr) => resolve(stdout)); + exec("git rev-parse HEAD", (error, stdout, stderr) => resolve(stdout)); }) ).trim(); const branch = ( await new Promise((resolve, reject) => { - exec('git branch --show-current', (error, stdout, stderr) => + exec("git branch --show-current", (error, stdout, stderr) => resolve(stdout), ); }) @@ -390,9 +391,9 @@ exports.sourceNodes = async ({ const gitData = { sha, branch }; createNode({ ...gitData, - id: createNodeId('edb-git'), + id: createNodeId("edb-git"), internal: { - type: 'edbGit', + type: "edbGit", contentDigest: createContentDigest(gitData), }, }); @@ -424,29 +425,34 @@ exports.createSchemaCustomization = ({ actions }) => { exports.onPreBootstrap = () => { console.log(` - _____ ____ _____ ____ -| __|| \\ | __ | | \\ ___ ___ ___ + _____ ____ _____ ____ +| __|| \\ | __ | | \\ ___ ___ ___ | __|| | || __ -| | | || . || _||_ -| |_____||____/ |_____| |____/ |___||___||___| - + `); }; exports.onPostBuild = async ({ reporter, pathPrefix }) => { - const originalRedirects = await readFile('public/_redirects'); + realFs.copyFileSync( + path.join(__dirname, "/netlify.toml"), + path.join(__dirname, "/public/netlify.toml"), + ); + + const originalRedirects = await readFile("public/_redirects"); // filter out legacyRedirects that are loaded via nginx, not netlify let filteredRedirects = originalRedirects - .split('\n') + .split("\n") .filter((line) => !line.startsWith(`${pathPrefix}/edb-docs/`)) - .join('\n'); + .join("\n"); if (filteredRedirects.length === originalRedirects.length) { - reporter.warn('no redirects were filtered out, did something change?'); + reporter.warn("no redirects were filtered out, did something change?"); } await writeFile( - 'public/_redirects', + "public/_redirects", `${filteredRedirects}\n\n# Netlify pathPrefix path rewrite\n${pathPrefix}/* /:splat 200`, ); }; diff --git a/netlify.toml b/netlify.toml new file mode 100644 index 00000000000..846bf63ec55 --- /dev/null +++ b/netlify.toml @@ -0,0 +1,8 @@ +[context.production] + GATSBY_ENVIRONMENT_BRANCH = "main" + + [context.deploy-preview.environment] + GATSBY_ENVIRONMENT_BRANCH = "develop" + + [context.branch-deploy] + GATSBY_ENVIRONMENT_BRANCH = "develop" diff --git a/src/components/archive.js b/src/components/archive.js new file mode 100644 index 00000000000..2ea7cdcbd65 --- /dev/null +++ b/src/components/archive.js @@ -0,0 +1,26 @@ +import React from "react"; + +import Icon from "./icon"; +import Link from "./link"; + +const environment = process.env.GATSBY_ENVIRONMENT_BRANCH; + +export default function Archive({ title, path = "", ...props }) { + const updatedPath = !path.startsWith('/') ? `/${path}` : path + const url = `https://github.com/EnterpriseDB/docs-archive/raw/${environment}${updatedPath}`; + + return ( + + {title} + + ); +} + +const PdfIcon = () => ( + +); diff --git a/src/components/index.js b/src/components/index.js index f8be29077e0..8c48c15c06f 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -1,34 +1,36 @@ -import BackButton from './back-button'; -import CardDecks from './card-decks'; -import CodeBlock from './code-block'; -import DarkModeToggle from './dark-mode-toggle'; -import DevOnly from './dev-only'; -import DevFrontmatter from './dev-frontmatter'; -import Footer from './footer'; -import IndexLinks from './index-links'; -import IndexSubNav from './index-sub-nav'; -import KatacodaPageEmbed from './katacoda-page-embed'; -import KatacodaPageLink from './katacoda-page-link'; -import KatacodaPanel from './katacoda-panel'; -import Layout from './layout'; -import LayoutContext from './layout-context'; -import LeftNav from './left-nav'; -import Link from './link'; -import Logo from './logo'; -import MainContent from './main-content'; -import PdfDownload from './pdf-download.js'; -import PrevNext from './prev-next'; -import SearchNavigationLinks from './search-navigation-links'; -import SearchNavigation from './search-navigation'; -import SideNavigation from './side-navigation'; -import StubCards from './stub-cards'; -import TableOfContents from './table-of-contents'; -import TextBalancer from './text-balancer'; -import TopBar from './top-bar'; -import TreeNode from './tree-node'; -import VersionDropdown from './version-dropdown'; +import Archive from "./archive"; +import BackButton from "./back-button"; +import CardDecks from "./card-decks"; +import CodeBlock from "./code-block"; +import DarkModeToggle from "./dark-mode-toggle"; +import DevOnly from "./dev-only"; +import DevFrontmatter from "./dev-frontmatter"; +import Footer from "./footer"; +import IndexLinks from "./index-links"; +import IndexSubNav from "./index-sub-nav"; +import KatacodaPageEmbed from "./katacoda-page-embed"; +import KatacodaPageLink from "./katacoda-page-link"; +import KatacodaPanel from "./katacoda-panel"; +import Layout from "./layout"; +import LayoutContext from "./layout-context"; +import LeftNav from "./left-nav"; +import Link from "./link"; +import Logo from "./logo"; +import MainContent from "./main-content"; +import PdfDownload from "./pdf-download.js"; +import PrevNext from "./prev-next"; +import SearchNavigationLinks from "./search-navigation-links"; +import SearchNavigation from "./search-navigation"; +import SideNavigation from "./side-navigation"; +import StubCards from "./stub-cards"; +import TableOfContents from "./table-of-contents"; +import TextBalancer from "./text-balancer"; +import TopBar from "./top-bar"; +import TreeNode from "./tree-node"; +import VersionDropdown from "./version-dropdown"; export { + Archive, BackButton, CardDecks, CodeBlock, diff --git a/src/components/layout.js b/src/components/layout.js index c28c3055cd0..29e06d00a0b 100644 --- a/src/components/layout.js +++ b/src/components/layout.js @@ -1,7 +1,8 @@ -import React, { useState, useEffect, useMemo } from 'react'; -import { Helmet } from 'react-helmet'; -import useSiteMetadata from '../hooks/use-sitemetadata'; +import React, { useState, useEffect, useMemo } from "react"; +import { Helmet } from "react-helmet"; +import useSiteMetadata from "../hooks/use-sitemetadata"; import { + Archive, CodeBlock, KatacodaPageLink, KatacodaPanel, @@ -9,17 +10,17 @@ import { Link, StubCards, TextBalancer, -} from '../components'; -import { MDXProvider } from '@mdx-js/react'; -import Icon from '../components/icon/'; +} from "../components"; +import { MDXProvider } from "@mdx-js/react"; +import Icon from "../components/icon/"; -import '../styles/index.scss'; +import "../styles/index.scss"; const Layout = ({ children, pageMeta, katacodaPanelData, - background = 'light', + background = "light", }) => { const { baseUrl, imageUrl, title: siteTitle } = useSiteMetadata(); const meta = pageMeta || {}; @@ -29,15 +30,15 @@ const Layout = ({ const [dark, setDark] = useState(false); const toggleDark = () => { - window.localStorage.setItem('dark', !dark); + window.localStorage.setItem("dark", !dark); setDark(!dark); }; // gatsby-ssr handles initial setting of class, this will sync the toggle to that useEffect(() => { if ( - document.documentElement.classList.contains('dark') || - window.localStorage.getItem('dark') === 'true' + document.documentElement.classList.contains("dark") || + window.localStorage.getItem("dark") === "true" ) { setDark(true); } @@ -79,6 +80,7 @@ const Layout = ({ KatacodaPageLink, Icon, StubCards, + Archive, }), [katacodaPanelData, meta.path, meta.isIndexPage], ); @@ -91,7 +93,7 @@ const Layout = ({ }} > - + {title} {meta.description && (