1
0
mirror of https://github.com/oceanprotocol/docs.git synced 2024-11-26 19:49:26 +01:00

Merge pull request #648 from oceanprotocol/feature/read-the-docs

Feature/read the docs
This commit is contained in:
Akshay 2021-05-25 10:06:07 +02:00 committed by GitHub
commit 2757b2d4f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 28 additions and 27 deletions

View File

@ -99,7 +99,6 @@ module.exports = {
} }
} }
}, },
'gatsby-remark-copy-linked-files',
{ {
resolve: 'gatsby-remark-component', resolve: 'gatsby-remark-component',
options: { options: {

View File

@ -69,6 +69,7 @@ exports.createPages = ({ graphql, actions }) => {
tableOfContents tableOfContents
frontmatter { frontmatter {
slug slug
source
title title
app app
module module
@ -291,25 +292,14 @@ const createReadTheDocsPage = async (createPage, name, list) => {
) )
createPage({ createPage({
path: `/read-the-docs/${name}`, path: `/read-the-docs/${name}`,
matchPath: `/read-the-docs/${name}/*`,
component: markdownListTemplate, component: markdownListTemplate,
context: { context: {
markdownList: list, markdownList: list,
name: name name: name,
baseUrl: `/read-the-docs/${name}`
} }
}) })
list.forEach((element) => {
createMarkdownPage(createPage, element)
})
}
const createMarkdownPage = async (createPage, element) => {
// console.log("element", JSON.stringify(element.node.frontmatter))
const markdownTemplate = path.resolve('./src/templates/MarkdownTemplate.jsx')
createPage({
path: element.node.frontmatter.slug,
component: markdownTemplate
})
} }
const filterMarkdownList = (markdownList, string) => { const filterMarkdownList = (markdownList, string) => {

View File

@ -6,7 +6,6 @@
padding: $spacer / 6 $spacer / 2; padding: $spacer / 6 $spacer / 2;
border-left: 0.1rem solid transparent; border-left: 0.1rem solid transparent;
margin-left: -0.05rem; margin-left: -0.05rem;
cursor: 'pointer';
&:hover, &:hover,
&:focus { &:focus {
@ -23,7 +22,6 @@
composes: link; composes: link;
color: $brand-purple; color: $brand-purple;
border-left-color: $brand-purple; border-left-color: $brand-purple;
cursor: 'pointer';
:global(.setup) & { :global(.setup) & {
color: $brand-blue; color: $brand-blue;

View File

@ -1,4 +1,4 @@
import React, { useState } from 'react' import React from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import Layout from '../../components/Layout' import Layout from '../../components/Layout'
import HeaderSection from '../../components/HeaderSection' import HeaderSection from '../../components/HeaderSection'
@ -7,13 +7,12 @@ import styles from '../../templates/Doc.module.scss'
import MarkdownTemplate from '../MarkdownTemplate' import MarkdownTemplate from '../MarkdownTemplate'
import sidebarStyles from '../../components/Sidebar.module.scss' import sidebarStyles from '../../components/Sidebar.module.scss'
import moduleStyles from './Markdown.module.scss' import moduleStyles from './Markdown.module.scss'
import { generatedNestedObject } from './utils' import { generatedNestedObject } from './utils'
import { navigate } from 'gatsby'
export default function MarkdownList({ pageContext }) { export default function MarkdownList({ location, pageContext }) {
const flattenedModules = {} const flattenedModules = {}
const nestedModules = {} const nestedModules = {}
pageContext.markdownList.map(({ node }) => { pageContext.markdownList.map(({ node }) => {
const modulePath = node.frontmatter.module.split('.') const modulePath = node.frontmatter.module.split('.')
const key = const key =
@ -28,16 +27,19 @@ export default function MarkdownList({ pageContext }) {
const moduleKeys = Object.keys(flattenedModules).sort() const moduleKeys = Object.keys(flattenedModules).sort()
const [selectedModule, setSelectedModule] = useState( const path = location.pathname.replace(pageContext.baseUrl + '/', '')
flattenedModules[moduleKeys[0]][0] const found = pageContext.markdownList.find(({ node }) => {
) return node.frontmatter.slug === path
})
const selectedModule = found ? found.node : flattenedModules[moduleKeys[0]][0]
const changeNodeid = (id) => { const changeNodeid = (id) => {
const found = pageContext.markdownList.find(({ node }) => { const found = pageContext.markdownList.find(({ node }) => {
return node.id === id return node.id === id
}) })
setSelectedModule(found.node) navigate(pageContext.baseUrl + '/' + found.node.frontmatter.slug)
} }
const generateModuleListElement = (id, label) => { const generateModuleListElement = (id, label) => {
@ -45,7 +47,7 @@ export default function MarkdownList({ pageContext }) {
selectedModule.id === id ? moduleStyles.active : moduleStyles.link selectedModule.id === id ? moduleStyles.active : moduleStyles.link
return ( return (
<li key={id} id={id}> <li key={id} id={id} style={{ cursor: 'pointer' }}>
<a className={className} onClick={() => changeNodeid(id)}> <a className={className} onClick={() => changeNodeid(id)}>
{label} {label}
</a> </a>
@ -101,5 +103,6 @@ export default function MarkdownList({ pageContext }) {
} }
MarkdownList.propTypes = { MarkdownList.propTypes = {
pageContext: PropTypes.object.isRequired pageContext: PropTypes.object.isRequired,
location: PropTypes.object.isRequired
} }

View File

@ -1,6 +1,7 @@
import React from 'react' import React from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import DocContent from '../components/DocContent' import DocContent from '../components/DocContent'
import styles from '../components/DocFooter.module.scss'
import Content from '../components/Content' import Content from '../components/Content'
export default function MarkdownTemplate({ data }) { export default function MarkdownTemplate({ data }) {
@ -13,6 +14,16 @@ export default function MarkdownTemplate({ data }) {
) : ( ) : (
<div>No content present</div> <div>No content present</div>
)} )}
<footer className={styles.footer}>
<a
style={{ cursor: 'pointer' }}
href={post.frontmatter.source}
target="_blank"
rel="noopener noreferrer"
>
View source on Github
</a>
</footer>
</Content> </Content>
</> </>
) )