@@ -2,29 +2,26 @@ import {
2
2
useIsAdmin ,
3
3
useIsMinter ,
4
4
} from "@3rdweb-sdk/react/hooks/useContractRoles" ;
5
- import {
6
- useBatchesToReveal ,
7
- useClaimConditions ,
8
- useContract ,
9
- } from "@thirdweb-dev/react" ;
5
+ import { useBatchesToReveal , useContract } from "@thirdweb-dev/react" ;
10
6
import { detectFeatures } from "components/contract-components/utils" ;
11
7
import { StepsCard } from "components/dashboard/StepsCard" ;
12
8
import { useTabHref } from "contract-ui/utils" ;
13
- import { totalSupply } from "thirdweb/extensions/erc20" ;
14
- import {
15
- getNFTs as erc721GetNfts ,
16
- getTotalClaimedSupply ,
17
- sharedMetadata ,
18
- } from "thirdweb/extensions/erc721" ;
19
- import { getNFTs as erc1155Nfts } from "thirdweb/extensions/erc1155" ;
9
+ import { useMemo } from "react" ;
10
+ import type { ThirdwebContract } from "thirdweb" ;
11
+ import * as ERC20Ext from "thirdweb/extensions/erc20" ;
12
+ import * as ERC721Ext from "thirdweb/extensions/erc721" ;
13
+ import * as ERC1155Ext from "thirdweb/extensions/erc1155" ;
14
+ import * as ERC4337Ext from "thirdweb/extensions/erc4337" ;
20
15
import { getAccounts } from "thirdweb/extensions/erc4337" ;
21
16
import { useReadContract } from "thirdweb/react" ;
22
-
23
- import type { ThirdwebContract } from "thirdweb" ;
24
17
import { Link , Text } from "tw-components" ;
18
+ import { useContractFunctionSelectors } from "../../../hooks/useContractFunctionSelectors" ;
25
19
26
20
interface ContractChecklistProps {
27
21
contract : ThirdwebContract ;
22
+ isErc721 : boolean ;
23
+ isErc1155 : boolean ;
24
+ isErc20 : boolean ;
28
25
}
29
26
30
27
type Step = {
@@ -35,37 +32,55 @@ type Step = {
35
32
36
33
export const ContractChecklist : React . FC < ContractChecklistProps > = ( {
37
34
contract,
35
+ isErc1155,
36
+ isErc20,
37
+ isErc721,
38
38
} ) => {
39
+ const functionSelectorQuery = useContractFunctionSelectors ( contract ) ;
39
40
const contractQuery = useContract ( contract . address ) ;
40
41
const nftHref = useTabHref ( "nfts" ) ;
41
42
const tokenHref = useTabHref ( "tokens" ) ;
42
43
const accountsHref = useTabHref ( "accounts" ) ;
43
44
const claimConditionsHref = useTabHref ( "claim-conditions" ) ;
44
45
45
- const erc721Claimed = useReadContract ( getTotalClaimedSupply , {
46
+ const erc721Claimed = useReadContract ( ERC721Ext . getTotalClaimedSupply , {
46
47
contract : contract ,
48
+ queryOptions : { enabled : isErc721 } ,
49
+ } ) ;
50
+ const erc20Supply = useReadContract ( ERC20Ext . totalSupply , {
51
+ contract,
52
+ queryOptions : { enabled : isErc20 } ,
47
53
} ) ;
48
- const erc20Supply = useReadContract ( totalSupply , { contract } ) ;
49
54
const accounts = useReadContract ( getAccounts , {
50
55
contract,
51
56
start : 0n ,
52
57
end : 1n ,
53
58
} ) ;
54
- const erc721NftQuery = useReadContract ( erc721GetNfts , {
55
- contract ,
56
- start : 0 ,
57
- count : 1 ,
58
- } ) ;
59
- const erc1155NftQuery = useReadContract ( erc1155Nfts , {
60
- contract ,
61
- start : 0 ,
62
- count : 1 ,
63
- } ) ;
64
- const sharedMetadataQuery = useReadContract ( sharedMetadata , {
59
+ const nftsQuery = useReadContract (
60
+ isErc721 ? ERC721Ext . getNFTs : ERC721Ext . getNFTs ,
61
+ {
62
+ contract ,
63
+ start : 0 ,
64
+ count : 1 ,
65
+ queryOptions : { enabled : isErc721 || isErc1155 } ,
66
+ } ,
67
+ ) ;
68
+
69
+ const sharedMetadataQuery = useReadContract ( ERC721Ext . sharedMetadata , {
65
70
contract,
71
+ queryOptions : { enabled : isErc721 } ,
66
72
} ) ;
67
73
68
- const claimConditions = useClaimConditions ( contractQuery . contract ) ;
74
+ const claimConditions = useReadContract (
75
+ isErc721 ? ERC721Ext . getClaimConditions : ERC1155Ext . getClaimConditions ,
76
+ {
77
+ contract,
78
+ tokenId : 0n ,
79
+ queryOptions : { enabled : isErc721 || isErc1155 } ,
80
+ } ,
81
+ ) ;
82
+
83
+ // need to replace!
69
84
const batchesToReveal = useBatchesToReveal ( contractQuery . contract ) ;
70
85
71
86
const steps : Step [ ] = [
@@ -79,15 +94,58 @@ export const ContractChecklist: React.FC<ContractChecklistProps> = ({
79
94
const isAdmin = useIsAdmin ( contract ) ;
80
95
const isMinter = useIsMinter ( contract ) ;
81
96
97
+ const isLazyMintable = useMemo ( ( ) => {
98
+ if ( isErc721 ) {
99
+ return ERC721Ext . isLazyMintSupported ( functionSelectorQuery . data ) ;
100
+ }
101
+ if ( isErc1155 ) {
102
+ return ERC1155Ext . isLazyMintSupported ( functionSelectorQuery . data ) ;
103
+ }
104
+ return false ;
105
+ } , [ functionSelectorQuery . data , isErc721 , isErc1155 ] ) ;
106
+
107
+ const hasERC721ClaimConditions = useMemo ( ( ) => {
108
+ return [
109
+ // reads
110
+ ERC721Ext . isGetClaimConditionByIdSupported ( functionSelectorQuery . data ) ,
111
+ ERC721Ext . isGetActiveClaimConditionIdSupported (
112
+ functionSelectorQuery . data ,
113
+ ) ,
114
+ ERC721Ext . isGetClaimConditionsSupported ( functionSelectorQuery . data ) ,
115
+ ERC721Ext . isGetActiveClaimConditionSupported ( functionSelectorQuery . data ) ,
116
+ // writes
117
+ ERC721Ext . isSetClaimConditionsSupported ( functionSelectorQuery . data ) ,
118
+ ERC721Ext . isResetClaimEligibilitySupported ( functionSelectorQuery . data ) ,
119
+ ] . every ( Boolean ) ;
120
+ } , [ functionSelectorQuery . data ] ) ;
121
+
122
+ const hasERC20ClaimConditions = useMemo ( ( ) => {
123
+ return [
124
+ // reads
125
+ ERC20Ext . isGetClaimConditionByIdSupported ( functionSelectorQuery . data ) ,
126
+ ERC20Ext . isGetActiveClaimConditionIdSupported ( functionSelectorQuery . data ) ,
127
+ ERC20Ext . isGetClaimConditionsSupported ( functionSelectorQuery . data ) ,
128
+ ERC20Ext . isGetActiveClaimConditionSupported ( functionSelectorQuery . data ) ,
129
+ // writes
130
+ ERC20Ext . isSetClaimConditionsSupported ( functionSelectorQuery . data ) ,
131
+ ERC20Ext . isResetClaimEligibilitySupported ( functionSelectorQuery . data ) ,
132
+ ] . every ( Boolean ) ;
133
+ } , [ functionSelectorQuery . data ] ) ;
134
+
135
+ const accountFactory = useMemo ( ( ) => {
136
+ return [
137
+ ERC4337Ext . isGetAllAccountsSupported ( functionSelectorQuery . data ) ,
138
+ ERC4337Ext . isGetAccountsSupported ( functionSelectorQuery . data ) ,
139
+ ERC4337Ext . isTotalAccountsSupported ( functionSelectorQuery . data ) ,
140
+ ERC4337Ext . isGetAccountsOfSignerSupported ( functionSelectorQuery . data ) ,
141
+ ERC4337Ext . isPredictAccountAddressSupported ( functionSelectorQuery . data ) ,
142
+ ] . every ( Boolean ) ;
143
+ } , [ functionSelectorQuery . data ] ) ;
144
+
82
145
if ( ! isAdmin ) {
83
146
return null ;
84
147
}
85
148
86
- const isLazyMintable = detectFeatures ( contractQuery . contract , [
87
- "ERC721LazyMintable" ,
88
- "ERC1155LazyMintableV2" ,
89
- "ERC1155LazyMintableV1" ,
90
- ] ) ;
91
149
if ( isLazyMintable && isMinter ) {
92
150
steps . push ( {
93
151
title : "First NFT uploaded" ,
@@ -101,15 +159,11 @@ export const ContractChecklist: React.FC<ContractChecklistProps> = ({
101
159
</ Text >
102
160
) ,
103
161
// can be either 721 or 1155
104
- completed :
105
- ( erc721NftQuery . data ?. length || erc1155NftQuery . data ?. length || 0 ) > 0 ,
162
+ completed : ( nftsQuery . data ?. length || 0 ) > 0 ,
106
163
} ) ;
107
164
}
108
165
109
- const isErc721SharedMetadadata = detectFeatures ( contractQuery . contract , [
110
- "ERC721SharedMetadata" ,
111
- ] ) ;
112
- if ( isErc721SharedMetadadata ) {
166
+ if ( ERC721Ext . isSharedMetadataSupported ( functionSelectorQuery . data ) ) {
113
167
steps . push ( {
114
168
title : "Set NFT Metadata" ,
115
169
children : (
@@ -125,20 +179,7 @@ export const ContractChecklist: React.FC<ContractChecklistProps> = ({
125
179
} ) ;
126
180
}
127
181
128
- const erc721hasClaimConditions = detectFeatures ( contractQuery . contract , [
129
- "ERC721ClaimPhasesV1" ,
130
- "ERC721ClaimPhasesV2" ,
131
- "ERC721ClaimConditionsV1" ,
132
- "ERC721ClaimConditionsV2" ,
133
- "ERC721ClaimCustom" ,
134
- ] ) ;
135
- const erc20HasClaimConditions = detectFeatures ( contractQuery . contract , [
136
- "ERC20ClaimPhasesV1" ,
137
- "ERC20ClaimPhasesV2" ,
138
- "ERC20ClaimConditionsV1" ,
139
- "ERC20ClaimConditionsV2" ,
140
- ] ) ;
141
- if ( erc721hasClaimConditions || erc20HasClaimConditions ) {
182
+ if ( hasERC721ClaimConditions || hasERC20ClaimConditions ) {
142
183
steps . push ( {
143
184
title : "Set Claim Conditions" ,
144
185
children : (
@@ -157,15 +198,15 @@ export const ContractChecklist: React.FC<ContractChecklistProps> = ({
157
198
( erc20Supply . data || 0n ) > 0n ,
158
199
} ) ;
159
200
}
160
- if ( erc721hasClaimConditions ) {
201
+ if ( hasERC721ClaimConditions ) {
161
202
steps . push ( {
162
203
title : "First NFT claimed" ,
163
204
children : < Text size = "label.sm" > No NFTs have been claimed so far.</ Text > ,
164
205
completed : ( erc721Claimed . data || 0n ) > 0n ,
165
206
} ) ;
166
207
}
167
208
168
- if ( erc20HasClaimConditions ) {
209
+ if ( hasERC20ClaimConditions ) {
169
210
steps . push ( {
170
211
title : "First token claimed" ,
171
212
children : (
@@ -175,10 +216,11 @@ export const ContractChecklist: React.FC<ContractChecklistProps> = ({
175
216
} ) ;
176
217
}
177
218
178
- const tokenIsMintable = detectFeatures ( contractQuery . contract , [
179
- "ERC20Mintable" ,
180
- ] ) ;
181
- if ( tokenIsMintable && isMinter ) {
219
+ if (
220
+ isErc20 &&
221
+ ERC20Ext . isMintToSupported ( functionSelectorQuery . data ) &&
222
+ isMinter
223
+ ) {
182
224
steps . push ( {
183
225
title : "First token minted" ,
184
226
children : (
@@ -194,10 +236,15 @@ export const ContractChecklist: React.FC<ContractChecklistProps> = ({
194
236
} ) ;
195
237
}
196
238
197
- const nftIsMintable = detectFeatures ( contractQuery . contract , [
198
- "ERC721Mintable" ,
199
- "ERC1155Mintable" ,
200
- ] ) ;
239
+ const nftIsMintable = ( ( ) => {
240
+ if ( isErc721 ) {
241
+ return ERC721Ext . isMintToSupported ( functionSelectorQuery . data ) ;
242
+ }
243
+ if ( isErc1155 ) {
244
+ return ERC1155Ext . isMintToSupported ( functionSelectorQuery . data ) ;
245
+ }
246
+ return false ;
247
+ } ) ( ) ;
201
248
if ( nftIsMintable && isMinter ) {
202
249
steps . push ( {
203
250
title : "First NFT minted" ,
@@ -211,15 +258,11 @@ export const ContractChecklist: React.FC<ContractChecklistProps> = ({
211
258
</ Text >
212
259
) ,
213
260
// can be either 721 or 1155
214
- completed :
215
- ( erc721NftQuery . data ?. length || erc1155NftQuery . data ?. length || 0 ) > 0 ,
261
+ completed : ( nftsQuery . data ?. length || 0 ) > 0 ,
216
262
} ) ;
217
263
}
218
264
219
- const isAccountFactory = detectFeatures ( contractQuery . contract , [
220
- "AccountFactory" ,
221
- ] ) ;
222
- if ( isAccountFactory ) {
265
+ if ( accountFactory ) {
223
266
steps . push ( {
224
267
title : "First account created" ,
225
268
children : (
0 commit comments