Skip to content

Commit 26ab90a

Browse files
authored
Merge pull request #1 from doublejumptokyo/update-to-sample-web3modal@5.0.2
update to sample-web3modal@5.0.2
2 parents 92359ed + 4c98e02 commit 26ab90a

22 files changed

+4644
-5244
lines changed

.gitignore

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ yarn-debug.log*
2525
yarn-error.log*
2626

2727
# local env files
28-
.env*.local
28+
.env
2929

3030
# vercel
3131
.vercel

README.md

Lines changed: 15 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,23 @@
1-
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
1+
# Oasys Passport Sample WebWallet
22

3-
## Getting Started
3+
## Features
44

5-
First, run the development server:
5+
- Web3Modal v2 https://w3m-v2-docs.walletconnect.com/2.0/
6+
- wagmi v2 https://wagmi.sh/
7+
- viem v2 https://viem.sh/
8+
- Next.js v14 https://nextjs.org/
69

7-
```bash
8-
npm run dev
9-
# or
10-
yarn dev
11-
# or
12-
pnpm dev
13-
# or
14-
bun dev
15-
```
16-
17-
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
18-
19-
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
20-
21-
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
10+
## Requirements
2211

23-
## Learn More
12+
- Node.js
2413

25-
To learn more about Next.js, take a look at the following resources:
14+
Install by yourself.
2615

27-
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
28-
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
16+
## Run the development server
2917

30-
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
31-
32-
## Deploy on Vercel
33-
34-
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
18+
```bash
19+
npm i
20+
npm run dev
21+
```
3522

36-
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
23+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

package-lock.json

Lines changed: 4601 additions & 4462 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,8 @@
1616
"buffer": "^6.0.3",
1717
"encoding": "^0.1.13",
1818
"ethers": "^6.13.0",
19-
"instant-wallet": "https://github.com/doublejumptokyo/oaw-instant-wallet.git",
2019
"lokijs": "^1.5.12",
2120
"next": "^14.1.3",
22-
"next-auth": "^4.24.7",
2321
"next-pwa": "^5.6.0",
2422
"pino-pretty": "^11.0.0",
2523
"react": "^18.3.1",

src/app/api/auth/[...nextauth]/route.ts

Lines changed: 0 additions & 97 deletions
This file was deleted.

src/app/layout.tsx

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,6 @@ import Head from 'next/head';
33

44
import type { Metadata } from 'next';
55

