From 952deee97ad59b9e7d8f61934622950a7ee5bc15 Mon Sep 17 00:00:00 2001 From: rk <59029880+rrr523@users.noreply.github.com> Date: Thu, 25 Apr 2024 18:18:17 +0800 Subject: [PATCH] chore: Update example (#533) --- examples/nextjs/README.md | 3 +- .../components/object/create/delegrate.tsx | 203 ++++++++++ .../src/components/object/create/index.tsx | 361 +----------------- .../src/components/object/create/withTx.tsx | 224 +++++++++++ .../src/components/walletInfo/index.tsx | 8 +- examples/nextjs/src/config/index.ts | 18 +- 6 files changed, 457 insertions(+), 360 deletions(-) create mode 100644 examples/nextjs/src/components/object/create/delegrate.tsx create mode 100644 examples/nextjs/src/components/object/create/withTx.tsx diff --git a/examples/nextjs/README.md b/examples/nextjs/README.md index 7b3ab018..5d034a67 100644 --- a/examples/nextjs/README.md +++ b/examples/nextjs/README.md @@ -36,7 +36,6 @@ NEXT_PUBLIC_BSC_CHAIN_ID=5601 > this is TESTNET's configuration. - Run the demo application: `npm run dev` ## Usage case @@ -46,4 +45,6 @@ Run the demo application: `npm run dev` * [withdraw](./src/components/withdraw/index.tsx) * [bucket](./src/components/bucket/index.tsx) * [object](./src/components/object/index.tsx) + * [create object with tx](./src/components/object/create/withTx.tsx) + * [create object and uploading object by delegrated agent](./src/components/object/create/delegrate.tsx) * [query](./src/components/withdraw/query.tsx) diff --git a/examples/nextjs/src/components/object/create/delegrate.tsx b/examples/nextjs/src/components/object/create/delegrate.tsx new file mode 100644 index 00000000..4c0d5197 --- /dev/null +++ b/examples/nextjs/src/components/object/create/delegrate.tsx @@ -0,0 +1,203 @@ +import { client } from '@/client'; +import { getOffchainAuthKeys } from '@/utils/offchainAuth'; +import { + bytesFromBase64, + Long, + RedundancyType, + VisibilityType, + OnProgressEvent, +} from '@bnb-chain/greenfield-js-sdk'; +import { ReedSolomon } from '@bnb-chain/reed-solomon'; +import { ChangeEvent, useState } from 'react'; +import { useAccount } from 'wagmi'; + +export const DelegrateObject = () => { + const { address, connector } = useAccount(); + const [file, setFile] = useState(); + const [txHash, setTxHash] = useState(); + const [createObjectInfo, setCreateObjectInfo] = useState({ + bucketName: '', + objectName: '', + }); + + return ( +
+ <> +

Create Object and uploading by delegated agent

+ bucket name : + { + setCreateObjectInfo({ ...createObjectInfo, bucketName: e.target.value }); + }} + /> +
+ object name : + { + setCreateObjectInfo({ ...createObjectInfo, objectName: e.target.value }); + }} + /> +
+ ) => { + if (e.target.files) { + setFile(e.target.files[0]); + } + }} + /> +
+ {' '} + +
+ +
+ + +
+ ); +}; diff --git a/examples/nextjs/src/components/object/create/index.tsx b/examples/nextjs/src/components/object/create/index.tsx index f0c3cde0..2deee545 100644 --- a/examples/nextjs/src/components/object/create/index.tsx +++ b/examples/nextjs/src/components/object/create/index.tsx @@ -3,373 +3,24 @@ import { getOffchainAuthKeys } from '@/utils/offchainAuth'; import { bytesFromBase64, Long, + OnProgressEvent, RedundancyType, VisibilityType, } from '@bnb-chain/greenfield-js-sdk'; -import { OnProgressEvent } from '@bnb-chain/greenfield-js-sdk/src/types/common'; import { ReedSolomon } from '@bnb-chain/reed-solomon'; import { ChangeEvent, useState } from 'react'; import { useAccount } from 'wagmi'; +import { CreateObjectWithTx } from './withTx'; +import { DelegrateObject } from './delegrate'; export const CreateObject = () => { - const { address, connector } = useAccount(); - const [file, setFile] = useState(); - const [txHash, setTxHash] = useState(); - const [createObjectInfo, setCreateObjectInfo] = useState({ - bucketName: '', - objectName: '', - }); - return (
- <> -

Create Object

- bucket name : - { - setCreateObjectInfo({ ...createObjectInfo, bucketName: e.target.value }); - }} - /> -
- object name : - { - setCreateObjectInfo({ ...createObjectInfo, objectName: e.target.value }); - }} - /> -
- ) => { - if (e.target.files) { - setFile(e.target.files[0]); - } - }} - /> -
- upload object with tx:{' '} - {' '} - {' '} - -
- or uploaded by delegated agent :{' '} - {' '} - -
- -
- {' '} - - +
); }; diff --git a/examples/nextjs/src/components/object/create/withTx.tsx b/examples/nextjs/src/components/object/create/withTx.tsx new file mode 100644 index 00000000..0377401e --- /dev/null +++ b/examples/nextjs/src/components/object/create/withTx.tsx @@ -0,0 +1,224 @@ +import { client } from '@/client'; +import { getOffchainAuthKeys } from '@/utils/offchainAuth'; +import { + bytesFromBase64, + Long, + OnProgressEvent, + RedundancyType, + VisibilityType, +} from '@bnb-chain/greenfield-js-sdk'; +import { ReedSolomon } from '@bnb-chain/reed-solomon'; +import { ChangeEvent, useState } from 'react'; +import { useAccount } from 'wagmi'; + +export const CreateObjectWithTx = () => { + const { address, connector } = useAccount(); + const [file, setFile] = useState(); + const [txHash, setTxHash] = useState(); + const [createObjectInfo, setCreateObjectInfo] = useState({ + bucketName: '', + objectName: '', + }); + + return ( +
+ <> +

Create Object and Upload with tx

+ bucket name : + { + setCreateObjectInfo({ ...createObjectInfo, bucketName: e.target.value }); + }} + /> +
+ object name : + { + setCreateObjectInfo({ ...createObjectInfo, objectName: e.target.value }); + }} + /> +
+ ) => { + if (e.target.files) { + setFile(e.target.files[0]); + } + }} + /> +
+ {' '} + {' '} + +
+ + +
+ ); +}; diff --git a/examples/nextjs/src/components/walletInfo/index.tsx b/examples/nextjs/src/components/walletInfo/index.tsx index d81d6858..084be5ae 100644 --- a/examples/nextjs/src/components/walletInfo/index.tsx +++ b/examples/nextjs/src/components/walletInfo/index.tsx @@ -6,7 +6,13 @@ export const WalletInfo = () => { return (
- +
); }; diff --git a/examples/nextjs/src/config/index.ts b/examples/nextjs/src/config/index.ts index ca322175..08711644 100644 --- a/examples/nextjs/src/config/index.ts +++ b/examples/nextjs/src/config/index.ts @@ -24,8 +24,8 @@ const greenFieldChain: Chain = { }, }, nativeCurrency: { - name: 'BNB', - symbol: 'BNB', + name: 'tBNB', + symbol: 'tBNB', decimals: 18, }, }; @@ -52,6 +52,9 @@ export const bscChain: Chain = { // testnet: true, }; +console.log('bscChain', bscChain); +console.log('greenFieldChain', greenFieldChain); + const connectors = connectorsForWallets( [ { @@ -66,7 +69,16 @@ const connectors = connectorsForWallets( ); export const wagmiConfig = createConfig({ - chains: [mainnet, bscChain, greenFieldChain], + chains: [ + mainnet, + bscChain, + { + ...greenFieldChain, + network: 'greenfield', + iconUrl: + 'https://github.com/wagmi-dev/wagmi/assets/5653652/44446c8c-5c72-4e89-b8eb-3042ef618eed', + }, + ], transports: { [mainnet.id]: http(), [bscChain.id]: http(),