From 8c7d2b7891bc31eae61f1f5a94059ea443d1a5c9 Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Wed, 15 Jul 2020 15:09:50 +0200 Subject: [PATCH] spread appConfig into siteMetadata for use in GraphQL --- gatsby-config.js | 6 +++- src/components/organisms/AssetList.tsx | 5 +-- src/components/pages/Home.tsx | 14 ++++---- src/hooks/useSiteMetadata.ts | 44 +++++++++++++++++++------- src/pages/asset/index.tsx | 5 +-- 5 files changed, 51 insertions(+), 23 deletions(-) diff --git a/gatsby-config.js b/gatsby-config.js index 3f882a8a2..9bd2e2b33 100644 --- a/gatsby-config.js +++ b/gatsby-config.js @@ -1,10 +1,14 @@ require('dotenv').config() const siteContent = require('./content/site.json') +const appConfig = require('./app.config') module.exports = { siteMetadata: { - ...siteContent.site + ...siteContent.site, + appConfig: { + ...appConfig + } }, plugins: [ { diff --git a/src/components/organisms/AssetList.tsx b/src/components/organisms/AssetList.tsx index 2f18752e9..cfedd1965 100644 --- a/src/components/organisms/AssetList.tsx +++ b/src/components/organisms/AssetList.tsx @@ -6,13 +6,14 @@ import { updateQueryStringParameter } from '../../utils' import styles from './AssetList.module.css' import { MetaDataMarket } from '../../@types/MetaData' import { DDO } from '@oceanprotocol/lib' -import { oceanConfig } from '../../../app.config' +import { useSiteMetadata } from '../../hooks/useSiteMetadata' declare type AssetListProps = { queryResult: QueryResult } const AssetList: React.FC = ({ queryResult }) => { + const { appConfig } = useSiteMetadata() // TODO: restore Pagination behavior // Construct the urls on the pagination links. This is only for UX, @@ -52,7 +53,7 @@ const AssetList: React.FC = ({ queryResult }) => { }) ) : (
- No data sets found in {oceanConfig.metadataStoreUri} + No data sets found in {appConfig.oceanConfig.metadataStoreUri}
)} diff --git a/src/components/pages/Home.tsx b/src/components/pages/Home.tsx index e85c0e72f..bf8de2812 100644 --- a/src/components/pages/Home.tsx +++ b/src/components/pages/Home.tsx @@ -1,19 +1,16 @@ import React, { ReactElement, useEffect, useState } from 'react' import SearchBar from '../molecules/SearchBar' import styles from './Home.module.css' -import { oceanConfig } from '../../../app.config' import { MetadataStore, Logger } from '@oceanprotocol/lib' import AssetList from '../organisms/AssetList' import { QueryResult } from '@oceanprotocol/lib/dist/node/metadatastore/MetadataStore' import Container from '../atoms/Container' import Loader from '../atoms/Loader' +import { useSiteMetadata } from '../../hooks/useSiteMetadata' -async function getLatestAssets() { +async function getLatestAssets(metadataStoreUri: string) { try { - const metadataStore = new MetadataStore( - oceanConfig.metadataStoreUri, - Logger - ) + const metadataStore = new MetadataStore(metadataStoreUri, Logger) const result = await metadataStore.queryMetadata({ page: 1, @@ -29,12 +26,15 @@ async function getLatestAssets() { } export default function HomePage(): ReactElement { + const { appConfig } = useSiteMetadata() const [queryResult, setQueryResult] = useState() const [loading, setLoading] = useState(true) useEffect(() => { async function init() { - const results = await getLatestAssets() + const results = await getLatestAssets( + appConfig.oceanConfig.metadataStoreUri + ) setQueryResult(results) setLoading(false) } diff --git a/src/hooks/useSiteMetadata.ts b/src/hooks/useSiteMetadata.ts index d808375ac..1e8b6d3b1 100644 --- a/src/hooks/useSiteMetadata.ts +++ b/src/hooks/useSiteMetadata.ts @@ -2,15 +2,36 @@ import { useStaticQuery, graphql } from 'gatsby' const query = graphql` query { - siteMetadata: allFile(filter: { relativePath: { eq: "site.json" } }) { + site { + siteMetadata { + siteTitle + siteTagline + siteUrl + siteIcon + copyright + menu { + name + link + } + appConfig { + infuraProjectId + networks + oceanConfig { + factoryAddress + metadataStoreUri + nodeUri + providerUri + verbose + } + } + } + } + + siteImage: allFile(filter: { relativePath: { eq: "site.json" } }) { edges { node { childContentJson { site { - siteTitle - siteTagline - siteUrl - siteIcon siteImage { childImageSharp { original { @@ -18,11 +39,6 @@ const query = graphql` } } } - copyright - menu { - name - link - } } } } @@ -33,5 +49,11 @@ const query = graphql` export function useSiteMetadata() { const data = useStaticQuery(query) - return data.siteMetadata.edges[0].node.childContentJson.site + + const siteMeta = { + ...data.siteImage.edges[0].node.childContentJson.site, + ...data.site.siteMetadata + } + + return siteMeta } diff --git a/src/pages/asset/index.tsx b/src/pages/asset/index.tsx index 45402683f..8fd0df130 100644 --- a/src/pages/asset/index.tsx +++ b/src/pages/asset/index.tsx @@ -5,11 +5,12 @@ import Layout from '../../components/Layout' import { PageProps } from 'gatsby' import { MetaDataMarket, ServiceMetaDataMarket } from '../../@types/MetaData' import { MetadataStore, Logger } from '@oceanprotocol/lib' -import { oceanConfig } from '../../../app.config' import Alert from '../../components/atoms/Alert' import Loader from '../../components/atoms/Loader' +import { useSiteMetadata } from '../../hooks/useSiteMetadata' export default function AssetRoute(props: PageProps): ReactElement { + const { appConfig } = useSiteMetadata() const [metadata, setMetadata] = useState() const [title, setTitle] = useState() const [error, setError] = useState() @@ -20,7 +21,7 @@ export default function AssetRoute(props: PageProps): ReactElement { async function init() { try { const metadataStore = new MetadataStore( - oceanConfig.metadataStoreUri, + appConfig.oceanConfig.metadataStoreUri, Logger ) const ddo = await metadataStore.retrieveDDO(did)