6-
import { Providers } from '@/app/providers';
7-
86
export const metadata: Metadata = {
97
title: 'OasysWallet WebApp',
108
description: 'A Web Wallet supporting Oasys Passport',
@@ -30,9 +28,7 @@ export default function RootLayout({
3028
<meta name="mobile-web-app-capable" content="yes" />
3129
</Head>
3230
<body>
33-
<main>
34-
<Providers>{children}</Providers>
35-
</main>
31+
<main>{children}</main>
3632
</body>
3733
</html>
3834
);

src/app/page.tsx

Lines changed: 17 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,30 @@
11
'use server';
22

3+
import dynamic from 'next/dynamic';
4+
35
import { SupportedSwitcher } from '@/components/SupportedSwitcher';
46
import { SupportedMethods } from '@/components/SupportedMethods';
5-
import { InstantWallet } from '@/components/instantWallet';
67
import { UnsupportedMethods } from '@/components/UnsupportedMethods';
78

89
import { Connect } from '../components/Connect';
910

11+
const Providers = dynamic(() => import('./providers'), { ssr: false });
12+
1013
export default async function Page() {
1114
return (
12-
<div className="p-5 flex flex-col justify-center items-center">
13-
<h1 className="text-xl font-extrabold text-center">
14-
Oasys Passport Sample Page
15-
</h1>
16-
<div className="flex flex-col justify-center items-center">
17-
<Connect />
18-
<SupportedSwitcher>
19-
<SupportedMethods />
20-
<UnsupportedMethods />
21-
<InstantWallet />
22-
</SupportedSwitcher>
15+
<Providers>
16+
<div className="p-5 flex flex-col justify-center items-center">
17+
<h1 className="text-xl font-extrabold text-center">
18+
Oasys Passport Sample Page
19+
</h1>
20+
<div className="flex flex-col justify-center items-center">
21+
<Connect />
22+
<SupportedSwitcher>
23+
<SupportedMethods />
24+
<UnsupportedMethods />
25+
</SupportedSwitcher>
26+
</div>
2327
</div>
24-
</div>
28+
</Providers>
2529
);
2630
}

src/app/providers.tsx

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,18 @@
11
'use client';
22

3-
import * as React from 'react';
4-
53
import { WagmiProvider } from 'wagmi';
64
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
7-
import { SessionProvider } from 'next-auth/react';
5+
// import { SessionProvider } from 'next-auth/react';
86

97
import { config } from '@/config/wagmi';
10-
import WalletProvider from '@/context/WalletProvider';
118

129
const queryClient = new QueryClient();
1310

14-
export function Providers({ children }: { children: React.ReactNode }) {
15-
const [mounted, setMounted] = React.useState(false);
16-
React.useEffect(() => {
17-
setMounted(true);
18-
}, []);
19-
11+
export default function Providers({ children }: { children: React.ReactNode }) {
2012
return (
2113
// <SessionProvider>
2214
<WagmiProvider config={config}>
23-
<QueryClientProvider client={queryClient}>
24-
<WalletProvider>{mounted && children}</WalletProvider>
25-
</QueryClientProvider>
15+
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
2616
</WagmiProvider>
2717
// </SessionProvider>
2818
);

src/components/Connect.tsx

Lines changed: 4 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -3,78 +3,32 @@
33
import { BaseError } from 'viem';
44
import { useAccount, useConnect, useDisconnect } from 'wagmi';
55
import { useWeb3Modal } from '@web3modal/wagmi/react';
6-
import { useSession } from 'next-auth/react';
7-
8-
import { WalletType, useWalletContext } from '@/context/WalletProvider';
96

107
export function Connect() {
118
const { connector, isConnected } = useAccount();
129
const { error } = useConnect();
1310
const { disconnect } = useDisconnect();
14-
const {
15-
currentWalletType,
16-
instantWallet,
17-
loginInstantWallet,
18-
disconnectInstantWallet,
19-
wipeInstantWallet,
20-
} = useWalletContext();
2111
const { open } = useWeb3Modal();
22-
// const { data: session } = useSession();
2312

2413
return (
2514
<div>
2615
<div className="flex flex-col">
27-
{isConnected && (
16+
{isConnected ? (
2817
<button
2918
className="border-solid border-2 border-red-500 p-1 rounded-md bg-red-400 font-bold m-5"
3019
onClick={() => disconnect()}
3120
>
3221
Disconnect from {connector?.name}
3322
</button>
34-
)}
35-
36-
{/*isConnected && session && (
37-
<p>SIWE session: {JSON.stringify(session)}</p>
38-
)*/}
39-
40-
{!isConnected && currentWalletType == WalletType.None && (
41-
<>
42-
<button
43-
className="border-solid border-2 border-sky-500 p-1 rounded-md bg-blue-400 font-bold m-5"
44-
onClick={() => open()}
45-
>
46-
Web3Modal
47-
</button>
48-
</>
49-
)}
50-
51-
{/* Instant Wallet */}
52-
{currentWalletType == WalletType.None && !isConnected && (
23+
) : (
5324
<button
5425
className="border-solid border-2 border-sky-500 p-1 rounded-md bg-blue-400 font-bold m-5"
55-
onClick={() => loginInstantWallet?.()}
26+
onClick={() => open()}
5627
>
57-
Instant Play
28+
Connect Wallet
5829
</button>
5930
)}
60-
{!!instantWallet && (
61-
<>
62-
<button
63-
className="border-solid border-2 border-red-500 p-1 rounded-md bg-red-400 font-bold m-5"
64-
onClick={() => disconnectInstantWallet?.()}
65-
>
66-
Disconnect Instant Wallet
67-
</button>
68-
<button
69-
className="border-solid border-2 border-red-500 p-1 rounded-md bg-red-400 font-bold m-5"
70-
onClick={() => wipeInstantWallet?.()}
71-
>
72-
Wipe Instant Wallet
73-
</button>
74-
</>
75-
)}
7631
</div>
77-
7832
{error && <div>{(error as BaseError).shortMessage}</div>}
7933
</div>
8034
);

src/components/SupportedMethods.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import { Connected, PassportSupport } from './Connected';
77
import { EIP4361 } from './EIP4361';
88
import { EIP712 } from './EIP712';
99
import { EthSign } from './EthSign';
10-
import { EthSignTransaction } from './EthSignTransaction';
1110
import { NetworkSwitcher } from './NetworkSwitcher';
1211
import { PersonalSign } from './PersonalSign';
1312
import { SendRawTransactionOAS } from './SendRawTransactionOAS';
@@ -30,7 +29,6 @@ export const SupportedMethods = () => {
3029
<BlockNumber />
3130
<PersonalSign />
3231
<EthSign />
33-
<EthSignTransaction />
3432
<SignTypedDataV4 />
3533
<SendTransaction />
3634
<WatchContractEvents />

src/components/UnsupportedMethods.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { Connected, PassportSupport } from './Connected';
44
import { EthCall } from './EthCall';
55
import { EthRequestAccounts } from './EthRequestAccounts';
66
import { EthSendRawTransaction } from './EthSendRawTransaction';
7+
import { EthSignTransaction } from './EthSignTransaction';
78
import { useSupportedState } from './SupportedSwitcher';
89
import { WalletAddEthereumChain } from './WalletAddEthereumChain';
910
import { WalletGetPermission } from './WalletGetPermission';
@@ -24,6 +25,7 @@ export const UnsupportedMethods = () => {
2425
<EthRequestAccounts />
2526
<EthCall />
2627
<EthSendRawTransaction />
28+
<EthSignTransaction />
2729
<WalletWatchAsset />
2830
<WalletScanQRCode />
2931
<WalletRegisterOnboarding />

0 commit comments

Comments
 (0)