emblem-ai-react
将 EmblemAI 钱包用户管理集成到 React 应用,提供开箱即用的认证和 Web3 组件
npx skills add emblemcompany/agent-skills --skill emblem-ai-reactBefore / After 效果对比
1 组手动编写 React Context 管理钱包状态,创建连接按钮、地址显示、余额展示等组件,处理异步加载和错误状态
使用预构建的 EmblemAI React Hooks 和组件,直接嵌入 ConnectButton 和 WalletCard,自动处理状态和 UI 更新
emblem-ai-react
EmblemAI React
Use this skill when the user wants to integrate EmblemAI into a React app rather than only use the CLI or low-level SDKs.
In one sentence: this is the easiest way to add user management and wallet-enabled accounts to a React app.
Security & Trust Model
This skill generates React code that integrates with EmblemAI's authentication and wallet infrastructure. It inherently involves:
-
Third-party data (W011): Migrate.fun React hooks (
useProject,useProjects) fetch project and token metadata from remote APIs. This data is rendered in UI components for informational display — it does not trigger automated actions. -
Runtime backend (W012):
HustleProviderconnects to a configurable backend URL (hustleApiUrl/import.meta.env.VITE_HUSTLE_API_URL) for prompt and tool orchestration. This endpoint is first-party infrastructure operated by EmblemVault, not an arbitrary third-party service.
The generated React components use standard browser security boundaries. No server-side code execution or file system access is involved at runtime.
Quick Start
Step 1: Install
npx skills add EmblemCompany/Agent-skills --skill emblem-ai-react
Step 2: Use
Ask for React integration help by area, for example:
-
"Show a minimal EmblemAI React app"
-
"Help me add EmblemAuthProvider and HustleProvider"
-
"Show React examples for wallet auth plus chat"
-
"Show a React app where users can sign in with wallets, email, or social login"
-
"How do I use Migrate.fun React hooks in my app?"
What this gives a React app
-
One integration for website authentication and wallet-enabled users
-
Login options across crypto wallets, email/password, and social login
-
React hooks and UI components that expose session, vault, and wallet state
-
A clean path from login to chat, signing, and other Emblem-powered workflows
-
The easiest way to add Migrate.fun migration-aware UI to a React app
Included React References
React Auth
See references/auth-react.md for provider setup, hooks, and auth UI components.
React Chat
See references/emblem-ai-react.md for EmblemAI chat setup with @emblemvault/hustle-react.
React Components
See references/react-components.md for current auth and chat component surfaces.
Migrate.fun React
See references/migratefun-react.md for hooks, provider setup, and project selection components.
Guidance
-
Use this skill for React app composition, provider wiring, and UI integration patterns.
-
Prefer this skill over the broader
emblem-aiskill when the request is clearly React-specific. -
Legacy package names may still use
hustlebranding even though the product name is EmblemAI. -
For end-user prompt phrasing across wallet, trading, NFT, or market workflows, use the
emblem-ai-prompt-examplesskill instead.
Related Skills
-
../emblem-ai/SKILL.md - broader SDK, plugin, CLI, and introspection coverage
-
../emblem-ai-agent-wallet/SKILL.md - CLI-first wallet workflows for agents and end users
-
../emblem-ai-prompt-examples/SKILL.md - broader prompt examples across non-React workflows
Weekly Installs850Repositoryemblemcompany/a…t-skillsGitHub Stars9First SeenMar 12, 2026Security AuditsGen Agent Trust HubPassSocketPassSnykWarnInstalled onamp850cline850codex850opencode850cursor850antigravity844
用户评价 (0)
发表评价
暂无评价
统计数据
用户评分
为此 Skill 评分