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

components splitup

Browse Source
This commit is contained in:
Matthias Kretschmann 2018-11-09 17:04:53 +01:00
parent c34682abb2
commit cf8ed79064
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 94 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
data/components.yml
View File

@ -1,3 +1,5 @@
- group: Core Components
items:
- name: keeper-contracts
description: '💧 Integration of TCRs, CPM and Ocean Tokens in Solidity'
links:
@ -24,6 +26,8 @@
- name: GitHub
url: https://github.com/oceanprotocol/pleuston
- group: Libraries
items:
- name: squid-js
description: '🦑 JavaScript client library for Ocean Protocol'
links:

90
src/components/Components.jsx
View File

@ -24,6 +24,44 @@ Component.propTypes = {
links: PropTypes.array.isRequired
}
const ComponentsList = ({ components }) => (
<div className={styles.componentsLists}>
{components.map(({ node }) => (
<div key={node.id} className={styles.componentsList}>
<h3 className={styles.componentsTitle}>{node.group}</h3>
<div className={styles.componentsWrapper}>
{node.items.map(item => (
<Component
key={item.name}
name={item.name}
description={item.description}
links={item.links}
/>
))}
</div>
</div>
))}
</div>
)
ComponentsList.propTypes = {
components: PropTypes.array.isRequired
}
const QuickRun = () => (
<div className={styles.quickrun}>
<strong>
Wanna quickly get an Ocean network running on your machine? Check
out{' '}
<a href="https://github.com/oceanprotocol/docker-images">
🐳 docker-images
</a>
.
</strong>
</div>
)
const Components = () => (
<StaticQuery
query={graphql`
@ -31,6 +69,9 @@ const Components = () => (
allComponentsYaml {
edges {
node {
id
group
items {
name
description
links {
@ -41,58 +82,15 @@ const Components = () => (
}
}
}
}
`}
render={data => {
const components = data.allComponentsYaml.edges
return (
<div className={styles.components}>
<div className={styles.quickrun}>
<strong>
Wanna quickly get an Ocean network running on your
machine? Check out{' '}
<a href="https://github.com/oceanprotocol/docker-images">
🐳 docker-images
</a>
.
</strong>
</div>
<div className={styles.componentsLists}>
<div className={styles.componentsList}>
<h3 className={styles.componentsTitle}>
Core Components
</h3>
<div className={styles.componentsWrapper}>
{components.map(({ node }) => (
<Component
key={node.name}
name={node.name}
description={node.description}
links={node.links}
/>
))}
</div>
</div>
<div className={styles.componentsList}>
<h3 className={styles.componentsTitle}>
Libraries
</h3>
<div className={styles.componentsWrapper}>
{components.map(({ node }) => (
<Component
key={node.name}
name={node.name}
description={node.description}
links={node.links}
/>
))}
</div>
</div>
</div>
<QuickRun />
<ComponentsList components={components} />
</div>
)
}}