1
0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00

extend json, setup loader

This commit is contained in:
Jernej Pregelj 2019-04-26 15:49:12 +02:00
parent 2be4569299
commit 0450034e75
4 changed files with 917 additions and 452 deletions

View File

@ -67,7 +67,7 @@ export default class Input extends PureComponent<InputProps, InputState> {
const event = {
currentTarget: {
name: 'dateCreated',
value: date
value: date.toISOString()
}
}
this.props.onChange!(event as any) // eslint-disable-line @typescript-eslint/no-non-null-assertion

View File

@ -1,4 +1,36 @@
{
"dataset": {
"defaults": {
"name": "",
"dateCreated": "",
"description": "",
"files": [],
"price": 0,
"author": "",
"type": "dataset",
"license": "",
"copyrightHolder": "",
"categories": ""
},
"validation": {
"1": {
"name": false,
"files": false,
"allFieldsValid": false
},
"2": {
"description": false,
"categories": false,
"dateCreated": false,
"allFieldsValid": false
},
"3": {
"author": false,
"copyrightHolder": false,
"license": false,
"allFieldsValid": false
}
},
"steps": [
{
"title": "Essentials",
@ -125,4 +157,482 @@
"content": "After clicking the button below you will be asked by your wallet to sign this request."
}
]
},
"algorithm": {
"defaults": {
"name": "",
"dateCreated": "",
"description": "",
"files": [],
"price": 0,
"author": "",
"type": "algorithm",
"license": "",
"copyrightHolder": "",
"categories": ""
},
"validation": {
"1": {
"name": false,
"files": false,
"allFieldsValid": false
},
"2": {
"description": false,
"categories": false,
"dateCreated": false,
"allFieldsValid": false
},
"3": {
"author": false,
"copyrightHolder": false,
"license": false,
"allFieldsValid": false
}
},
"steps": [
{
"title": "Essentials",
"description": "Start by adding a title and URLs for your algorithm.",
"fields": {
"name": {
"label": "Title",
"placeholder": "e.g. Shapes of Desert Plants",
"type": "text",
"required": true,
"help": "Enter a concise title. You will be able to enter a more thorough description in the next step."
},
"files": {
"label": "Files",
"placeholder": "e.g. https://file.com/file.json",
"type": "text",
"required": true,
"help": "Provide one or multiple urls to your algorithm files."
}
}
},
{
"title": "Information",
"description": "Further describe and categorize your algorithm to help people discover it.",
"fields": {
"description": {
"label": "Description",
"help": "Add a thorough description with as much detail as possible.",
"placeholder": "e.g. Shapes of 23 common desert plants.",
"type": "textarea",
"required": true,
"rows": 5
},
"categories": {
"label": "Category",
"help": "Pick a category which best fits your algorithm.",
"type": "select",
"required": true,
"options": [
"Image Recognition",
"Dataset Of Datasets",
"Language",
"Performing Arts",
"Visual Arts & Design",
"Philosophy",
"History",
"Theology",
"Anthropology & Archeology",
"Sociology",
"Psychology",
"Politics",
"Interdisciplinary",
"Economics & Finance",
"Demography",
"Biology",
"Chemistry",
"Physics & Energy",
"Earth & Climate",
"Space & Astronomy",
"Mathematics",
"Computer Technology",
"Engineering",
"Agriculture & Bio Engineering",
"Transportation",
"Urban Planning",
"Medicine",
"Business & Management",
"Sports & Recreation",
"Communication & Journalism",
"Deep Learning",
"Law",
"Other"
]
},
"dateCreated": {
"label": "Creation Date",
"help": "Select the date the asset was created, or was updated for the last time.",
"type": "date",
"required": true
}
}
},
{
"title": "Authorship",
"description": "Give proper attribution for your algorithm.",
"fields": {
"author": {
"label": "Author",
"placeholder": "e.g. Jelly McJellyfish",
"type": "text",
"required": true
},
"copyrightHolder": {
"label": "Copyright Holder",
"placeholder": "e.g. Marine Institute of Jellyfish",
"type": "text",
"required": true
},
"license": {
"label": "License",
"type": "select",
"required": true,
"options": [
"Public Domain",
"PDDL: Public Domain Dedication and License",
"ODC-By: Attribution License",
"ODC-ODbL: Open Database License",
"CDLA-Sharing: Community Data License Agreement",
"CDLA-Permissive: Community Data License Agreement",
"CC0: Public Domain Dedication",
"CC BY: Attribution 4.0 International",
"CC BY-SA: Attribution-ShareAlike 4.0 International",
"CC BY-ND: Attribution-NoDerivatives 4.0 International",
"CC BY-NC: Attribution-NonCommercial 4.0 International",
"CC BY-NC-SA: Attribution-NonCommercial-ShareAlike 4.0 International",
"CC BY-NC-ND: Attribution-NonCommercial-NoDerivatives 4.0 International"
]
}
}
},
{
"title": "Register",
"description": "Splendid, we got all the data. Now let's register your algorithm.",
"content": "After clicking the button below you will be asked by your wallet to sign this request."
}
]
},
"workflow": {
"defaults": {
"name": "",
"dateCreated": "",
"description": "",
"files": [],
"price": 0,
"author": "",
"type": "workflow",
"license": "",
"copyrightHolder": "",
"categories": ""
},
"validation": {
"1": {
"name": false,
"files": false,
"allFieldsValid": false
},
"2": {
"description": false,
"categories": false,
"dateCreated": false,
"allFieldsValid": false
},
"3": {
"author": false,
"copyrightHolder": false,
"license": false,
"allFieldsValid": false
}
},
"steps": [
{
"title": "Essentials",
"description": "Start by adding a title and URLs for your workflow.",
"fields": {
"name": {
"label": "Title",
"placeholder": "e.g. Shapes of Desert Plants",
"type": "text",
"required": true,
"help": "Enter a concise title. You will be able to enter a more thorough description in the next step."
},
"files": {
"label": "Files",
"placeholder": "e.g. https://file.com/file.json",
"type": "text",
"required": true,
"help": "Provide one or multiple urls to your workflow files."
}
}
},
{
"title": "Information",
"description": "Further describe and categorize your workflow to help people discover it.",
"fields": {
"description": {
"label": "Description",
"help": "Add a thorough description with as much detail as possible.",
"placeholder": "e.g. Shapes of 23 common desert plants.",
"type": "textarea",
"required": true,
"rows": 5
},
"categories": {
"label": "Category",
"help": "Pick a category which best fits your workflow.",
"type": "select",
"required": true,
"options": [
"Image Recognition",
"Dataset Of Datasets",
"Language",
"Performing Arts",
"Visual Arts & Design",
"Philosophy",
"History",
"Theology",
"Anthropology & Archeology",
"Sociology",
"Psychology",
"Politics",
"Interdisciplinary",
"Economics & Finance",
"Demography",
"Biology",
"Chemistry",
"Physics & Energy",
"Earth & Climate",
"Space & Astronomy",
"Mathematics",
"Computer Technology",
"Engineering",
"Agriculture & Bio Engineering",
"Transportation",
"Urban Planning",
"Medicine",
"Business & Management",
"Sports & Recreation",
"Communication & Journalism",
"Deep Learning",
"Law",
"Other"
]
},
"dateCreated": {
"label": "Creation Date",
"help": "Select the date the asset was created, or was updated for the last time.",
"type": "date",
"required": true
}
}
},
{
"title": "Authorship",
"description": "Give proper attribution for your workflow.",
"fields": {
"author": {
"label": "Author",
"placeholder": "e.g. Jelly McJellyfish",
"type": "text",
"required": true
},
"copyrightHolder": {
"label": "Copyright Holder",
"placeholder": "e.g. Marine Institute of Jellyfish",
"type": "text",
"required": true
},
"license": {
"label": "License",
"type": "select",
"required": true,
"options": [
"Public Domain",
"PDDL: Public Domain Dedication and License",
"ODC-By: Attribution License",
"ODC-ODbL: Open Database License",
"CDLA-Sharing: Community Data License Agreement",
"CDLA-Permissive: Community Data License Agreement",
"CC0: Public Domain Dedication",
"CC BY: Attribution 4.0 International",
"CC BY-SA: Attribution-ShareAlike 4.0 International",
"CC BY-ND: Attribution-NoDerivatives 4.0 International",
"CC BY-NC: Attribution-NonCommercial 4.0 International",
"CC BY-NC-SA: Attribution-NonCommercial-ShareAlike 4.0 International",
"CC BY-NC-ND: Attribution-NonCommercial-NoDerivatives 4.0 International"
]
}
}
},
{
"title": "Register",
"description": "Splendid, we got all the data. Now let's register your workflow.",
"content": "After clicking the button below you will be asked by your wallet to sign this request."
}
]
},
"container": {
"defaults": {
"name": "",
"dateCreated": "",
"description": "",
"files": [],
"price": 0,
"author": "",
"type": "container",
"license": "",
"copyrightHolder": "",
"categories": ""
},
"validation": {
"1": {
"name": false,
"files": false,
"allFieldsValid": false
},
"2": {
"description": false,
"categories": false,
"dateCreated": false,
"allFieldsValid": false
},
"3": {
"author": false,
"copyrightHolder": false,
"license": false,
"allFieldsValid": false
}
},
"steps": [
{
"title": "Essentials",
"description": "Start by adding a title and URLs for your container.",
"fields": {
"name": {
"label": "Title",
"placeholder": "e.g. Shapes of Desert Plants",
"type": "text",
"required": true,
"help": "Enter a concise title. You will be able to enter a more thorough description in the next step."
},
"files": {
"label": "Files",
"placeholder": "e.g. https://file.com/file.json",
"type": "text",
"required": true,
"help": "Provide one or multiple urls to your container files."
}
}
},
{
"title": "Information",
"description": "Further describe and categorize your container to help people discover it.",
"fields": {
"description": {
"label": "Description",
"help": "Add a thorough description with as much detail as possible.",
"placeholder": "e.g. Shapes of 23 common desert plants.",
"type": "textarea",
"required": true,
"rows": 5
},
"categories": {
"label": "Category",
"help": "Pick a category which best fits your container.",
"type": "select",
"required": true,
"options": [
"Image Recognition",
"Dataset Of Datasets",
"Language",
"Performing Arts",
"Visual Arts & Design",
"Philosophy",
"History",
"Theology",
"Anthropology & Archeology",
"Sociology",
"Psychology",
"Politics",
"Interdisciplinary",
"Economics & Finance",
"Demography",
"Biology",
"Chemistry",
"Physics & Energy",
"Earth & Climate",
"Space & Astronomy",
"Mathematics",
"Computer Technology",
"Engineering",
"Agriculture & Bio Engineering",
"Transportation",
"Urban Planning",
"Medicine",
"Business & Management",
"Sports & Recreation",
"Communication & Journalism",
"Deep Learning",
"Law",
"Other"
]
},
"dateCreated": {
"label": "Creation Date",
"help": "Select the date the asset was created, or was updated for the last time.",
"type": "date",
"required": true
}
}
},
{
"title": "Authorship",
"description": "Give proper attribution for your container.",
"fields": {
"author": {
"label": "Author",
"placeholder": "e.g. Jelly McJellyfish",
"type": "text",
"required": true
},
"copyrightHolder": {
"label": "Copyright Holder",
"placeholder": "e.g. Marine Institute of Jellyfish",
"type": "text",
"required": true
},
"license": {
"label": "License",
"type": "select",
"required": true,
"options": [
"Public Domain",
"PDDL: Public Domain Dedication and License",
"ODC-By: Attribution License",
"ODC-ODbL: Open Database License",
"CDLA-Sharing: Community Data License Agreement",
"CDLA-Permissive: Community Data License Agreement",
"CC0: Public Domain Dedication",
"CC BY: Attribution 4.0 International",
"CC BY-SA: Attribution-ShareAlike 4.0 International",
"CC BY-ND: Attribution-NoDerivatives 4.0 International",
"CC BY-NC: Attribution-NonCommercial 4.0 International",
"CC BY-NC-SA: Attribution-NonCommercial-ShareAlike 4.0 International",
"CC BY-NC-ND: Attribution-NonCommercial-NoDerivatives 4.0 International"
]
}
}
},
{
"title": "Register",
"description": "Splendid, we got all the data. Now let's register your container.",
"content": "After clicking the button below you will be asked by your wallet to sign this request."
}
]
}
}

View File

@ -1,352 +1,46 @@
import React, { ChangeEvent, Component, FormEvent } from 'react'
import { Logger } from '@oceanprotocol/squid'
import React, { Component } from 'react'
import Route from '../../components/templates/Route'
import Form from '../../components/atoms/Form/Form'
import AssetModel from '../../models/AssetModel'
import { User } from '../../context'
import Web3message from '../../components/organisms/Web3message'
import Step from './Step'
import Progress from './Progress'
import ReactGA from 'react-ga'
import { steps } from '../../data/form-publish.json'
type AssetType = 'dataset' | 'algorithm' | 'container' | 'workflow' | 'other'
import Loader from './loader'
interface PublishState {
name?: string
dateCreated?: string
description?: string
files?: string[]
price?: number
author?: string
type?: AssetType
license?: string
copyrightHolder?: string
categories?: string
tags?: string[]
isPublishing?: boolean
isPublished?: boolean
publishedDid?: string
publishingError?: string
currentStep?: number
validationStatus?: any
type: string
}
class Publish extends Component<{}, PublishState> {
public state = {
currentStep: 1,
name: '',
dateCreated: new Date().toISOString(),
description: '',
files: [],
price: 0,
author: '',
type: 'dataset' as AssetType,
license: '',
copyrightHolder: '',
categories: '',
isPublishing: false,
isPublished: false,
publishedDid: '',
publishingError: '',
validationStatus: {
1: { name: false, files: false, allFieldsValid: false },
2: {
description: false,
categories: false,
allFieldsValid: false
},
3: {
author: false,
copyrightHolder: false,
license: false,
allFieldsValid: false
type: 'start'
}
publishDataset = () => {
this.setState({ type: 'dataset' })
}
publishContainer = () => {
this.setState({ type: 'container' })
}
private inputChange = (
event: ChangeEvent<HTMLInputElement> | ChangeEvent<HTMLSelectElement>
) => {
this.validateInputs(event.currentTarget.name, event.currentTarget.value)
this.setState({
[event.currentTarget.name]: event.currentTarget.value
})
publishAlgorithm = () => {
this.setState({ type: 'algorithm' })
}
private inputToArrayChange = (
event: ChangeEvent<HTMLInputElement> | ChangeEvent<HTMLSelectElement>
) => {
this.validateInputs(event.currentTarget.name, event.currentTarget.value)
this.setState({
[event.currentTarget.name]: [event.currentTarget.value]
})
publishWorkflow = () => {
this.setState({ type: 'workflow' })
}
private next = () => {
let { currentStep } = this.state
const totalSteps = steps.length
currentStep =
currentStep >= totalSteps - 1 ? totalSteps : currentStep + 1
ReactGA.event({
category: 'Publish',
action: 'nextStep ' + currentStep
})
this.setState({ currentStep })
}
private prev = () => {
let { currentStep } = this.state
currentStep = currentStep <= 1 ? 1 : currentStep - 1
this.setState({ currentStep })
}
private tryAgain = () => {
this.setState({ publishingError: '' })
}
private toStart = () => {
this.setState({
name: '',
dateCreated: new Date().toISOString(),
description: '',
files: [],
price: 0,
author: '',
type: 'dataset' as AssetType,
license: '',
copyrightHolder: '',
categories: '',
isPublishing: false,
isPublished: false,
currentStep: 1
})
}
private validateInputs = (name: string, value: string) => {
let hasContent = value.length > 0
// Setting state for all fields
if (hasContent) {
this.setState(
prevState => ({
validationStatus: {
...prevState.validationStatus,
[this.state.currentStep]: {
...prevState.validationStatus[
this.state.currentStep
],
[name]: true
}
}
}),
this.runValidation
)
} else {
this.setState(
prevState => ({
validationStatus: {
...prevState.validationStatus,
[this.state.currentStep]: {
...prevState.validationStatus[
this.state.currentStep
],
[name]: false
}
}
}),
this.runValidation
)
}
}
private runValidation = () => {
let { validationStatus } = this.state
//
// Step 1
//
if (validationStatus[1].name && validationStatus[1].files) {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
1: {
...prevState.validationStatus[1],
allFieldsValid: true
}
}
}))
} else {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
1: {
...prevState.validationStatus[1],
allFieldsValid: false
}
}
}))
}
//
// Step 2
//
if (validationStatus[2].description && validationStatus[2].categories) {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
2: {
...prevState.validationStatus[2],
allFieldsValid: true
}
}
}))
} else {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
2: {
...prevState.validationStatus[2],
allFieldsValid: false
}
}
}))
}
//
// Step 3
//
if (
validationStatus[3].author &&
validationStatus[3].copyrightHolder &&
validationStatus[3].license
) {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
3: {
...prevState.validationStatus[3],
allFieldsValid: true
}
}
}))
} else {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
3: {
...prevState.validationStatus[3],
allFieldsValid: false
}
}
}))
}
}
private registerAsset = async (event: FormEvent<HTMLFormElement>) => {
event.preventDefault()
ReactGA.event({
category: 'Publish',
action: 'registerAsset-start'
})
this.setState({
publishingError: '',
isPublishing: true
})
const { ocean } = this.context
const account = await ocean.accounts.list()
const newAsset = {
// OEP-08 Attributes
// https://github.com/oceanprotocol/OEPs/tree/master/8
base: Object.assign(AssetModel.base, {
name: this.state.name,
description: this.state.description,
dateCreated: new Date(this.state.dateCreated).toISOString(),
author: this.state.author,
license: this.state.license,
copyrightHolder: this.state.copyrightHolder,
files: this.state.files,
price: this.state.price,
type: this.state.type,
categories: [this.state.categories],
workExample: undefined,
inLanguage: undefined,
tags: ''
}),
curation: Object.assign(AssetModel.curation),
additionalInformation: Object.assign(
AssetModel.additionalInformation
)
}
try {
const asset = await this.context.ocean.assets.create(
newAsset,
account[0]
)
this.setState({
publishedDid: asset.id,
isPublished: true
})
ReactGA.event({
category: 'Publish',
action: 'registerAsset-end' + asset.id
})
} catch (e) {
// make readable errors
Logger.log('error:', e)
this.setState({
publishingError: e.message
})
ReactGA.event({
category: 'Publish',
action: 'registerAsset-error' + e.message
})
}
this.setState({
isPublishing: false
})
}
public render() {
return (
<div>
{this.state.type !== 'start' && (
<Loader loadType={this.state.type}/>
)}
{this.state.type === 'start' && (
<Route
title="Publish"
description="Publish a new data set into the Ocean Protocol Network."
description="What do you want to publish?"
>
{(!this.context.isLogged || !this.context.isNile) && (
<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}
currentStep={this.state.currentStep}
fields={step.fields}
inputChange={this.inputChange}
inputToArrayChange={this.inputToArrayChange}
state={this.state}
next={this.next}
prev={this.prev}
totalSteps={steps.length}
tryAgain={this.tryAgain}
toStart={this.toStart}
content={step.content}
/>
))}
</Form>
<button onClick={this.publishDataset}>Dataset</button>
<button onClick={this.publishContainer}>Container</button>
<button onClick={this.publishWorkflow}>Workflow</button>
<button onClick={this.publishAlgorithm}>Algorithm</button>
</Route>
)}
</div>
)
}
}

