Skip to content

Commit 424e6b8

Browse files
authored
Stylus modules (#8383)
1 parent 763d3de commit 424e6b8

File tree

12 files changed

+636
-105
lines changed

12 files changed

+636
-105
lines changed

.changeset/sharp-files-cry.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"thirdweb": patch
3+
---
4+
5+
deploy and install stylus modules

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/ModuleForm.tsx

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -225,6 +225,10 @@ export const InstallModuleForm = (props: InstallModuleFormProps) => {
225225
moduleInfo: {
226226
bytecodeUri: selectedModule.metadata.bytecodeUri,
227227
},
228+
isStylus:
229+
(selectedModule.metadata.compilers?.stylus &&
230+
selectedModule.metadata.compilers?.stylus?.length > 0) ||
231+
false,
228232
});
229233
},
230234
queryKey: [
@@ -432,6 +436,7 @@ async function isModuleCompatible(options: {
432436
moduleInfo: {
433437
bytecodeUri: string;
434438
};
439+
isStylus: boolean;
435440
client: ThirdwebClient;
436441
}) {
437442
// 1. get module's bytecode
@@ -444,15 +449,17 @@ async function isModuleCompatible(options: {
444449

445450
// 2. check compatibility with core and installed modules
446451
try {
447-
const isCompatible = await checkModulesCompatibility({
448-
chain: options.contractInfo.chain,
449-
client: options.client,
450-
coreBytecode: options.contractInfo.bytecode,
451-
moduleBytecodes: [
452-
moduleBytecode,
453-
...options.contractInfo.installedModuleBytecodes,
454-
],
455-
});
452+
const isCompatible =
453+
options.isStylus ||
454+
(await checkModulesCompatibility({
455+
chain: options.contractInfo.chain,
456+
client: options.client,
457+
coreBytecode: options.contractInfo.bytecode,
458+
moduleBytecodes: [
459+
moduleBytecode,
460+
...options.contractInfo.installedModuleBytecodes,
461+
],
462+
}));
456463

457464
return isCompatible;
458465
} catch (e) {

apps/dashboard/src/app/(app)/(dashboard)/explore/data.ts

Lines changed: 53 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -183,13 +183,64 @@ const STYLUS = {
183183
],
184184
description:
185185
"Airdrop your NFTs or tokens to a large number of recipients. Built with Arbitrum Stylus.",
186-
displayName: "Arbitrum Stylus Contracts",
186+
displayName: "Airdrop - Arbitrum Stylus",
187187
id: "stylus",
188188
name: "Stylus",
189189
showInExplore: true,
190190
isBeta: true,
191191
} satisfies ExploreCategory;
192192

193+
const MODULAR_CONTRACTS_STYLUS = {
194+
contracts: [
195+
// erc721 token
196+
[
197+
"thirdweb.eth/ERC721CoreInitializable",
198+
[
199+
"0x6453a486d52e0eb6e79ec4491038e2522a926936/StylusMintableERC721",
200+
"deployer.thirdweb.eth/BatchMetadataERC721",
201+
"0x6453a486d52e0eb6e79ec4491038e2522a926936/StylusTransferableERC721",
202+
],
203+
{
204+
description: "ERC721 NFTs that only owners can mint.",
205+
title: "Modular NFT Collection",
206+
},
207+
],
208+
// erc1155 token
209+
[
210+
"thirdweb.eth/ERC1155CoreInitializable",
211+
[
212+
"0x6453a486d52e0eb6e79ec4491038e2522a926936/StylusMintableERC1155",
213+
"deployer.thirdweb.eth/BatchMetadataERC1155",
214+
"0x6453a486d52e0eb6e79ec4491038e2522a926936/StylusTransferableERC1155",
215+
"deployer.thirdweb.eth/SequentialTokenIdERC1155",
216+
],
217+
{
218+
description: "ERC1155 NFTs that only owners can mint.",
219+
title: "Modular Edition",
220+
},
221+
],
222+
// erc20 token
223+
[
224+
"thirdweb.eth/ERC20CoreInitializable",
225+
[
226+
"0x6453a486d52e0eb6e79ec4491038e2522a926936/StylusMintableERC20",
227+
"0x6453a486d52e0eb6e79ec4491038e2522a926936/StylusTransferableERC20",
228+
],
229+
{
230+
description: "ERC20 Tokens that only owners can mint.",
231+
title: "Modular Token",
232+
},
233+
],
234+
],
235+
description:
236+
"Collection of highly customizable and upgradeable smart contracts built with the modular contracts framework.",
237+
displayName: "Modular Contracts - Arbitrum Stylus",
238+
id: "modular-contracts",
239+
name: "modular",
240+
showInExplore: true,
241+
isBeta: true,
242+
} satisfies ExploreCategory;
243+
193244
const CATEGORIES: Record<string, ExploreCategory> = {
194245
[POPULAR.id]: POPULAR,
195246
[NFTS.id]: NFTS,
@@ -203,6 +254,7 @@ const CATEGORIES: Record<string, ExploreCategory> = {
203254
[COMMERCE.id]: COMMERCE,
204255
[STAKING.id]: STAKING,
205256
[GOVERNANCE.id]: GOVERNANCE,
257+
[MODULAR_CONTRACTS_STYLUS.id]: MODULAR_CONTRACTS_STYLUS,
206258
};
207259

208260
export function getCategory(id: string) {
Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
import { Step, Steps, createMetadata } from "@doc";
2+
3+
export const metadata = createMetadata({
4+
title: "Stylus Minting Modules | thirdweb Documentation",
5+
description:
6+
"Customizable rust modules written for thirdweb's modular contracts",
7+
image: {
8+
title: "Stylus Minting Modules",
9+
icon: "contracts",
10+
},
11+
});
12+
13+
# Stylus Minting Modules
14+
15+
You can now install rust based modules into a solidity based [modular contract](https://github.com/thirdweb-dev/modular-contracts/blob/dev/design-document.md).
16+
17+
This plug-n-play model also allows users to write their own custom minting logic in rust, taking advantage of Stylus' interoperability and gas savings. These modules work with existing router contracts and modules written in solidity.
18+
19+
## Deploy through dashboard
20+
21+
Deploying a Modular Contract and installing modules is easy through the thirdweb dashboard and ideal when you don't want to modify any code on the contract.
22+
23+
<Steps>
24+
<Step title="Select Modular Contract for Stylus">
25+
26+
Navigate to the Modular Contracts section on Explore and select any token contract for your project.
27+
</Step>
28+
29+
<Step title="Deploy Contract">
30+
Select Arbitrum Sepolia or any other Stylus-supported network, then select Deploy. Once you have deployed one of these contracts, the modules come pre-installed, both solidity and rust ones.
31+
</Step>
32+
33+
<Step title="Edit Modules">
34+
If you wish to install a custom module, navigate to modules tab on your contract page. Enter the publisher address and select module from the dropdown, and click install.
35+
36+
You can uninstall a module from the same page.
37+
38+
Here's a list of prebuilt Rust / Stylus specific modules provided by thirdweb:
39+
- [Mintable ERC20](https://thirdweb.com/0x6453a486d52e0EB6E79Ec4491038E2522a926936/StylusMintableERC20)
40+
- [Transferable ERC20](https://thirdweb.com/0x6453a486d52e0EB6E79Ec4491038E2522a926936/StylusTransferableERC20)
41+
- [Mintable ERC721](https://thirdweb.com/0x6453a486d52e0EB6E79Ec4491038E2522a926936/StylusMintableERC721)
42+
- [Transferable ERC721](https://thirdweb.com/0x6453a486d52e0EB6E79Ec4491038E2522a926936/StylusTransferableERC721)
43+
- [Mintable ERC1155](https://thirdweb.com/0x6453a486d52e0EB6E79Ec4491038E2522a926936/StylusMintableERC1155)
44+
- [Transferable ERC1155](https://thirdweb.com/0x6453a486d52e0EB6E79Ec4491038E2522a926936/StylusTransferableERC1155)
45+
46+
You can customize these modules via thirdweb CLI as described below.
47+
48+
</Step>
49+
50+
</Steps>
51+
52+
## Build with CLI
53+
54+
If you want to modify the contract code or publish a custom module, you can use the thirdweb CLI.
55+
56+
<Steps>
57+
<Step title="Create a new Stylus module">
58+
59+
In your CLI, run the following command to create a new directory with an template module. Select the module template from the list shown.
60+
61+
```bash
62+
npx thirdweb create-stylus
63+
```
64+
</Step>
65+
66+
<Step title="Modify logic">
67+
In the `src/lib.rs` file you can modify the contract logic such as adding fees, gating logic, analytics events, and more.
68+
</Step>
69+
70+
<Step title="Build & Test">
71+
72+
To build your project, run the following command:
73+
74+
```bash
75+
cargo stylus build
76+
```
77+
78+
</Step>
79+
80+
<Step title="Deploy or Publish Your Module">
81+
You can publish your module and install it to your modular contract. Publishing stores your module metadata in thirdweb’s on-chain registry so anyone (including you) can use that exact version later with a few clicks.
82+
83+
To publish your module, ensure you have your thirdweb secret key from your created project, then run the following command:
84+
85+
```bash
86+
npx thirdweb publish-stylus -k YOUR_TW_SECRET_KEY
87+
```
88+
89+
Once published, the module is now available to install via thirdweb dashboard from the modules tab of your contract.
90+
</Step>
91+
92+
</Steps>
93+
94+
## Interacting with the Contract
95+
96+
Using the thirdweb SDKs, you can interact with your Stylus Modular contracts / modules to mint tokens, transfer ownership, and more.
97+
98+
The following describes how to interact with a ERC721 modular contract using thirdweb SDK. (Swap for ERC20 or ERC1155 variants as needed.)
99+
100+
### Upload metadata
101+
102+
```ts
103+
import { BatchMetadataERC721 } from "thirdweb/modules";
104+
105+
const transaction = BatchMetadataERC721.uploadMetadata({
106+
contract,
107+
metadatas: [
108+
{ name: "My NFT", description: "This is my NFT" },
109+
],
110+
});
111+
112+
await sendTransaction({
113+
transaction,
114+
account,
115+
});
116+
```
117+
118+
### Mint with role
119+
120+
```typescript
121+
import { MintableERC721 } from "thirdweb/modules";
122+
123+
const transaction = MintableERC721.mintWithRole({
124+
contract,
125+
to: "0x...", // Address to mint tokens to
126+
nfts: [
127+
{
128+
name: "My NFT",
129+
description: "This is my NFT",
130+
image: "ipfs://...",
131+
},
132+
],
133+
});
134+
135+
// Send the transaction
136+
await sendTransaction({ transaction, account });
137+
```
138+
139+
### Set transfer rules
140+
141+
```ts
142+
import { sendTransaction } from "thirdweb";
143+
import { TransferableERC20 } from "thirdweb/modules";
144+
145+
const transaction = TransferableERC20.setTransferable({
146+
contract,
147+
enableTransfer: ...,
148+
overrides: {
149+
...
150+
}
151+
});
152+
153+
// Send the transaction
154+
await sendTransaction({ transaction, account });
155+
```
156+
157+
### Resources
158+
159+
- [Modular Contracts Design Doc](https://github.com/thirdweb-dev/modular-contracts/blob/dev/design-document.md)
160+

0 commit comments

Comments
 (0)