Have they developed a polygon amoy chain specifically for thirdweb?

I'm currently attempting to utilize the polygon amoy testnet on a local server. Unfortunately, I haven't been able to determine if there's a method for accessing this chain via thirdweb.

My code is implemented in typescript.

Although I attempted using 

const activeChain = "amoy";
and 
const activeChain = "polygonamoy";
, an error occurred:

Error: Invalid chain: "amoy". It is not one of supportedChains
.

The tutorial I'm following, found at this link, mentions the mumbai testnet using simply 

const activeChain = "mumbai";
. However, that option is currently unavailable.

Is there any alternative approach or a solution to specifically reference the polygon amoy chain?

typescripterc20thirdweb

Answer №1

Yesterday, I encountered the same issue and was able to solve it. Make sure to include the following import statement: import { PolygonAmoyTestnet } from "@thirdweb-dev/chains";

Delete the active chain variable and then assign the variable to the active chain section in the return statement:
return ( <ThirdwebProvider clientId={process.env.NEXT_PUBLIC_TEMPLATE_CLIENT_ID} activeChain={ PolygonAmoyTestnet }

This solution should help you rectify your code!

Answer №2

// Customizing pages>_app.tsx

import type { AppProps } from "next/app";
import { ThirdwebProvider } from "@thirdweb-dev/react";
import { ChakraProvider } from "@chakra-ui/react";
import "../styles/globals.css";
import { Navbar } from "../components/Navbar";
import { PolygonAmoyTestnet } from "@thirdweb-dev/chains";

function MyApp({ Component, pageProps }: AppProps) {
  return ( 
      <ThirdwebProvider 
          activeChain={PolygonAmoyTestnet}
          clientId={process.env.NEXT_PUBLIC_TEMPLATE_CLIENT_ID}>
          <ChakraProvider>
              <Navbar />
              <Component {...pageProps} />
          </ChakraProvider>
      </ThirdwebProvider>
  );
}

export default MyApp;

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Unusual behavior of Typescript with Storybook's addon-docs

I'm trying to integrate storybook addon-docs into my TypeScript React project. Everything seems to be almost working, but I've noticed that the file name is affecting how the props type table gets rendered. Here is my file structure: src - Butto ...

reactjstypescriptcreate-react-appstorybook

Having trouble with clearInterval in my Angular code

After all files have finished running, the array this.currentlyRunning is emptied and its length becomes zero. if(numberOfFiles === 0) { clearInterval(this.repeat); } I conducted a test using console.log and found that even though ...

javascriptangulartypescript

Get an angular xml file by utilizing the response from a C# web API download

I am trying to download an XML file from a database using a Web API in C#, which returns the file as byte[]. How can I properly read these bytes and convert them into an XML file on the client side using Angular? Despite attempts with blobs and other metho ...

c#angulartypescript

Steps for generating a unit test for code that invokes scrollIntoView on an HTML element

I'm currently working on an Angular component where I have a method that involves scrolling through a list of elements known as "cards" based on certain criteria. Despite my efforts to write unit tests for this method using the Jasmine framework, I&ap ...

angulartypescriptunit-testingjasmine

Tips for retrieving an item from a (dropdown) menu in Angular

I am facing an issue with selecting objects from a dropdown list. The array called "devices" stores a list of Bluetooth devices. Here is the HTML code: <select (change)="selectDevice($event.target.data)"> <option>Select ...

angulartypescriptangular8

Automatically adjust padding in nested lists with ReactJS and MaterialUI v1

How can I automatically add padding to nested lists that may vary in depth due to recursion? Currently, my output looks like this: https://i.stack.imgur.com/6anY9.png: However, I would like it to look like this instead: https://i.stack.imgur.com/dgSPB. ...

cssreactjstypescriptmaterial-uinested-lists

Select a single radio button containing values that can change dynamically

<input type="radio" on-click="checkDefaultLanguage" id="checkbox" > [[names(name)]] This custom radio input field contains dynamic values and I am attempting to create a functionality where only one radio button can be selected at a time while dese ...

javascripttypescript

Guide to importing a markdown document into Next.js

Trying to showcase pure markdown on my NextJS Typescript page has been a challenge. I attempted the following: import React, { useState, useEffect } from "react"; import markdown from "./assets/1.md"; const Post1 = () => { return ...

reactjstypescriptnext.js

Are indexed properties constraints in Typescript only working with raw types and not with object literals?

After defining this interface: interface Thing1 { [key: string]: string; x: number; } During compilation in Typescript, an error is thrown stating "TS2411: Property 'x' of type number is not assignable to string index type 'string& ...

typescript

The Angular component seems to be failing to refresh the user interface despite changes in value

Recently, I created a simple component that utilizes a variable to manage its state. The goal is to have the UI display different content based on changes in this variable. To test this functionality, I implemented the component and used a wait function to ...

angulartypescript

Expanding the StringConstructor in TypeScript results in a function that is not defined

I'm currently trying to enhance the String class in TypeScript 2.5 by adding a static method, which will be compiled to ES5. Here's what I have in StringExtensions.d.ts: declare interface StringConstructor { isNullOrEmpty(value: string | nu ...

javascriptgoogle-chrometypescript

Utilize nested object models as parameters in TypeScript requests

Trying to pass request parameters using model structure in typescript. It works fine for non-nested objects, but encountering issues with nested arrays as shown below: export class exampleModel{ products: [ { name: string, ...

angulartypescriptapimodel

Revising Global Variables and States in React

Recently delving into React and tackling a project. I find myself needing to manage a counter as a global variable and modify its value within a component. I initialized this counter using the useState hook as const [currentMaxRow, setRow] = useState(3) ...

javascriptreactjstypescript

Tips for incorporating ACE Editor syntax highlighting rules into an Angular application

I am attempting to create custom highlighter rules by referencing examples from here and here. import { Component, OnInit, ViewChild, ElementRef } from '@angular/core'; import * as ace from 'ace-builds'; import 'ace-builds/src- ...

angulartypescriptace-editor

Is it possible to use jQuery to set a value for a form control within an Angular component?

I'm currently working on an Angular 5 UI project. In one of my component templates, I have a text area where I'm attempting to set a value from the component.ts file using jQuery. However, for some reason, it's not working. Any suggestions o ...

javascriptjqueryangulartypescript

Explore the world of watching and references using typescript and vue-property-decorator

I'm inquiring about watches and refs. The situation is that I have a vswitch with a v-model where the setter action takes quite a bit of time to complete (involving writes to the store and numerous updates on the DOM). An issue arises when Vue execut ...

typescriptvue.jsvuetify.jswatch

Is there a way to reactivate Cognito tokens that are originating from a different tab?

I have a unique feature that opens a new tab on a different domain, and I want to ensure the cognito session remains active. To achieve this, I've implemented a hidden iframe with the same origin to transfer local storage data using the following code ...

typescriptiframeamazon-cognitoaws-amplify

Personalized angular subscription malfunction

Recently, as I dive into learning Angular 6, a question has arisen regarding the subscribe method and error handling. A typical use of the subscribe function on an observable typically appears like this: this.myService.myFunction(this.myArg).subscribe( ...

angulartypescripthttp

Beating the API call system: Utilizing the RxJS skip operator

Currently, I am attempting to utilize the skip operator in RxJS to skip the initial API call. However, despite my efforts, I have not been successful in achieving this. const source = of('a', 'b', 'c', 'd', 'e&a ...

javascriptangulartypescriptrxjsrxjs6

Creating an enum from an associative array for restructuring conditions

Hey everyone, I have a situation where my current condition is working fine, but now I need to convert it into an enum. Unfortunately, the enum doesn't seem to work with my existing condition as mentioned by the team lead. Currently, my condition loo ...

javascriptreactjstypescript