oceanprotocol/market
1
0
Fork 0
mirror of https://github.com/oceanprotocol/market.git synced 2024-06-30 05:41:41 +02:00
Code Releases Activity

prepare NFT creation

Browse Source
This commit is contained in:
Matthias Kretschmann 2021-11-15 19:06:33 +00:00
parent 34bb90b717
commit abfe920150
Signed by: m
GPG Key ID: 606EEEF3C479A91F
3 changed files with 45 additions and 185 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/@utils/nft.ts
View File

@ -1,15 +1,47 @@
export interface NftOptions {
name: string
symbol: string
tokenURI: string
description: string
image: string
}
function encodeSvg(svgString: string): string {
return svgString
.replace(
'<svg',
~svgString.indexOf('xmlns')
? '<svg'
: '<svg xmlns="http://www.w3.org/2000/svg"'
)
.replace(/"/g, "'")
.replace(/%/g, '%25')
.replace(/#/g, '%23')
.replace(/{/g, '%7B')
.replace(/}/g, '%7D')
.replace(/</g, '%3C')
.replace(/>/g, '%3E')
.replace(/\s+/g, ' ')
}
export function generateNftOptions(): NftOptions {
const image = '<svg></svg>'
const newNft: NftOptions = {
name: 'Ocean Asset v4',
symbol: 'OCEAN-V4',
tokenURI: ''
description: `This NFT represents an asset in the Ocean Protocol v4 ecosystem.`,
image: `data:image/svg+xml,${encodeSvg(image)}` // generated SVG embedded as 'data:image/svg+xml;base64'
}
return newNft
}
export function generateNftCreateData(nftOptions: NftOptions): any {
const nftCreateData = {
name: nftOptions.name,
symbol: nftOptions.symbol,
templateIndex: 1,
tokenURI: Buffer.from(JSON.stringify(nftOptions)).toString('base64') // data:application/json;base64
}
return nftCreateData
}

182
src/components/Publish/FormAlgoPublish.tsx
View File

@ -1,182 +0,0 @@
import React, {
ReactElement,
useEffect,
useState,
FormEvent,
ChangeEvent
} from 'react'
// import { useStaticQuery, graphql } from 'gatsby'
// import { useFormikContext, Field, Form, FormikContextType } from 'formik'
// import Input from '../../atoms/Input'
// import { FormContent, FormFieldContent } from '../../../@types/Form'
// import { MetadataPublishFormAlgorithm } from '../../../@types/MetaData'
// import { initialValues as initialValuesAlgorithm } from '../../../@types/FormAlgoPublish'
// import AdvancedSettings from '../../molecules/FormFields/AdvancedSettings'
// import FormTitle from './FormTitle'
// import FormActions from './FormActions'
// import styles from './FormPublish.module.css'
// const query = graphql`
// query {
// content: allFile(
// filter: { relativePath: { eq: "pages/publish/form-algorithm.json" } }
// ) {
// edges {
// node {
// childPublishJson {
// title
// data {
// name
// placeholder
// label
// help
// type
// required
// sortOptions
// options
// disclaimer
// disclaimerValues
// advanced
// }
// warning
// }
// }
// }
// }
// }
// `
// export default function FormPublish(): ReactElement {
// const data = useStaticQuery(query)
// const content: FormContent = data.content.edges[0].node.childPublishJson
// const {
// status,
// setStatus,
// isValid,
// setErrors,
// setTouched,
// resetForm,
// initialValues,
// validateField,
// setFieldValue
// }: FormikContextType<MetadataPublishFormAlgorithm> = useFormikContext()
// const [selectedDockerImage, setSelectedDockerImage] = useState<string>(
// initialValues.dockerImage
// )
// const dockerImageOptions = [
// {
// name: 'node:latest',
// title: 'node:latest',
// checked: true
// },
// {
// name: 'python:latest',
// title: 'python:latest',
// checked: false
// },
// {
// name: 'custom image',
// title: 'custom image',
// checked: false
// }
// ]
// // reset form validation on every mount
// useEffect(() => {
// setErrors({})
// setTouched({})
// }, [setErrors, setTouched])
// function handleImageSelectChange(imageSelected: string) {
// switch (imageSelected) {
// case 'node:latest': {
// setFieldValue('image', 'node')
// setFieldValue('containerTag', 'latest')
// setFieldValue('entrypoint', 'node $ALGO')
// break
// }
// case 'python:latest': {
// setFieldValue('image', 'oceanprotocol/algo_dockers')
// setFieldValue('containerTag', 'python-panda')
// setFieldValue('entrypoint', 'python $ALGO')
// break
// }
// default: {
// setFieldValue('image', '')
// setFieldValue('containerTag', '')
// setFieldValue('entrypoint', '')
// break
// }
// }
// }
// // Manually handle change events instead of using `handleChange` from Formik.
// // Workaround for default `validateOnChange` not kicking in
// function handleFieldChange(
// e: ChangeEvent<HTMLInputElement>,
// field: InputProps
// ) {
// const value =
// field.type === 'checkbox' || field.type === 'terms'
// ? !JSON.parse(e.target.value)
// : e.target.value
// if (field.name === 'dockerImage') {
// setSelectedDockerImage(e.target.value)
// handleImageSelectChange(e.target.value)
// }
// validateField(field.name)
// setFieldValue(field.name, value)
// }
// const resetFormAndClearStorage = (e: FormEvent<Element>) => {
// e.preventDefault()
// resetForm({
// values: initialValuesAlgorithm as MetadataPublishFormAlgorithm,
// status: 'empty'
// })
// setStatus('empty')
// }
// return (
// <Form
// className={styles.form}
// // do we need this?
// onChange={() => status === 'empty' && setStatus(null)}
// >
// <FormTitle title={content.title} />
// {content.data.map(
// (field: InputProps) =>
// field.advanced !== true &&
// ((field.name !== 'entrypoint' &&
// field.name !== 'image' &&
// field.name !== 'containerTag') ||
// selectedDockerImage === 'custom image') && (
// <Field
// key={field.name}
// {...field}
// options={
// field.type === 'boxSelection'
// ? dockerImageOptions
// : field.options
// }
// component={Input}
// onChange={(e: ChangeEvent<HTMLInputElement>) =>
// handleFieldChange(e, field)
// }
// />
// )
// )}
// <AdvancedSettings
// content={content}
// handleFieldChange={handleFieldChange}
// />
// <FormActions
// isValid={isValid}
// resetFormAndClearStorage={resetFormAndClearStorage}
// />
// </Form>
// )
// }

12
src/components/Publish/index.tsx
View File

@ -15,6 +15,7 @@ import Navigation from './Navigation'
import { Steps } from './Steps'
import { FormPublishData } from './_types'
import { sha256 } from 'js-sha256'
import { generateNftCreateData } from '@utils/nft'
const formName = 'ocean-publish-form'
@ -32,16 +33,25 @@ export default function PublishPage({
async function handleSubmit(values: FormPublishData) {
try {
// --------------------------------------------------
// 1. Mint NFT & datatokens & put in pool
// const txMint = await createNftWithErc()
// --------------------------------------------------
// const nftOptions = values.metadata.nft
// const nftCreateData = generateNftCreateData(nftOptions)
// const ercParams = {}
// const txMint = await createNftWithErc(accountId, nftCreateData)
// const { nftAddress, datatokenAddress } = txMint.logs[0].args
//
// --------------------------------------------------
// 2. Construct and publish DDO
// --------------------------------------------------
// const did = sha256(`${nftAddress}${chainId}`)
// const ddo = transformPublishFormToDdo(values, datatokenAddress, nftAddress)
// const txPublish = await publish(ddo)
//
// --------------------------------------------------
// 3. Integrity check of DDO before & after publishing
// --------------------------------------------------
// const checksumBefore = sha256(ddo)
// const ddoFromChain = await getDdoFromChain(ddo.id)
// const ddoFromChainDecrypted = await decryptDdo(ddoFromChain)