From 9adcb9f253f046ffff0b5d3100d2318359f1cb44 Mon Sep 17 00:00:00 2001 From: Gregor Date: Mon, 25 Mar 2019 11:01:44 -0700 Subject: [PATCH] =?UTF-8?q?docs(website):=20remove=20landing=20page=20&=20?= =?UTF-8?q?guides,=20it=E2=80=99s=20now=20API=20only?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/gatsby-config.js | 8 +- docs/gatsby-node.js | 50 ++--- docs/src/components/guides-list.js | 39 ---- docs/src/components/layout.js | 18 +- docs/src/pages/api.js | 177 ----------------- docs/src/pages/guides.js | 43 ----- .../src/pages/guides/create-a-pull-request.md | 158 ---------------- docs/src/pages/index.js | 179 +++++++++++++++++- docs/src/templates/guide.js | 28 --- 9 files changed, 201 insertions(+), 499 deletions(-) delete mode 100644 docs/src/components/guides-list.js delete mode 100644 docs/src/pages/api.js delete mode 100644 docs/src/pages/guides.js delete mode 100644 docs/src/pages/guides/create-a-pull-request.md delete mode 100644 docs/src/templates/guide.js diff --git a/docs/gatsby-config.js b/docs/gatsby-config.js index 0f0eb07d..efd4f604 100644 --- a/docs/gatsby-config.js +++ b/docs/gatsby-config.js @@ -75,12 +75,12 @@ module.exports = { // For any node of type MarkdownRemark, list how to resolve the fields` values MarkdownRemark: { title: node => node.frontmatter.title, - slug: node => `/api#octokit-${node.fields.idName}`, - type: node => /\/api\//.test(node.fileAbsolutePath) ? 'API' : 'Guide' + slug: node => `#octokit-${node.fields.idName}`, + type: node => 'API' }, OctokitApiGroup: { title: node => upperFirst(node.name), - slug: node => `/api#${node.id}`, + slug: node => `#${node.id}`, type: node => 'API' }, OctokitApiMethod: { @@ -88,7 +88,7 @@ module.exports = { scope: node => node.scope, route: node => `${node.method} ${node.path}`, method: node => `${node.scope}.${camelCase(node.idName)}`, - slug: node => `/api#${node.id}`, + slug: node => `#${node.id}`, type: node => 'API method' } }, diff --git a/docs/gatsby-node.js b/docs/gatsby-node.js index 022f9cf1..aa62026c 100644 --- a/docs/gatsby-node.js +++ b/docs/gatsby-node.js @@ -44,29 +44,29 @@ exports.onCreateNode = ({ node, getNode, actions }) => { } } -exports.createPages = async ({ graphql, actions }) => { - const { createPage } = actions +// exports.createPages = async ({ graphql, actions }) => { +// const { createPage } = actions - const guidesPagesResult = await graphql(`{ - allMarkdownRemark { - edges { - node { - fields { - slug - } - } - } - } - }`) - guidesPagesResult.data.allMarkdownRemark.edges.forEach(({ node }) => { - createPage({ - path: node.fields.slug, - component: path.resolve(`./src/templates/guide.js`), - context: { - // Data passed to context is available - // in page queries as GraphQL variables. - slug: node.fields.slug - } - }) - }) -} +// const guidesPagesResult = await graphql(`{ +// allMarkdownRemark { +// edges { +// node { +// fields { +// slug +// } +// } +// } +// } +// }`) +// guidesPagesResult.data.allMarkdownRemark.edges.forEach(({ node }) => { +// createPage({ +// path: node.fields.slug, +// component: path.resolve(`./src/templates/guide.js`), +// context: { +// // Data passed to context is available +// // in page queries as GraphQL variables. +// slug: node.fields.slug +// } +// }) +// }) +// } diff --git a/docs/src/components/guides-list.js b/docs/src/components/guides-list.js deleted file mode 100644 index ffb1eb9b..00000000 --- a/docs/src/components/guides-list.js +++ /dev/null @@ -1,39 +0,0 @@ -import React from 'react' -import { StaticQuery, Link, graphql } from 'gatsby' - -export default ({ children }) => ( - ( - - )} - /> -) diff --git a/docs/src/components/layout.js b/docs/src/components/layout.js index 94991bfe..956693cc 100644 --- a/docs/src/components/layout.js +++ b/docs/src/components/layout.js @@ -1,16 +1,10 @@ import React, { Component } from 'react' -import { StaticQuery, Link } from 'gatsby' +import { graphql, StaticQuery } from 'gatsby' import layoutStyles from './layout.module.css' import './layout.css' import Search from "./search" -const ListLink = props => ( -
  • - {props.children} -
    • -) - class Layout extends Component { constructor(props) { super(props) @@ -29,15 +23,7 @@ class Layout extends Component { render() { return
    - -

    octokit/rest.js

    - - -
      - Home - Guides - API -
    +

    octokit/rest.js

    - {this.props.node.name} -
      - {this.props.node.methods.map((method) => { - return
    1. - {method.name} -
      2. - })} -
    - - ) - } -} - -class ApiMenu extends Component { - constructor(props) { - super(props) - this.state = { - menuActive: false, - activeSubMenu: null - } - this.toggleMenu = this.toggleMenu.bind(this) - this.setActiveSubMenu = this.setActiveSubMenu.bind(this) - this.isActiveSubMenu = this.isActiveSubMenu.bind(this) - } - - toggleMenu() { - this.setState({ - menuActive: !this.state.menuActive - }) - } - - setActiveSubMenu(subMenu) { - this.setState({ - activeSubMenu: subMenu - }) - } - - isActiveSubMenu(subMenu) { - return this.state.activeSubMenu === subMenu - } - - render() { - return ( - - ) - } -} - -export default ({ data }) => ( - - -
    - {data.staticMethods.edges.map(({ node }) => { - return -

    {node.frontmatter.title}

    -
    - - })} - -{data.endpointScopes.edges.map(({ node }) => { - return -

    {node.name}

    - {node.methods.map(method => { - return -

    {method.name}

    -
    -

    Parameters

    -
    - - - - - - - - - - {method.params.map(param => { - return - - - - - })} - -
    namerequireddescription
    {param.name}{param.required ? 'yes' : 'no'}{param.description}
    -
    -
    -
    -
    - - })} - - })} -
    -     -) - -export const query = graphql` - query { - staticMethods: allMarkdownRemark( - filter: { fields:{slug: { regex: "/^/api/" } }} - ) { - edges { - node { - id - frontmatter { - title - } - html - fields { - idName - } - } - } - } - endpointScopes: allOctokitApiGroup { - edges { - node { - id - name - methods { - id - name - description - example - params { - name - required - description - } - } - } - } - } - } -` diff --git a/docs/src/pages/guides.js b/docs/src/pages/guides.js deleted file mode 100644 index 3a8066d1..00000000 --- a/docs/src/pages/guides.js +++ /dev/null @@ -1,43 +0,0 @@ -import React from 'react' -import { Link, graphql } from 'gatsby' -import Layout from '../components/layout' -import GuidesList from '../components/guides-list' - -export default ({ data }) => ( - -
    -

    Guides

    - {data.allMarkdownRemark.edges.map(({ node }) => ( -
    -

    - {node.frontmatter.title} -

    -

    {node.excerpt}

    -
    - ))} -
    - -     -) - -export const query = graphql` - query { - allMarkdownRemark( - filter: { fields:{slug: { regex: "/^/guides/" } }} - ) { - totalCount - edges { - node { - id - frontmatter { - title - } - excerpt - fields { - slug - } - } - } - } - } -` diff --git a/docs/src/pages/guides/create-a-pull-request.md b/docs/src/pages/guides/create-a-pull-request.md deleted file mode 100644 index 04ede292..00000000 --- a/docs/src/pages/guides/create-a-pull-request.md +++ /dev/null @@ -1,158 +0,0 @@ ---- -title: "Create a pull request" ---- - -In this guide you will learn how to create a pull request which includes multiple file changes. There are three main steps: - -1. Get the base branch name & commit sha -2. Make file changes -3. Create pull request - -## Get the base branch name & commit sha - -1. Get the repository’s default branch name -2. Get the commit sha you want to branch off from -3. Fork the repository if you don’t have write access - -### Get the repository’s default branch name - -Related: - -- REST API documentation for [Get a repository](https://developer.github.com/v3/repos/#get) - -Unless you know the name of the base branch you want to send the pull request against, you have to retrieve the the `default_branch` for the repository first - -```js -const response = await octokit.repos.get({ - owner, - repo -}) -const baseBranch = response.default_branch -``` - -### Find the commit sha - -Related: - -- REST API documentation for [List commits](https://developer.github.com/v3/repos/commits/#list-commits-on-a-repository) - -You can retrieve the last commit which includes the commit sha and the tree sha that you will need later. - -```js -const response = await octokit.repos.listCommits({ - owner, - repo, - sha: baseBranch - per_page: 1 -}) -const latestCommitSha = response.data[0].sha -const treeSha = response.data[0].commit.tree.sha -``` - -### Fork the repository - -Related: - -- REST API documentation for [creating a fork](https://developer.github.com/v3/repos/forks/#create-a-fork) - -You can skip this part if you have write access to the repository. - -The code to create a fork is fairly straight forward. - -```js -await octokit.repos.createFork({ - owner, - repo -}) -``` - -Note that it might take a moment until the fork becomes usable, ideally work for a short amount of time, depending of the size of the original repository. If you get a `Not Found` error in subsequent requests then retry the request as the reason is most likely the replication lag. - -If you created a fork you need to send the next requests to that new repository. The final request to create a pull requests is sent against the upstream repository, the `head` parameter needs to be prefixed by `:` or `:` if you forked to an organization instead. - -### Create a reference - -Related: - -- REST API documentation for [creating a reference](https://developer.github.com/v3/git/refs/#create-a-reference) - -With the repository name , owner name, and the commit sha from the previous steps, you can now create a new git reference for the branch. The branch name has to be prefixed with `refs/heads/` - -```js -await octokit.git.createRef({ - owner, - repo, - sha: latestCommitSha, - ref: 'refs/heads/your-branch-name' -}) -``` - -## Make file changes - -In order to make all file changes in a single commit, we use the "Create a tree" and "Create a commit" APIs. - -### Create a git tree - -Related: - -- REST API documentation for [Create a tree](https://developer.github.com/v3/git/trees/#create-a-tree) - -```js -const response = await octokit.git.createTree({ - owner, - repo, - base_tree: treeSha, - tree: [ - { path: 'path/to/file.txt', content: 'file content here' }, - { path: 'path/to/other-file.txt', content: 'other file content here' } - ] -}) -const newTreeSha = response.sha -``` - -### Create a commit - -Related: - -- REST API documentation for [Create a commit](https://developer.github.com/v3/git/commits/#create-a-commit) - -```js -const response = await octokit.git.createCommit({ - owner, - repo, - message: 'Your commit message', - tree: newTreeSha, - parents: [latestCommitSha], - author: 'Your name ' -}) -const newCommitSha = response.sha -``` - -## Create pull request - -Related - -- REST API documentation to [Create a pull request](https://developer.github.com/v3/pulls/#create-a-pull-request) - -In order create the pull request you need to know the branch you want to merge into. If you want to merge into the repository’s default branch then you can get it from the repository’s `default_branch` - -```js -const response = await octokit.repos.get({ - owner, - repo -}) -const baseBranch = response.default_branch -``` - -Now you can create the pull request - -```js -octokit.pulls.create({ - owner, - repo, - head: 'your-branch-name', - base: baseBranch, - title: 'Pull request title', - body: 'Pull request description' -}) -``` diff --git a/docs/src/pages/index.js b/docs/src/pages/index.js index 099bff62..c29e7864 100644 --- a/docs/src/pages/index.js +++ b/docs/src/pages/index.js @@ -1,14 +1,175 @@ -import React from 'react' +import Prism from 'prismjs' + +import marked from 'marked' +import React, { Component } from 'react' + import Layout from '../components/layout' -import { Link } from 'gatsby' +import { graphql } from 'gatsby' +import apiStyles from '../components/api.module.css' + +class ApiSubMenu extends Component { + constructor(props) { + super(props) + this.showMenu = this.showMenu.bind(this) + this.isActive = this.isActive.bind(this) + } + + showMenu() { + this.props.onUserInteraction(this.props.node.id) + } + + isActive() { + return this.props.isActive(this.props.node.id) + } + + render() { + return ( +
  • + {this.props.node.name} +
      + {this.props.node.methods.map((method) => { + return
    1. + {method.name} +
      2. + })} +
    +
    • + ) + } +} + +class ApiMenu extends Component { + constructor(props) { + super(props) + this.state = { + menuActive: false, + activeSubMenu: null + } + this.toggleMenu = this.toggleMenu.bind(this) + this.setActiveSubMenu = this.setActiveSubMenu.bind(this) + this.isActiveSubMenu = this.isActiveSubMenu.bind(this) + } -export default () => ( + toggleMenu() { + this.setState({ + menuActive: !this.state.menuActive + }) + } + + setActiveSubMenu(subMenu) { + this.setState({ + activeSubMenu: subMenu + }) + } + + isActiveSubMenu(subMenu) { + return this.state.activeSubMenu === subMenu + } + + render() { + return ( + + ) + } +} + +export default ({ data }) => ( -
    -

    Home

    -

    - Check out our guides or API. -

    -
    + +
    + {data.staticMethods.edges.map(({ node }) => { + return +

    {node.frontmatter.title}

    +
    + + })} + +{data.endpointScopes.edges.map(({ node }) => { + return +

    {node.name}

    + {node.methods.map(method => { + return +

    {method.name}

    +
    +

    Parameters

    +
    + + + + + + + + + + {method.params.map(param => { + return + + + + + })} + +
    namerequireddescription
    {param.name}{param.required ? 'yes' : 'no'}{param.description}
    +
    +
    +
    +
    + + })} + + })} +
    ) + +export const query = graphql` + query { + staticMethods: allMarkdownRemark { + edges { + node { + id + frontmatter { + title + } + html + fields { + idName + } + } + } + } + endpointScopes: allOctokitApiGroup { + edges { + node { + id + name + methods { + id + name + description + example + params { + name + required + description + } + } + } + } + } + } +` diff --git a/docs/src/templates/guide.js b/docs/src/templates/guide.js deleted file mode 100644 index b185702a..00000000 --- a/docs/src/templates/guide.js +++ /dev/null @@ -1,28 +0,0 @@ -import React from 'react' -import { graphql } from 'gatsby' -import Layout from '../components/layout' -import GuidesList from '../components/guides-list' - -export default ({ data }) => { - const post = data.markdownRemark - return ( - -
    -

    {post.frontmatter.title}

    -
    -
    - -     - ) -} - -export const query = graphql` - query($slug: String!) { - markdownRemark(fields: { slug: { eq: $slug } }) { - html - frontmatter { - title - } - } - } -`