View File

@ -0,0 +1,261 @@
import React, { ChangeEvent, Component, FormEvent } from 'react'
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 Web3message from '../../components/organisms/Web3message'
import Step from './Step'
import Progress from './Progress'
import ReactGA from 'react-ga'
import dataPublishForm from '../../data/form-publish.json'
interface LoaderState {
currentStep?: number
isPublishing?: boolean
isPublished?: boolean
publishedDid?: string
publishingError?: string
validationStatus?: any
[defaultsState: string]: any
}
interface LoaderProps {
loadType: string
}
class Loader extends Component<LoaderProps, LoaderState> {
public state = {
currentStep: 1,
isPublishing: false,
isPublished: false,
publishedDid: '',
publishingError: '',
validationStatus: ((dataPublishForm as any)[this.props.loadType]).validation,
...((dataPublishForm as any)[this.props.loadType]).defaults
}
private inputChange = (
event: ChangeEvent<HTMLInputElement> | ChangeEvent<HTMLSelectElement>
) => {
this.validateInputs(event.currentTarget.name, event.currentTarget.value)
this.setState({
[event.currentTarget.name]: event.currentTarget.value
})
}
private inputToArrayChange = (
event: ChangeEvent<HTMLInputElement> | ChangeEvent<HTMLSelectElement>
) => {
this.validateInputs(event.currentTarget.name, event.currentTarget.value)
this.setState({
[event.currentTarget.name]: [event.currentTarget.value]
})
}
private next = () => {
let { currentStep } = this.state
const totalSteps = ((dataPublishForm as any)[this.props.loadType]).steps.length
currentStep =
currentStep >= totalSteps - 1 ? totalSteps : currentStep + 1
ReactGA.event({
category: 'Publish',
action: 'nextStep ' + currentStep
})
this.setState({ currentStep })
}
private prev = () => {
let { currentStep } = this.state
currentStep = currentStep <= 1 ? 1 : currentStep - 1
this.setState({ currentStep })
}
private tryAgain = () => {
this.setState({ publishingError: '' })
}
private toStart = () => {
this.setState({
isPublishing: false,
isPublished: false,
currentStep: 1,
...((dataPublishForm as any)[this.props.loadType]).defaults
})
}
private validateInputs = (name: string, value: string) => {
let hasContent = value && value.length > 0
// Setting state for all fields
if (hasContent) {
this.setState(
prevState => ({
validationStatus: {
...prevState.validationStatus,
[this.state.currentStep]: {
...prevState.validationStatus[
this.state.currentStep
],
[name]: true
}
}
}),
this.runValidation
)
} else {
this.setState(
prevState => ({
validationStatus: {
...prevState.validationStatus,
[this.state.currentStep]: {
...prevState.validationStatus[
this.state.currentStep
],
[name]: false
}
}
}),
this.runValidation
)
}
}
private runValidation = () => {
let { validationStatus } = this.state
for (let step of Object.keys(validationStatus)) {
const { allFieldsValid, ...keysToCheck } = validationStatus[step]
if (Object.values(keysToCheck).every(item => item === true)) {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
[step]: {
...prevState.validationStatus[step],
allFieldsValid: true
}
}
}))
} else {
this.setState(prevState => ({
validationStatus: {
...prevState.validationStatus,
[step]: {
...prevState.validationStatus[step],
allFieldsValid: false
}
}
}))
}
}
}
private submitAction = async (event: FormEvent<HTMLFormElement>) => {
event.preventDefault()
ReactGA.event({
category: 'Publish',
action: 'registerAsset-start'
})
this.setState({
publishingError: '',
isPublishing: true
})
const { ocean } = this.context
const account = await ocean.accounts.list()
const newAsset = {
// OEP-08 Attributes
// https://github.com/oceanprotocol/OEPs/tree/master/8
base: Object.assign(AssetModel.base, {
name: this.state.name,
description: this.state.description,
dateCreated: new Date(this.state.dateCreated).toISOString(),
author: this.state.author,
license: this.state.license,
copyrightHolder: this.state.copyrightHolder,
files: this.state.files,
price: this.state.price,
type: this.state.type,
categories: [this.state.categories],
workExample: undefined,
inLanguage: undefined,
tags: ''
}),
curation: Object.assign(AssetModel.curation),
additionalInformation: Object.assign(
AssetModel.additionalInformation
)
}
try {
const asset = await this.context.ocean.assets.create(
newAsset,
account[0]
)
this.setState({
publishedDid: asset.id,
isPublished: true
})
ReactGA.event({
category: 'Publish',
action: 'registerAsset-end' + asset.id
})
} catch (e) {
// make readable errors
Logger.log('error:', e)
this.setState({
publishingError: e.message
})
ReactGA.event({
category: 'Publish',
action: 'registerAsset-error' + e.message
})
}
this.setState({
isPublishing: false
})
}
public render() {
return (
<Route
title="Publish"
description="Publish a new data set into the Ocean Protocol Network."
>
{(!this.context.isLogged || !this.context.isNile) && (
<Web3message />
)}
<Progress steps={((dataPublishForm as any)[this.props.loadType]).steps} currentStep={this.state.currentStep} />
<Form onSubmit={this.submitAction}>
{((dataPublishForm as any)[this.props.loadType]).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}
inputToArrayChange={this.inputToArrayChange}
state={this.state}
next={this.next}
prev={this.prev}
totalSteps={((dataPublishForm as any)[this.props.loadType]).steps.length}
tryAgain={this.tryAgain}
toStart={this.toStart}
content={step.content}
/>
))}
</Form>
</Route>
)
}
}
Loader.contextType = User
export default Loader