From ac2cd2eb702eca4d526e75b1361f311682d82077 Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Wed, 10 Jul 2019 13:40:19 +0200
Subject: [PATCH] fetch market network, use it in some places to switch copy,
 fix faucet button

---
 .../organisms/Web3message.module.scss         |  4 ++
 client/src/context/MarketProvider.tsx         | 18 ++++-
 client/src/context/index.tsx                  |  6 +-
 client/src/routes/Faucet.tsx                  | 46 ++++++------
 client/src/routes/Publish/index.tsx           | 72 ++++++++++---------
 5 files changed, 90 insertions(+), 56 deletions(-)

diff --git a/client/src/components/organisms/Web3message.module.scss b/client/src/components/organisms/Web3message.module.scss
index 4988335..99c21e3 100644
--- a/client/src/components/organisms/Web3message.module.scss
+++ b/client/src/components/organisms/Web3message.module.scss
@@ -9,6 +9,10 @@
     padding-top: $spacer / 2;
     padding-bottom: $spacer / 2;
     text-align: left;
+
+    > div:first-child {
+        margin-bottom: $spacer / 2;
+    }
 }
 
 .text {
diff --git a/client/src/context/MarketProvider.tsx b/client/src/context/MarketProvider.tsx
index c24f77e..0132aaf 100644
--- a/client/src/context/MarketProvider.tsx
+++ b/client/src/context/MarketProvider.tsx
@@ -16,6 +16,7 @@ interface MarketProviderProps {
 interface MarketProviderState {
     totalAssets: number
     categories: string[]
+    network: string
 }
 
 export default class MarketProvider extends PureComponent<
@@ -24,7 +25,8 @@ export default class MarketProvider extends PureComponent<
 > {
     public state = {
         totalAssets: 0,
-        categories
+        categories,
+        network: 'Pacific'
     }
 
     public async componentDidMount() {}
@@ -34,6 +36,7 @@ export default class MarketProvider extends PureComponent<
         // Cause there is no `prevContext`.
         if (prevProps.ocean !== this.props.ocean) {
             await this.getTotalAssets()
+            await this.getMarketNetwork()
         }
     }
 
@@ -56,6 +59,19 @@ export default class MarketProvider extends PureComponent<
         }
     }
 
