@deriv-com/fe-mcp-servers 0.0.7 → 0.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -4,6 +4,7 @@ A collection of Front-End Model Context Protocol (MCP) servers for reusability a
4
4
 
5
5
  ## 🏗️ Project Structure
6
6
 
7
+ ### Source Structure (Development)
7
8
  ```
8
9
  mcps/
9
10
  ├── shift-ai/ # Individual MCP server
@@ -27,14 +28,14 @@ mcps/
27
28
  ### Install the Package
28
29
  ```bash
29
30
  # Install globally
30
- npm install -g @deriv/ai-tools
31
+ npm install -g @deriv-com/fe-mcp-servers
31
32
  ```
32
33
 
33
34
  ### Get Your Configuration Path
34
35
  Copy and run this command to get the exact path for your MCP configuration:
35
36
 
36
37
  ```bash
37
- echo "$(npm root -g)/@deriv/ai-tools/mcps/dist/SERVER_NAME/src/mcp-server.js"
38
+ echo "$(npm root -g)/@deriv-com/fe-mcp-servers/dist/SERVER_NAME/mcp-server.js"
38
39
  ```
39
40
 
40
41
  Replace `SERVER_NAME` with the specific server you want (e.g., `shift-ai`).
@@ -57,7 +58,7 @@ Replace `SERVER_NAME` with the specific server you want (e.g., `shift-ai`).
57
58
  "mcpServers": {
58
59
  "shift-ai": {
59
60
  "command": "node",
60
- "args": ["/Users/user/.nvm/versions/node/v20.17.0/lib/node_modules/@deriv/ai-tools/mcps/dist/shift-ai/src/mcp-server.js"]
61
+ "args": ["/Users/user/.nvm/versions/node/v20.17.0/lib/node_modules/@deriv-com/fe-mcp-servers/dist/shift-ai/mcp-server.js"]
61
62
  }
62
63
  }
63
64
  }
@@ -66,11 +67,14 @@ Replace `SERVER_NAME` with the specific server you want (e.g., `shift-ai`).
66
67
  ## 🛠️ Development
67
68
 
68
69
  ### Building the Package
70
+ The build process bundles all dependencies into standalone executables:
69
71
  ```bash
70
72
  cd mcps
71
73
  npm run build
72
74
  ```
73
75
 
76
+ This creates bundled files in `dist/` with all dependencies included.
77
+
74
78
  ### Running Tests
75
79
  ```bash
76
80
  npm run test
@@ -79,64 +83,35 @@ npm run test
79
83
  ### Adding New MCP Servers
80
84
 
81
85
  1. Create a new directory in `mcps/`
82
- 2. Add the required structure:
86
+ 2. Add the required **source structure**:
83
87
  ```
84
88
  your-server/
85
89
  ├── src/
86
- │ ├── mcp-server.js # Required: Main MCP server
87
- ├── your-logic.js # Your server logic
88
- └── test-mcp.js # Optional: Tests
89
- └── README.md # Required: Documentation
90
+ │ ├── mcp-server.js # Main server implementation (entry point)
91
+ └── mcp.js # Core functionality
92
+ └── README.md # Server documentation
90
93
  ```
91
- 3. Use standard npm imports (dependencies are resolved from mcps root)
92
- 4. The build script will automatically include it
93
-
94
- ## Available MCP Servers
95
-
96
- ### 🚀 shift-ai
97
- AI code generation and analysis server that provides intelligent code suggestions, analysis, and automated code generation capabilities.
98
-
99
- **Status**: ✅ Active
100
- **Location**: `shift-ai/`
101
-
102
- ### 🐙 github-mcp
103
- GitHub integration server for repository management, issue tracking, and pull request automation.
104
-
105
- **Status**: 🚧 Planned
106
- **Location**: `github-mcp/`
107
-
108
- ### 💬 slack-mcp
109
- Slack workspace automation server for communication workflows and bot integrations.
94
+ 3. Implement your MCP server logic in the `src/` files
95
+ 4. The build process will automatically bundle everything into `dist/your-server/mcp-server.js`
96
+ 5. Users will reference the **bundled file** (not the source) in their MCP configuration
110
97
 
