Skip to content

feat: add Deploy MCP App #10263

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
joehan wants to merge 3 commits into
base: mcp-deploy-tools
Choose a base branch
from
Open

feat: add Deploy MCP App #10263

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fdd4c37
feat: add Deploy MCP App
joehan Apr 3, 2026
35e1774
fix: resolve lint warnings and fix build for deploy app on mcp-deploy…
joehan Apr 6, 2026
dadc628
fix: remove unused variables in deploy_ui.ts
joehan Apr 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
"firebase": "./lib/bin/firebase.js"
},
"scripts": {
"build:mcp-apps": "vite build --config src/mcp/apps/update_environment/vite.config.ts && vite build --config src/mcp/apps/init/vite.config.ts",
"build:mcp-apps": "vite build --config src/mcp/apps/update_environment/vite.config.ts && vite build --config src/mcp/apps/init/vite.config.ts && vite build --config src/mcp/apps/deploy/vite.config.ts",
"build": "npm run build:mcp-apps && tsc && npm run copyfiles",
"build:publish": "tsc --build tsconfig.publish.json && npm run copyfiles",
"build:watch": "npm run build && tsc --watch",
Expand Down
3 changes: 3 additions & 0 deletions src/deploy/firestore/deploy.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,9 @@ async function deployIndexes(context: any, options: any): Promise<void> {
return;
}
const indexesContext: IndexContext[] = context?.firestore?.indexes;
if (!indexesContext || indexesContext.length === 0) {
return;
}

utils.logBullet(clc.bold(clc.cyan("firestore: ")) + "deploying indexes...");
const firestoreIndexes = new FirestoreApi();
Expand Down
258 changes: 258 additions & 0 deletions src/mcp/apps/deploy/mcp-app.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,258 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Firebase Deploy</title>
<style>
:root {
--color-bg: #0f172a;
--color-surface: rgba(30, 41, 59, 0.7);
--color-primary: #38bdf8;
--color-primary-hover: #7dd3fc;
--color-text: #f8fafc;
--color-text-secondary: #94a3b8;
--color-border: rgba(255, 255, 255, 0.1);
--border-radius-md: 12px;
--border-radius-lg: 16px;
--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
background-color: var(--color-bg);
color: var(--color-text);
margin: 0;
padding: 24px;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
}

.container {
background: var(--color-surface);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border: 1px solid var(--color-border);
border-radius: var(--border-radius-lg);
padding: 32px;
width: 100%;
max-width: 500px;
box-shadow: var(--shadow);
text-align: center;
}

.header {
margin-bottom: 32px;
}

h1 {
margin: 0;
font-size: 24px;
font-weight: 700;
background: linear-gradient(135deg, #fff 0%, #cbd5e1 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.subtitle {
color: var(--color-text-secondary);
font-size: 14px;
margin-top: 8px;
}

.targets-section {
text-align: left;
margin-bottom: 24px;
}

.targets-section h3 {
font-size: 14px;
color: var(--color-text-secondary);
margin-bottom: 12px;
}

.checkbox-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}

.checkbox-item {
display: flex;
align-items: center;
gap: 8px;
padding: 12px;
background: rgba(255, 255, 255, 0.05);
border: 1px solid var(--color-border);
border-radius: var(--border-radius-md);
cursor: pointer;
transition: all 0.2s ease;
}

.checkbox-item:hover {
background: rgba(255, 255, 255, 0.1);
border-color: var(--color-primary);
}

.checkbox-item input {
cursor: pointer;
}

.checkbox-item label {
cursor: pointer;
font-size: 14px;
flex: 1;
}

.actions {
margin-top: 32px;
}

button {
width: 100%;
background: var(--color-primary);
color: #0f172a;
border: none;
padding: 12px;
border-radius: var(--border-radius-md);
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
box-shadow: 0 4px 12px rgba(56, 189, 248, 0.3);
}

button:hover {
background: var(--color-primary-hover);
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(56, 189, 248, 0.4);
}

button:active {
transform: translateY(0);
}

button:disabled {
background: #475569;
color: #94a3b8;
cursor: not-allowed;
box-shadow: none;
transform: none;
}

.progress-section {
margin-top: 32px;
text-align: left;
display: none; /* Shown during deploy */
}

.progress-section h3 {
font-size: 14px;
color: var(--color-text-secondary);
margin-bottom: 12px;
}

.progress-bar-container {
height: 8px;
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
overflow: hidden;
margin-bottom: 12px;
}

.progress-bar {
height: 100%;
background: var(--color-primary);
width: 0%;
transition: width 0.3s ease;
}

.status-list {
display: flex;
flex-direction: column;
gap: 8px;
max-height: 200px;
overflow-y: auto;
font-size: 13px;
color: var(--color-text-secondary);
}

.status-item {
padding: 8px;
background: rgba(255, 255, 255, 0.02);
border-radius: 6px;
}

.status-item.success {
color: #10b981;
}

.status-item.error {
color: #ef4444;
}
</style>
</head>
<body>
<div class="container">
<div class="header">
<h1>Deploy Firebase</h1>
<p class="subtitle">Select services and trigger deployment.</p>
</div>

<div class="targets-section">
<h3>Services to Deploy</h3>
<div class="checkbox-grid">
<div class="checkbox-item">
<input type="checkbox" id="target-hosting" value="hosting" checked />
<label for="target-hosting">Hosting</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="target-functions" value="functions" />
<label for="target-functions">Functions</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="target-firestore" value="firestore" />
<label for="target-firestore">Firestore</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="target-storage" value="storage" />
<label for="target-storage">Storage</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="target-database" value="database" />
<label for="target-database">Database</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="target-rules" value="remoteconfig" />
<label for="target-rules">Remote Config</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="target-extensions" value="extensions" />
<label for="target-extensions">Extensions</label>
</div>
<div class="checkbox-item">
<input type="checkbox" id="target-dataconnect" value="dataconnect" />
<label for="target-dataconnect">Data Connect</label>
</div>
</div>
</div>

<div class="actions">
<button id="deploy-btn">Deploy</button>
</div>

<div id="progress-container" class="progress-section">
<h3>Deployment Progress</h3>
<div class="progress-bar-container">
<div id="progress-bar" class="progress-bar"></div>
</div>
<div id="status-list" class="status-list">
<!-- Logs go here -->
</div>
</div>
</div>
<script type="module" src="mcp-app.ts"></script>
</body>
</html>
Loading
Loading