examples's People
Forkers
williamclay8 llcyphers priyanshlodha gillogly nicklin1226 a3259454 cleverprogrammers sudupipei lilwinstyvert growthladyvee acethemad sxop12 ilya808 denzipp manana1234 mgoldstein18 ross1219 oliverjumpertz prim3us3r tawseefnabi jackwatucsf parkranger002 breakpoint341 haohaor2 vic3164 luko12 jesse-21 ritik-prog beathivenft nftsandbox jam516 thomascailhol gnomegnoir dambu07 rattrayd11 friendbear fegig headies710 haschich akegaviar warengonzaga thebridgedao arielvdl consciouscrypto claydcruze nibu-dev jdsinc hawhigh metawarfareofficial lilkangoo cryptopunk40 defispector davoweb3 anil1000000 hydrogenbond007 breakpoint-341 housseinsaleh dannyclifford vincent-loi duncan4123 thiagofive rock8-it berkinsavciozen sirgawain0x devtraderx ojiubasi-motif keiyoshi0831 saison3 littledevho telatre abhishekdodda mlb302 paloma-p mastermindsl zeddkhan03 guy-lederer avdheshcharjan poodoge atharvadeosthale thesidsridhar justshabir innovation-labs-technical-hub jacqlinegeng thirdweb-dev acemadeit red-verse renchris seunghyonpark jamespatrickcrypto madhvanbajaj ringolam gutshotexist bobresik ruvini1996 nacen11 climaxme rupam124 amirv5a halkenbox smartaiprojectexamples's Issues
getDefaultProvider error
Here is the error I am receiving, I have tried completely copying your codebase to implement gasless transactions but I am getting this error.
Unhandled Runtime Error
Error: unsupported getDefaultProvider network (operation="getDefaultProvider", network="polygon", code=NETWORK_ERROR, version=providers/5.6.6)
also in _app.js the desiredChainId = {ChainId.Polygon}
I also tried implementing with Mumbai but nothing seemed to work.
Can you please explain what might be the problem?
Thirdweb provider to be upgraded
Thirdweb API needs the API keys to work from 1st August onwards.
Therefore we need to upgrade the sdk version and add the clientID to it.
Can't reexport the named export 'useSyncExternalStore' from non EcmaScript module (only default export is available)
layouts/index.tsx
import { IRouteComponentProps } from 'umi'
import { ThirdwebProvider } from "@thirdweb-dev/react";
export default function Layout({ children, location, route, history, match }: IRouteComponentProps) {
const desiredChainId = 80001;
return(
<ThirdwebProvider desiredChainId={desiredChainId}>
{children}
</ThirdwebProvider>
)
}
packages.json
{
"name": "react-dapp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "umi dev",
"build": "umi build",
"postinstall": "umi generate tmp",
"prettier": "prettier --write '**/*.{js,jsx,tsx,ts,less,md,json}'",
"test": "umi-test",
"test:coverage": "umi-test --coverage"
},
"gitHooks": {
"pre-commit": "lint-staged"
},
"lint-staged": {
"*.{js,jsx,less,md,json}": [
"prettier --write"
],
"*.ts?(x)": [
"prettier --parser=typescript --write"
]
},
"dependencies": {
"@ant-design/pro-layout": "^6.38.2",
"@thirdweb-dev/react": "^2.2.7",
"@thirdweb-dev/sdk": "^2.2.9",
"ethers": "^5.6.6",
"react": "^18.1.0",
"react-dom": "^18.1.0",
"umi": "^3.5.23"
},
"devDependencies": {
"@types/react": "^18.0.9",
"@types/react-dom": "^18.0.4",
"@umijs/preset-react": "1.x",
"@umijs/test": "^3.5.23",
"lint-staged": "^12.4.1",
"prettier": "^2.6.2",
"react-dev-inspector": "^1.8.0",
"typescript": "^4.6.4",
"yorkie": "^2.0.0"
},
"engines": {
"node": ">=12.0.0"
},
"create-umi": {
"ignoreScript": [
"docker*",
"functions*",
"site",
"generateMock"
],
"ignoreDependencies": [
"netlify*",
"serverless"
],
"ignore": [
".dockerignore",
".git",
".github",
".gitpod.yml",
"CODE_OF_CONDUCT.md",
"Dockerfile",
"Dockerfile.*",
"lambda",
"LICENSE",
"netlify.toml",
"README.*.md",
"azure-pipelines.yml",
"docker",
"CNAME",
"create-umi"
]
}
}
Examples TODO
Today:
- Splits
- Using a split contract https://thirdweb.com/portal/learn/code-examples#deploying-a-splits-module
- Changing the royalty recipient address for an existing module https://thirdweb.com/portal/learn/code-examples#changing-the-royalty-recipient-address-of-an-existing-module
- Drops
- NFT Collection
- Minting an NFT https://thirdweb.com/portal/learn/code-examples#mint-an-nft
- Confirm presence of NFT
Batch minting:
- Batch mint (bundle, pack, currency, drop)
Later:
- Market
- List an NFT on the marketplace
- Buy an NFT on the marketplace
- Use client wallet signer instance of SDK (@eabdelmoneim do you mean using a connected signer like metamask when using the sdk instead of a private key?)
- Currency
- Create 1k custom tokens
- Transfer token to another wallet
Issue: Account Switch Listener and useSiweAuth Hook Causing Broken State
Client Code:
<ConnectButton
client={client}
chain={chain}
chains={[chain]}
auth={{
isLoggedIn: async (address) => {
const loggedIn = await isLoggedIn(address);
if (!loggedIn) {
await logout();
}
return loggedIn;
},
doLogin: async (params) => {
await login(params);
},
getLoginPayload: async ({ address }) => generatePayload({ address }),
doLogout: async () => {
await logout();
},
}}
/>
Backend Code:
const privateKey = env.THIRDWEB_ADMIN_PRIVATE_KEY;
if (!privateKey) {
throw new Error('Missing THIRDWEB_ADMIN_PRIVATE_KEY in .env file.');
}
const thirdwebAuth = createAuth({
domain: env.NEXT_PUBLIC_APP_URL || '',
adminAccount: privateKeyToAccount({ client, privateKey }),
});
export const { generatePayload } = thirdwebAuth;
export async function login(payload: VerifyLoginPayloadParams) {
const verifiedPayload = await thirdwebAuth.verifyPayload(payload);
if (verifiedPayload.valid) {
const jwt = await thirdwebAuth.generateJWT({
payload: verifiedPayload.payload,
});
cookies().set('jwt', jwt);
}
}
export async function isLoggedIn(address: string) {
const jwt = cookies().get('jwt');
if (!jwt?.value) {
return false;
}
const authResult = await thirdwebAuth.verifyJWT({ jwt: jwt.value });
if (!authResult.valid || authResult.parsedJWT.sub !== address) {
return false;
}
return true;
}
export async function logout() {
cookies().delete('jwt');
}
Problem Description:
When connecting using a wallet like MetaMask and switching between two accounts ( using the Metamask account switcher not the modal provided by ThirdWeb ), the application ends up in a broken state. Specifically, the ConnectButton
indicates that the user is connected when, in fact, they actually need to sign in again to obtain a valid JWT. This inconsistency is caused by the account switch not properly triggering the authentication state to update, resulting in the UI reflecting an incorrect state.
Expected Behavior:
Upon switching accounts from a wallet extension, the ConnectButton
should correctly prompt the user to sign in again to obtain a new JWT, ensuring the authentication state is accurately maintained.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.