mirror of
https://github.com/logos-messaging/OpChan.git
synced 2026-01-05 14:23:06 +00:00
chore: update readme
This commit is contained in:
parent
2aaf795ebc
commit
1617103bbc
@ -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
2
package-lock.json
generated
@ -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",
|
||||||
|
|||||||
@ -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",
|
||||||
|
|||||||
@ -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',
|
||||||
|
|||||||
@ -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 }`.
|
||||||
|
|
||||||
|
|||||||
@ -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",
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user