+    private getMarketNetwork = async () => {
+        try {
+            const { ocean } = this.props
+            // Set desired network to whatever Brizo is running in
+            const brizo = await ocean.brizo.getVersionInfo()
+            const network =
+                brizo.network.charAt(0).toUpperCase() + brizo.network.slice(1)
+            this.setState({ network })
+        } catch (error) {
+            Logger.error('Error', error.message)
+        }
+    }
+
     public render() {
         return (
             <Market.Provider value={this.state}>
diff --git a/client/src/context/index.tsx b/client/src/context/index.tsx
index 69fffb1..f78e3ce 100644
--- a/client/src/context/index.tsx
+++ b/client/src/context/index.tsx
@@ -25,4 +25,8 @@ export const User = React.createContext({
     message: ''
 })
 
-export const Market = React.createContext({ totalAssets: 0, categories: [''] })
+export const Market = React.createContext({
+    totalAssets: 0,
+    categories: [''],
+    network: ''
+})
diff --git a/client/src/routes/Faucet.tsx b/client/src/routes/Faucet.tsx
index 6e01306..e187cbb 100644
--- a/client/src/routes/Faucet.tsx
+++ b/client/src/routes/Faucet.tsx
@@ -3,7 +3,7 @@ import { FaucetResponse } from '../ocean'
 import Route from '../components/templates/Route'
 import Button from '../components/atoms/Button'
 import Spinner from '../components/atoms/Spinner'
-import { User } from '../context'
+import { User, Market } from '../context'
 import Web3message from '../components/organisms/Web3message'
 import styles from './Faucet.module.scss'
 import Content from '../components/atoms/Content'
@@ -112,30 +112,34 @@ export default class Faucet extends PureComponent<{}, FaucetState> {
     )
 
     public render() {
-        const { isWeb3 } = this.context
+        const { isLogged } = this.context
         const { isLoading, error, success } = this.state
 
         return (
-            <Route
-                title="Faucet"
-                description="Shower yourself with some Ether for Ocean's Pacific network."
-            >
-                <Content>
-                    <Web3message />
+            <Market.Consumer>
+                {market => (
+                    <Route
+                        title="Faucet"
+                        description={`Shower yourself with some Ether for Ocean's ${market.network} network.`}
+                    >
+                        <Content>
+                            <Web3message />
 
-                    <div className={styles.action}>
-                        {isLoading ? (
-                            <Spinner message="Getting Ether..." />
-                        ) : error ? (
-                            <this.Error />
-                        ) : success ? (
-                            <this.Success />
-                        ) : (
-                            isWeb3 && <this.Action />
-                        )}
-                    </div>
-                </Content>
-            </Route>
+                            <div className={styles.action}>
+                                {isLoading ? (
+                                    <Spinner message="Getting Ether..." />
+                                ) : error ? (
+                                    <this.Error />
+                                ) : success ? (
+                                    <this.Success />
+                                ) : (
+                                    isLogged && <this.Action />
+                                )}
+                            </div>
+                        </Content>
+                    </Route>
+                )}
+            </Market.Consumer>
         )
     }
 }
diff --git a/client/src/routes/Publish/index.tsx b/client/src/routes/Publish/index.tsx
index eb18137..bc61a03 100644
--- a/client/src/routes/Publish/index.tsx
+++ b/client/src/routes/Publish/index.tsx
@@ -3,7 +3,7 @@ import { Logger } from '@oceanprotocol/squid'
 import Route from '../../components/templates/Route'
 import Form from '../../components/atoms/Form/Form'
 import AssetModel from '../../models/AssetModel'
-import { User } from '../../context'
+import { User, Market } from '../../context'
 import Web3message from '../../components/organisms/Web3message'
 import Step from './Step'
 import Progress from './Progress'
@@ -319,41 +319,47 @@ export default class Publish extends Component<{}, PublishState> {
 
     public render() {
         return (
-            <Route
-                title="Publish"
-                description="Publish a new data set into the Ocean Protocol Network."
-            >
-                <Content>
-                    {(!this.context.isLogged ||
-                        !this.context.isOceanNetwork) && <Web3message />}
+            <Market.Consumer>
+                {market => (
+                    <Route
+                        title="Publish"
+                        description={`Publish a new data set into the Ocean Protocol ${market.network} Network.`}
+                    >
+                        <Content>
+                            {(!this.context.isLogged ||
+                                !this.context.isOceanNetwork) && (
+                                <Web3message />
+                            )}
 
-                    <Progress
-                        steps={steps}
-                        currentStep={this.state.currentStep}
-                    />
-
-                    <Form onSubmit={this.registerAsset}>
-                        {steps.map((step: any, index: number) => (
-                            <Step
-                                key={index}
-                                index={index}
-                                title={step.title}
-                                description={step.description}
+                            <Progress
+                                steps={steps}
                                 currentStep={this.state.currentStep}
-                                fields={step.fields}
-                                inputChange={this.inputChange}
-                                state={this.state}
-                                next={this.next}
-                                prev={this.prev}
-                                totalSteps={steps.length}
-                                tryAgain={this.tryAgain}
-                                toStart={this.toStart}
-                                content={step.content}
                             />
-                        ))}
-                    </Form>
-                </Content>
-            </Route>
+
+                            <Form onSubmit={this.registerAsset}>
+                                {steps.map((step: any, index: number) => (
+                                    <Step
+                                        key={index}
+                                        index={index}
+                                        title={step.title}
+                                        description={step.description}
+                                        currentStep={this.state.currentStep}
+                                        fields={step.fields}
+                                        inputChange={this.inputChange}
+                                        state={this.state}
+                                        next={this.next}
+                                        prev={this.prev}
+                                        totalSteps={steps.length}
+                                        tryAgain={this.tryAgain}
+                                        toStart={this.toStart}
+                                        content={step.content}
+                                    />
+                                ))}
+                            </Form>
+                        </Content>
+                    </Route>
+                )}
+            </Market.Consumer>
         )
     }
 }