111
- **Status**: 🚧 Planned
112
- **Location**: `slack-mcp/`
113
-
114
- ### 🗄️ database-mcp
115
- Database query and schema management server supporting multiple database systems.
116
-
117
- **Status**: 🚧 Planned
118
- **Location**: `database-mcp/`
119
-
120
- ## 📦 Distribution
121
-
122
- This package is published to npm as part of the @deriv/ai-tools collection with all dependencies bundled for easy installation and usage.
123
-
124
- ## 🔧 Standards
98
+ ### Requirements for New Servers
125
99
 
126
100
  Each MCP server must:
127
- - Have `src/mcp-server.js` as the main entry point
128
- - Use standard npm package imports
129
- - Include comprehensive `README.md` documentation
130
- - Follow consistent coding patterns
131
- - Include test coverage where applicable
101
+ - Have `src/mcp-server.js` as the main entry point (source file)
102
+ - Follow the MCP protocol specification
103
+ - Include comprehensive documentation in README.md
104
+ - The build process will bundle everything into a single executable `dist/server-name/mcp-server.js` file
132
105
 
133
106
  ## 🏗️ Architecture
134
107
 
135
- - **Monorepo Structure**: All servers in one package for easy distribution
136
- - **Shared Dependencies**: Common dependencies bundled at mcps level
137
- - **Automatic Discovery**: Build system automatically finds and includes servers
138
- - **Global Installation**: Zero-configuration setup via npm global install
139
- - **Standardized Structure**: Consistent patterns across all servers
140
- - **Protocol**: [Model Context Protocol (MCP)](https://modelcontextprotocol.io/)
141
- - **Runtime**: Node.js
142
- - **Build System**: Automated packaging and distribution
108
+ ### Build Process
109
+ - **Input**: Source files in `src/` directories
110
+ - **Process**: esbuild bundles all dependencies
111
+ - **Output**: Single executable files in `dist/` directories
112
+ - **Distribution**: npm package contains only the `dist/` directory
113
+
114
+ ### Dependency Management
115
+ - All dependencies are bundled into the final executable
116
+ - No external dependency resolution required at runtime
117
+ - Standalone files that work in any Node.js environment
@@ -1,136 +1,183 @@
1
1
  # ShiftAI MCP Server
2
2
 
3
- An MCP (Model Context Protocol) server that provides AI code provenance tracking through simple comment markers. This tool helps maintain transparency and traceability of AI-generated code across different programming languages.
3
+ A Model Context Protocol (MCP) server that provides AI code generation with automatic code provenance wrapping according to simple AI code wrapping rules.
4
4
 
5
- ## Features
5
+ ## 🚀 Installation & Setup
6
6
 
7
- - **Universal Code Wrapping**: Supports JavaScript, TypeScript, Python, CSS, HTML, and more
8
- - **Simple Comment Markers**: Uses language-appropriate comment syntax for wrapping
9
- - **AI Code Provenance**: Enables automated detection and tracking of AI-generated code
10
- - **MCP Protocol**: Full compatibility with MCP-enabled AI tools and IDEs
11
- - **Zero Configuration**: Works out of the box with sensible defaults
12
- - **Language Detection**: Automatically applies correct comment syntax for each file type
13
-
14
- ## 🚀 Installation
15
-
16
- ### Install the Package
7
+ ### Step 1: Install the Package
17
8
  ```bash
18
9
  npm install -g @deriv-com/fe-mcp-servers
19
10
  ```
20
11
 
21
- ### Get ShiftAI Configuration Path
22
- Copy and run this command to get the exact path for ShiftAI:
12
+ ### Step 2: Get Configuration Path
13
+ Get the exact path for your MCP configuration:
23
14
 
24
15
  ```bash
25
- echo "$(npm root -g)/@deriv-com/fe-mcp-servers/dist/shift-ai/src/mcp-server.js"
16
+ echo "$(npm root -g)/@deriv-com/fe-mcp-servers/dist/shift-ai/mcp-server.js"
26
17
  ```
27
18
 
28
- This will output the full path that you can copy directly into your MCP configuration.
19
+ **Important**: Use the **bundled executable path** (without `src/`) for MCP configuration.
29
20
 
30
- ## 📋 Configuration
21
+ ### Step 3: Configure MCP Client
22
+ Add to your MCP client configuration (e.g., in Cursor settings):
31
23
 
32
- ### Cursor IDE
33
24
  ```json
34
25
  {
35
26
  "mcpServers": {
36
27
  "shift-ai": {
37
28
  "command": "node",
38
- "args": ["<PASTE_PATH_FROM_ABOVE>"]
29
+ "args": ["/Users/user/.nvm/versions/node/v20.17.0/lib/node_modules/@deriv-com/fe-mcp-servers/dist/shift-ai/mcp-server.js"]
39
30
  }
40
31
  }
41
32
  }
42
33
  ```
43
34
 
44
- ### Claude Desktop
45
- ```json
46
- {
47
- "mcpServers": {
48
- "shift-ai": {
49
- "command": "node",
50
- "args": ["<PASTE_PATH_FROM_ABOVE>"]
51
- }
52
- }
53
- }
35
+ ## 🛠️ Development Structure
36
+
37
+ ### Source Code (Development)
38
+ ```
39
+ shift-ai/
40
+ ├── src/
41
+ │ ├── mcp-server.js # Main MCP server implementation
42
+ │ ├── mcp.js # Core ShiftAI functionality
43
+ │ └── test-mcp.js # Test suite
44
+ └── README.md # This documentation
54
45
  ```
55
46
 
56
- ### Example Configuration
57
- ```json
58
- {
59
- "mcpServers": {
60
- "shift-ai": {
61
- "command": "node",
62
- "args": ["/Users/user/.nvm/versions/node/v20.17.0/lib/node_modules/@deriv-com/fe-mcp-servers/dist/shift-ai/src/mcp-server.js"]
63
- }
64
- }
65
- }
47
+ ### Built Output (Distribution)
48
+ After building, the package creates:
49
+ ```
50
+ dist/
51
+ └── shift-ai/
52
+ ├── mcp-server.js # Bundled executable (all dependencies included)
53
+ └── README.md # Documentation
66
54
  ```
67
55
 
68
- ## 🛠️ Usage
56
+ ## 🔧 Build Process
69
57
 
70
- Once configured, you can use the `shai` tool in your AI conversations:
58
+ The build process uses esbuild to:
59
+ 1. Bundle all dependencies into a single file
60
+ 2. Create a standalone executable
61
+ 3. Include proper Node.js shebang for direct execution
62
+ 4. No external dependency resolution needed at runtime
71
63
 
72
- ### Simple Usage
64
+ ## Available Tools
73
65
 
74
- ```
75
- shai: refactor this button component
76
- ```
66
+ ### `shai` Tool
67
+ Generates code wrapped according to simple AI code provenance rules.
77
68
 
78
- ```
79
- shai: create a login form with validation
80
- ```
69
+ **Parameters:**
81
70
 
71
+ - `prompt` (string, required): The instruction or prompt for code generation
72
+ - `code` (string, optional): Existing code to be wrapped with AI markers
73
+
74
+ **Returns:**
75
+
76
+ - Formatted instructions with examples for proper AI code wrapping
77
+
78
+ ## 🎯 Usage Examples
79
+
80
+ Once configured in your MCP client, you can use the `shai` tool in your conversations:
81
+
82
+ ### Simple Code Generation
83
+
84
+ **Input:**
82
85
  ```
83
- shai: optimize this database query function
86
+ Use shai to create a login form component in React
84
87
  ```
85
88
 
86
- ### With Context
89
+ **What happens:**
90
+ The AI will receive instructions to wrap any generated code with proper AI markers for React/JavaScript.
91
+
92
+ ### Code Refactoring
87
93
 
94
+ **Input:**
88
95
  ```
89
- shai: add error handling to this API call function:
96
+ shai: refactor this function to be more efficient:
90
97
 
91
- function fetchUserData(userId) {
92
- return fetch(`/api/users/${userId}`).then(res => res.json());
98
+ function calculateTotal(items) {
99
+ let total = 0;
100
+ for (let i = 0; i < items.length; i++) {
101
+ total += items[i].price * items[i].quantity;
102
+ }
103
+ return total;
93
104
  }
94
105
  ```
95
106
 
96
- ### For Code Reviews
97
-
98
- ```
99
- shai: suggest improvements for this React component and wrap with proper markers
107
+ **Expected Output:**
108
+ ```javascript
109
+ // [AI]
110
+ function calculateTotal(items) {
111
+ return items.reduce((total, item) => total + (item.price * item.quantity), 0);
112
+ }
113
+ // [/AI]
100
114
  ```
101
115
 
102
- ## 🔧 API Reference
103
-
104
- ### `shai` Tool
116
+ ### Multi-Language Support
105
117
 
106
- Generates code wrapped according to AI code provenance rules.
118
+ **Python Example:**
119
+ ```
120
+ shai: create a data validation function in Python
121
+ ```
107
122
 
108
- **Parameters:**
123
+ **Expected Output:**
124
+ ```python
125
+ # [AI]
126
+ def validate_email(email):
127
+ import re
128
+ pattern = r'^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$'
129
+ return re.match(pattern, email) is not None
130
+ # [/AI]
131
+ ```
109
132
 
110
- - `prompt` (string, required): The instruction or prompt for code generation
111
- - `code` (string, optional): Existing code to be wrapped with AI markers
133
+ **CSS Example:**
134
+ ```
135
+ shai: create a responsive navigation bar style
136
+ ```
112
137
 
113
- **Returns:**
138
+ **Expected Output:**
139
+ ```css
140
+ /* [AI] */
141
+ .navbar {
142
+ display: flex;
143
+ justify-content: space-between;
144
+ align-items: center;
145
+ padding: 1rem 2rem;
146
+ background-color: #333;
147
+ color: white;
148
+ }
114
149
 
115
- - Formatted instructions with examples for proper AI code wrapping
150
+ @media (max-width: 768px) {
151
+ .navbar {
152
+ flex-direction: column;
153
+ padding: 1rem;
154
+ }
155
+ }
156
+ /* [/AI] */
157
+ ```
116
158
 
117
- ## 🏗️ Project Structure
159
+ ### Code Review and Improvement
118
160
 
161
+ **Input:**
119
162
  ```
120
- shift-ai/
121
- ├── src/
122
- │ ├── mcp-server.js # Main MCP server implementation
123
- │ ├── mcp.js # Core shai function
124
- │ └── test-mcp.js # Test suite
125
- └── README.md # This file
163
+ shai: analyze and improve this API endpoint for better error handling
126
164
  ```
127
165
 
128
- ## 🔧 Dependencies
166
+ **Benefits:**
167
+ - Ensures all AI-generated code suggestions are properly marked
168
+ - Maintains code provenance tracking
169
+ - Enables automated detection of AI-assisted code
170
+ - Supports team transparency and compliance requirements
171
+
172
+ ### Common Use Cases
129
173
 
130
- - `@modelcontextprotocol/sdk`: MCP protocol implementation
131
- - Additional dependencies bundled automatically
174
+ 1. **Feature Development**: `shai: implement user authentication`
175
+ 2. **Bug Fixes**: `shai: fix the memory leak in this component`
176
+ 3. **Code Optimization**: `shai: optimize this database query`
177
+ 4. **Testing**: `shai: write unit tests for this function`
178
+ 5. **Documentation**: `shai: add JSDoc comments to this module`
132
179
 
133
- ## 📝 Comment Formats
180
+ ## Comment Formats
134
181
 
135
182
  | Language/File Type | Wrapper Format |
136
183
  |----------------------- |-----------------------------------|