@burdenoff/microfe-vibecontrols 2026.520.2 → 2026.521.1
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/dist/VibeControlsRoot.js +82 -76
- package/dist/VibeControlsRoot.js.map +1 -1
- package/dist/components/tunnels/TunnelCreateWizard.js +55 -47
- package/dist/components/tunnels/TunnelCreateWizard.js.map +1 -1
- package/dist/pages/ActionsPage.js +1 -1
- package/dist/pages/ActionsPage.js.map +1 -1
- package/dist/pages/ComponentsPage.js +2 -1
- package/dist/pages/ComponentsPage.js.map +1 -1
- package/dist/pages/SessionsPage.js +1 -1
- package/dist/pages/SessionsPage.js.map +1 -1
- package/dist/pages/TargetsPage.js +1 -1
- package/dist/pages/TargetsPage.js.map +1 -1
- package/dist/pages/VibeDeckPage.js +1 -1
- package/dist/pages/VibeDeckPage.js.map +1 -1
- package/dist/pages/VibesPage.js +2 -1
- package/dist/pages/VibesPage.js.map +1 -1
- package/package.json +2 -2
package/dist/VibeControlsRoot.js
CHANGED
|
@@ -4,200 +4,206 @@ import n from "./components/shared/AgentEventsConnector.js";
|
|
|
4
4
|
/* empty css */
|
|
5
5
|
import { useEffect as r } from "react";
|
|
6
6
|
import { useI18n as i } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
7
|
+
import { useRecordProductVisit as a } from "@burdenoff/fe-libs/shared/hooks";
|
|
8
|
+
import { Activity as o, BarChart2 as s, BookOpen as c, Bot as l, Box as u, Brain as d, CalendarClock as f, FileCode as p, GitBranch as m, Globe as h, LayoutDashboard as g, LayoutGrid as _, PlayCircle as v, Plug as y, Rocket as b, Server as x, Settings as S, Shield as C, Terminal as w, Zap as T } from "lucide-react";
|
|
9
|
+
import { jsx as E, jsxs as D } from "react/jsx-runtime";
|
|
10
|
+
import { FeatureFlagProvider as O } from "@burdenoff/fe-libs/shared/feature-flags";
|
|
10
11
|
//#region src/VibeControlsRoot.tsx
|
|
11
|
-
var
|
|
12
|
-
let { registerNavItems:
|
|
12
|
+
var k = (k) => {
|
|
13
|
+
let { registerNavItems: A, registerFooterItems: j, basePath: M = "/", workspaceId: N } = k, { t: P, locale: F } = i(), I = typeof window < "u" && /^\/vibecontrols\/(share|deck)\//.test(window.location.pathname);
|
|
14
|
+
a({
|
|
15
|
+
productSlug: "vibecontrols",
|
|
16
|
+
enabled: !I
|
|
17
|
+
});
|
|
18
|
+
let L = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
|
|
13
19
|
return r(() => {
|
|
14
|
-
if (!(!
|
|
20
|
+
if (!(!A || I)) return A([
|
|
15
21
|
{
|
|
16
22
|
id: "vibecontrols-overview",
|
|
17
|
-
label:
|
|
18
|
-
path:
|
|
19
|
-
icon: /* @__PURE__ */
|
|
23
|
+
label: P("nav.overview"),
|
|
24
|
+
path: M === "/" ? "/" : M,
|
|
25
|
+
icon: /* @__PURE__ */ E(g, { size: 20 }),
|
|
20
26
|
order: 10,
|
|
21
27
|
group: "vibecontrols"
|
|
22
28
|
},
|
|
23
29
|
{
|
|
24
30
|
id: "vibecontrols-targets",
|
|
25
|
-
label:
|
|
26
|
-
path:
|
|
27
|
-
icon: /* @__PURE__ */
|
|
31
|
+
label: P("nav.targets"),
|
|
32
|
+
path: L(M, "targets"),
|
|
33
|
+
icon: /* @__PURE__ */ E(x, { size: 20 }),
|
|
28
34
|
order: 12,
|
|
29
35
|
group: "vibecontrols"
|
|
30
36
|
},
|
|
31
37
|
{
|
|
32
38
|
id: "vibecontrols-agents",
|
|
33
|
-
label:
|
|
34
|
-
path:
|
|
35
|
-
icon: /* @__PURE__ */
|
|
39
|
+
label: P("nav.agents"),
|
|
40
|
+
path: L(M, "agents"),
|
|
41
|
+
icon: /* @__PURE__ */ E(l, { size: 20 }),
|
|
36
42
|
order: 14,
|
|
37
43
|
group: "vibecontrols"
|
|
38
44
|
},
|
|
39
45
|
{
|
|
40
46
|
id: "vibecontrols-agent-graph",
|
|
41
|
-
label:
|
|
42
|
-
path:
|
|
43
|
-
icon: /* @__PURE__ */
|
|
47
|
+
label: P("nav.agentGraph"),
|
|
48
|
+
path: L(M, "agent-graph"),
|
|
49
|
+
icon: /* @__PURE__ */ E(m, { size: 20 }),
|
|
44
50
|
order: 16,
|
|
45
51
|
group: "vibecontrols"
|
|
46
52
|
},
|
|
47
53
|
{
|
|
48
54
|
id: "vibecontrols-vibes",
|
|
49
|
-
label:
|
|
50
|
-
path:
|
|
51
|
-
icon: /* @__PURE__ */ T
|
|
55
|
+
label: P("nav.vibes"),
|
|
56
|
+
path: L(M, "vibes"),
|
|
57
|
+
icon: /* @__PURE__ */ E(T, { size: 20 }),
|
|
52
58
|
order: 20,
|
|
53
59
|
group: "vibecontrols"
|
|
54
60
|
},
|
|
55
61
|
{
|
|
56
62
|
id: "vibecontrols-catalogs",
|
|
57
|
-
label:
|
|
58
|
-
path:
|
|
59
|
-
icon: /* @__PURE__ */
|
|
63
|
+
label: P("nav.catalogs") === "nav.catalogs" ? "Catalogs" : P("nav.catalogs"),
|
|
64
|
+
path: L(M, "catalogs"),
|
|
65
|
+
icon: /* @__PURE__ */ E(c, { size: 20 }),
|
|
60
66
|
order: 21,
|
|
61
67
|
group: "vibecontrols"
|
|
62
68
|
},
|
|
63
69
|
{
|
|
64
70
|
id: "vibecontrols-components",
|
|
65
|
-
label:
|
|
66
|
-
path:
|
|
67
|
-
icon: /* @__PURE__ */
|
|
71
|
+
label: P("nav.components") === "nav.components" ? "Components" : P("nav.components"),
|
|
72
|
+
path: L(M, "components"),
|
|
73
|
+
icon: /* @__PURE__ */ E(u, { size: 20 }),
|
|
68
74
|
order: 22,
|
|
69
75
|
group: "vibecontrols"
|
|
70
76
|
},
|
|
71
77
|
{
|
|
72
78
|
id: "vibecontrols-templates",
|
|
73
|
-
label:
|
|
74
|
-
path:
|
|
75
|
-
icon: /* @__PURE__ */
|
|
79
|
+
label: P("nav.templates") === "nav.templates" ? "Templates" : P("nav.templates"),
|
|
80
|
+
path: L(M, "templates"),
|
|
81
|
+
icon: /* @__PURE__ */ E(p, { size: 20 }),
|
|
76
82
|
order: 23,
|
|
77
83
|
group: "vibecontrols"
|
|
78
84
|
},
|
|
79
85
|
{
|
|
80
86
|
id: "vibecontrols-vibedeck",
|
|
81
|
-
label:
|
|
82
|
-
path:
|
|
83
|
-
icon: /* @__PURE__ */
|
|
87
|
+
label: P("nav.vibeDeck"),
|
|
88
|
+
path: L(M, "vibedeck"),
|
|
89
|
+
icon: /* @__PURE__ */ E(_, { size: 20 }),
|
|
84
90
|
order: 25,
|
|
85
91
|
group: "vibecontrols"
|
|
86
92
|
},
|
|
87
93
|
{
|
|
88
94
|
id: "vibecontrols-sessions",
|
|
89
|
-
label:
|
|
90
|
-
path:
|
|
91
|
-
icon: /* @__PURE__ */
|
|
95
|
+
label: P("nav.sessions"),
|
|
96
|
+
path: L(M, "sessions"),
|
|
97
|
+
icon: /* @__PURE__ */ E(w, { size: 20 }),
|
|
92
98
|
order: 30,
|
|
93
99
|
group: "vibecontrols"
|
|
94
100
|
},
|
|
95
101
|
{
|
|
96
102
|
id: "vibecontrols-vibecalendar",
|
|
97
|
-
label:
|
|
98
|
-
path:
|
|
99
|
-
icon: /* @__PURE__ */
|
|
103
|
+
label: P("nav.vibeCalendar"),
|
|
104
|
+
path: L(M, "calendar"),
|
|
105
|
+
icon: /* @__PURE__ */ E(f, { size: 20 }),
|
|
100
106
|
order: 35,
|
|
101
107
|
group: "vibecontrols"
|
|
102
108
|
},
|
|
103
109
|
{
|
|
104
110
|
id: "vibecontrols-ai",
|
|
105
|
-
label:
|
|
106
|
-
path:
|
|
107
|
-
icon: /* @__PURE__ */
|
|
111
|
+
label: P("nav.ai"),
|
|
112
|
+
path: L(M, "ai"),
|
|
113
|
+
icon: /* @__PURE__ */ E(d, { size: 20 }),
|
|
108
114
|
order: 38,
|
|
109
115
|
group: "vibecontrols"
|
|
110
116
|
},
|
|
111
117
|
{
|
|
112
118
|
id: "vibecontrols-actions",
|
|
113
|
-
label:
|
|
114
|
-
path:
|
|
115
|
-
icon: /* @__PURE__ */
|
|
119
|
+
label: P("nav.actions"),
|
|
120
|
+
path: L(M, "actions"),
|
|
121
|
+
icon: /* @__PURE__ */ E(v, { size: 20 }),
|
|
116
122
|
order: 40,
|
|
117
123
|
group: "vibecontrols"
|
|
118
124
|
},
|
|
119
125
|
{
|
|
120
126
|
id: "vibecontrols-getting-started",
|
|
121
|
-
label:
|
|
122
|
-
path:
|
|
123
|
-
icon: /* @__PURE__ */
|
|
127
|
+
label: P("nav.gettingStarted"),
|
|
128
|
+
path: L(M, "getting-started"),
|
|
129
|
+
icon: /* @__PURE__ */ E(b, { size: 20 }),
|
|
124
130
|
order: 50,
|
|
125
131
|
group: "vibecontrols"
|
|
126
132
|
},
|
|
127
133
|
{
|
|
128
134
|
id: "vibecontrols-tunnels",
|
|
129
|
-
label:
|
|
130
|
-
path:
|
|
131
|
-
icon: /* @__PURE__ */
|
|
135
|
+
label: P("nav.tunnels"),
|
|
136
|
+
path: L(M, "tunnels"),
|
|
137
|
+
icon: /* @__PURE__ */ E(h, { size: 20 }),
|
|
132
138
|
order: 47,
|
|
133
139
|
group: "vibecontrols"
|
|
134
140
|
},
|
|
135
141
|
{
|
|
136
142
|
id: "vibecontrols-analytics",
|
|
137
|
-
label:
|
|
138
|
-
path:
|
|
139
|
-
icon: /* @__PURE__ */
|
|
143
|
+
label: P("nav.analytics"),
|
|
144
|
+
path: L(M, "analytics"),
|
|
145
|
+
icon: /* @__PURE__ */ E(s, { size: 20 }),
|
|
140
146
|
order: 55.5,
|
|
141
147
|
group: "vibecontrols-system"
|
|
142
148
|
},
|
|
143
149
|
{
|
|
144
150
|
id: "vibecontrols-audit",
|
|
145
|
-
label:
|
|
146
|
-
path:
|
|
147
|
-
icon: /* @__PURE__ */
|
|
151
|
+
label: P("nav.vibeAudit"),
|
|
152
|
+
path: L(M, "audit"),
|
|
153
|
+
icon: /* @__PURE__ */ E(C, { size: 20 }),
|
|
148
154
|
order: 56,
|
|
149
155
|
group: "vibecontrols-system"
|
|
150
156
|
},
|
|
151
157
|
{
|
|
152
158
|
id: "vibecontrols-health",
|
|
153
|
-
label:
|
|
154
|
-
path:
|
|
155
|
-
icon: /* @__PURE__ */
|
|
159
|
+
label: P("nav.health"),
|
|
160
|
+
path: L(M, "health"),
|
|
161
|
+
icon: /* @__PURE__ */ E(o, { size: 20 }),
|
|
156
162
|
order: 110,
|
|
157
163
|
group: "vibecontrols-system"
|
|
158
164
|
},
|
|
159
165
|
{
|
|
160
166
|
id: "vibecontrols-integrations",
|
|
161
|
-
label:
|
|
167
|
+
label: P("nav.integrations") === "nav.integrations" ? "Integrations" : P("nav.integrations"),
|
|
162
168
|
path: "/integrations",
|
|
163
|
-
icon: /* @__PURE__ */
|
|
169
|
+
icon: /* @__PURE__ */ E(y, { size: 20 }),
|
|
164
170
|
order: 115,
|
|
165
171
|
group: "vibecontrols-system"
|
|
166
172
|
},
|
|
167
173
|
{
|
|
168
174
|
id: "vibecontrols-settings",
|
|
169
|
-
label:
|
|
170
|
-
path:
|
|
171
|
-
icon: /* @__PURE__ */
|
|
175
|
+
label: P("nav.settings"),
|
|
176
|
+
path: L(M, "settings"),
|
|
177
|
+
icon: /* @__PURE__ */ E(S, { size: 20 }),
|
|
172
178
|
order: 120,
|
|
173
179
|
group: "vibecontrols-system"
|
|
174
180
|
}
|
|
175
181
|
]);
|
|
176
182
|
}, [
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
N,
|
|
183
|
+
A,
|
|
184
|
+
M,
|
|
180
185
|
P,
|
|
181
|
-
F
|
|
186
|
+
F,
|
|
187
|
+
I
|
|
182
188
|
]), r(() => {
|
|
183
|
-
if (!(!
|
|
189
|
+
if (!(!j || I)) return j([{
|
|
184
190
|
id: "vibecontrols-status",
|
|
185
191
|
label: "VibeControls Ready",
|
|
186
192
|
type: "status",
|
|
187
193
|
order: 10,
|
|
188
194
|
section: "left"
|
|
189
195
|
}]);
|
|
190
|
-
}, [
|
|
191
|
-
workspaceId:
|
|
196
|
+
}, [j, I]), /* @__PURE__ */ E(O, {
|
|
197
|
+
workspaceId: N ?? null,
|
|
192
198
|
gateway: "global",
|
|
193
199
|
defaultEnabled: !0,
|
|
194
|
-
children: /* @__PURE__ */
|
|
195
|
-
...
|
|
196
|
-
children: [
|
|
200
|
+
children: /* @__PURE__ */ D(e, {
|
|
201
|
+
...k,
|
|
202
|
+
children: [I ? null : /* @__PURE__ */ E(n, {}), /* @__PURE__ */ E(t, {})]
|
|
197
203
|
})
|
|
198
204
|
});
|
|
199
205
|
};
|
|
200
206
|
//#endregion
|
|
201
|
-
export {
|
|
207
|
+
export { k as VibeControlsRoot };
|
|
202
208
|
|
|
203
209
|
//# sourceMappingURL=VibeControlsRoot.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VibeControlsRoot.js","names":[],"sources":["../src/VibeControlsRoot.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n LayoutDashboard,\n Bot,\n Terminal,\n Zap,\n Globe,\n Settings,\n Activity,\n Rocket,\n LayoutGrid,\n CalendarClock,\n Shield,\n Server,\n GitBranch,\n Brain,\n PlayCircle,\n BarChart2,\n BookOpen,\n Box,\n FileCode,\n Plug,\n} from 'lucide-react';\nimport { VibeControlsProvider } from './providers/VibeControlsProvider';\nimport { FeatureFlagProvider } from '@burdenoff/fe-libs/shared/feature-flags';\nimport type { NavItem, VibeControlsRootProps } from './types';\nimport { VibeControlsRoutes } from './VibeControlsRoutes';\nimport { AgentEventsConnector } from './components/shared/AgentEventsConnector';\nimport './styles/vibecontrols.css';\n\n/**\n * Root component for the VibeControls microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n *\n * @example\n * ```tsx\n * import { VibeControlsRoot, type VibeControlsRootProps } from '@burdenoff/microfe-vibecontrols';\n *\n * function App() {\n * const props: VibeControlsRootProps = {\n * basePath: '/vibecontrols',\n * navigate: (path) => router.push(path),\n * currentUser: { id: '1', email: 'user@example.com', firstName: 'John', lastName: 'Doe' },\n * workspaceId: 'ws-123',\n * tenantId: 'tenant-123',\n * apiGatewayUrl: 'https://api.example.com',\n * authToken: 'token',\n * defaultView: 'agents',\n * onAgentSelect: (agent) => console.log('Agent selected:', agent),\n * onSessionStart: (session) => console.log('Session started:', session),\n * onVibeActivate: (vibe) => console.log('Vibe activated:', vibe),\n * registerNavItems: (items) => { return () => {}; },\n * };\n *\n * return <VibeControlsRoot {...props} />;\n * }\n * ```\n */\nexport const VibeControlsRoot: FC<VibeControlsRootProps> = (props) => {\n const { registerNavItems, registerFooterItems, basePath = '/', workspaceId } = props;\n const { t, locale } = useI18n();\n const isPublicLinkRoute =\n typeof window !== 'undefined' &&\n /^\\/vibecontrols\\/(share|deck)\\//.test(window.location.pathname);\n\n // Helper to join paths correctly, avoiding double slashes\n const joinPath = (base: string, path: string): string => {\n const cleanBase = base.endsWith('/') ? base.slice(0, -1) : base;\n const cleanPath = path.startsWith('/') ? path : `/${path}`;\n return cleanBase + cleanPath;\n };\n\n // Register navigation items with the shell\n useEffect(() => {\n if (!registerNavItems || isPublicLinkRoute) return;\n\n const navItems: NavItem[] = [\n // Main navigation\n {\n id: 'vibecontrols-overview',\n label: t('nav.overview'),\n path: basePath === '/' ? '/' : basePath,\n icon: <LayoutDashboard size={20} />,\n order: 10,\n group: 'vibecontrols',\n },\n\n // Targets first — the primary entity\n {\n id: 'vibecontrols-targets',\n label: t('nav.targets'),\n path: joinPath(basePath, 'targets'),\n icon: <Server size={20} />,\n order: 12,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agents',\n label: t('nav.agents'),\n path: joinPath(basePath, 'agents'),\n icon: <Bot size={20} />,\n order: 14,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agent-graph',\n label: t('nav.agentGraph'),\n path: joinPath(basePath, 'agent-graph'),\n icon: <GitBranch size={20} />,\n order: 16,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibes',\n label: t('nav.vibes'),\n path: joinPath(basePath, 'vibes'),\n icon: <Zap size={20} />,\n order: 20,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-catalogs',\n label: t('nav.catalogs') === 'nav.catalogs' ? 'Catalogs' : t('nav.catalogs'),\n path: joinPath(basePath, 'catalogs'),\n icon: <BookOpen size={20} />,\n order: 21,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-components',\n label: t('nav.components') === 'nav.components' ? 'Components' : t('nav.components'),\n path: joinPath(basePath, 'components'),\n icon: <Box size={20} />,\n order: 22,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-templates',\n label: t('nav.templates') === 'nav.templates' ? 'Templates' : t('nav.templates'),\n path: joinPath(basePath, 'templates'),\n icon: <FileCode size={20} />,\n order: 23,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibedeck',\n label: t('nav.vibeDeck'),\n path: joinPath(basePath, 'vibedeck'),\n icon: <LayoutGrid size={20} />,\n order: 25,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-sessions',\n label: t('nav.sessions'),\n path: joinPath(basePath, 'sessions'),\n icon: <Terminal size={20} />,\n order: 30,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibecalendar',\n label: t('nav.vibeCalendar'),\n path: joinPath(basePath, 'calendar'),\n icon: <CalendarClock size={20} />,\n order: 35,\n group: 'vibecontrols',\n },\n // AI Vibecoding\n {\n id: 'vibecontrols-ai',\n label: t('nav.ai'),\n path: joinPath(basePath, 'ai'),\n icon: <Brain size={20} />,\n order: 38,\n group: 'vibecontrols',\n },\n\n // Actions\n {\n id: 'vibecontrols-actions',\n label: t('nav.actions'),\n path: joinPath(basePath, 'actions'),\n icon: <PlayCircle size={20} />,\n order: 40,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-getting-started',\n label: t('nav.gettingStarted'),\n path: joinPath(basePath, 'getting-started'),\n icon: <Rocket size={20} />,\n order: 50,\n group: 'vibecontrols',\n },\n\n // Connection management\n {\n id: 'vibecontrols-tunnels',\n label: t('nav.tunnels'),\n path: joinPath(basePath, 'tunnels'),\n icon: <Globe size={20} />,\n order: 47,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-analytics',\n label: t('nav.analytics'),\n path: joinPath(basePath, 'analytics'),\n icon: <BarChart2 size={20} />,\n order: 55.5,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-audit',\n label: t('nav.vibeAudit'),\n path: joinPath(basePath, 'audit'),\n icon: <Shield size={20} />,\n order: 56,\n group: 'vibecontrols-system',\n },\n\n // Settings & System\n {\n id: 'vibecontrols-health',\n label: t('nav.health'),\n path: joinPath(basePath, 'health'),\n icon: <Activity size={20} />,\n order: 110,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-integrations',\n label:\n t('nav.integrations') === 'nav.integrations' ? 'Integrations' : t('nav.integrations'),\n // Absolute path — links out to the host shell's /integrations route\n // (microfe-integrations, mounted by vibecontrols-app). Keeps the\n // VibeControls MFE compliant with the no-cross-MFE-import rule.\n path: '/integrations',\n icon: <Plug size={20} />,\n order: 115,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-settings',\n label: t('nav.settings'),\n path: joinPath(basePath, 'settings'),\n icon: <Settings size={20} />,\n order: 120,\n group: 'vibecontrols-system',\n },\n ];\n\n // Register and get cleanup function\n const cleanup = registerNavItems(navItems);\n\n // Return cleanup function to unregister on unmount\n return cleanup;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [registerNavItems, basePath, t, locale, isPublicLinkRoute]);\n\n // Register footer items (example: status indicator in left section)\n useEffect(() => {\n if (!registerFooterItems || isPublicLinkRoute) return;\n\n const footerItems = [\n {\n id: 'vibecontrols-status',\n label: 'VibeControls Ready',\n type: 'status' as const,\n order: 10,\n section: 'left' as const,\n },\n ];\n\n const cleanup = registerFooterItems(footerItems);\n return cleanup;\n }, [registerFooterItems, isPublicLinkRoute]);\n\n return (\n <FeatureFlagProvider workspaceId={workspaceId ?? null} gateway=\"global\" defaultEnabled={true}>\n <VibeControlsProvider {...props}>\n {!isPublicLinkRoute ? (\n /* Agent events connector - syncs active agent to WebSocket */\n <AgentEventsConnector />\n ) : null}\n <VibeControlsRoutes />\n </VibeControlsProvider>\n </FeatureFlagProvider>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"VibeControlsRoot.js","names":[],"sources":["../src/VibeControlsRoot.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useRecordProductVisit } from '@burdenoff/fe-libs/shared/hooks';\nimport {\n LayoutDashboard,\n Bot,\n Terminal,\n Zap,\n Globe,\n Settings,\n Activity,\n Rocket,\n LayoutGrid,\n CalendarClock,\n Shield,\n Server,\n GitBranch,\n Brain,\n PlayCircle,\n BarChart2,\n BookOpen,\n Box,\n FileCode,\n Plug,\n} from 'lucide-react';\nimport { VibeControlsProvider } from './providers/VibeControlsProvider';\nimport { FeatureFlagProvider } from '@burdenoff/fe-libs/shared/feature-flags';\nimport type { NavItem, VibeControlsRootProps } from './types';\nimport { VibeControlsRoutes } from './VibeControlsRoutes';\nimport { AgentEventsConnector } from './components/shared/AgentEventsConnector';\nimport './styles/vibecontrols.css';\n\n/**\n * Root component for the VibeControls microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n *\n * @example\n * ```tsx\n * import { VibeControlsRoot, type VibeControlsRootProps } from '@burdenoff/microfe-vibecontrols';\n *\n * function App() {\n * const props: VibeControlsRootProps = {\n * basePath: '/vibecontrols',\n * navigate: (path) => router.push(path),\n * currentUser: { id: '1', email: 'user@example.com', firstName: 'John', lastName: 'Doe' },\n * workspaceId: 'ws-123',\n * tenantId: 'tenant-123',\n * apiGatewayUrl: 'https://api.example.com',\n * authToken: 'token',\n * defaultView: 'agents',\n * onAgentSelect: (agent) => console.log('Agent selected:', agent),\n * onSessionStart: (session) => console.log('Session started:', session),\n * onVibeActivate: (vibe) => console.log('Vibe activated:', vibe),\n * registerNavItems: (items) => { return () => {}; },\n * };\n *\n * return <VibeControlsRoot {...props} />;\n * }\n * ```\n */\nexport const VibeControlsRoot: FC<VibeControlsRootProps> = (props) => {\n const { registerNavItems, registerFooterItems, basePath = '/', workspaceId } = props;\n const { t, locale } = useI18n();\n\n const isPublicLinkRoute =\n typeof window !== 'undefined' &&\n /^\\/vibecontrols\\/(share|deck)\\//.test(window.location.pathname);\n\n useRecordProductVisit({ productSlug: 'vibecontrols', enabled: !isPublicLinkRoute });\n\n // Helper to join paths correctly, avoiding double slashes\n const joinPath = (base: string, path: string): string => {\n const cleanBase = base.endsWith('/') ? base.slice(0, -1) : base;\n const cleanPath = path.startsWith('/') ? path : `/${path}`;\n return cleanBase + cleanPath;\n };\n\n // Register navigation items with the shell\n useEffect(() => {\n if (!registerNavItems || isPublicLinkRoute) return;\n\n const navItems: NavItem[] = [\n // Main navigation\n {\n id: 'vibecontrols-overview',\n label: t('nav.overview'),\n path: basePath === '/' ? '/' : basePath,\n icon: <LayoutDashboard size={20} />,\n order: 10,\n group: 'vibecontrols',\n },\n\n // Targets first — the primary entity\n {\n id: 'vibecontrols-targets',\n label: t('nav.targets'),\n path: joinPath(basePath, 'targets'),\n icon: <Server size={20} />,\n order: 12,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agents',\n label: t('nav.agents'),\n path: joinPath(basePath, 'agents'),\n icon: <Bot size={20} />,\n order: 14,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-agent-graph',\n label: t('nav.agentGraph'),\n path: joinPath(basePath, 'agent-graph'),\n icon: <GitBranch size={20} />,\n order: 16,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibes',\n label: t('nav.vibes'),\n path: joinPath(basePath, 'vibes'),\n icon: <Zap size={20} />,\n order: 20,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-catalogs',\n label: t('nav.catalogs') === 'nav.catalogs' ? 'Catalogs' : t('nav.catalogs'),\n path: joinPath(basePath, 'catalogs'),\n icon: <BookOpen size={20} />,\n order: 21,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-components',\n label: t('nav.components') === 'nav.components' ? 'Components' : t('nav.components'),\n path: joinPath(basePath, 'components'),\n icon: <Box size={20} />,\n order: 22,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-templates',\n label: t('nav.templates') === 'nav.templates' ? 'Templates' : t('nav.templates'),\n path: joinPath(basePath, 'templates'),\n icon: <FileCode size={20} />,\n order: 23,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibedeck',\n label: t('nav.vibeDeck'),\n path: joinPath(basePath, 'vibedeck'),\n icon: <LayoutGrid size={20} />,\n order: 25,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-sessions',\n label: t('nav.sessions'),\n path: joinPath(basePath, 'sessions'),\n icon: <Terminal size={20} />,\n order: 30,\n group: 'vibecontrols',\n },\n {\n id: 'vibecontrols-vibecalendar',\n label: t('nav.vibeCalendar'),\n path: joinPath(basePath, 'calendar'),\n icon: <CalendarClock size={20} />,\n order: 35,\n group: 'vibecontrols',\n },\n // AI Vibecoding\n {\n id: 'vibecontrols-ai',\n label: t('nav.ai'),\n path: joinPath(basePath, 'ai'),\n icon: <Brain size={20} />,\n order: 38,\n group: 'vibecontrols',\n },\n\n // Actions\n {\n id: 'vibecontrols-actions',\n label: t('nav.actions'),\n path: joinPath(basePath, 'actions'),\n icon: <PlayCircle size={20} />,\n order: 40,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-getting-started',\n label: t('nav.gettingStarted'),\n path: joinPath(basePath, 'getting-started'),\n icon: <Rocket size={20} />,\n order: 50,\n group: 'vibecontrols',\n },\n\n // Connection management\n {\n id: 'vibecontrols-tunnels',\n label: t('nav.tunnels'),\n path: joinPath(basePath, 'tunnels'),\n icon: <Globe size={20} />,\n order: 47,\n group: 'vibecontrols',\n },\n\n {\n id: 'vibecontrols-analytics',\n label: t('nav.analytics'),\n path: joinPath(basePath, 'analytics'),\n icon: <BarChart2 size={20} />,\n order: 55.5,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-audit',\n label: t('nav.vibeAudit'),\n path: joinPath(basePath, 'audit'),\n icon: <Shield size={20} />,\n order: 56,\n group: 'vibecontrols-system',\n },\n\n // Settings & System\n {\n id: 'vibecontrols-health',\n label: t('nav.health'),\n path: joinPath(basePath, 'health'),\n icon: <Activity size={20} />,\n order: 110,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-integrations',\n label:\n t('nav.integrations') === 'nav.integrations' ? 'Integrations' : t('nav.integrations'),\n // Absolute path — links out to the host shell's /integrations route\n // (microfe-integrations, mounted by vibecontrols-app). Keeps the\n // VibeControls MFE compliant with the no-cross-MFE-import rule.\n path: '/integrations',\n icon: <Plug size={20} />,\n order: 115,\n group: 'vibecontrols-system',\n },\n {\n id: 'vibecontrols-settings',\n label: t('nav.settings'),\n path: joinPath(basePath, 'settings'),\n icon: <Settings size={20} />,\n order: 120,\n group: 'vibecontrols-system',\n },\n ];\n\n // Register and get cleanup function\n const cleanup = registerNavItems(navItems);\n\n // Return cleanup function to unregister on unmount\n return cleanup;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [registerNavItems, basePath, t, locale, isPublicLinkRoute]);\n\n // Register footer items (example: status indicator in left section)\n useEffect(() => {\n if (!registerFooterItems || isPublicLinkRoute) return;\n\n const footerItems = [\n {\n id: 'vibecontrols-status',\n label: 'VibeControls Ready',\n type: 'status' as const,\n order: 10,\n section: 'left' as const,\n },\n ];\n\n const cleanup = registerFooterItems(footerItems);\n return cleanup;\n }, [registerFooterItems, isPublicLinkRoute]);\n\n return (\n <FeatureFlagProvider workspaceId={workspaceId ?? null} gateway=\"global\" defaultEnabled={true}>\n <VibeControlsProvider {...props}>\n {!isPublicLinkRoute ? (\n /* Agent events connector - syncs active agent to WebSocket */\n <AgentEventsConnector />\n ) : null}\n <VibeControlsRoutes />\n </VibeControlsProvider>\n </FeatureFlagProvider>\n );\n};\n"],"mappings":"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"}
|
|
@@ -50,32 +50,32 @@ var w = /^[a-z0-9]([a-z0-9-]{0,61}[a-z0-9])?$/, T = {
|
|
|
50
50
|
}
|
|
51
51
|
];
|
|
52
52
|
function D() {
|
|
53
|
-
let D = e(), A = v(), [j, M] = _(0), [N, P] = _(T), [F, I] = _(null), [L, R] = _(!1), { setDraftTagIds:
|
|
53
|
+
let D = e(), A = v(), [j, M] = _(0), [N, P] = _(T), [F, I] = _(null), [L, R] = _(!1), [z, B] = _(!1), { setDraftTagIds: V, flushTags: H } = m("VIBECONTROLS_TUNNEL"), { data: U, loading: W, error: G } = r(), { data: K } = n({ variables: { pagination: { limit: 100 } } }), [q, { loading: J }] = t(), Y = h((e, t) => {
|
|
54
54
|
P((n) => ({
|
|
55
55
|
...n,
|
|
56
56
|
[e]: t
|
|
57
57
|
}));
|
|
58
|
-
}, []),
|
|
58
|
+
}, []), X = h((e) => {
|
|
59
59
|
P((t) => ({
|
|
60
60
|
...t,
|
|
61
61
|
providerKey: e,
|
|
62
62
|
hostnameKind: e === u.Cloudflare ? "auto" : "managed"
|
|
63
63
|
}));
|
|
64
|
-
}, []),
|
|
64
|
+
}, []), Z = g(() => [...U?.tunnelProviders ?? []].sort((e, t) => {
|
|
65
65
|
let n = (e) => e === "VIBETUNNELS" ? 0 : e === "CLOUDFLARE" ? 1 : 2, r = n(e.key) - n(t.key);
|
|
66
66
|
return r === 0 ? e.key.localeCompare(t.key) : r;
|
|
67
|
-
}), [
|
|
68
|
-
if (!
|
|
67
|
+
}), [U]), Q = g(() => Z.find((e) => e.key === N.providerKey), [Z, N.providerKey])?.capabilities, $ = N.providerKey === u.Cloudflare, ee = g(() => {
|
|
68
|
+
if (!Q) return [l.Http];
|
|
69
69
|
let e = [];
|
|
70
|
-
return
|
|
71
|
-
}, [
|
|
70
|
+
return Q.supportsHttp && e.push(l.Http), Q.supportsHttps && e.push(l.Https), Q.supportsTcp && e.push(l.Tcp), e;
|
|
71
|
+
}, [Q]), te = g(() => j === 0 ? !!(N.providerKey && N.agentId && N.name.trim()) : j === 1 ? N.localPort > 0 && N.localPort < 65536 : j === 2 ? N.hostnameKind === "managed" ? !!(N.subdomain && w.test(N.subdomain)) : N.hostnameKind === "custom" ? N.customDomain.trim().includes(".") : $ : !0, [
|
|
72
72
|
j,
|
|
73
73
|
N,
|
|
74
|
-
|
|
75
|
-
]),
|
|
74
|
+
$
|
|
75
|
+
]), ne = () => M((e) => Math.min(e + 1, E.length - 1)), re = () => M((e) => Math.max(e - 1, 0)), ie = async () => {
|
|
76
76
|
I(null);
|
|
77
77
|
try {
|
|
78
|
-
let e = await
|
|
78
|
+
let e = await q({ variables: { input: {
|
|
79
79
|
agentId: N.agentId,
|
|
80
80
|
name: N.name,
|
|
81
81
|
description: N.description || void 0,
|
|
@@ -90,25 +90,33 @@ function D() {
|
|
|
90
90
|
} } });
|
|
91
91
|
if (e.error) {
|
|
92
92
|
if (f(e.error)) {
|
|
93
|
-
|
|
93
|
+
B(!0);
|
|
94
94
|
return;
|
|
95
95
|
}
|
|
96
96
|
I(e.error.message);
|
|
97
97
|
return;
|
|
98
98
|
}
|
|
99
99
|
let t = e.data?.createTunnel.id;
|
|
100
|
-
|
|
100
|
+
if (t) {
|
|
101
|
+
R(!0);
|
|
102
|
+
try {
|
|
103
|
+
await H(t);
|
|
104
|
+
} finally {
|
|
105
|
+
R(!1);
|
|
106
|
+
}
|
|
107
|
+
A(`/vibecontrols/tunnels/${t}`);
|
|
108
|
+
}
|
|
101
109
|
} catch (e) {
|
|
102
110
|
if (f(e)) {
|
|
103
|
-
I(null),
|
|
111
|
+
I(null), B(!0);
|
|
104
112
|
return;
|
|
105
113
|
}
|
|
106
114
|
I(e instanceof Error ? e.message : String(e));
|
|
107
115
|
}
|
|
108
116
|
};
|
|
109
|
-
return
|
|
117
|
+
return W ? /* @__PURE__ */ S(a, { message: "Loading providers" }) : G ? /* @__PURE__ */ S(o, {
|
|
110
118
|
title: "Failed to load providers",
|
|
111
|
-
message:
|
|
119
|
+
message: G.message,
|
|
112
120
|
onRetry: () => window.location.reload()
|
|
113
121
|
}) : /* @__PURE__ */ C("div", {
|
|
114
122
|
className: "p-6 max-w-3xl mx-auto",
|
|
@@ -155,9 +163,9 @@ function D() {
|
|
|
155
163
|
}),
|
|
156
164
|
/* @__PURE__ */ S("div", {
|
|
157
165
|
className: "grid gap-3 sm:grid-cols-2",
|
|
158
|
-
children:
|
|
166
|
+
children: Z.map((e) => /* @__PURE__ */ C("button", {
|
|
159
167
|
type: "button",
|
|
160
|
-
onClick: () =>
|
|
168
|
+
onClick: () => X(e.key),
|
|
161
169
|
className: `rounded-lg border p-4 text-left transition-colors ${N.providerKey === e.key ? "border-action-primary-bg bg-bg-sunken" : "border-border-subtle hover:border-border-default"}`,
|
|
162
170
|
children: [
|
|
163
171
|
/* @__PURE__ */ S("div", {
|
|
@@ -179,12 +187,12 @@ function D() {
|
|
|
179
187
|
label: "Agent",
|
|
180
188
|
children: /* @__PURE__ */ C("select", {
|
|
181
189
|
value: N.agentId,
|
|
182
|
-
onChange: (e) =>
|
|
190
|
+
onChange: (e) => Y("agentId", e.target.value),
|
|
183
191
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary",
|
|
184
192
|
children: [/* @__PURE__ */ S("option", {
|
|
185
193
|
value: "",
|
|
186
194
|
children: "Select agent"
|
|
187
|
-
}), (
|
|
195
|
+
}), (K?.vibecontrolsAgents ?? []).map((e) => /* @__PURE__ */ S("option", {
|
|
188
196
|
value: e.id,
|
|
189
197
|
children: e.name
|
|
190
198
|
}, e.id))]
|
|
@@ -195,7 +203,7 @@ function D() {
|
|
|
195
203
|
children: /* @__PURE__ */ S("input", {
|
|
196
204
|
type: "text",
|
|
197
205
|
value: N.name,
|
|
198
|
-
onChange: (e) =>
|
|
206
|
+
onChange: (e) => Y("name", e.target.value),
|
|
199
207
|
placeholder: "My dev tunnel",
|
|
200
208
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-muted"
|
|
201
209
|
})
|
|
@@ -205,7 +213,7 @@ function D() {
|
|
|
205
213
|
children: /* @__PURE__ */ S("input", {
|
|
206
214
|
type: "text",
|
|
207
215
|
value: N.description,
|
|
208
|
-
onChange: (e) =>
|
|
216
|
+
onChange: (e) => Y("description", e.target.value),
|
|
209
217
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-muted"
|
|
210
218
|
})
|
|
211
219
|
})
|
|
@@ -222,9 +230,9 @@ function D() {
|
|
|
222
230
|
label: "Protocol",
|
|
223
231
|
children: /* @__PURE__ */ S("div", {
|
|
224
232
|
className: "flex gap-2",
|
|
225
|
-
children:
|
|
233
|
+
children: ee.map((e) => /* @__PURE__ */ S("button", {
|
|
226
234
|
type: "button",
|
|
227
|
-
onClick: () =>
|
|
235
|
+
onClick: () => Y("protocol", e),
|
|
228
236
|
className: `rounded-md border px-4 py-2 text-sm ${N.protocol === e ? "border-action-primary-bg bg-bg-sunken text-text-primary" : "border-border-subtle text-text-secondary hover:border-border-default"}`,
|
|
229
237
|
children: e
|
|
230
238
|
}, e))
|
|
@@ -235,7 +243,7 @@ function D() {
|
|
|
235
243
|
children: /* @__PURE__ */ S("input", {
|
|
236
244
|
type: "text",
|
|
237
245
|
value: N.localHost,
|
|
238
|
-
onChange: (e) =>
|
|
246
|
+
onChange: (e) => Y("localHost", e.target.value),
|
|
239
247
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
|
|
240
248
|
})
|
|
241
249
|
}),
|
|
@@ -244,7 +252,7 @@ function D() {
|
|
|
244
252
|
children: /* @__PURE__ */ S("input", {
|
|
245
253
|
type: "number",
|
|
246
254
|
value: N.localPort,
|
|
247
|
-
onChange: (e) =>
|
|
255
|
+
onChange: (e) => Y("localPort", parseInt(e.target.value, 10) || 0),
|
|
248
256
|
min: 1,
|
|
249
257
|
max: 65535,
|
|
250
258
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
|
|
@@ -264,22 +272,22 @@ function D() {
|
|
|
264
272
|
children: [
|
|
265
273
|
/* @__PURE__ */ S(k, {
|
|
266
274
|
active: N.hostnameKind === "managed",
|
|
267
|
-
onClick: () =>
|
|
268
|
-
disabled: !
|
|
275
|
+
onClick: () => Y("hostnameKind", "managed"),
|
|
276
|
+
disabled: !Q?.supportsManagedSubdomains,
|
|
269
277
|
label: "Managed subdomain",
|
|
270
278
|
hint: "*.vibetunnels.com"
|
|
271
279
|
}),
|
|
272
280
|
/* @__PURE__ */ S(k, {
|
|
273
281
|
active: N.hostnameKind === "custom",
|
|
274
|
-
onClick: () =>
|
|
275
|
-
disabled: !
|
|
282
|
+
onClick: () => Y("hostnameKind", "custom"),
|
|
283
|
+
disabled: !Q?.supportsCustomDomains,
|
|
276
284
|
label: "Custom domain",
|
|
277
285
|
hint: "TXT verification"
|
|
278
286
|
}),
|
|
279
287
|
/* @__PURE__ */ S(k, {
|
|
280
288
|
active: N.hostnameKind === "auto",
|
|
281
|
-
onClick: () =>
|
|
282
|
-
disabled:
|
|
289
|
+
onClick: () => Y("hostnameKind", "auto"),
|
|
290
|
+
disabled: !$,
|
|
283
291
|
label: "Auto",
|
|
284
292
|
hint: "provider default"
|
|
285
293
|
})
|
|
@@ -292,12 +300,12 @@ function D() {
|
|
|
292
300
|
className: "flex gap-2",
|
|
293
301
|
children: [/* @__PURE__ */ S("button", {
|
|
294
302
|
type: "button",
|
|
295
|
-
onClick: () =>
|
|
303
|
+
onClick: () => Y("environment", c.Prod),
|
|
296
304
|
className: `rounded-md border px-4 py-2 text-sm ${N.environment === c.Prod ? "border-action-primary-bg bg-bg-sunken text-text-primary" : "border-border-subtle text-text-secondary hover:border-border-default"}`,
|
|
297
305
|
children: "Prod (vibetunnels.com)"
|
|
298
306
|
}), /* @__PURE__ */ S("button", {
|
|
299
307
|
type: "button",
|
|
300
|
-
onClick: () =>
|
|
308
|
+
onClick: () => Y("environment", c.Alpha),
|
|
301
309
|
className: `rounded-md border px-4 py-2 text-sm ${N.environment === c.Alpha ? "border-action-primary-bg bg-bg-sunken text-text-primary" : "border-border-subtle text-text-secondary hover:border-border-default"}`,
|
|
302
310
|
children: "Alpha"
|
|
303
311
|
})]
|
|
@@ -308,7 +316,7 @@ function D() {
|
|
|
308
316
|
children: /* @__PURE__ */ S("input", {
|
|
309
317
|
type: "text",
|
|
310
318
|
value: N.subdomain,
|
|
311
|
-
onChange: (e) =>
|
|
319
|
+
onChange: (e) => Y("subdomain", e.target.value.toLowerCase()),
|
|
312
320
|
placeholder: "demo",
|
|
313
321
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
|
|
314
322
|
})
|
|
@@ -330,7 +338,7 @@ function D() {
|
|
|
330
338
|
children: [/* @__PURE__ */ S("input", {
|
|
331
339
|
type: "text",
|
|
332
340
|
value: N.customDomain,
|
|
333
|
-
onChange: (e) =>
|
|
341
|
+
onChange: (e) => Y("customDomain", e.target.value.toLowerCase()),
|
|
334
342
|
placeholder: "preview.example.com",
|
|
335
343
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
|
|
336
344
|
}), /* @__PURE__ */ S("p", {
|
|
@@ -352,7 +360,7 @@ function D() {
|
|
|
352
360
|
children: /* @__PURE__ */ S("input", {
|
|
353
361
|
type: "text",
|
|
354
362
|
value: N.basicAuthUser,
|
|
355
|
-
onChange: (e) =>
|
|
363
|
+
onChange: (e) => Y("basicAuthUser", e.target.value),
|
|
356
364
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
|
|
357
365
|
})
|
|
358
366
|
}),
|
|
@@ -361,7 +369,7 @@ function D() {
|
|
|
361
369
|
children: /* @__PURE__ */ S("input", {
|
|
362
370
|
type: "password",
|
|
363
371
|
value: N.basicAuthPassword,
|
|
364
|
-
onChange: (e) =>
|
|
372
|
+
onChange: (e) => Y("basicAuthPassword", e.target.value),
|
|
365
373
|
className: "w-full rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-primary"
|
|
366
374
|
})
|
|
367
375
|
})
|
|
@@ -446,7 +454,7 @@ function D() {
|
|
|
446
454
|
children: D("vibecontrols.tunnels.tags", "Tags")
|
|
447
455
|
}), /* @__PURE__ */ S(p, {
|
|
448
456
|
entityType: "VIBECONTROLS_TUNNEL",
|
|
449
|
-
onDraftChange:
|
|
457
|
+
onDraftChange: V
|
|
450
458
|
})]
|
|
451
459
|
}),
|
|
452
460
|
F && /* @__PURE__ */ S("div", {
|
|
@@ -463,28 +471,28 @@ function D() {
|
|
|
463
471
|
children: [/* @__PURE__ */ S("button", {
|
|
464
472
|
type: "button",
|
|
465
473
|
disabled: j === 0,
|
|
466
|
-
onClick:
|
|
474
|
+
onClick: re,
|
|
467
475
|
className: "rounded-md border border-border-default px-4 py-2 text-sm text-text-primary hover:bg-bg-elevated disabled:opacity-50",
|
|
468
476
|
children: D("vibecontrols.tunnels.back", "Back")
|
|
469
477
|
}), j < E.length - 1 ? /* @__PURE__ */ S("button", {
|
|
470
478
|
type: "button",
|
|
471
|
-
disabled:
|
|
472
|
-
onClick:
|
|
479
|
+
disabled: !te,
|
|
480
|
+
onClick: ne,
|
|
473
481
|
className: "rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover disabled:opacity-50",
|
|
474
482
|
children: D("vibecontrols.tunnels.next", "Next")
|
|
475
483
|
}) : /* @__PURE__ */ S("button", {
|
|
476
484
|
type: "button",
|
|
477
|
-
disabled:
|
|
478
|
-
onClick: () => void
|
|
485
|
+
disabled: J || L,
|
|
486
|
+
onClick: () => void ie(),
|
|
479
487
|
className: "rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-fg hover:bg-action-primary-bg-hover disabled:opacity-50",
|
|
480
|
-
children:
|
|
488
|
+
children: J ? D("vibecontrols.tunnels.creating", "Creating...") : D("vibecontrols.tunnels.createTunnel", "Create tunnel")
|
|
481
489
|
})]
|
|
482
490
|
}),
|
|
483
491
|
/* @__PURE__ */ S(s, {
|
|
484
|
-
isOpen:
|
|
485
|
-
onClose: () =>
|
|
492
|
+
isOpen: z,
|
|
493
|
+
onClose: () => B(!1),
|
|
486
494
|
onConfirm: () => {
|
|
487
|
-
|
|
495
|
+
B(!1), A("/billing");
|
|
488
496
|
},
|
|
489
497
|
...d("tunnel-subdomain")
|
|
490
498
|
})
|