chore: update readme

This commit is contained in:
Danish Arora 2025-09-25 21:25:32 +05:30
parent 2aaf795ebc
commit 1617103bbc
No known key found for this signature in database
GPG Key ID: 1C6EF37CDAE1426E
6 changed files with 51 additions and 20 deletions

View File

@ -1,16 +1,3 @@
//TODO: research into having signatures somehow?
//TODO research: **each message sent should not be able to be spoofed**
/**
* Reference:
* https://www.notion.so/Logos-Forum-PoC-Waku-Powered-Opchan-1968f96fb65c8078b343c43429d66d0a#1968f96fb65c8025a929c2c9255a57c4
* Also note that for UX purposes, **we should not ask a user to sign with their Bitcoin wallet for every action.**
*
* Instead, a key delegation system should be developed.
*
* - User sign an in-browser key with their wallet and broadcast it
* - Browser uses in-browser key to sign messages moving forward
*/
import { Toaster } from '@/components/ui/toaster'; import { Toaster } from '@/components/ui/toaster';
import { Toaster as Sonner } from '@/components/ui/sonner'; import { Toaster as Sonner } from '@/components/ui/sonner';
import { TooltipProvider } from '@/components/ui/tooltip'; import { TooltipProvider } from '@/components/ui/tooltip';

2
package-lock.json generated
View File

@ -18008,7 +18008,7 @@
"name": "@opchan/react", "name": "@opchan/react",
"version": "1.0.0", "version": "1.0.0",
"dependencies": { "dependencies": {
"@opchan/core": "file:../core" "@opchan/core": "^1.0.0"
}, },
"devDependencies": { "devDependencies": {
"@types/react": "^18.2.66", "@types/react": "^18.2.66",

View File

@ -16,6 +16,9 @@
"files": [ "files": [
"dist" "dist"
], ],
"publishConfig": {
"access": "public"
},
"scripts": { "scripts": {
"build": "npm run clean && npm run build:cjs && cp dist/cjs/index.js dist/index.js && npm run build:esm && npm run build:types", "build": "npm run clean && npm run build:cjs && cp dist/cjs/index.js dist/index.js && npm run build:esm && npm run build:types",
"build:cjs": "tsc --module commonjs --outDir dist/cjs", "build:cjs": "tsc --module commonjs --outDir dist/cjs",

View File

@ -1,5 +1,5 @@
export const DB_NAME = 'opchan-local'; export const DB_NAME = 'opchan-local';
export const DB_VERSION = 3; export const DB_VERSION = 4;
export const STORE = { export const STORE = {
CELLS: 'cells', CELLS: 'cells',

View File

@ -10,15 +10,16 @@ npm i @opchan/react @opchan/core react react-dom
### Quickstart ### Quickstart
#### Basic Usage
```tsx ```tsx
import React from 'react'; import React from 'react';
import { createRoot } from 'react-dom/client'; import { createRoot } from 'react-dom/client';
import { OpChanProvider } from '@opchan/react'; import { OpChanProvider } from '@opchan/react';
import type { OpChanClientConfig } from '@opchan/core';
const config = { const config: OpChanClientConfig = {
// See @opchan/core for full options ordiscanApiKey: 'YOUR_ORDISCAN_API_KEY',
waku: { bootstrapPeers: [], pubsubTopic: 'opchan-v1' },
database: { name: 'opchan' },
}; };
// Optional: bridge your wallet to OpChan // Optional: bridge your wallet to OpChan
@ -44,6 +45,37 @@ function App() {
createRoot(document.getElementById('root')!).render(<App />); createRoot(document.getElementById('root')!).render(<App />);
``` ```
#### (Suggested) With Reown AppKit Integration
Using Reown AppKit for wallet management:
```tsx
import React from 'react';
import { createRoot } from 'react-dom/client';
import { WagmiProvider } from 'wagmi';
import { AppKitProvider } from '@reown/appkit/react';
import { OpchanWithAppKit } from './providers/OpchanWithAppKit';
// Define your own config for networks, or use our by default (supports Bitcoin and Ethereum)
import { config, appkitConfig } from '@opchan/core';
const opchanConfig = { ordiscanApiKey: 'YOUR_ORDISCAN_API_KEY' };
function App() {
return (
<WagmiProvider config={config}>
<AppKitProvider {...appkitConfig}>
<OpchanWithAppKit config={opchanConfig}>
{/* your app */}
</OpchanWithAppKit>
</AppKitProvider>
</WagmiProvider>
);
}
createRoot(document.getElementById('root')!).render(<App />);
```
### Common usage ### Common usage
```tsx ```tsx
@ -107,6 +139,12 @@ export function Connect() {
- `WalletAdapter`: - `WalletAdapter`:
- `getAccount(): WalletAdapterAccount | null` - `getAccount(): WalletAdapterAccount | null`
- `onChange(cb: (a: WalletAdapterAccount | null) => void): () => void` - `onChange(cb: (a: WalletAdapterAccount | null) => void): () => void`
- **`OpchanWithAppKit`**: Convenience wrapper around `OpChanProvider` that integrates with Reown AppKit.
- Props:
- `config: OpChanClientConfig` — core client configuration.
- `children: React.ReactNode`.
- Automatically bridges AppKit wallet connections to OpChan's wallet adapter interface.
- Requires `WagmiProvider` and `AppKitProvider` from Reown AppKit as parent providers.
- **`ClientProvider`**: Low-level provider if you construct `OpChanClient` yourself. - **`ClientProvider`**: Low-level provider if you construct `OpChanClient` yourself.
- Props: `{ client: OpChanClient; children: React.ReactNode }`. - Props: `{ client: OpChanClient; children: React.ReactNode }`.

View File

@ -17,6 +17,9 @@
"files": [ "files": [
"dist" "dist"
], ],
"publishConfig": {
"access": "public"
},
"scripts": { "scripts": {
"build": "npm run clean && npm run build:esm && npm run build:types", "build": "npm run clean && npm run build:esm && npm run build:types",
"build:esm": "tsc -b --force tsconfig.build.json && cp dist/index.js dist/index.esm.js", "build:esm": "tsc -b --force tsconfig.build.json && cp dist/index.js dist/index.esm.js",
@ -30,7 +33,7 @@
"react-dom": ">=18.0.0" "react-dom": ">=18.0.0"
}, },
"dependencies": { "dependencies": {
"@opchan/core": "file:../core" "@opchan/core": "^1.0.0"
}, },
"devDependencies": { "devDependencies": {
"typescript": "^5.5.3", "typescript": "^5.5.3",