Phantom Connect + DFlow Skill
Instructions
Step 1: Identify What the User Wants to Build
Determine the domain, then route to the right references.
Wallet connection and Solana interactions:
- Connecting a Phantom wallet (React, React Native, vanilla JS)
- Signing messages or transactions
- Token-gated access
- NFT minting
- Crypto payments
- Solana transfers (SOL or SPL tokens)
DFlow trading & market data:
- Spot token swaps (quote, sign, submit, confirm)
- Live prices, order-book depth, or priority-fee streaming
Many tasks combine both (for example, a swap UI needs wallet connection AND DFlow trading). Read all relevant references before writing code.
Step 2: Read the Relevant References
Phantom Connect SDKs (wallet connection, signing, auth):
references/react-sdk.md: React hooks, components, theming, PhantomProvider
references/react-native-sdk.md: Expo config, polyfills, deep links, mobile auth
references/browser-sdk.md: BrowserSDK init, events, wallet discovery, vanilla JS
Solana patterns (transactions, gating, minting, payments):
references/transactions.md: SOL/SPL transfers, signing, fee estimation
references/token-gating.md: client-side and server-side token-gated access
references/nft-minting.md: mint pages, Metaplex Core, compressed NFTs
references/payments.md: SOL/USDC payments, checkout with backend verification
DFlow (swaps, streaming):
references/dflow-crypto-trading.md: spot swaps via /order (atomic units, base58 mints, quote-without-wallet, priority/platform/sponsor fees)
references/dflow-websockets.md: real-time quote, order-book, and priority-fee streaming (browser proxies through the backend)
Step 3: Ask the Right Questions
Before implementing, ask questions based on the domain:
For Phantom Connect tasks:
- Which platform? (React, React Native, vanilla JS)
- Do they need social login (Google/Apple) or extension only?
For DFlow tasks:
- Do you have a DFlow API key? (Yes: prod host with
x-api-key. No: dev host, rate-limited. Prod key: pond.dflow.net/get-started/api-key.) It's one key for everything DFlow.
- Client environment? (web, mobile, backend, CLI) Browser apps keep the key on the backend and proxy DFlow HTTP and WebSocket through it.
- Platform fees? If yes, what bps and which builder-owned fee account (which must already exist)?
Step 4: Implement
Follow the patterns in the reference files. Key rules by domain:
Phantom Connect:
- All SDK details (provider setup, hooks, components, auth providers) are in the SDK reference files. Read them before writing Phantom integration code.
DFlow:
- Trades are synchronous: one
/order call returns a signed-ready transaction that you sign, submit, and confirm.
- As a security best practice, keep the DFlow API key on the backend, not in browser code. Browser apps proxy DFlow HTTP (
/order serves no CORS) and the WebSocket streams through their backend.
- Dev endpoints (
dev-quote-api.dflow.net) work without a key but are rate-limited; production requires a key from pond.dflow.net/get-started/api-key. In production, quote and book stream access is granted per key.
Step 5: Handle Errors
Each reference file contains domain-specific error handling. Key cross-cutting concerns:
- User rejects a transaction or signature request
- Wallet not connected when a signed action is attempted
- DFlow API returns 429 (rate limited): retry with backoff or get a production API key
route_not_found from DFlow: a likely cause is insufficient liquidity for the pair at that size; also check the mint addresses and that amount is in atomic units
Examples
Example 1: React wallet connection
User says: "Add Phantom wallet login to my Next.js app"
Actions:
- Read
references/react-sdk.md
- Install
@phantom/react-sdk
- Wrap app in PhantomProvider with desired auth providers and appId
- Use
useModal hook for a connect button
- Use
useAccounts to display the connected wallet address
Result: Working wallet connection with social login and extension support
Example 2: Token-gated page
User says: "Build a page that only BONK holders can see"
Actions:
- Read
references/react-sdk.md and references/token-gating.md
- Set up wallet connection
- Query the BONK token balance for the connected wallet
- Conditionally render content based on balance threshold
- For production: add server-side signature verification
Result: Page that checks wallet token balance and gates content
Example 3: DFlow token swap
User says: "Add a swap feature using DFlow"
Actions:
- Ask: API key? Client environment? Platform fees?
- Read
references/dflow-crypto-trading.md
- Use the
/order flow: request the order (proxy through the backend in a browser), deserialize the returned transaction, sign, submit, and confirm
- In a browser, sign and send with the Phantom SDK (see
references/transactions.md); server-side, sign with a keypair and submit through your RPC
Result: Working swap with DFlow routing
Example 4: Full swap page with wallet connection
User says: "Build a full swap page with wallet connect and DFlow"
Actions:
- Ask: which platform? API key? Platform fees?
- Read the relevant SDK reference AND
references/dflow-crypto-trading.md
- Set up wallet connection with the Phantom SDK
- Build the swap form; proxy
/order through the backend so the key stays server-side
- Sign and send with the Phantom SDK, then confirm
Result: End-to-end swap page combining Phantom wallet and DFlow trading
Example 5: Live order book
User says: "Show a live order book for a token pair"
Actions:
- Read
references/dflow-websockets.md
- Stand up a backend relay that holds the key, opens
/book-stream with the x-api-key header, and relays frames to the browser
- Subscribe with
{ op: "subscribe", base_mint, quote_mint }; render the batched per-slot updates[]
- Reconnect and re-subscribe on drop
Result: Live streaming order book, key kept server-side
Resources
- Phantom Portal: phantom.com/portal/login
- Phantom Docs: docs.phantom.com/introduction
- SDK Examples: github.com/phantom/phantom-connect-sdk/tree/main/examples
- Phantom MCP Server: docs.phantom.com/resources/mcp-server
- DFlow MCP Server: pond.dflow.net/mcp
- DFlow MCP Docs: pond.dflow.net/ai/mcp
- DFlow Docs: pond.dflow.net/introduction
1---2name: dflow-phantom-connect3description: Build Solana wallet-connected apps with Phantom Connect SDKs and DFlow spot trading. Use when user asks to connect a Phantom wallet, integrate Phantom in React, React Native, or vanilla JS, sign messages or transactions, build token-gated pages, mint NFTs, accept crypto payments, or swap/stream tokens with DFlow. Covers @phantom/react-sdk, @phantom/react-native-sdk, @phantom/browser-sdk, and DFlow spot trading and market-data streaming. Do NOT use for Ethereum or EVM wallet integrations, or non-DFlow DEX routing.4license: MIT5---6
7# Phantom Connect + DFlow Skill
8
9## Instructions
10
11### Step 1: Identify What the User Wants to Build
12
13Determine the domain, then route to the right references.
14
15**Wallet connection and Solana interactions:**
16
17- Connecting a Phantom wallet (React, React Native, vanilla JS)
18- Signing messages or transactions
19- Token-gated access
20- NFT minting
21- Crypto payments
22- Solana transfers (SOL or SPL tokens)
23
24**DFlow trading & market data:**
25
26- Spot token swaps (quote, sign, submit, confirm)
27- Live prices, order-book depth, or priority-fee streaming
28
29Many tasks combine both (for example, a swap UI needs wallet connection AND DFlow trading). Read all relevant references before writing code.
30
31### Step 2: Read the Relevant References
32
33**Phantom Connect SDKs** (wallet connection, signing, auth):
34
35- `references/react-sdk.md`: React hooks, components, theming, PhantomProvider
36- `references/react-native-sdk.md`: Expo config, polyfills, deep links, mobile auth
37- `references/browser-sdk.md`: BrowserSDK init, events, wallet discovery, vanilla JS
38
39**Solana patterns** (transactions, gating, minting, payments):
40
41- `references/transactions.md`: SOL/SPL transfers, signing, fee estimation
42- `references/token-gating.md`: client-side and server-side token-gated access
43- `references/nft-minting.md`: mint pages, Metaplex Core, compressed NFTs
44- `references/payments.md`: SOL/USDC payments, checkout with backend verification
45
46**DFlow** (swaps, streaming):
47
48- `references/dflow-crypto-trading.md`: spot swaps via `/order` (atomic units, base58 mints, quote-without-wallet, priority/platform/sponsor fees)
49- `references/dflow-websockets.md`: real-time quote, order-book, and priority-fee streaming (browser proxies through the backend)
50
51### Step 3: Ask the Right Questions
52
53Before implementing, ask questions based on the domain:
54
55**For Phantom Connect tasks:**
56
57- Which platform? (React, React Native, vanilla JS)
58- Do they need social login (Google/Apple) or extension only?
59
60**For DFlow tasks:**
61
62- Do you have a DFlow API key? (Yes: prod host with `x-api-key`. No: dev host, rate-limited. Prod key: pond.dflow.net/get-started/api-key.) It's one key for everything DFlow.
63- Client environment? (web, mobile, backend, CLI) Browser apps keep the key on the backend and proxy DFlow HTTP and WebSocket through it.
64- Platform fees? If yes, what bps and which builder-owned fee account (which must already exist)?
65
66### Step 4: Implement
67
68Follow the patterns in the reference files. Key rules by domain:
69
70**Phantom Connect:**
71
72- All SDK details (provider setup, hooks, components, auth providers) are in the SDK reference files. Read them before writing Phantom integration code.
73
74**DFlow:**
75
76- Trades are synchronous: one `/order` call returns a signed-ready transaction that you sign, submit, and confirm.
77- As a security best practice, keep the DFlow API key on the backend, not in browser code. Browser apps proxy DFlow HTTP (`/order` serves no CORS) and the WebSocket streams through their backend.
78- Dev endpoints (`dev-quote-api.dflow.net`) work without a key but are rate-limited; production requires a key from pond.dflow.net/get-started/api-key. In production, quote and book stream access is granted per key.
79
80### Step 5: Handle Errors
81
82Each reference file contains domain-specific error handling. Key cross-cutting concerns:
83
84- User rejects a transaction or signature request
85- Wallet not connected when a signed action is attempted
86- DFlow API returns 429 (rate limited): retry with backoff or get a production API key
87- `route_not_found` from DFlow: a likely cause is insufficient liquidity for the pair at that size; also check the mint addresses and that `amount` is in atomic units
88
89## Examples
90
91### Example 1: React wallet connection
92
93User says: "Add Phantom wallet login to my Next.js app"
94
95Actions:
96
971. Read `references/react-sdk.md`
982. Install `@phantom/react-sdk`
993. Wrap app in PhantomProvider with desired auth providers and appId
1004. Use `useModal` hook for a connect button
1015. Use `useAccounts` to display the connected wallet address
102
103Result: Working wallet connection with social login and extension support
104
105### Example 2: Token-gated page
106
107User says: "Build a page that only BONK holders can see"
108
109Actions:
110
1111. Read `references/react-sdk.md` and `references/token-gating.md`
1122. Set up wallet connection
1133. Query the BONK token balance for the connected wallet
1144. Conditionally render content based on balance threshold
1155. For production: add server-side signature verification
116
117Result: Page that checks wallet token balance and gates content
118
119### Example 3: DFlow token swap
120
121User says: "Add a swap feature using DFlow"
122
123Actions:
124
1251. Ask: API key? Client environment? Platform fees?
1262. Read `references/dflow-crypto-trading.md`
1273. Use the `/order` flow: request the order (proxy through the backend in a browser), deserialize the returned transaction, sign, submit, and confirm
1284. In a browser, sign and send with the Phantom SDK (see `references/transactions.md`); server-side, sign with a keypair and submit through your RPC
129
130Result: Working swap with DFlow routing
131
132### Example 4: Full swap page with wallet connection
133
134User says: "Build a full swap page with wallet connect and DFlow"
135
136Actions:
137
1381. Ask: which platform? API key? Platform fees?
1392. Read the relevant SDK reference AND `references/dflow-crypto-trading.md`
1403. Set up wallet connection with the Phantom SDK
1414. Build the swap form; proxy `/order` through the backend so the key stays server-side
1425. Sign and send with the Phantom SDK, then confirm
143
144Result: End-to-end swap page combining Phantom wallet and DFlow trading
145
146### Example 5: Live order book
147
148User says: "Show a live order book for a token pair"
149
150Actions:
151
1521. Read `references/dflow-websockets.md`
1532. Stand up a backend relay that holds the key, opens `/book-stream` with the `x-api-key` header, and relays frames to the browser
1543. Subscribe with `{ op: "subscribe", base_mint, quote_mint }`; render the batched per-slot `updates[]`
1554. Reconnect and re-subscribe on drop
156
157Result: Live streaming order book, key kept server-side
158
159## Resources
160
161- Phantom Portal: phantom.com/portal/login
162- Phantom Docs: docs.phantom.com/introduction
163- SDK Examples: github.com/phantom/phantom-connect-sdk/tree/main/examples
164- Phantom MCP Server: docs.phantom.com/resources/mcp-server
165- DFlow MCP Server: pond.dflow.net/mcp
166- DFlow MCP Docs: pond.dflow.net/ai/mcp
167- DFlow Docs: pond.dflow.net/introduction