import '../styles/globals.css'
import { ThirdwebWeb3Provider } from '@3rdweb/hooks'
import React from 'react'
import { render } from 'react-dom'
import { BrowserRouter as Router, Routes, Route, Link, Switch } from 'react-router-dom'
import Announcement from "./Announcement";
import Assets from './Assets'
import Trade from './Trade'
import InviteFriends from './InviteFriends'
import ErrorPage from './ErrorPage'


const supportedChainIds = [4]
const connectors = {
  injected: {},
}

function App() {
  return (
    <Router>
      <Switch>
        <nav>
          <Link to="/Announcement"> Announcement </Link>
          <Link to="/"> Assets </Link>
          <Link to="/Trade"> Trade </Link>
          <Link to="/InviteFriends"> InviteFriends </Link>
        </nav>
        <Routes>
          <Route path="/Announcement" element={<Announcement />} />
          <Route path="/" element={<Assets />} />
          <Route path="/Trade" element={<Trade />} />
          <Route path="/InviteFriends" element={<InviteFriends />} />
          <Route path="*" element={<ErrorPage />} />

        </Routes>
      </Switch>
    </Router>
  )
}

function MyApp({ Component, pageProps }) {
  return (

    <ThirdwebWeb3Provider
      supportedChainIds={supportedChainIds}
      connectors={connectors}
    >
      <Component {...pageProps} />

    </ThirdwebWeb3Provider>
  )
}



export default MyApp


아니면 아에 설계를 잘못했나? ㅠ

꿀팁 오네가이시마스