diff --git a/apps/web/package.json b/apps/web/package.json index 876b389..5f1959d 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -9,10 +9,14 @@ "lint": "next lint" }, "dependencies": { + "@rainbow-me/rainbowkit": "^0.5.1", "next": "12.2.5", "react": "18.2.0", "react-dom": "18.2.0", - "ui": "*" + "react-query": "^3.39.2", + "sass": "^1.54.9", + "ui": "*", + "wagmi": "^0.6.5" }, "devDependencies": { "@babel/core": "^7.0.0", diff --git a/apps/web/pages/index.tsx b/apps/web/pages/index.tsx deleted file mode 100644 index 6ec0887..0000000 --- a/apps/web/pages/index.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import { Button } from "ui"; - -export default function Web() { - return ( -
-

Web

-
- ); -} diff --git a/apps/web/public/fonts/Aeonik-Bold.ttf b/apps/web/public/fonts/Aeonik-Bold.ttf new file mode 100644 index 0000000..8839e25 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Bold.ttf differ diff --git a/apps/web/public/fonts/Aeonik-Bold.woff b/apps/web/public/fonts/Aeonik-Bold.woff new file mode 100644 index 0000000..32fa615 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Bold.woff differ diff --git a/apps/web/public/fonts/Aeonik-Bold.woff2 b/apps/web/public/fonts/Aeonik-Bold.woff2 new file mode 100644 index 0000000..af4923d Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Bold.woff2 differ diff --git a/apps/web/public/fonts/Aeonik-Light.ttf b/apps/web/public/fonts/Aeonik-Light.ttf new file mode 100644 index 0000000..6db4793 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Light.ttf differ diff --git a/apps/web/public/fonts/Aeonik-Light.woff b/apps/web/public/fonts/Aeonik-Light.woff new file mode 100644 index 0000000..d19fb28 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Light.woff differ diff --git a/apps/web/public/fonts/Aeonik-Light.woff2 b/apps/web/public/fonts/Aeonik-Light.woff2 new file mode 100644 index 0000000..bf5c917 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Light.woff2 differ diff --git a/apps/web/public/fonts/Aeonik-Medium.ttf b/apps/web/public/fonts/Aeonik-Medium.ttf new file mode 100644 index 0000000..5f25399 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Medium.ttf differ diff --git a/apps/web/public/fonts/Aeonik-Medium.woff b/apps/web/public/fonts/Aeonik-Medium.woff new file mode 100644 index 0000000..6ec3802 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Medium.woff differ diff --git a/apps/web/public/fonts/Aeonik-Medium.woff2 b/apps/web/public/fonts/Aeonik-Medium.woff2 new file mode 100644 index 0000000..31fc5d4 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Medium.woff2 differ diff --git a/apps/web/public/fonts/Aeonik-Regular.ttf b/apps/web/public/fonts/Aeonik-Regular.ttf new file mode 100644 index 0000000..eb507c7 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Regular.ttf differ diff --git a/apps/web/public/fonts/Aeonik-Regular.woff b/apps/web/public/fonts/Aeonik-Regular.woff new file mode 100644 index 0000000..590caff Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Regular.woff differ diff --git a/apps/web/public/fonts/Aeonik-Regular.woff2 b/apps/web/public/fonts/Aeonik-Regular.woff2 new file mode 100644 index 0000000..ae5e545 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Regular.woff2 differ diff --git a/apps/web/public/fonts/Aeonik-Thin.ttf b/apps/web/public/fonts/Aeonik-Thin.ttf new file mode 100644 index 0000000..7c328ab Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Thin.ttf differ diff --git a/apps/web/public/fonts/Aeonik-Thin.woff b/apps/web/public/fonts/Aeonik-Thin.woff new file mode 100644 index 0000000..0b763b7 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Thin.woff differ diff --git a/apps/web/public/fonts/Aeonik-Thin.woff2 b/apps/web/public/fonts/Aeonik-Thin.woff2 new file mode 100644 index 0000000..0352231 Binary files /dev/null and b/apps/web/public/fonts/Aeonik-Thin.woff2 differ diff --git a/apps/web/public/fonts/fonts.css b/apps/web/public/fonts/fonts.css new file mode 100644 index 0000000..12ef89d --- /dev/null +++ b/apps/web/public/fonts/fonts.css @@ -0,0 +1,49 @@ +@font-face { + font-family: 'Aeonik'; + src: url('/fonts/Aeonik-Bold.woff2') format('woff2'), + url('/fonts/Aeonik-Bold.woff') format('woff'), + url('/fonts/Aeonik-Bold.ttf') format('truetype'); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Aeonik'; + src: url('/fonts/Aeonik-Medium.woff2') format('woff2'), + url('/fonts/Aeonik-Medium.woff') format('woff'), + url('/fonts/Aeonik-Medium.ttf') format('truetype'); + font-weight: 500; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Aeonik'; + src: url('/fonts/Aeonik-Regular.woff2') format('woff2'), + url('/fonts/Aeonik-Regular.woff') format('woff'), + url('/fonts/Aeonik-Regular.ttf') format('truetype'); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Aeonik'; + src: url('/fonts/Aeonik-Light.woff2') format('woff2'), + url('/fonts/Aeonik-Light.woff') format('woff'), + url('/fonts/Aeonik-Light.ttf') format('truetype'); + font-weight: 300; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Aeonik'; + src: url('/fonts/Aeonik-Thin.woff2') format('woff2'), + url('/fonts/Aeonik-Thin.woff') format('woff'), + url('/fonts/Aeonik-Thin.ttf') format('truetype'); + font-weight: 100; + font-style: normal; + font-display: swap; +} diff --git a/apps/web/public/site.webmanifest b/apps/web/public/site.webmanifest new file mode 100644 index 0000000..dc4f186 --- /dev/null +++ b/apps/web/public/site.webmanifest @@ -0,0 +1,19 @@ +{ + "name": "MyApp", + "short_name": "MY_APP", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-384x384.png", + "sizes": "384x384", + "type": "image/png" + } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} diff --git a/apps/web/src/components/Header.tsx b/apps/web/src/components/Header.tsx new file mode 100644 index 0000000..6f50e42 --- /dev/null +++ b/apps/web/src/components/Header.tsx @@ -0,0 +1,23 @@ +import { ConnectButton } from "@rainbow-me/rainbowkit"; +import React from "react"; + +function Header() { + return ( + <> +
+
+ +
+
+ + ); +} + +export default Header; diff --git a/apps/web/src/components/Web3Provider.tsx b/apps/web/src/components/Web3Provider.tsx new file mode 100644 index 0000000..9c2c2ec --- /dev/null +++ b/apps/web/src/components/Web3Provider.tsx @@ -0,0 +1,42 @@ +import "@rainbow-me/rainbowkit/styles.css"; + +import { getDefaultWallets, RainbowKitProvider } from "@rainbow-me/rainbowkit"; +import { chain, configureChains, createClient, WagmiConfig } from "wagmi"; +import { alchemyProvider } from "wagmi/providers/alchemy"; +import { publicProvider } from "wagmi/providers/public"; + +const { chains, provider } = configureChains( + [chain.mainnet, chain.rinkeby], + [ + alchemyProvider({ apiKey: process.env.NEXT_PUBLIC_ALCHEMY }), + publicProvider(), + ] +); + +const { connectors } = getDefaultWallets({ + appName: "anotherblock-allowlist", + chains, +}); + +const wagmiClient = createClient({ + autoConnect: true, + connectors, + provider, +}); + +const Web3Provider = ({ children }) => { + return ( + + + {children} + + + ); +}; + +export default Web3Provider; diff --git a/apps/web/src/pages/_app.tsx b/apps/web/src/pages/_app.tsx new file mode 100644 index 0000000..fdec5b2 --- /dev/null +++ b/apps/web/src/pages/_app.tsx @@ -0,0 +1,24 @@ +import "../styles/globals.scss"; + +import type { AppProps } from "next/app"; +import React from "react"; +import { Hydrate } from "react-query"; +import { QueryClient, QueryClientProvider } from "react-query"; + +import WagmiProvider from "../components/Web3Provider"; + +const queryClient = new QueryClient({}); + +function MyApp({ Component, pageProps }: AppProps) { + return ( + + + + + + + + ); +} + +export default MyApp; diff --git a/apps/web/src/pages/index.tsx b/apps/web/src/pages/index.tsx new file mode 100644 index 0000000..0618473 --- /dev/null +++ b/apps/web/src/pages/index.tsx @@ -0,0 +1,37 @@ +import { Button } from "ui"; +import Header from "../components/Header"; +import { + useAccount, + useContractRead, + useContractWrite, + useNetwork, +} from "wagmi"; + +export default function Web() { + const { address, isDisconnected, isConnecting } = useAccount(); + + return ( + <> +
+ {isDisconnected && ( +
+

please connect your wallet

+
+ )} + + {!isDisconnected && ( + <> +

My App Name

+