NiWaRe commited on
Commit
2504e6a
Β·
1 Parent(s): 2325f96

add landing page

Browse files
Files changed (1) hide show
  1. index.html +265 -0
index.html ADDED
@@ -0,0 +1,265 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Weights & Biases MCP Server</title>
7
+ <style>
8
+ body {
9
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
10
+ line-height: 1.6;
11
+ color: #333;
12
+ max-width: 1000px;
13
+ margin: 0 auto;
14
+ padding: 20px;
15
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
16
+ min-height: 100vh;
17
+ }
18
+
19
+ .container {
20
+ background: white;
21
+ border-radius: 12px;
22
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
23
+ padding: 40px;
24
+ margin: 20px 0;
25
+ }
26
+
27
+ .header {
28
+ text-align: center;
29
+ margin-bottom: 40px;
30
+ }
31
+
32
+ .logo {
33
+ width: 60px;
34
+ height: 60px;
35
+ background: linear-gradient(45deg, #ff6b35, #f7931e);
36
+ border-radius: 12px;
37
+ display: inline-flex;
38
+ align-items: center;
39
+ justify-content: center;
40
+ font-size: 30px;
41
+ margin-bottom: 20px;
42
+ }
43
+
44
+ h1 {
45
+ color: #2d3748;
46
+ margin: 0;
47
+ font-size: 2.5em;
48
+ font-weight: 700;
49
+ }
50
+
51
+ .subtitle {
52
+ color: #718096;
53
+ font-size: 1.2em;
54
+ margin-top: 10px;
55
+ }
56
+
57
+ .status {
58
+ background: #48bb78;
59
+ color: white;
60
+ padding: 8px 16px;
61
+ border-radius: 20px;
62
+ font-size: 0.9em;
63
+ font-weight: 600;
64
+ display: inline-block;
65
+ margin-top: 20px;
66
+ }
67
+
68
+ .features {
69
+ display: grid;
70
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
71
+ gap: 20px;
72
+ margin: 40px 0;
73
+ }
74
+
75
+ .feature {
76
+ background: #f7fafc;
77
+ padding: 25px;
78
+ border-radius: 8px;
79
+ border-left: 4px solid #4299e1;
80
+ }
81
+
82
+ .feature h3 {
83
+ color: #2d3748;
84
+ margin: 0 0 10px 0;
85
+ font-size: 1.2em;
86
+ }
87
+
88
+ .feature p {
89
+ color: #4a5568;
90
+ margin: 0;
91
+ font-size: 0.95em;
92
+ }
93
+
94
+ .endpoint {
95
+ background: #1a202c;
96
+ color: #e2e8f0;
97
+ padding: 20px;
98
+ border-radius: 8px;
99
+ font-family: 'Monaco', 'Menlo', monospace;
100
+ font-size: 1.1em;
101
+ text-align: center;
102
+ margin: 30px 0;
103
+ position: relative;
104
+ }
105
+
106
+ .endpoint::before {
107
+ content: "πŸ”— MCP Endpoint";
108
+ position: absolute;
109
+ top: -10px;
110
+ left: 20px;
111
+ background: #1a202c;
112
+ padding: 0 10px;
113
+ font-size: 0.8em;
114
+ color: #a0aec0;
115
+ }
116
+
117
+ .examples {
118
+ background: #edf2f7;
119
+ padding: 25px;
120
+ border-radius: 8px;
121
+ margin: 30px 0;
122
+ }
123
+
124
+ .examples h3 {
125
+ color: #2d3748;
126
+ margin: 0 0 15px 0;
127
+ }
128
+
129
+ .example {
130
+ background: white;
131
+ padding: 15px;
132
+ border-radius: 6px;
133
+ margin: 10px 0;
134
+ border-left: 3px solid #38b2ac;
135
+ font-style: italic;
136
+ color: #2d3748;
137
+ }
138
+
139
+ .setup-steps {
140
+ background: #fff5f5;
141
+ border: 1px solid #feb2b2;
142
+ border-radius: 8px;
143
+ padding: 25px;
144
+ margin: 30px 0;
145
+ }
146
+
147
+ .setup-steps h3 {
148
+ color: #c53030;
149
+ margin: 0 0 15px 0;
150
+ }
151
+
152
+ .setup-steps ol {
153
+ color: #2d3748;
154
+ padding-left: 20px;
155
+ }
156
+
157
+ .setup-steps li {
158
+ margin: 10px 0;
159
+ }
160
+
161
+ .footer {
162
+ text-align: center;
163
+ margin-top: 40px;
164
+ padding-top: 20px;
165
+ border-top: 1px solid #e2e8f0;
166
+ color: #718096;
167
+ }
168
+
169
+ .footer a {
170
+ color: #4299e1;
171
+ text-decoration: none;
172
+ }
173
+
174
+ .footer a:hover {
175
+ text-decoration: underline;
176
+ }
177
+
178
+ @media (max-width: 768px) {
179
+ body {
180
+ padding: 10px;
181
+ }
182
+
183
+ .container {
184
+ padding: 20px;
185
+ }
186
+
187
+ h1 {
188
+ font-size: 2em;
189
+ }
190
+
191
+ .features {
192
+ grid-template-columns: 1fr;
193
+ }
194
+ }
195
+ </style>
196
+ </head>
197
+ <body>
198
+ <div class="container">
199
+ <div class="header">
200
+ <div class="logo">🐝</div>
201
+ <h1>Weights & Biases MCP Server</h1>
202
+ <p class="subtitle">Model Context Protocol server for querying W&B data</p>
203
+ <div class="status">βœ… Server Running</div>
204
+ </div>
205
+
206
+ <div class="endpoint">
207
+ https://huggingface.co/spaces/[your-username]/[space-name]/mcp
208
+ </div>
209
+
210
+ <div class="features">
211
+ <div class="feature">
212
+ <h3>πŸ“Š W&B Models</h3>
213
+ <p>Query experiment tracking data, runs, sweeps, and performance metrics using GraphQL.</p>
214
+ </div>
215
+
216
+ <div class="feature">
217
+ <h3>πŸ” W&B Weave</h3>
218
+ <p>Access LLM traces, evaluations, and datasets with powerful filtering and pagination.</p>
219
+ </div>
220
+
221
+ <div class="feature">
222
+ <h3>πŸ€– Support Agent</h3>
223
+ <p>Get help from wandbot, the W&B RAG-powered support agent for product questions.</p>
224
+ </div>
225
+
226
+ <div class="feature">
227
+ <h3>πŸ“ Reports</h3>
228
+ <p>Create and save W&B Reports with markdown text and HTML visualizations.</p>
229
+ </div>
230
+ </div>
231
+
232
+ <div class="setup-steps">
233
+ <h3>⚠️ Setup Required</h3>
234
+ <ol>
235
+ <li>Get your W&B API key from <a href="https://wandb.ai/authorize" target="_blank">wandb.ai/authorize</a></li>
236
+ <li>Set <code>WANDB_API_KEY</code> as a secret in this Space's environment variables</li>
237
+ <li>Connect your MCP client to the endpoint above</li>
238
+ </ol>
239
+ </div>
240
+
241
+ <div class="examples">
242
+ <h3>πŸ’¬ Example Queries</h3>
243
+ <div class="example">
244
+ "How many openai.chat traces are in my wandb-team/my-project weave project?"
245
+ </div>
246
+ <div class="example">
247
+ "Show me the latest 10 runs from my experiment and create a report with the results."
248
+ </div>
249
+ <div class="example">
250
+ "What's the best performing model in my latest sweep? Plot the results."
251
+ </div>
252
+ </div>
253
+
254
+ <div class="footer">
255
+ <p>
256
+ Built with ❀️ for the <a href="https://modelcontextprotocol.io/" target="_blank">Model Context Protocol</a> community
257
+ <br>
258
+ <a href="https://github.com/wandb/wandb-mcp-server" target="_blank">Source Code</a> β€’
259
+ <a href="https://docs.wandb.ai/" target="_blank">W&B Docs</a> β€’
260
+ <a href="https://weave-docs.wandb.ai/" target="_blank">Weave Docs</a>
261
+ </p>
262
+ </div>
263
+ </div>
264
+ </body>
265
+ </html>