mirror of
https://github.com/logos-messaging/OpChan.git
synced 2026-01-02 12:53:10 +00:00
chore: update docs
This commit is contained in:
parent
3197dcaa6f
commit
45fea2397a
@ -12,27 +12,19 @@ npm i @opchan/react @opchan/core react react-dom
|
||||
|
||||
#### With Reown AppKit (Recommended)
|
||||
|
||||
OpChan integrates with Reown AppKit for wallet management. The provider must be nested inside `WagmiProvider` and `AppKitProvider`:
|
||||
OpChan integrates with Reown AppKit for wallet management. The OpChanProvider already wraps WagmiProvider and AppKitProvider internally, so you can mount it directly:
|
||||
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
import { WagmiProvider } from 'wagmi';
|
||||
import { AppKitProvider } from '@reown/appkit/react';
|
||||
import { OpChanProvider } from '@opchan/react';
|
||||
import { config, appkitConfig } from '@opchan/core';
|
||||
|
||||
const opchanConfig = { ordiscanApiKey: 'YOUR_ORDISCAN_API_KEY' };
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<WagmiProvider config={config}>
|
||||
<AppKitProvider {...appkitConfig}>
|
||||
<OpChanProvider config={opchanConfig}>
|
||||
{/* your app */}
|
||||
</OpChanProvider>
|
||||
</AppKitProvider>
|
||||
</WagmiProvider>
|
||||
<OpChanProvider config={opchanConfig}>
|
||||
{/* your app */}
|
||||
</OpChanProvider>
|
||||
);
|
||||
}
|
||||
|
||||
@ -97,7 +89,7 @@ export function Connect() {
|
||||
- Props:
|
||||
- `config: OpChanClientConfig` — core client configuration.
|
||||
- `children: React.ReactNode`.
|
||||
- Requirements: Must be nested inside `WagmiProvider` and `AppKitProvider` from Reown AppKit.
|
||||
- Requirements: None — this provider already wraps `WagmiProvider` and `AppKitProvider` internally.
|
||||
- Internally provides `AppKitWalletProvider` for wallet state management.
|
||||
|
||||
- **`AppKitWalletProvider`**: Wallet context provider (automatically included in `OpChanProvider`).
|
||||
@ -154,6 +146,18 @@ export function Connect() {
|
||||
`useUserDisplay` and `useAuth.verifyOwnership()` will keep store and local DB in sync.
|
||||
- This package is UI-agnostic; pair with your component library of choice.
|
||||
|
||||
### Runtime requirements
|
||||
|
||||
- Browser Buffer polyfill (for some crypto/wallet libs):
|
||||
```ts
|
||||
import { Buffer } from 'buffer'
|
||||
if (!(window as any).Buffer) (window as any).Buffer = Buffer
|
||||
```
|
||||
- Config values you likely need to pass to `OpChanProvider`:
|
||||
- `ordiscanApiKey` (optional for dev)
|
||||
- `wakuConfig` with `contentTopic` and `reliableChannelId`
|
||||
- `reownProjectId` (e.g., from `import.meta.env.VITE_REOWN_SECRET`)
|
||||
|
||||
### License
|
||||
|
||||
MIT
|
||||
|
||||
@ -12,24 +12,17 @@ The examples assume you install and use the `@opchan/react` and `@opchan/core` p
|
||||
npm i @opchan/react @opchan/core
|
||||
```
|
||||
|
||||
Create an app-level provider using `OpChanProvider`. You must pass a minimal client config (e.g., Ordiscan API key if you have one). OpChanProvider must be nested inside `WagmiProvider` and `AppKitProvider` from Reown AppKit.
|
||||
Create an app-level provider using `OpChanProvider`. You must pass a minimal client config (e.g., Ordiscan API key if you have one). OpChanProvider already wraps `WagmiProvider` and `AppKitProvider` from Reown AppKit internally, so mount it directly at the app root.
|
||||
|
||||
```tsx
|
||||
import React from 'react';
|
||||
import { OpChanProvider } from '@opchan/react';
|
||||
import { WagmiProvider } from 'wagmi';
|
||||
import { AppKitProvider } from '@reown/appkit/react';
|
||||
import { appkitConfig, config } from '@opchan/core';
|
||||
|
||||
export function AppProviders({ children }: { children: React.ReactNode }) {
|
||||
return (
|
||||
<WagmiProvider config={config}>
|
||||
<AppKitProvider {...appkitConfig}>
|
||||
<OpChanProvider config={{ ordiscanApiKey: 'YOUR_API_KEY' }}>
|
||||
{children}
|
||||
</OpChanProvider>
|
||||
</AppKitProvider>
|
||||
</WagmiProvider>
|
||||
<OpChanProvider config={{ ordiscanApiKey: 'YOUR_API_KEY' }}>
|
||||
{children}
|
||||
</OpChanProvider>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
@ -15,7 +15,8 @@ export interface OpChanProviderProps {
|
||||
|
||||
/**
|
||||
* OpChan provider that constructs the OpChanClient and provides wallet context.
|
||||
* Must be nested inside WagmiProvider and AppKitProvider.
|
||||
* This component already wraps WagmiProvider and AppKitProvider internally,
|
||||
* so you can mount it directly at your app root with the required config.
|
||||
*/
|
||||
export const OpChanProvider: React.FC<OpChanProviderProps> = ({
|
||||
config,
|
||||
|
||||
@ -37,9 +37,7 @@ export const WalletAdapterInitializer: React.FC = () => {
|
||||
// Initialize WalletManager for signing flows
|
||||
try {
|
||||
WalletManager.create(
|
||||
appKit as unknown as AppKit,
|
||||
btc as unknown as UseAppKitAccountReturn,
|
||||
eth as unknown as UseAppKitAccountReturn,
|
||||
appKit as unknown as AppKit, btc, eth
|
||||
);
|
||||
} catch (e) {
|
||||
console.warn('[WalletAdapterInitializer] WalletManager.create failed', e);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user